:root { --fm-product-shell: 1920px; --fm-product-gutter: clamp(1rem, 2vw, 2.25rem); } /* * Product navigation * Used by data-heavy pages through: * */ .fm-header--product { position: sticky; top: 0; z-index: 1000; } .fm-nav--product { min-height: 68px; background: #090d0e; border-bottom: 1px solid rgba(211, 220, 215, .14); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; } .fm-nav__inner--product { width: 100%; max-width: var(--fm-product-shell); min-height: 68px; margin: 0 auto; padding-right: var(--fm-product-gutter); padding-left: var(--fm-product-gutter); } .fm-brand--product { margin-right: clamp(1.5rem, 2.5vw, 3rem); } .fm-brand--product .fm-brand__mark { width: 40px; height: 40px; } .fm-brand--product .fm-brand__text { font-size: 1.38rem; } .fm-nav--product .fm-nav__list { gap: .1rem; } .fm-nav--product .fm-nav__link { min-height: 38px; padding: .58rem .72rem; border-radius: 4px; font-size: .86rem; } .fm-nav--product .fm-nav__link.is-active, .fm-nav--product .fm-nav__item.is-open > .fm-nav__link, .fm-nav--product .fm-nav__link:hover, .fm-nav--product .fm-nav__link:focus-visible { background: #141a1b; } .fm-nav--product .fm-nav__link.is-active::after { right: .7rem; bottom: .12rem; left: .7rem; height: 2px; background: #76d564; box-shadow: none; } .fm-nav--product .fm-nav__signin { font-size: .83rem; } .fm-nav--product .fm-nav__premium { padding: .58rem .95rem; border-radius: 4px; background: #76d564; box-shadow: none; } .fm-nav--product .fm-dropdown { border-radius: 6px; background: #111718; border-color: rgba(211, 220, 215, .18); box-shadow: 0 18px 38px rgba(0, 0, 0, .34); } .fm-nav--product .fm-dropdown__section, .fm-nav--product .fm-dropdown__featured, .fm-nav--product .fm-dropdown__plain-links a, .fm-nav--product .fm-dropdown__badge { border-radius: 4px; } @media (max-width: 1199.98px) { .fm-nav__inner--product { min-height: 64px; padding-top: .5rem; padding-bottom: .5rem; } .fm-nav--product .fm-nav__content { padding-top: .65rem; } .fm-nav--product .fm-nav__link { min-height: 42px; } } @media (max-width: 575.98px) { .fm-brand--product .fm-brand__mark { width: 36px; height: 36px; } .fm-brand--product .fm-brand__text { font-size: 1.22rem; } }