/** * Dropdown menus — load last in so this wins over Astra style.min.css * (.sub-menu { background: #fff }) and nested paints on li / .menu-link. */ #masthead #primary-menu ul.sub-menu, #masthead .main-navigation #primary-menu ul.sub-menu { background: rgba(38, 38, 38, 0.48) !important; background-color: rgba(38, 38, 38, 0.48) !important; background-image: none !important; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: none !important; border-top: 0 !important; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.28) !important; } .ast-desktop .main-header-menu.submenu-with-border .sub-menu, .ast-desktop .main-header-menu.submenu-with-border .sub-menu .sub-menu, .ast-desktop .main-header-menu.submenu-with-border .astra-full-megamenu-wrapper { border: none !important; border-color: transparent !important; border-top-width: 0 !important; } #masthead #primary-menu ul.sub-menu ul.sub-menu { background: rgba(32, 32, 32, 0.52) !important; background-color: rgba(32, 32, 32, 0.52) !important; } #masthead #primary-menu ul.sub-menu > li, #masthead .main-navigation ul.sub-menu > li { background: transparent !important; background-color: transparent !important; } #masthead #primary-menu ul.sub-menu .menu-item > .menu-link, #masthead #primary-menu ul.sub-menu a.menu-link { background: transparent !important; background-color: transparent !important; } #masthead #primary-menu ul.sub-menu > li:hover { background: rgba(22, 22, 22, 0.42) !important; background-color: rgba(22, 22, 22, 0.42) !important; } #masthead #primary-menu ul.sub-menu a.menu-link:hover, #masthead #primary-menu ul.sub-menu a.menu-link:focus { background: rgba(22, 22, 22, 0.5) !important; background-color: rgba(22, 22, 22, 0.5) !important; } /* * Mobile drawer: no hero text-shadow on nav labels. * Hero blocks often load AFTER this file in ; use #masthead + #primary-menu so specificity * beats .cc-*-fullscreen-hero #primary-menu > .menu-item > .menu-link { text-shadow: … }. */ @media (max-width: 921px) { .ast-header-break-point #masthead #primary-menu > .menu-item > .menu-link, .ast-header-break-point #masthead #primary-menu > .menu-item > a, .ast-header-break-point #masthead .main-header-menu > .menu-item > .menu-link, .ast-header-break-point #masthead .main-header-menu > .menu-item > a { text-shadow: none !important; } } /* * Flyout / fullscreen mobile menu: markup is often cloned outside #masthead into * .ast-mobile-popup-drawer. Theme CSS still applies .main-header-menu .menu-link { color: #fff }, * which yields white-on-white against a white drawer. Cover full Astra break range (921px). */ @media (max-width: 921px) { /* Drawer root + inner content wrapper (Astra injects menu here at runtime). */ /* Use descendants, not only > child: builder / popup clones may wrap .menu-link in extra nodes. */ .ast-mobile-popup-drawer .main-header-menu > .menu-item > .menu-link, .ast-mobile-popup-drawer .main-header-menu > .menu-item > a, .ast-mobile-popup-drawer #primary-menu > .menu-item > .menu-link, .ast-mobile-popup-drawer #primary-menu > .menu-item > a, .ast-mobile-popup-drawer .main-navigation ul li a.menu-link, .ast-mobile-popup-drawer .main-navigation ul li a, .ast-mobile-popup-drawer #primary-menu a.menu-link, .ast-mobile-popup-drawer #primary-menu a:not(.ast-button), .ast-mobile-popup-drawer .main-header-menu a.menu-link, .ast-mobile-popup-drawer .main-header-menu a:not(.ast-button), .ast-mobile-popup-content .main-header-menu > .menu-item > .menu-link, .ast-mobile-popup-content .main-header-menu > .menu-item > a, .ast-mobile-popup-content #primary-menu > .menu-item > .menu-link, .ast-mobile-popup-content #primary-menu > .menu-item > a, .ast-mobile-popup-content .main-navigation ul li a.menu-link, .ast-mobile-popup-content .main-navigation ul li a, .ast-mobile-popup-content #primary-menu a.menu-link, .ast-mobile-popup-content #primary-menu a:not(.ast-button), .ast-mobile-popup-content .main-header-menu a.menu-link, .ast-mobile-popup-content .main-header-menu a:not(.ast-button) { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } .ast-mobile-popup-drawer #primary-menu .sub-menu .menu-link, .ast-mobile-popup-drawer #primary-menu .sub-menu a, .ast-mobile-popup-drawer .main-header-menu .sub-menu .menu-link, .ast-mobile-popup-drawer .main-header-menu .sub-menu a, .ast-mobile-popup-content #primary-menu .sub-menu .menu-link, .ast-mobile-popup-content #primary-menu .sub-menu a, .ast-mobile-popup-content .main-header-menu .sub-menu .menu-link, .ast-mobile-popup-content .main-header-menu .sub-menu a { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; } .ast-mobile-popup-drawer .cc-lang-open, .ast-mobile-popup-drawer .cc-lang-current-label, .ast-mobile-popup-content .cc-lang-open, .ast-mobile-popup-content .cc-lang-current-label { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; } /* Inline slide-down nav still under #masthead — fix 769–921px gap vs older max-width:768 rules */ .ast-header-break-point #masthead .main-header-menu > .menu-item > .menu-link, .ast-header-break-point #masthead .main-header-menu > .menu-item > a, .ast-header-break-point #masthead #primary-menu > .menu-item > .menu-link, .ast-header-break-point #masthead #primary-menu > .menu-item > a, .ast-header-break-point #masthead .main-navigation ul li a { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } .ast-header-break-point #masthead .cc-lang-open, .ast-header-break-point #masthead .cc-lang-current-label { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; } /* * Static / CDN HTML often omits body.ast-header-break-point (WP normally adds it via JS). * Top-level nav rows still use .main-header-menu .menu-link { color: #fff } from the theme. */ .main-header-menu > .menu-item > .menu-link, .main-header-menu > .menu-item > a.menu-link, .main-header-menu .menu-item a.menu-link, .main-header-menu .menu-item > a { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } /* Any primary menu anchor (clone may live outside known wrappers). */ html body ul#primary-menu a.menu-link, html body ul#primary-menu .sub-menu a { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; opacity: 1 !important; visibility: visible !important; } /* * Header Footer Elementor flyout: plugins/header-footer-elementor/.../frontend.css sets * .hfe-flyout-content { color: #fff } and ul li { color: #fff } for dark panels. Many pages * use a light flyout background — text disappears without an override. */ .hfe-flyout-content, .hfe-flyout-content.push, .hfe-flyout-content ul li, .hfe-flyout-wrapper .hfe-nav-menu a, .hfe-flyout-wrapper .hfe-nav-menu a.hfe-menu-item, .hfe-flyout-container .hfe-nav-menu .menu-link { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } .hfe-flyout-wrapper .cc-lang-open, .hfe-flyout-wrapper .cc-lang-current-label { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; } /* Beat late-loaded theme / Elementor bundles on primary nav (duplicate ids illegal but clones happen). */ html body ul#primary-menu.main-header-menu > li.menu-item > a.menu-link, html body ul#primary-menu.main-header-menu li.menu-item > a.menu-link, html body ul#primary-menu.main-header-menu a.menu-link, html body ul#primary-menu.main-header-menu li a { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } /* Clone sometimes drops duplicate id on ul — target nav subtree only */ .ast-mobile-popup-drawer .main-navigation a.menu-link, .ast-mobile-popup-drawer .main-navigation a:not(.ast-button), .ast-mobile-popup-content .main-navigation a.menu-link, .ast-mobile-popup-content .main-navigation a:not(.ast-button) { color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; text-shadow: none !important; } /* * Row rhythm + alignment: theme keeps links compact; primary ul uses ast-justify-content-flex-end * which reads as centered/end-aligned in column flyouts. Language row matches other items (left). */ .ast-mobile-popup-drawer ul#primary-menu.main-header-menu.ast-flex, .ast-mobile-popup-drawer ul.main-header-menu.ast-nav-menu.ast-flex, .ast-mobile-popup-content ul#primary-menu.main-header-menu.ast-flex, html body ul#primary-menu.main-header-menu.ast-flex { justify-content: flex-start !important; align-items: stretch !important; width: 100% !important; } .ast-mobile-popup-drawer #primary-menu > .menu-item, .ast-mobile-popup-content #primary-menu > .menu-item, #masthead .main-header-bar-navigation #primary-menu > .menu-item { align-items: stretch !important; -webkit-box-align: stretch !important; justify-content: flex-start !important; -webkit-box-pack: start !important; text-align: left !important; } /* * Astra `.menu-item` uses column flex + legacy `-webkit-box-pack:center`; language row `.menu-link` * is `inline-flex` in header `