/* --------------------------------------------------------------------------- Overrides layered on top of the original Financity stylesheets. Loaded last, so everything here wins without editing the theme CSS. --------------------------------------------------------------------------- */ /* --- Sticky navigation background ---------------------------------------- The transparent-header skin zeroes the header's background: .financity-header-background-transparent .financity-header-background { opacity: 0 } On WordPress the theme's jQuery physically moved the

element to when it became sticky, which took it out of that ancestor and let the #112349 background reappear. This build keeps the header where it is in the React tree, so the rule has to be undone explicitly once the header sticks. */ .financity-header-background-transparent .financity-fixed-navigation .financity-header-background { opacity: 1; } /* The mobile header sticks the same way and needs the same solid background. */ .financity-mobile-header.financity-fixed-navigation, .financity-mobile-header.financity-fixed-navigation .financity-header-background { background-color: #112349; opacity: 1; } /* --- Slider arrow glyphs -------------------------------------------------- The hero arrows use Slider Revolution's own icon font, mirrored under public/ at its original path. Declared here rather than in the HeroSlider CSS module because @font-face names are global either way. */ @font-face { font-family: "revicons"; src: url("/wp-content/plugins/revslider/public/assets/fonts/revicons/revicons.woff") format("woff"), url("/wp-content/plugins/revslider/public/assets/fonts/revicons/revicons.ttf") format("truetype"); font-weight: normal; font-style: normal; font-display: swap; } /* --- Dropdown fade -------------------------------------------------------- Superfish was initialised with `{ delay: 400, speed: "fast" }`, so submenus faded in over 200ms and, on mouse-out, waited 400ms before fading out again. `Menu.tsx` drives the state; these rules supply the fade. `.financity-sub- closing` keeps the submenu displayed while it fades away after `sfHover` has already been dropped, which is what jQuery's inline styles did. */ .financity-navigation .sf-menu > li.sfHover > .sub-menu, .financity-navigation .sf-menu > li.financity-sub-closing > .sub-menu { display: block; opacity: 0; transition: opacity 200ms ease; } .financity-navigation .sf-menu > li.financity-sub-open > .sub-menu { opacity: 1; } /* --- Motion --------------------------------------------------------------- Promote the elements that actually move to their own compositor layer, so scrolling drives a transform rather than a repaint. */ .gdlr-core-parallax { will-change: transform; backface-visibility: hidden; } .financity-sticky-navigation.financity-fixed-navigation { will-change: transform; } /* The sticky header slid down via jQuery's slideDown(200). A transform-based transition gets the same motion off the main thread. */ .financity-sticky-navigation.financity-fixed-navigation { transform: translate3d(0, -100%, 0); transition: transform 200ms ease-out; } .financity-sticky-navigation.financity-fixed-navigation.financity-animate-fixed-navigation { transform: translate3d(0, 0, 0); } /* The mmenu transform rules must still win while the off-canvas panel is open. */ html.mm-opening.financity-mmenu-right .financity-sticky-navigation.financity-fixed-navigation { transform: translate3d(-350px, 0, 0); } @media (max-width: 1024px) { html.mm-opening.financity-mmenu-right .financity-sticky-navigation.financity-fixed-navigation { transform: translate3d(-250px, 0, 0); } } .financity-mobile-header.financity-fixed-navigation { transform: translate3d(0, -100%, 0); transition: transform 200ms ease-out; } .financity-mobile-header.financity-fixed-navigation.financity-animate-fixed-navigation { transform: translate3d(0, 0, 0); } /* --- Reduced motion ------------------------------------------------------- Honour the OS-level preference: keep every element in its final position and drop the movement, rather than hiding content that only appears on scroll. */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; } [data-gdlr-animation] { opacity: 1 !important; } .financity-navigation .sf-menu > li.sfHover > .sub-menu { opacity: 1 !important; } .gdlr-core-parallax { transform: none !important; will-change: auto; } .financity-sticky-navigation.financity-fixed-navigation, .financity-mobile-header.financity-fixed-navigation { transform: none !important; } }