/* fgb-header-patch — structural header CSS (auto-extracted). Layout only: no color/background/font/branding declarations. Regenerate with tools/extract-header-css.py when the canonical firegang-framework-b.local header changes. DO NOT hand-edit. */ /* ===== from parent fg-style (69 rule groups) ===== */ #nav, #nav ul, .btn-list { margin: 0; padding: 0; list-style: none; } :where(#header) .container:after { display: block; clear: both; } :where(#header) .btn { padding: .4em .7em; display: inline-block; padding: 16px 56px; border-radius: 5px; } :where(#header) .row { overflow: hidden; clear: both; float: none; } #wrapper.nav-active .nav-bar { display: block; height: auto; } #wrapper.nav-active.opener { width: 32px; height: 32px; } #header { width: 100%; position: relative; } #header .header-holder { position: relative; z-index: 100; } .page-scrolled .header-holder { width: 100%; position: fixed!important; top: 0; height: 75px; } #header .container { width: 90%; max-width: 1500px; padding: 0 15px; } #header .mobile-hidden span { display: block; } .nav-bar { float: left; margin: 0 -20px; } .logo-block { float: left; margin: 15px 0; } #logo { display: inline-block; vertical-align: middle; margin: 23px 32px 0 0; min-width: 150px; } #logo img { width: 150px; height: auto; } .sLogo { width: 0; overflow: hidden; } .brand { display: inline-block; vertical-align: middle; } .menu-opener { float: right; width: 62px; display: none; margin-right: -15px; height: 31px; position: relative; overflow: hidden; } .menu-opener:before, .menu-opener:after, .menu-opener span { position: absolute; top: 16px; left: 25%; right: 25%; height: 5px; margin-top: -4px; } .menu-opener:before, .menu-opener:after { top: 7px; } .menu-opener:after { top: 25px; } .nav-active .menu-opener:after, .nav-active .menu-opener:before { top: 16px; left: 25%; right: 25%; } .btn-block { float: right; display: block; } .btn-list { margin: 0 0px 0 0; display: inline-block; vertical-align: top; } .btn-list li { padding: 0 0 3px; } .btn-list li:last-child { padding: 0; } .btn-list a { display: block; vertical-align: middle; padding: 13px 15px; min-width: 160px; margin: 15px 0 0 10px; height: 62px; border-radius: 3px; } .page-scrolled .btn-list a { display: none; } .opener-form { position: relative; display: inline-block; vertical-align: top; float: right; } .booking-opener { max-width: 210px; float: right; padding: 12px 25px; margin: 15px 0 0 10px; border-radius: 3px; } :where(#header) .col-xs-1, :where(#header) .col-sm-1, :where(#header) .col-md-1, :where(#header) .col-lg-1, :where(#header) .col-xs-2, :where(#header) .col-sm-2, :where(#header) .col-md-2, :where(#header) .col-lg-2, :where(#header) .col-xs-3, :where(#header) .col-sm-3, :where(#header) .col-md-3, :where(#header) .col-lg-3, :where(#header) .col-xs-4, :where(#header) .col-sm-4, :where(#header) .col-md-4, :where(#header) .col-lg-4, :where(#header) .col-xs-5, :where(#header) .col-sm-5, :where(#header) .col-md-5, :where(#header) .col-lg-5, :where(#header) .col-xs-6, :where(#header) .col-sm-6, :where(#header) .col-md-6, :where(#header) .col-lg-6, :where(#header) .col-xs-7, :where(#header) .col-sm-7, :where(#header) .col-md-7, :where(#header) .col-lg-7, :where(#header) .col-xs-8, :where(#header) .col-sm-8, :where(#header) .col-md-8, :where(#header) .col-lg-8, :where(#header) .col-xs-9, :where(#header) .col-sm-9, :where(#header) .col-md-9, :where(#header) .col-lg-9, :where(#header) .col-xs-10, :where(#header) .col-sm-10, :where(#header) .col-md-10, :where(#header) .col-lg-10, :where(#header) .col-xs-11, :where(#header) .col-sm-11, :where(#header) .col-md-11, :where(#header) .col-lg-11, :where(#header) .col-xs-12, :where(#header) .col-sm-12, :where(#header) .col-md-12, :where(#header) .col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } :where(#header) .col-xs-1, :where(#header) .col-xs-2, :where(#header) .col-xs-3, :where(#header) .col-xs-4, :where(#header) .col-xs-5, :where(#header) .col-xs-6, :where(#header) .col-xs-7, :where(#header) .col-xs-8, :where(#header) .col-xs-9, :where(#header) .col-xs-10, :where(#header) .col-xs-11, :where(#header) .col-xs-12 { float: left; } :where(#header) .col-xs-12 { width: 100%; } :where(#header) .col-xs-11 { width: 91.66666667%; } :where(#header) .col-xs-10 { width: 83.33333333%; } :where(#header) .col-xs-9 { width: 75%; } :where(#header) .col-xs-8 { width: 66.66666667%; } :where(#header) .col-xs-7 { width: 58.33333333%; } :where(#header) .col-xs-6 { width: 50%; } :where(#header) .col-xs-5 { width: 41.66666667%; } :where(#header) .col-xs-4 { width: 33.33333333%; } :where(#header) .col-xs-3 { width: 25%; } :where(#header) .col-xs-2 { width: 16.66666667%; } :where(#header) .col-xs-1 { width: 8.33333333%; } :where(#header) .col-xs-offset-12 { margin-left: 100%; } :where(#header) .col-xs-offset-11 { margin-left: 91.66666667%; } :where(#header) .col-xs-offset-10 { margin-left: 83.33333333%; } :where(#header) .col-xs-offset-9 { margin-left: 75%; } :where(#header) .col-xs-offset-8 { margin-left: 66.66666667%; } :where(#header) .col-xs-offset-7 { margin-left: 58.33333333%; } :where(#header) .col-xs-offset-6 { margin-left: 50%; } :where(#header) .col-xs-offset-5 { margin-left: 41.66666667%; } :where(#header) .col-xs-offset-4 { margin-left: 33.33333333%; } :where(#header) .col-xs-offset-3 { margin-left: 25%; } :where(#header) .col-xs-offset-2 { margin-left: 16.66666667%; } :where(#header) .col-xs-offset-1 { margin-left: 8.33333333%; } :where(#header) .col-xs-offset-0 { margin-left: 0; } @media (min-width: 768px) { :where(#header) .col-sm-1, :where(#header) .col-sm-2, :where(#header) .col-sm-3, :where(#header) .col-sm-4, :where(#header) .col-sm-5, :where(#header) .col-sm-6, :where(#header) .col-sm-7, :where(#header) .col-sm-8, :where(#header) .col-sm-9, :where(#header) .col-sm-10, :where(#header) .col-sm-11, :where(#header) .col-sm-12 { float: left; } :where(#header) .col-sm-12 { width: 100%; } :where(#header) .col-sm-11 { width: 91.66666667%; } :where(#header) .col-sm-10 { width: 83.33333333%; } :where(#header) .col-sm-9 { width: 75%; } :where(#header) .col-sm-8 { width: 66.66666667%; } :where(#header) .col-sm-7 { width: 58.33333333%; } :where(#header) .col-sm-6 { width: 50%; } :where(#header) .col-sm-5 { width: 41.66666667%; } :where(#header) .col-sm-4 { width: 33.33333333%; } :where(#header) .col-sm-3 { width: 25%; } :where(#header) .col-sm-2 { width: 16.66666667%; } :where(#header) .col-sm-1 { width: 8.33333333%; } :where(#header) .col-sm-offset-12 { margin-left: 100%; } :where(#header) .col-sm-offset-11 { margin-left: 91.66666667%; } :where(#header) .col-sm-offset-10 { margin-left: 83.33333333%; } :where(#header) .col-sm-offset-9 { margin-left: 75%; } :where(#header) .col-sm-offset-8 { margin-left: 66.66666667%; } :where(#header) .col-sm-offset-7 { margin-left: 58.33333333%; } :where(#header) .col-sm-offset-6 { margin-left: 50%; } :where(#header) .col-sm-offset-5 { margin-left: 41.66666667%; } :where(#header) .col-sm-offset-4 { margin-left: 33.33333333%; } :where(#header) .col-sm-offset-3 { margin-left: 25%; } :where(#header) .col-sm-offset-2 { margin-left: 16.66666667%; } :where(#header) .col-sm-offset-1 { margin-left: 8.33333333%; } :where(#header) .col-sm-offset-0 { margin-left: 0; } } @media (min-width: 992px) { :where(#header) .col-md-1, :where(#header) .col-md-2, :where(#header) .col-md-3, :where(#header) .col-md-4, :where(#header) .col-md-5, :where(#header) .col-md-6, :where(#header) .col-md-7, :where(#header) .col-md-8, :where(#header) .col-md-9, :where(#header) .col-md-10, :where(#header) .col-md-11, :where(#header) .col-md-12 { float: left; } :where(#header) .col-md-12 { width: 100%; } :where(#header) .col-md-11 { width: 91.66666667%; } :where(#header) .col-md-10 { width: 83.33333333%; } :where(#header) .col-md-9 { width: 75%; } :where(#header) .col-md-8 { width: 66.66666667%; } :where(#header) .col-md-7 { width: 58.33333333%; } :where(#header) .col-md-6 { width: 50%; } :where(#header) .col-md-5 { width: 41.66666667%; } :where(#header) .col-md-4 { width: 33.33333333%; } :where(#header) .col-md-3 { width: 25%; } :where(#header) .col-md-2 { width: 16.66666667%; } :where(#header) .col-md-1 { width: 8.33333333%; } :where(#header) .col-md-offset-12 { margin-left: 100%; } :where(#header) .col-md-offset-11 { margin-left: 91.66666667%; } :where(#header) .col-md-offset-10 { margin-left: 83.33333333%; } :where(#header) .col-md-offset-9 { margin-left: 75%; } :where(#header) .col-md-offset-8 { margin-left: 66.66666667%; } :where(#header) .col-md-offset-7 { margin-left: 58.33333333%; } :where(#header) .col-md-offset-6 { margin-left: 50%; } :where(#header) .col-md-offset-5 { margin-left: 41.66666667%; } :where(#header) .col-md-offset-4 { margin-left: 33.33333333%; } :where(#header) .col-md-offset-3 { margin-left: 25%; } :where(#header) .col-md-offset-2 { margin-left: 16.66666667%; } :where(#header) .col-md-offset-1 { margin-left: 8.33333333%; } :where(#header) .col-md-offset-0 { margin-left: 0; } } @media (min-width: 1025px) { :where(#header) .col-lg-1, :where(#header) .col-lg-2, :where(#header) .col-lg-3, :where(#header) .col-lg-4, :where(#header) .col-lg-5, :where(#header) .col-lg-6, :where(#header) .col-lg-7, :where(#header) .col-lg-8, :where(#header) .col-lg-9, :where(#header) .col-lg-10, :where(#header) .col-lg-11, :where(#header) .col-lg-12 { float: left; } :where(#header) .col-lg-12 { width: 100%; } :where(#header) .col-lg-11 { width: 91.66666667%; } :where(#header) .col-lg-10 { width: 83.33333333%; } :where(#header) .col-lg-9 { width: 75%; } :where(#header) .col-lg-8 { width: 66.66666667%; } :where(#header) .col-lg-7 { width: 58.33333333%; } :where(#header) .col-lg-6 { width: 50%; } :where(#header) .col-lg-5 { width: 41.66666667%; } :where(#header) .col-lg-4 { width: 33.33333333%; } :where(#header) .col-lg-3 { width: 25%; } :where(#header) .col-lg-2 { width: 16.66666667%; } :where(#header) .col-lg-1 { width: 8.33333333%; } :where(#header) .col-lg-offset-12 { margin-left: 100%; } :where(#header) .col-lg-offset-11 { margin-left: 91.66666667%; } :where(#header) .col-lg-offset-10 { margin-left: 83.33333333%; } :where(#header) .col-lg-offset-9 { margin-left: 75%; } :where(#header) .col-lg-offset-8 { margin-left: 66.66666667%; } :where(#header) .col-lg-offset-7 { margin-left: 58.33333333%; } :where(#header) .col-lg-offset-6 { margin-left: 50%; } :where(#header) .col-lg-offset-5 { margin-left: 41.66666667%; } :where(#header) .col-lg-offset-4 { margin-left: 33.33333333%; } :where(#header) .col-lg-offset-3 { margin-left: 25%; } :where(#header) .col-lg-offset-2 { margin-left: 16.66666667%; } :where(#header) .col-lg-offset-1 { margin-left: 8.33333333%; } :where(#header) .col-lg-offset-0 { margin-left: 0; } } :where(#header) .mobile-show { display: none; } @media (max-width: 1440px) and (min-width: 1024px) { .page-scrolled #header .header-holder .container { width: 95%; } .page-scrolled .booking-opener { margin-left: 25px; } #nav > li { padding: 0 5px; } } @media (max-width: 1024px) { .mob-logo-section { display: block; max-width: 265px; margin: 75px auto 30px; } } @media (max-width: 1024px) { #nav .sub-menu.mm-spn--open { padding: 0 5px; } } @media (max-width: 1024px) { .btn-list a { position: absolute; right: 3px; top: 112px; margin: unset !important; } :where(#header) .container { padding: 0 50px; } #header .header-holder { padding: 15px 0; position: fixed; width: 100%; height: 63px; top: 0; } #header .header-frame { padding-top: 66px; } #wrapper.nav-active { overflow: hidden; } #header .header-holder .social { display: none; } #header .header-frame .social { display: block; float: none; margin: 0 0 47px; } .logo-block { float: none; width: 100%; margin: 0 0 13px; } .brand { display: block; } #logo { margin: 0 0 20px; } #logo img { height: 30px; width: auto; } .menu-opener { display: block; } .btn-list { max-width: inherit; } .opener-form.fixed-position { position: relative !important; left: 0 !important; top: 0 !important; } :where(#header) .col-md-4.foot { width: 100%; } :where(#header) .mobile-show { display: block; } .mobile-show.moreInfo { position: fixed; bottom: 5vh; right: 5px; z-index: 999; } .mobile-show.moreInfo a { padding: 8px 10px; border-radius: 50%; } .mobile-show.moreInfo a.btn.btn-orange .fa { display: block; } :where(#header) .mobile-hidden { display: none; } :where(#header) .mobile-show.box-social.slick-initialized.slick-slider { width: 100%; max-width: unset; } .booking-opener { position: fixed; right: 3px; top: 73px; } .page-scrolled a.btn.btn-orange.booking-opener { top: 61px; } } @media (max-width: 768px) { #nav { height: 80vh; overflow-y: scroll; } } @media (max-width: 666px) { .home .booking-opener { top: 52px; } .btn-list a { max-width: 188px; width: 100%; } .btn.booking-opener { top: 50px; max-width: 200px; } .page-template-full-width-with-banner .booking-opener { top: 125px; } :where(#header) .btn { padding: 16px; } :where(#header) .btn-large { margin-bottom: 10px; } :where(#header) .container { padding: 0 15px; } #header .header-frame .social { margin: 0 0 10px; } .menu-opener { width: 52px; margin-right: -12px; } .menu-opener:before, .menu-opener:after, .menu-opener span { margin-top: -2px; height: 2px; } .menu-opener:before, .menu-opener:after { top: 10px; } .menu-opener:after { top: 22px; } .nav-active .menu-opener:after, .nav-active .menu-opener:before { left: 20%; right: 20%; } } @media (max-width: 479px) { .btn-block { width: 100%; display: block; float: left; } } @media (max-width: 358px) { #nav { height: 75vh; } .home .booking-opener { top: 65px; padding: 11px 5px; } .btn-list a { min-width: unset; top: 111px; max-width: 200px; padding: 14px 20px; } .booking-opener { margin-top: 3px; } } /* ===== from child style (60 rule groups) ===== */ :where(#header) .row.flex, :where(#header) .container.flex { display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center; clear: both; } :where(#header) .row.flex.wrap { flex-wrap: wrap; } :where(#header) .container.flex.col-reverse { flex-direction: column-reverse; } :where(#header) .flex.reverse { flex-direction: row-reverse; } :where(#header) .container, #header .container { width: min(95%, 1636px); max-width: unset; padding: 0; margin: 0 auto; } #header .container { display: flex; flex-direction: row; align-content: center; align-items: center; justify-content: space-between; flex-wrap: nowrap; padding-bottom: 0; } #nav { display: flex; flex-direction: row; flex-wrap: nowrap; flex: 1; justify-content: flex-end; } #header { position: fixed; width: min( 100vw, 1920px ); z-index: 99; } .conBlock { position: relative; display: flex; flex-direction: row-reverse; align-content: center; align-items: center; flex-wrap: nowrap; justify-content: flex-start; padding: 0; } .phoneBlock { display: inline-flex; margin-right: 0; gap: 16px; } .headAdd { float: right; width: fit-content; width: -moz-fit-content; margin-left: 0; display: inline-flex; align-items: center; gap: 16px; } .headAdd a, .phoneBlock a { display: flex; align-items: center; flex-wrap: nowrap; gap: 16px; } .phoneBlock a, .headAdd a { float: right; } #header .phoneBlock span { display: inline-block; } #header .header-holder { height: auto; padding: 22px 0; display: flex; flex-direction: row; align-content: stretch; align-items: stretch; overflow: visible; } .conBlock.flex { position: relative; display: flex; padding: 0 0 11px; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: flex-end; gap: 48px; align-items: center; } .navBtns.row.flex { overflow: visible; gap: 12px; } #header:hover, .page-scrolled #header, .page:not(.home).page-scrolled #header, .page-scrolled #header:hover { position: fixed; max-height: unset; max-width: 1920px; top: 0; z-index: 999; } .page-scrolled #header .header-holder, .page:not(.home).page-scrolled #header .header-holder { position: relative !important; } #logo { float: left; margin: 0; min-width: unset; } .sLogo { width: auto; display: block; } #scLogo { display: none; top: -100%; } #header:hover #scLogo, .page:not(.home) #scLogo { display: block; } .page-scrolled .sLogo #logo { float: none; margin: 0 auto; } .page-scrolled .sLogo #scLogo { display: block; padding-top: 0; } #scLogo img { width: min( 18.177vw, 349px ); height: auto; margin: 0 auto; } #logo img { width: min( 16.146vw, 310px ); } .nav-bar { margin: 0; display: flex; flex-grow: 25; justify-content: flex-end; float: none; align-content: center; flex-direction: row; flex-wrap: nowrap; align-items: center; } .btn-block { position: relative; margin: 0; display: flex; flex-grow: 1; flex-wrap: nowrap; align-items: center; justify-content: flex-end; } .btn-block.mobile-show { display: none; } .page-scrolled .btn-block { margin: 0; } .logo-block { display: flex; padding: 0; margin: 0; flex-grow: 1; align-items: center; } #header:hover #logo img, .page-scrolled .sLogo #logo img, .page:not(.home) #logo img, .page:not(.home) #header:hover #logo img { height: auto; max-height: unset; width: min( 16.146vw, 310px); } #nav ul, #nav ul.sub-menu > li.hover a, #nav ul li.hover ul.sub-menu { z-index: 6; } #nav > li { padding: 0 0.521vw; } .page:not(.home).page-scrolled #nav { margin: 1px 0 0; } #wrapper { max-width: 1920px; margin: 0 auto; } :where(#header) .btn { width: fit-content; width: -moz-fit-content; clear: both; border-radius: var( --btn-border-radius ); padding: clamp(14px, 0.833vw, 16px) clamp(22px, 1.667vw, 32px); } :where(#header) .btn.btn-danger, :where(#header) .btn.btn-orange { position: relative; display: block; width: fit-content; border-radius: var( --btn-border-radius ); margin: 0 auto; z-index: 1; } :where(#header) .btn.btn-white { border-radius: var( --btn-border-radius ); } .btn-list a { height: fit-content; height: -moz-fit-content; width: fit-content; width: -moz-fit-content; margin: 0 5px 0 0; padding: 16px 24px; border-radius: var( --btn-border-radius ); } .btn.btn-orange.booking-opener, #header .btn.btn-orange { position: relative; padding: min(15px, 0.781vw) min(32px, 1.667vw); margin: 0; border-radius: var( --btn-border-radius ); z-index: 1; } .btn.btn-orange.booking-opener:hover { margin: 0; } .page-scrolled .btn-list a { display: block; } :where(#header) .btn.btn-orange:hover, #header .btn.btn-orange:hover, #header:hover .btn.btn-orange:hover { margin: 0 auto; } #header .btn.btn-orange:hover, #header:hover .btn.btn-orange:hover { margin: 0; } .btn.btn-orange.booking-opener:before { position: absolute; display: none; z-index: -1; top: 0; left: 0; right: 0; width: 0; height: 100%; } .btn.btn-orange.booking-opener:hover:before { width: 100%; } :where(#header) .btn.btn-orange.btn-content { margin: 10px auto; padding: 15px 24px; border-radius: var( --btn-border-radius ); } .booking-opener { max-width: 310px; padding: 20px; } @media ( max-width: 1440px ) { #nav > li a { padding: 0.694vw 0; } :where(#header) .container { width: 95%; max-width: 1500px; padding: 0 15px; margin: 0 auto; z-index: 5; } #nav > li { padding: 0 0.694vw; } .page-scrolled .sLogo #logo img { margin-top: 0; } } @media ( max-width: 1366px ) { #header .container { width: 95%; } } @media (min-width: 1025px) { #nav { margin: 0; } #nav > li { display: inline-block; position: relative; padding: 0 min(0.521vw, 10px); } #nav > li a { display: inline-block; padding: min( 1.198vw, 23px ) min(0.260vw, 5px); position: relative; } #nav > li > a::after { position: absolute; left: 50%; bottom: 0; display: block; width: 0; height: 2px; } #nav > li > a:hover::after, #nav > li.current_page_item > a::after { width: 100%; } #nav > li.hover ul { display: block; } #nav ul { position: absolute; top: 100%; width: 240px; left: 10px; display: none; padding: 6px 0 6px 6px; } #nav ul.sub-menu > li { position: relative; } #nav ul li ul.sub-menu { display: none; position: absolute; left: 200px; } #nav ul li.hover ul.sub-menu { display: block; top: 0; } #nav ul a { display: block; position: relative; padding: 15px 20px 15px 20px; } #nav > li > a .opener { display: none; } #nav .opener::after { position: relative; top: 0; z-index: 2; display: inline-block; margin: 0 0 0 10px; } #nav li.menu-item-has-children:hover>ul.sub-menu { display: block; } #nav li.menu-item-has-children:hover>ul.sub-menu>li.menu-item-has-children>ul.sub-menu { top: 0; } #nav .sub-menu li .opener:after { right: 0; } #nav .opener.actives:after { border-width: 0 4px 5px 4px; } } @media ( max-width: 1024px ) { :where(#header) .container { width: 100%; } #header .btn.btn-orange:hover, #header:hover .btn.btn-orange:hover { margin: 0 auto; } #header:hover #logo img, .page-scrolled .sLogo #logo img { width: auto; height: 30px; } #scLogo img { width: auto; height: 30px; display: none; } .page-scrolled #header, .page:not(.home).page-scrolled #header { position: relative; } .page-scrolled #header .header-holder, .page-scrolled.page:not(.home) #header .header-holder { position: fixed !important; } #header .container { display: block; } .page-scrolled .sLogo #scLogo { padding-top: 0; } .page-scrolled:not(.home) .sLogo #scLogo { padding-top: 0; } #nav { display: block; } :where(#header) .mobile-hidden { display: none !important; } #nav > li a, header:hover #nav > li a, .page-scrolled #nav > li a, .page:not(.home) #nav > li a { padding: 10px 0; } #header, #header:hover, #header:hover, .page-scrolled #header, .page-scrolled #header:hover, .page:not(.home).page-scrolled #header { padding-bottom: 46px; width: 100%; float: left; height: fit-content; margin-bottom: -1px; position: relative; } .mob-logo-section { margin: 5px auto 0; padding: 51px 0 30px; display: block; position: relative; height: fit-content; height: -moz-fit-content; max-width: 300px; } .page:not(.home) .mob-logo-section { padding: 30px 15px; max-width: 274px; } :where(#header) .btn.btn-orange.bottom-opener { padding: 16px 24px; } .nav-bar, .page-scrolled .nav-bar, .page:not(.home).page-scrolled .nav-bar, .page:not(.home) .nav-bar { margin: 0; } .mob-logo-section img { width: 80%; margin: 10px auto; display: block; } .sLogo { display: none; } .page-scrolled .sLogo { display: block; width: fit-content; } .logo-block { display: none; margin: 10px auto; padding: 0; width: fit-content; } .page-scrolled .logo-block { display: block; } #wrapper { margin-top: 47px; overflow-x: hidden; } .btn-block { width: 100%; height: 54px; float: none; position: absolute; top: 90px; right: 0; margin: 0; } .btn-block.mobile-show { position: relative; top: 0; right: unset; display: block; margin: 10px auto; float: none; height: fit-content; height: -moz-fit-content; } .btn-block.mobile-show .opener-form { right: unset; top: unset; } .btn-block.mobile-show .booking-opener, .btn-list a, .btn.btn-orange.booking-opener, #header .btn.btn-orange { margin: 0 auto; position: relative; display: block; padding: 16px 24px; float: none; right: unset; left: unset; top: unset; max-width: unset; } .page-scrolled #header .btn.btn-orange.booking-opener, .page-scrolled #header .btn.btn-orange { position: fixed; right: 10px; top: 64px; } .btn-block.mobile-show .btn.btn-orange.booking-opener:hover { margin: -5px auto 5px; } .btn-list { display: block; margin: 0 auto 20px; width: fit-content; display: none; } #header .header-holder { padding: 8px 0; height: 50px; width: 100%; } .addBlock #logo img { height: auto; margin-bottom: 75px; } #logo { margin: 30px 0 20px; max-width: 300px; width: 100%; float: none; } .menu-opener { margin-right: 15px; z-index: 5; } .mobile-show.moreInfo a { border-radius: 0; } .updated-contact-block .booking-opener { position: relative; right: unset; top: unset; float: none; } .opener-form { float: none; right: 10px; width: 100%; height: 54px; top: 0; } .booking-opener { position: relative; right: 5px; top: 0; margin: 0 auto; float: right; z-index: 99; } .page-scrolled a.btn.btn-orange.booking-opener { position: fixed; right: 3px; top: 56px; left: unset; z-index: 99; } .mobile-show.moreInfo { bottom: 8vh; } .sLogo { display: block; } .sLogo #logo, .page-scrolled .sLogo #logo { margin: 0; } .page-scrolled .logo-block { margin: 0 auto; padding: 2px 0; width: fit-content; width: -moz-fit-content; } .sLogo #logo img { max-width: 260px; max-height: 65px; width: auto; } .page-scrolled .sLogo #logo img { width: auto; height: 30px; max-width: 260px; } .mobile-show.moreInfo { bottom: 1vh; } } @media ( max-width: 768px ) { .mobile-show.moreInfo { top: 6px; left: 15px; width: fit-content; height: fit-content; } } @media ( max-width: 567px ) { :where(#header) .container { width: 100%; padding: 0; } } @media (max-width: 479px) { .page-scrolled .sLogo #logo img { display: none; } .mob-logo-section { padding-bottom: 10px; } .mob-logo-section img { width: 100%; } #logo { max-width: 220px; } .btn.booking-opener { padding: 15px 24px; margin-top: 0; top: 24px; } .page-scrolled .btn.booking-opener { margin-top: 10px; } .mobile-show.moreInfo { bottom: 11vh; } } @media (max-width: 390px) { .btn-block { top: 175px; right: 75px; } .mobile-show.moreInfo { bottom: 12vh; } } @media (max-width: 320px) { .page-scrolled .sLogo #logo img { width: 100%; } .mobile-show.moreInfo { bottom: 14vh; } } .headAdd a, .phoneBlock a { display: inline-block; min-height: 24px; } /* ===== from child interior (1 rule groups) ===== */ #header, #header:hover { position: relative; }