/** * FFI Header Fix v1.2.0 * * Enfold sets id="top" on → use "#top.ffi-header-fix …" * * Site already uses: * - #header_main { background: #4D88CE } * - home header overlays hero (margin-bottom: -80px) * - white menu text + inverted logo * * We keep that model and only fix overflow / tablet / search polish. */ /* -------------------------------------------------------------------------- 1. Kill WP Mobile Menu leftovers -------------------------------------------------------------------------- */ #top.ffi-header-fix .mob-menu-header-holder, #top.ffi-header-fix .mobmenu-panel, #top.ffi-header-fix .mobmenu-overlay, #top.ffi-header-fix .mobmenu-push-wrap, #top.ffi-header-fix .mob-menu-left-bg-holder, #top.ffi-header-fix .mob-menu-right-bg-holder, #top.ffi-header-fix .mobmenu-footer-menu-holder { display: none !important; visibility: hidden !important; pointer-events: none !important; height: 0 !important; max-height: 0 !important; overflow: hidden !important; opacity: 0 !important; } #top.ffi-header-fix.mob-menu-overlay, #top.ffi-header-fix.mob-menu-slideout, #top.ffi-header-fix.mob-menu-slideout-over, #top.ffi-header-fix.mob-menu-slideout-top { padding-top: 0 !important; transform: none !important; } /* -------------------------------------------------------------------------- 2. Full-bleed blue bar — match existing 80px overlay height -------------------------------------------------------------------------- */ #top.ffi-header-fix #header { z-index: 1000; overflow: visible !important; } #top.ffi-header-fix #header_main { border: 0 !important; padding: 0 !important; background-color: #4d88ce !important; width: 100% !important; box-sizing: border-box !important; overflow: visible !important; } #top.ffi-header-fix #header_main > .container.av-logo-container { max-width: 100% !important; width: 100% !important; height: 80px !important; line-height: 80px !important; padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box !important; position: relative !important; } #top.ffi-header-fix #header_main .inner-container { height: 80px !important; position: relative !important; overflow: visible !important; width: 100% !important; } /* Logo — keep Enfold left placement, don’t break overlay height */ #top.ffi-header-fix #header_main .logo { z-index: 5 !important; max-width: min(320px, 52vw) !important; height: 80px !important; display: flex !important; align-items: center !important; padding: 0 !important; margin: 0 !important; } #top.ffi-header-fix #header_main .logo a, #top.ffi-header-fix #header_main .logo strong { display: flex !important; align-items: center !important; height: 80px !important; line-height: 0 !important; } #top.ffi-header-fix #header_main .logo img { display: block !important; width: auto !important; max-width: 100% !important; height: auto !important; max-height: 52px !important; object-fit: contain !important; } /* Menu stays absolute-right (Enfold), full header height */ #top.ffi-header-fix #header_main .main_menu { position: absolute !important; right: 0 !important; top: 0 !important; height: 80px !important; line-height: 80px !important; z-index: 10 !important; margin: 0 !important; display: block !important; } #top.ffi-header-fix #header_main .avia-menu, #top.ffi-header-fix #header_main .av-main-nav-wrap { height: 80px !important; } /* Home overlay: keep the designed -80px pull over the hero */ #top.ffi-header-fix.home #header:not(.entry-content-header) { margin-bottom: -80px !important; } #top.ffi-header-fix.home .header_bg { display: none !important; } /* Always kill Enfold's built-in search icon (Ivory Search is the real one) */ #top.ffi-header-fix #avia-menu > li#menu-item-search, #top.ffi-header-fix #avia-menu > li.menu-item-search-dropdown, #top.ffi-header-fix #header #menu-item-search { display: none !important; visibility: hidden !important; width: 0 !important; height: 0 !important; max-width: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; pointer-events: none !important; } /* -------------------------------------------------------------------------- 3. Desktop (≥ 1200px) — horizontal nav + styled search -------------------------------------------------------------------------- */ @media screen and (min-width: 1200px) { #top.ffi-header-fix #header_main > .container.av-logo-container { padding-left: 32px !important; padding-right: 32px !important; } #top.ffi-header-fix #avia-menu.av-main-nav { display: flex !important; align-items: center !important; justify-content: flex-end !important; flex-wrap: nowrap !important; height: 80px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } /* Show nav items — EXCLUDE Enfold's built-in search (ghost loop) + burger */ #top.ffi-header-fix #avia-menu.av-main-nav > li:not(#menu-item-search):not(.menu-item-search-dropdown):not(.av-burger-menu-main) { float: none !important; display: flex !important; align-items: center !important; height: 80px !important; margin: 0 !important; padding: 0 !important; } #top.ffi-header-fix #avia-menu.av-main-nav > li.av-burger-menu-main, #top.ffi-header-fix #avia-menu.av-main-nav > li#menu-item-search, #top.ffi-header-fix #avia-menu.av-main-nav > li.menu-item-search-dropdown { display: none !important; visibility: hidden !important; width: 0 !important; height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; } #top.ffi-header-fix #header_main .av-main-nav > li:not(.av-menu-button):not(.menu-item-type-gs_sim) > a { display: flex !important; align-items: center !important; height: 80px !important; line-height: 1.2 !important; padding: 0 12px !important; white-space: nowrap !important; background: transparent !important; } #top.ffi-header-fix #header_main .av-main-nav > li:not(.av-menu-button) .avia-menu-text { letter-spacing: 1.2px !important; font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; font-size: 13px !important; text-transform: uppercase !important; color: #fff !important; background: transparent !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; } /* Ivory Search — one pill, vertically centered with nav */ #top.ffi-header-fix #avia-menu > li.menu-item-type-gs_sim, #top.ffi-header-fix #menu-item-4842 { display: flex !important; align-items: center !important; justify-content: center !important; height: 80px !important; padding: 0 10px !important; line-height: normal !important; } #top.ffi-header-fix #menu-item-4842 .is-search-form, #top.ffi-header-fix #menu-item-4842 .is-ajax-search { display: flex !important; align-items: center !important; margin: 0 !important; margin-top: 0 !important; padding: 0 !important; position: relative !important; height: 36px !important; line-height: normal !important; top: auto !important; transform: none !important; } #top.ffi-header-fix #menu-item-4842 .is-search-form label { display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; height: 36px !important; line-height: normal !important; } #top.ffi-header-fix #menu-item-4842 .is-search-input { width: 148px !important; height: 36px !important; margin: 0 !important; padding: 0 40px 0 16px !important; border: 1px solid rgba(255, 255, 255, 0.85) !important; border-radius: 999px !important; background: transparent !important; color: #fff !important; font-family: 'Montserrat', sans-serif !important; font-size: 13px !important; line-height: 34px !important; box-shadow: none !important; outline: none !important; -webkit-appearance: none !important; vertical-align: middle !important; } #top.ffi-header-fix #menu-item-4842 .is-search-input::placeholder { color: rgba(255, 255, 255, 0.7) !important; opacity: 1 !important; } #top.ffi-header-fix #menu-item-4842 .is-search-input:focus { border-color: #fff !important; background: rgba(255, 255, 255, 0.1) !important; } #top.ffi-header-fix #menu-item-4842 .is-search-submit { position: absolute !important; right: 4px !important; top: 50% !important; transform: translateY(-50%) !important; width: 32px !important; height: 32px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; } #top.ffi-header-fix #menu-item-4842 .is-search-icon { background: transparent !important; border: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; margin: 0 !important; } #top.ffi-header-fix #menu-item-4842 .is-search-icon svg { width: 18px !important; height: 18px !important; fill: #fff !important; filter: none !important; } /* * Contact CTA — Enfold paints the pill on .avia-menu-text. * Only style that span; keep transparent so we don't get a double blob. */ #top.ffi-header-fix #avia-menu > li.av-menu-button > a, #top.ffi-header-fix #menu-item-4840 > a { display: flex !important; align-items: center !important; height: 80px !important; line-height: 1 !important; padding: 0 0 0 10px !important; margin: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } #top.ffi-header-fix #avia-menu > li.av-menu-button > a .avia-menu-text, #top.ffi-header-fix #menu-item-4840 > a .avia-menu-text, #top.ffi-header-fix #wrap_all .header_color .av-menu-button-colored > a .avia-menu-text { display: inline-flex !important; align-items: center !important; justify-content: center !important; background-color: #ff7a00 !important; color: #fff !important; border: 0 !important; border-radius: 40px !important; padding: 10px 22px !important; margin: 0 !important; line-height: 1.2 !important; height: auto !important; box-shadow: none !important; letter-spacing: 1.2px !important; font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; font-size: 13px !important; text-transform: uppercase !important; } #top.ffi-header-fix #avia-menu > li.av-menu-button > a:hover .avia-menu-text, #top.ffi-header-fix #menu-item-4840 > a:hover .avia-menu-text { background-color: #e86e00 !important; opacity: 1 !important; } #top.ffi-header-fix #avia-menu > li.av-menu-button .avia-menu-fx, #top.ffi-header-fix #menu-item-4840 .avia-menu-fx, #top.ffi-header-fix #avia-menu > li.av-menu-button .avia-bullet, #top.ffi-header-fix #menu-item-4840 .avia-bullet { display: none !important; } #top.ffi-header-fix #menu-item-5524 .avia_mega_div { left: auto !important; right: 0 !important; min-width: 420px !important; } } @media screen and (min-width: 1200px) and (max-width: 1400px) { #top.ffi-header-fix #header_main .av-main-nav > li:not(.av-menu-button):not(.menu-item-type-gs_sim) > a { padding: 0 8px !important; } #top.ffi-header-fix #header_main .av-main-nav > li:not(.av-menu-button) .avia-menu-text { font-size: 12px !important; letter-spacing: 1px !important; } #top.ffi-header-fix #menu-item-4842 .is-search-input { width: 120px !important; } #top.ffi-header-fix #avia-menu > li.av-menu-button > a .avia-menu-text, #top.ffi-header-fix #menu-item-4840 > a .avia-menu-text { padding: 9px 16px !important; font-size: 12px !important; } } /* -------------------------------------------------------------------------- 4. Tablet + mobile (≤ 1199px) — logo + burger only -------------------------------------------------------------------------- */ @media screen and (max-width: 1199px) { #top.ffi-header-fix #header_main > .container.av-logo-container, #top.ffi-header-fix #header_main .inner-container, #top.ffi-header-fix #header_main .logo, #top.ffi-header-fix #header_main .logo a, #top.ffi-header-fix #header_main .main_menu { height: 64px !important; line-height: 64px !important; } #top.ffi-header-fix.home #header:not(.entry-content-header) { margin-bottom: -64px !important; } #top.ffi-header-fix #header_main > .container.av-logo-container { padding-left: 16px !important; padding-right: 16px !important; } #top.ffi-header-fix #header_main .logo { max-width: min(260px, 68vw) !important; } #top.ffi-header-fix #header_main .logo img { max-height: 42px !important; } #top.ffi-header-fix #avia-menu.av-main-nav { display: flex !important; align-items: center !important; justify-content: flex-end !important; height: 64px !important; margin: 0 !important; padding: 0 !important; } #top.ffi-header-fix #avia-menu.av-main-nav > li:not(.av-burger-menu-main) { display: none !important; } #top.ffi-header-fix #avia-menu.av-main-nav > li.av-burger-menu-main { display: flex !important; align-items: center !important; justify-content: center !important; float: none !important; margin: 0 !important; padding: 0 4px !important; height: 64px !important; z-index: 10050 !important; visibility: visible !important; } #top.ffi-header-fix #avia-menu > li.av-burger-menu-main > a { display: flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; padding: 0 !important; margin: 0 !important; line-height: 1 !important; background: transparent !important; border: 0 !important; } #top.ffi-header-fix .av-hamburger strong { display: none !important; } #top.ffi-header-fix .av-hamburger-inner, #top.ffi-header-fix .av-hamburger-inner::before, #top.ffi-header-fix .av-hamburger-inner::after { background-color: #ffffff !important; } /* Drawer */ #top.ffi-header-fix #av-burger-menu-ul { padding: 72px 0 40px !important; box-sizing: border-box !important; max-width: 360px !important; width: min(360px, 88vw) !important; box-shadow: -12px 0 40px rgba(15, 23, 42, 0.12) !important; background: #ffffff !important; } #top.ffi-header-fix #av-burger-menu-ul > li { border: 0 !important; margin: 0 !important; display: block !important; float: none !important; width: 100% !important; height: auto !important; line-height: 1.3 !important; } #top.ffi-header-fix #av-burger-menu-ul > li > a { display: block !important; padding: 16px 28px !important; height: auto !important; line-height: 1.3 !important; border-bottom: 1px solid #eef1f5 !important; font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; font-size: 15px !important; letter-spacing: 1px !important; text-transform: uppercase !important; color: #1a1a1a !important; } #top.ffi-header-fix #av-burger-menu-ul .avia-menu-text { color: inherit !important; font-size: 15px !important; } #top.ffi-header-fix #av-burger-menu-ul > li > a:hover { color: #2f6dbc !important; background: #f5f8fc !important; } /* Hide search inside drawer (use desktop search; keep mobile clean) */ #top.ffi-header-fix #av-burger-menu-ul > li.menu-item-type-gs_sim, #top.ffi-header-fix #av-burger-menu-ul > li.menu-item-object-gs_sim, #top.ffi-header-fix #av-burger-menu-ul > li.menu-item-search, #top.ffi-header-fix #av-burger-menu-ul #menu-item-4842, #top.ffi-header-fix #av-burger-menu-ul .is-search-form { display: none !important; } #top.ffi-header-fix #av-burger-menu-ul > li.av-menu-button, #top.ffi-header-fix #av-burger-menu-ul > #menu-item-4840 { margin-top: 20px !important; padding: 0 28px !important; width: auto !important; } #top.ffi-header-fix #av-burger-menu-ul > li.av-menu-button > a, #top.ffi-header-fix #av-burger-menu-ul > #menu-item-4840 > a { background: transparent !important; border-radius: 0 !important; border: 0 !important; text-align: center !important; color: #fff !important; padding: 0 !important; height: auto !important; line-height: 1.3 !important; } #top.ffi-header-fix #av-burger-menu-ul > li.av-menu-button .avia-menu-text, #top.ffi-header-fix #av-burger-menu-ul > #menu-item-4840 .avia-menu-text { display: block !important; background-color: #ff7a00 !important; color: #fff !important; border-radius: 50px !important; padding: 14px 24px !important; text-align: center !important; } #top.ffi-header-fix #av-burger-menu-ul .avia-menu-fx { display: none !important; } #top.ffi-header-fix #av-burger-menu-ul .sub-menu, #top.ffi-header-fix #av-burger-menu-ul .avia_mega_div { position: static !important; display: block !important; width: 100% !important; max-width: 100% !important; box-shadow: none !important; background: #f7f9fc !important; padding: 0 !important; margin: 0 !important; border: 0 !important; opacity: 1 !important; visibility: visible !important; float: none !important; } #top.ffi-header-fix #av-burger-menu-ul .sub-menu li, #top.ffi-header-fix #av-burger-menu-ul .avia_mega_div li { display: block !important; float: none !important; width: 100% !important; height: auto !important; } #top.ffi-header-fix #av-burger-menu-ul .sub-menu a, #top.ffi-header-fix #av-burger-menu-ul .mega_menu_title a, #top.ffi-header-fix #av-burger-menu-ul .mega_menu_title { font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.5px !important; text-transform: none !important; color: #4a5568 !important; padding: 12px 28px 12px 40px !important; display: block !important; border-bottom: 1px solid #e8edf3 !important; height: auto !important; line-height: 1.3 !important; } } @media screen and (max-width: 479px) { #top.ffi-header-fix #header_main > .container.av-logo-container { padding-left: 12px !important; padding-right: 12px !important; } #top.ffi-header-fix #header_main .logo { max-width: min(200px, 64vw) !important; } #top.ffi-header-fix #header_main .logo img { max-height: 36px !important; } #top.ffi-header-fix #av-burger-menu-ul { width: 100% !important; max-width: 100% !important; } } #top.ffi-header-fix.av-burger-overlay-active { overflow: hidden !important; }