Template:Main page/header/styles.css
More actions
.loka-mainpage-header { position: relative; margin-top: -2rem; margin-bottom: -4rem; padding-top: 6rem; padding-bottom: 6rem; clear: both; overflow: hidden; pointer-events: none; /* So that you can click elements overlap with the header */ }
.loka-mainpage-content { align-items: center; display: flex; flex-direction: column; text-align: center; pointer-events: auto; /* Reset pointer-events: none from header */ }
.loka-mainpage-header-wordmark { position: relative; margin-top: 2.5rem; width: 420px; max-width: 100%; padding-top: 0.75rem; }
.loka-mainpage-header-wordmark img { width: 100%; height: 100%; }
.loka-mainpage-header-tagline { margin-top: -0.25rem; color: var(--loka-color-subtle); font-size: var(--loka-font-size-small); line-height: var(--loka-line-height-xx-small); }
.loka-mainpage-header-search { align-items: center; background-color: var(--loka-color-progressive); border-radius: var(--loka-border-radius-pill); color: var(--loka-color-inverted-progressive); cursor: pointer; display: flex; font-size: 0.875rem; font-weight: var(--font-weight-medium); gap: 0.5rem; line-height: 1; margin-top: 1rem; padding: 1rem 2rem; user-select: none; }
.loka-mainpage-header-search:before { content: ; width: 1rem; height: 1rem; mask-image: url(/images/a/a5/CdxIconSearch.svg); mask-size: contain; background-color: currentColor; display: block; }
/* Keyboard hint */ @media (hover: hover) { .loka-mainpage-header-search:after { content: '/'; margin-top: -2px; margin-bottom: -2px; margin-left: 2px; width: 18px; height: 18px; display: flex; background-color: var(--loka-color-inverted-progressive); color: var(--loka-color-progressive); border-radius: var(--loka-border-radius-small); line-height: 1; align-items: center; justify-content: center; font-size: 10px; font-weight: 900; opacity: 0.6; } }
.loka-mainpage-header-search:hover { background-color: var(--loka-color-progressive--hover); }
.loka-mainpage-header-search:active { background-color: var(--loka-color-progressive--active); }