/* =========================================================
PAGE: I-HOTEL Website-Wide Global Custom CSS
LIVE URL: https://www.i-hotelfurniture.com/ (site-wide header)
CODE FILE: I-HOTEL-GLOBAL-CUSTOM-CSS-2026.09.24-V1.12.css
VERSION: V1.12
DATE: 2026-09-24
LAST REVISION: 2026-09-24
PURPOSE: Preserve current site-wide styling, align the desktop logo, extend the
         homepage header rule below the logo, and keep the mobile header fixed.
MAIN SEO INTENT: Not applicable; visual header adjustment only.
PRIMARY KEYWORD: Not applicable; SEO content is unchanged.
CANNIBALIZATION BOUNDARY: No page copy or SEO target changes.
DESIGN: Existing charcoal header; homepage desktop red rule sits below the logo.
RESPONSIVE: Desktop menu and logo refinements remain desktop-only; fixed header applies
            below 768px. Tablet and desktop header layouts are unchanged.
INTERNAL LINKS: Unchanged.
SCHEMA: Unchanged.
PERFORMANCE: CSS-only adjustment; no images, scripts, or network requests added.
KALLYAS / WORDPRESS: For the existing site-wide Custom CSS field; no theme files edited.
CHANGED: Added a homepage-only desktop bottom spacing adjustment so the red header
         rule sits below the logo; existing menu and mobile behavior are preserved.
INTENTIONALLY NOT CHANGED: Logo position, menu layout, other pages, CTA position,
                            links, content, mobile spacing, and schema.
========================================================= */
/* =========================================================
   01. CONTACT / QUOTE FORM
   ========================================================= */
.ihotel-lux-wrapper {
  max-width:860px!important;
  margin:30px auto!important;
  padding:45px 40px!important;
  background:#ffffff!important;
  border-radius:12px!important;
  box-shadow:0 15px 35px rgba(0,0,0,0.05)!important;
  border:1px solid #eaeaea!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif!important
}
.ihotel-lux-header {
  text-align:center!important;
  margin-bottom:35px!important
}
.ihotel-badge {
  display:inline-block!important;
  font-size:11px!important;
  font-weight:700!important;
  text-transform:uppercase!important;
  letter-spacing:2px!important;
  color:#8b0000!important;
  background:rgba(139,0,0,0.06)!important;
  padding:5px 14px!important;
  border-radius:20px!important;
  margin-bottom:12px!important
}
.ihotel-lux-title {
  font-size:26px!important;
  font-weight:800!important;
  color:#111111!important;
  letter-spacing:0.5px!important;
  margin:0 0 12px 0!important
}
.ihotel-lux-divider {
  width:40px!important;
  height:3px!important;
  background:#8b0000!important;
  margin:0 auto 18px auto!important;
  border-radius:2px!important
}
.ihotel-lux-desc {
  font-size:13.5px!important;
  line-height:1.65!important;
  color:#555555!important;
  max-width:720px!important;
  margin:0 auto!important
}
.ihotel-lux-grid {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:25px 30px!important;
  margin-bottom:25px!important
}
.ihotel-full-width {
  margin-bottom:25px!important
}
.ihotel-lux-field input,.ihotel-lux-field textarea {
  width:100%!important;
  border:none!important;
  border-bottom:1.5px solid #cccccc!important;
  background:transparent!important;
  padding:12px 0!important;
  font-size:14px!important;
  color:#111111!important;
  outline:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  transition:border-color 0.3s ease!important
}
.ihotel-lux-field input:focus,.ihotel-lux-field textarea:focus {
  border-bottom-color:#8b0000!important
}
.ihotel-lux-file-zone {
  display:flex!important;
  flex-direction:column!important;
  padding:22px!important;
  background:#fcfcfc!important;
  border:1.5px dashed #cccccc!important;
  border-radius:8px!important;
  margin-bottom:30px!important
}
.ihotel-file-title {
  font-size:14px!important;
  font-weight:700!important;
  color:#222222!important
}
.ihotel-file-sub {
  font-size:12px!important;
  color:#777777!important;
  margin-top:2px!important;
  margin-bottom:12px!important
}
.ihotel-lux-file-zone input[type="file"] {
  display:block!important;
  width:100%!important;
  font-size:13px!important;
  color:#555555!important;
  cursor:pointer!important
}
.ihotel-lux-file-zone input[type="file"]::-webkit-file-upload-button {
  background:#222222!important;
  color:#ffffff!important;
  border:none!important;
  padding:8px 18px!important;
  border-radius:4px!important;
  font-size:12px!important;
  font-weight:600!important;
  cursor:pointer!important;
  margin-right:12px!important;
  transition:background 0.2s ease!important
}
.ihotel-lux-file-zone input[type="file"]::-webkit-file-upload-button:hover {
  background:#8b0000!important
}
.ihotel-lux-action {
  text-align:center!important
}
.ihotel-lux-btn {
  background:#8b0000!important;
  color:#ffffff!important;
  font-size:13.5px!important;
  font-weight:700!important;
  letter-spacing:1.5px!important;
  padding:16px 45px!important;
  border:none!important;
  border-radius:4px!important;
  cursor:pointer!important;
  transition:all 0.3s ease!important;
  box-shadow:0 4px 15px rgba(139,0,0,0.2)!important
}
.ihotel-lux-btn:hover {
  background:#660000!important;
  transform:translateY(-2px)!important;
  box-shadow:0 7px 20px rgba(139,0,0,0.35)!important
}
@media (max-width: 768px) {
  .ihotel-lux-wrapper {
    padding:25px 20px!important
  }
  .ihotel-lux-grid {
    grid-template-columns:1fr!important;
    gap:20px!important
  }
}

/* =========================================================
   12. HEADER DESKTOP RULES
   ========================================================= */
@media (min-width: 992px) {
  .ihotel-lux-wrapper {
    margin-top:120px!important
  }
}

/* =========================================================
   02. PORTFOLIO CLEANUP
   ========================================================= */
.zn_portfolio_related_title,.portfolio-related-projects,.zn_portfolio_single_related,.row.zn_portfolio_related {
  display:none!important
}

/* =========================================================
   03. HERO / CTA UTILITIES
   ========================================================= */
.hero-banner-container {
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap
}
@media (max-width: 768px) {
  .hero-banner-container {
    gap:15px;
    justify-content:center
  }
  .hero-cta-button {
    min-height:48px;
    padding:0 25px;
    font-size:14px
  }
}

/* =========================================================
   04. GLOBAL REFERENCES SLIDER
   ========================================================= */
.global-references-section-wrapper {
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
  font-family:Arial,sans-serif
}
.global-references-section {
  background:#ffffff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 25px 60px -12px rgba(0,0,0,0.25),0 10px 20px -5px rgba(0,0,0,0.15)
}
.references-header {
  background-color:#8e0000;
  padding:30px 30px;
  text-align:center;
  box-shadow:0 -10px 30px rgba(142,0,0,0.15);
  position:relative;
  z-index:2
}
.references-badge {
  display:inline-block;
  font-size:11px;
  font-weight:800;
  color:#ffffff;
  text-transform:uppercase;
  letter-spacing:1.5px;
  padding:5px 16px;
  border-radius:20px;
  background:rgba(255,255,255,0.15);
  border:1px solid rgba(255,255,255,0.2);
  margin-bottom:12px
}
.references-title {
  font-size:24px;
  font-weight:800;
  color:#ffffff;
  margin:0 0 10px 0;
  letter-spacing:-0.5px;
  text-transform:uppercase
}
.references-desc {
  font-size:14px;
  color:rgba(255,255,255,0.9);
  max-width:750px;
  margin:0 auto;
  line-height:1.6
}
.references-body {
  background:#ffffff;
  padding:40px 30px;
  position:relative;
  z-index:1
}
.slider-wrapper {
  position:relative;
  display:flex;
  align-items:center
}
.slider-btn {
  position:absolute;
  z-index:10;
  background:#ffffff;
  border:1px solid #cbd5e1;
  width:45px;
  height:45px;
  border-radius:50%;
  cursor:pointer;
  box-shadow:0 4px 10px rgba(0,0,0,0.1);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  color:#0f172a;
  transition:all 0.2s ease
}
.slider-btn:hover {
  background:#f8fafc;
  border-color:#94a3b8
}
.slider-btn-left {
  left:-22px
}
.slider-btn-right {
  right:-22px
}
.project-slider {
  display:flex;
  gap:30px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -ms-overflow-style:none;
  padding:10px 5px;
  width:100%
}
.project-slider::-webkit-scrollbar {
  display:none
}
.project-card {
  background:#ffffff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  overflow:hidden;
  min-width:350px;
  max-width:350px;
  flex:0 0 auto;
  box-shadow:0 4px 15px rgba(0,0,0,0.03);
  border-left:4px solid #8e0000;
  transition:transform 0.3s ease,box-shadow 0.3s ease
}
.project-card:hover {
  transform:translateY(-5px);
  box-shadow:0 12px 30px rgba(142,0,0,0.12)
}
.project-img-container {
  height:240px;
  overflow:hidden;
  background:#e2e8f0
}
.project-img-container img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 0.5s ease
}
.project-card:hover .project-img-container img {
  transform:scale(1.04)
}
.project-content {
  padding:25px
}
.project-title {
  font-size:16px;
  font-weight:800;
  color:#8e0000;
  margin:0 0 10px 0;
  min-height:44px;
  line-height:1.4
}
.project-text {
  font-size:13px;
  color:#64748b;
  margin:0;
  line-height:1.5
}
.btn-global-ref-container {
  text-align:center;
  margin-top:40px
}
.btn-global-ref {
  background:#0f172a;
  color:#ffffff;
  padding:16px 36px;
  border-radius:8px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  display:inline-block;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 4px 15px rgba(15,23,42,0.2);
  transition:all 0.3s ease;
  border:1px solid transparent
}
.btn-global-ref:hover {
  background:#1e293b;
  transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(15,23,42,0.3);
  border-color:#334155
}
@media (max-width: 768px) {
  .slider-btn {
    width:36px;
    height:36px;
    font-size:16px
  }
  .slider-btn-left {
    left:-12px
  }
  .slider-btn-right {
    right:-12px
  }
  .project-slider {
    gap:15px
  }
  .project-card {
    min-width:275px;
    max-width:275px
  }
  .project-img-container {
    height:190px
  }
  .references-title {
    font-size:20px!important
  }
  .references-header {
    padding:25px 20px
  }
  .references-desc {
    font-size:13px!important
  }
  .references-body {
    padding:30px 15px
  }
  .btn-global-ref {
    width:100%;
    max-width:320px;
    padding:14px 20px;
    font-size:13px
  }
}

/* =========================================================
   05. GLOBAL IMAGE / TYPOGRAPHY FIXES
   ========================================================= */
.image-boxes-img {
  aspect-ratio:auto;
  width:100%;
  height:auto
}
h1,.page-title,.entry-title,.single-post-title {
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:700!important;
  letter-spacing:-0.2px!important
}
h2,h3 {
  font-family:Arial,Helvetica,sans-serif!important
}
@media (max-width: 600px) {
  .ihf-project {
    display:none!important
  }
}
@media (max-width: 767px) {
  html,body {
    overflow-x:hidden!important;
    position:relative;
    width:100%
  }
}

/* =========================================================
   06. CLOUDFLARE TURNSTILE
   ========================================================= */
.cf-turnstile,div[id*="turnstile"],iframe[src*="challenges.cloudflare.com"] {
  min-height:65px!important;
  min-width:300px!important;
  display:block!important;
  margin-left:auto!important;
  margin-right:auto!important;
  contain:strict!important
}
.page-id-4180 .wp-block-gallery .wp-block-image figcaption,.page-id-4180 .gallery .gallery-caption,.page-id-4180 figcaption,.page-id-4180 .wp-block-image figcaption,.page-id-4180 .wp-block-gallery+p,.page-id-4180 .gallery-item+br+dd {
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  height:0!important;
  margin:0!important;
  padding:0!important
}
html {
  scroll-behavior:auto!important
}
.rtl .wpcf7-response-output {
  direction:ltr!important;
  text-align:left!important;
  float:right!important;
  width:100%!important
}

/* =========================================================
   07. BACK TO TOP BUTTON
   ========================================================= */
#ihotel-totop {
  position:fixed!important;
  bottom:30px!important;
  right:30px!important;
  z-index:999999!important;
  width:55px!important;
  height:55px!important;
  border-radius:6px!important;
  background-color:#3E2723!important;
  background-image:url("https://www.i-hotelfurniture.com/wp-content/uploads/2026/09/Natural-American-walnut-veneer-sample.webp")!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  border:1px solid rgba(255,255,255,0.08)!important;
  box-shadow:inset 0 0 12px rgba(0,0,0,0.7),3px 5px 10px rgba(0,0,0,0.5)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(20px)!important;
  transition:all 0.4s cubic-bezier(0.25,0.8,0.25,1)!important
}
#ihotel-totop svg {
  width:24px!important;
  height:24px!important;
  stroke:#d7ccc8!important;
  stroke-width:3px!important;
  filter:drop-shadow(0px 1px 0px rgba(0,0,0,0.9))!important
}
#ihotel-totop.visible {
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0)!important
}
#ihotel-totop:hover {
  transform:scale(1.08)!important;
  box-shadow:inset 0 0 8px rgba(0,0,0,0.3),5px 10px 20px rgba(0,0,0,0.6)!important;
  border-color:#fbbf24!important
}
#ihotel-totop:hover svg {
  stroke:#fbbf24!important;
  filter:drop-shadow(0px 0px 3px rgba(251,191,36,0.6))!important
}
@media (max-width: 768px) {
  #ihotel-totop {
    bottom:140px!important;
    right:16px!important;
    width:48px!important;
    height:48px!important
  }
}

/* =========================================================
   08. FORM HONEYPOT / ANTI-SPAM
   ========================================================= */
.wpcf7-honeypot,.hp-message,label[for*="honeypot"],span.wpcf7-form-control-wrap[class*="honeypot"],.wpcf7-form-control-wrap.hp-field {
  display:none!important;
  visibility:hidden!important;
  position:absolute!important;
  left:-99999px!important
}
.mc4wp-form label[style*="display: none"],.mc4wp-form input[name="_mc4wp_honeypot"] {
  display:none!important;
  font-size:0!important;
  line-height:0!important;
  opacity:0!important;
  visibility:hidden!important
}

/* =========================================================
   09. PERFORMANCE / CAROUSEL CONTAINMENT
   ========================================================= */
.projects-slider,.hotel-case-studies-carousel,.swiper-container,.slick-slider,.owl-carousel,[class*="carousel"],[class*="slider"] {
  contain:layout style!important;
  content-visibility:auto;
  contain-intrinsic-size:1000px 450px
}
.projects-slider img,.hotel-case-studies-carousel img,[class*="carousel"] img,[class*="slider"] img {
  aspect-ratio:16 / 10;
  object-fit:cover;
  width:100%;
  height:auto;
  transform:translateZ(0)
}
.joinchat,.wp-block-whatsapp,#whatsapp-chat-widget,[class*="whatsapp"],[class*="live-chat"] {
  contain:layout paint!important;
  will-change:transform
}

/* =========================================================
   10. FOOTER
   ========================================================= */
div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a {
  color:#FFFFFF!important;
  font-size:12px!important;
  font-weight:700!important;
  opacity:0.9!important;
  display:inline-block!important;
  margin:0 4px!important;
  white-space:nowrap!important;
  text-decoration:none!important
}
div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a:hover {
  color:#ff4d4d!important;
  opacity:1!important
}
div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a:not(:last-child)::after {
  content:"|"!important;
  margin-left:8px!important;
  color:rgba(255,255,255,0.4)!important;
  font-weight:400!important
}
@media (max-width: 768px) {
  div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links {
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:4px!important;
    width:100%!important
  }
  div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a {
    font-size:11px!important;
    margin:0!important
  }
  div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a[href*="contact-us"] {
    display:none!important
  }
  div.ihf-footer-inner div.ihf-footer-bottom div.ihf-footer-bottom-links a[href*="terms-and-conditions"]::after {
    content:""!important
  }
}

/* =========================================================
   11. HEADER BASE
   ========================================================= */
#header {
  --ihf-header-bg:#17191B;
  --ihf-header-bg-2:#101214;
  --ihf-red:#8B0000;
  --ihf-red-hover:#A11212;
  --ihf-sand:#D6B28A;
  --ihf-panel:#FBF8F2;
  --ihf-panel-hover:#F2E9DF;
  --ihf-text-dark:#25282B;
  --ihf-text-soft:#53585D;
  --ihf-white:#FFFFFF;
  --ihf-mobile-menu-bg:#081A38;
  font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important
}
html body #header,html body #header>.site-header-wrapper,html body #header .site-header-wrapper,html body #header .site-header-main-wrapper,html body #header .site-header-bottom-wrapper,html body #header .siteheader-container {
  background-color:var(--ihf-header-bg)!important;
  background-image:none!important
}
html body #header {
  border-bottom:0!important
}
html body #header>.site-header-wrapper,html body #header .site-header-wrapper,html body #header .site-header-main-wrapper,html body #header .site-header-bottom-wrapper,html body #header .siteheader-container {
  border-bottom:0!important;
  box-shadow:none!important
}
html body #header .site-header-main-wrapper {
  position:relative!important;
  z-index:20!important
}
html body #header .site-header-main-wrapper::after {
  content:none!important;
  display:none!important
}

/* =========================================================
   HEADER BOTTOM RED LINE
   Drawn at the real #header bottom without changing layout.
   ========================================================= */
html body #header {
  border-bottom:0!important;
  box-shadow:0 3px 0 #8B0000!important
}

html body #header::after {
  content:none!important;
  display:none!important
}
html body .page-subheader,html body .kl-slideshow,html body .hero-area,html body .site-content>div:first-child {
  border-top:0!important;
  box-shadow:none!important
}
@media (min-width: 992px) {
  html body #header .main-menu-wrapper,html body #header #main-menu,html body #header .main-menu,html body #header #main-menu>ul,html body #header ul.main-menu {
    background:transparent!important;
    background-image:none!important;
    margin:0!important;
    padding:0!important
  }
  html body #header #main-menu>ul,html body #header ul.main-menu {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important
  }
  html body #header #main-menu>ul>li,html body #header ul.main-menu>li {
    position:relative!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:96px!important;
    padding:0 13px!important;
    margin:0!important;
    color:#F2F0EC!important;
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:12px!important;
    font-weight:500!important;
    line-height:1!important;
    letter-spacing:0.1px!important;
    text-transform:uppercase!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    transition:color .18s ease,box-shadow .18s ease!important
  }
  html body #header #main-menu>ul>li>a>span,html body #header ul.main-menu>li>a>span {
    color:inherit!important;
    font:inherit!important;
    text-transform:inherit!important;
    letter-spacing:inherit!important
  }
  html body #header #main-menu>ul>li.active,html body #header #main-menu>ul>li.current_page_item,html body #header #main-menu>ul>li.current-menu-item,html body #header #main-menu>ul>li.current-menu-parent,html body #header #main-menu>ul>li.current-menu-ancestor,html body #header ul.main-menu>li.active,html body #header ul.main-menu>li.current_page_item,html body #header ul.main-menu>li.current-menu-item,html body #header ul.main-menu>li.current-menu-parent,html body #header ul.main-menu>li.current-menu-ancestor {
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important
  }
  html body #header #main-menu>ul>li::before,html body #header #main-menu>ul>li::after,html body #header ul.main-menu>li::before,html body #header ul.main-menu>li::after,html body #header #main-menu>ul>li>a::before,html body #header ul.main-menu>li>a::before {
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important
  }
  html body #header #main-menu>ul>li.active>a,html body #header #main-menu>ul>li.current_page_item>a,html body #header #main-menu>ul>li.current-menu-item>a,html body #header #main-menu>ul>li.current-menu-parent>a,html body #header #main-menu>ul>li.current-menu-ancestor>a,html body #header ul.main-menu>li.active>a,html body #header ul.main-menu>li.current_page_item>a,html body #header ul.main-menu>li.current-menu-item>a,html body #header ul.main-menu>li.current-menu-parent>a,html body #header ul.main-menu>li.current-menu-ancestor>a {
    color:#FFFFFF!important;
    background:transparent!important;
    box-shadow:inset 0 -2px 0 #8B0000!important
  }
  html body #header #main-menu>ul>li:hover>a,html body #header #main-menu>ul>li:focus-within>a,html body #header ul.main-menu>li:hover>a,html body #header ul.main-menu>li:focus-within>a {
    color:#E1262F!important;
    background:transparent!important;
    box-shadow:inset 0 -2px 0 var(--ihf-red)!important
  }
  html body #header #main-menu>ul>li>ul.sub-menu,html body #header ul.main-menu>li>ul.sub-menu,html body #header #main-menu>ul>li>ul,html body #header ul.main-menu>li>ul {
    position:absolute!important;
    top:calc(100% - 6px)!important;
    left:0!important;
    right:auto!important;
    z-index:200000!important;
    display:none!important;
    width:410px!important;
    min-width:410px!important;
    max-width:min(410px,calc(100vw - 40px))!important;
    margin:0!important;
    padding:16px!important;
    background:var(--ihf-panel)!important;
    background-image:none!important;
    border:1px solid rgba(38,42,46,.10)!important;
    border-top:3px solid var(--ihf-red)!important;
    border-radius:0 0 15px 15px!important;
    box-shadow:0 20px 50px rgba(0,0,0,.22)!important;
    column-count:1!important;
    column-gap:0!important;
    overflow:visible!important
  }
  html body #header #main-menu>ul>li:hover>ul.sub-menu,html body #header #main-menu>ul>li:focus-within>ul.sub-menu,html body #header ul.main-menu>li:hover>ul.sub-menu,html body #header ul.main-menu>li:focus-within>ul.sub-menu,html body #header #main-menu>ul>li:hover>ul,html body #header #main-menu>ul>li:focus-within>ul,html body #header ul.main-menu>li:hover>ul,html body #header ul.main-menu>li:focus-within>ul {
    display:block!important
  }
  html body #header #main-menu>ul>li>ul.sub-menu::before,html body #header ul.main-menu>li>ul.sub-menu::before,html body #header #main-menu>ul>li>ul::before,html body #header ul.main-menu>li>ul::before {
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:-12px!important;
    left:54px!important;
    width:0!important;
    height:0!important;
    border-left:12px solid transparent!important;
    border-right:12px solid transparent!important;
    border-bottom:12px solid var(--ihf-panel)!important
  }
  html body #header #main-menu ul.sub-menu,html body #header #main-menu ul.sub-menu li,html body #header #main-menu ul.sub-menu li a,html body #header #main-menu ul.sub-menu li span,html body #header .main-menu ul.sub-menu,html body #header .main-menu ul.sub-menu li,html body #header .main-menu ul.sub-menu li a,html body #header .main-menu ul.sub-menu li span {
    box-shadow:none!important;
    background-image:none!important;
    text-decoration:none!important
  }
  html body #header #main-menu ul.sub-menu>li,html body #header .main-menu ul.sub-menu>li {
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important
  }
  html body #header #main-menu ul.sub-menu>li+li,html body #header .main-menu ul.sub-menu>li+li {
    margin-top:4px!important
  }
  html body #header #main-menu ul.sub-menu>li>a,html body #header .main-menu ul.sub-menu>li>a {
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:50px!important;
    margin:0!important;
    padding:12px 46px 12px 18px!important;
    color:#33383D!important;
    background:transparent!important;
    border:0!important;
    border-radius:11px!important;
    box-shadow:none!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:16px!important;
    font-weight:500!important;
    line-height:1.35!important;
    letter-spacing:0!important;
    text-transform:none!important;
    text-align:left!important;
    white-space:normal!important;
    transition:color .16s ease,background-color .16s ease!important
  }
  html body #header #main-menu ul.sub-menu>li>a>span,html body #header .main-menu ul.sub-menu>li>a>span {
    color:inherit!important;
    font:inherit!important;
    letter-spacing:inherit!important;
    text-transform:none!important;
    white-space:normal!important
  }
  html body #header #main-menu ul.sub-menu>li>a::after,html body #header .main-menu ul.sub-menu>li>a::after {
    content:"›"!important;
    display:block!important;
    position:absolute!important;
    right:17px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    color:var(--ihf-red-hover)!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:27px!important;
    font-weight:300!important;
    line-height:1!important;
    opacity:0!important;
    transition:opacity .16s ease,transform .16s ease!important
  }
  html body #header #main-menu ul.sub-menu>li:hover>a,html body #header #main-menu ul.sub-menu>li:focus-within>a,html body #header #main-menu ul.sub-menu>li.current-menu-item>a,html body #header .main-menu ul.sub-menu>li:hover>a,html body #header .main-menu ul.sub-menu>li:focus-within>a,html body #header .main-menu ul.sub-menu>li.current-menu-item>a {
    color:var(--ihf-red-hover)!important;
    background:var(--ihf-panel-hover)!important
  }
  html body #header #main-menu ul.sub-menu>li:hover>a::after,html body #header #main-menu ul.sub-menu>li:focus-within>a::after,html body #header #main-menu ul.sub-menu>li.current-menu-item>a::after,html body #header .main-menu ul.sub-menu>li:hover>a::after,html body #header .main-menu ul.sub-menu>li:focus-within>a::after,html body #header .main-menu ul.sub-menu>li.current-menu-item>a::after {
    opacity:1!important;
    transform:translate(2px,-50%)!important
  }
  html body #header #main-menu ul.sub-menu ul,html body #header .main-menu ul.sub-menu ul {
    position:static!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:4px 0 0!important;
    padding:0 0 0 12px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    background:var(--ihf-red)!important;
    border-color:var(--ihf-red)!important;
    color:#FFFFFF!important;
    border-radius:10px!important;
    box-shadow:none!important;
    text-decoration:none!important;
    white-space:nowrap!important
  }
  html body #header a.ctabutton:hover,html body #header .ctabutton:hover {
    background:var(--ihf-red-hover)!important;
    border-color:var(--ihf-red-hover)!important;
    color:#FFFFFF!important
  }
  html body #header .search,html body #header .header-search,html body #header .zn_search_button,html body #header .glyphicon-search,html body #header .kl-header-search,html body #header .site-header-search {
    display:none!important
  }
}
@media (max-width: 991px) {
  html body #header,html body #header>.site-header-wrapper,html body #header .site-header-wrapper,html body #header .site-header-main-wrapper,html body #header .site-header-bottom-wrapper,html body #header .siteheader-container {
    background-color:var(--ihf-header-bg)!important;
    background-image:none!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    width:100%!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm {
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col {
    display:flex!important;
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    align-items:center!important;
    justify-content:center!important
  }
  html body #header .site-header-main-right,html body #header .site-header-main-right-top {
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important
  }
  html body #header .logo-container,html body #header #logo-container,html body #header #logo,html body #header .site-logo,html body #header .logo-container a,html body #header #logo a,html body #header .site-logo a {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    float:none!important
  }
  html body #header .logo-container img,html body #header #logo img,html body #header .site-logo img {
    display:block!important;
    width:230px!important;
    max-width:72vw!important;
    height:auto!important;
    margin:0 auto!important
  }
  html body #header .zn-res-menuwrapper {
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    margin:0!important;
    padding:10px 12px 14px!important;
    float:none!important;
    text-align:center!important;
    background:var(--ihf-header-bg)!important;
    background-image:none!important
  }
  html body #header .zn-res-trigger {
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:min(230px,72vw)!important;
    min-width:0!important;
    max-width:72vw!important;
    height:64px!important;
    min-height:64px!important;
    margin:0 auto!important;
    padding:0!important;
    float:none!important;
    background-color:#10243A!important;
    background-image:none!important;
    border:1px solid rgba(214,178,138,.38)!important;
    border-radius:14px!important;
    box-shadow:none!important;
    color:#F5F2ED!important;
    cursor:pointer!important
  }
  html body #header .zn-res-trigger:hover,html body #header .zn-res-trigger:focus,html body #header .zn-res-trigger:focus-visible {
    background-color:#17314D!important
  }
  html body #header .zn-res-trigger>span {
    display:none!important
  }
  html body #header .zn-res-trigger::before {
    content:""!important;
    position:absolute!important;
    left:28px!important;
    top:50%!important;
    width:25px!important;
    height:18px!important;
    transform:translateY(-50%)!important;
    background-image:linear-gradient(var(--ihf-sand),var(--ihf-sand)),linear-gradient(var(--ihf-sand),var(--ihf-sand)),linear-gradient(var(--ihf-sand),var(--ihf-sand))!important;
    background-repeat:no-repeat!important;
    background-size:25px 3px,25px 3px,25px 3px!important;
    background-position:left top,left center,left bottom!important
  }
  html body #header .zn-res-trigger::after {
    content:"MENU"!important;
    color:#F5F2ED!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:18px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:.3px!important;
    text-transform:uppercase!important
  }
  html body #header #main-menu,html body #header .main-menu {
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:var(--ihf-panel)!important
  }
  html body #header #main-menu>ul,html body #header ul.main-menu {
    width:100%!important;
    margin:0!important;
    padding:10px 14px 16px!important;
    background:var(--ihf-panel)!important
  }
  html body #header #main-menu>ul>li,html body #header ul.main-menu>li {
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:56px!important;
    padding:13px 14px!important;
    color:var(--ihf-text-dark)!important;
    background:transparent!important;
    border:0!important;
    border-radius:8px!important;
    box-shadow:none!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:17px!important;
    font-weight:600!important;
    line-height:1.35!important;
    text-transform:none!important
  }
  html body #header #main-menu>ul>li.current-menu-item>a,html body #header #main-menu>ul>li.current_page_item>a,html body #header ul.main-menu>li.current-menu-item>a,html body #header ul.main-menu>li.current_page_item>a {
    color:var(--ihf-red-hover)!important;
    background:var(--ihf-panel-hover)!important
  }
  html body #header #main-menu ul.sub-menu,html body #header .main-menu ul.sub-menu {
    position:static!important;
    width:100%!important;
    min-width:0!important;
    margin:0 0 6px!important;
    padding:4px 0 4px 14px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    column-count:1!important
  }
  html body #header #main-menu ul.sub-menu li>a,html body #header .main-menu ul.sub-menu li>a {
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:48px!important;
    padding:10px 14px!important;
    color:var(--ihf-text-soft)!important;
    background:transparent!important;
    border:0!important;
    border-radius:7px!important;
    box-shadow:none!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:15px!important;
    font-weight:500!important;
    line-height:1.35!important;
    text-transform:none!important
  }
  html body #header #main-menu ul.sub-menu li.current-menu-item>a,html body #header .main-menu ul.sub-menu li.current-menu-item>a {
    color:var(--ihf-red-hover)!important;
    background:var(--ihf-panel-hover)!important
  }
  html body #header .ctabutton,html body #header a.ctabutton {
    display:none!important
  }
  html body #header .search,html body #header .header-search,html body #header .zn_search_button,html body #header .glyphicon-search,html body #header .kl-header-search,html body #header .site-header-search {
    display:none!important
  }
}
@media (min-width: 992px) {
  html body #header .logo-container img,html body #header #logo img,html body #header .site-logo img {
    max-width:92%!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    padding-left:11px!important;
    padding-right:11px!important
  }
  html body #header #main-menu>ul>li>a::after,html body #header ul.main-menu>li>a::after {
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:0!important;
    width:0!important;
    height:2px!important;
    background:#8B0000!important;
    transform:translateX(-50%)!important;
    transition:width .18s ease!important
  }
  html body #header #main-menu>ul>li.active>a::after,html body #header #main-menu>ul>li.current_page_item>a::after,html body #header #main-menu>ul>li.current-menu-item>a::after,html body #header #main-menu>ul>li.current-menu-parent>a::after,html body #header #main-menu>ul>li.current-menu-ancestor>a::after,html body #header ul.main-menu>li.active>a::after,html body #header ul.main-menu>li.current_page_item>a::after,html body #header ul.main-menu>li.current-menu-item>a::after,html body #header ul.main-menu>li.current-menu-parent>a::after,html body #header ul.main-menu>li.current-menu-ancestor>a::after {
    width:30px!important
  }
  html body #header #main-menu>ul>li:hover>a::after,html body #header #main-menu>ul>li:focus-within>a::after,html body #header ul.main-menu>li:hover>a::after,html body #header ul.main-menu>li:focus-within>a::after {
    width:30px!important
  }
  html body #header #main-menu>ul>li.active>a,html body #header #main-menu>ul>li.current_page_item>a,html body #header #main-menu>ul>li.current-menu-item>a,html body #header #main-menu>ul>li.current-menu-parent>a,html body #header #main-menu>ul>li.current-menu-ancestor>a,html body #header ul.main-menu>li.active>a,html body #header ul.main-menu>li.current_page_item>a,html body #header ul.main-menu>li.current-menu-item>a,html body #header ul.main-menu>li.current-menu-parent>a,html body #header ul.main-menu>li.current-menu-ancestor>a,html body #header #main-menu>ul>li:hover>a,html body #header #main-menu>ul>li:focus-within>a,html body #header ul.main-menu>li:hover>a,html body #header ul.main-menu>li:focus-within>a {
    box-shadow:none!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    margin-left:22px!important
  }
  html body #header #main-menu>ul>li>ul.sub-menu,html body #header ul.main-menu>li>ul.sub-menu,html body #header #main-menu>ul>li>ul,html body #header ul.main-menu>li>ul {
    width:380px!important;
    min-width:380px!important;
    max-width:min(380px,calc(100vw - 40px))!important;
    padding:14px!important
  }
  html body #header #main-menu ul.sub-menu>li>a,html body #header .main-menu ul.sub-menu>li>a {
    min-height:46px!important;
    padding:10px 42px 10px 16px!important;
    font-size:14.5px!important;
    font-weight:500!important;
    line-height:1.3!important
  }
}
@media (max-width: 991px) {
  html body #header .site-header-main-wrapper .siteheader-container {
    padding-top:18px!important;
    padding-bottom:8px!important
  }
  html body #header .logo-container,html body #header #logo,html body #header .site-logo {
    margin-bottom:8px!important
  }
}
@media (min-width: 992px) {
  html body #header #main-menu>ul>li.menu-item-has-children>a,html body #header ul.main-menu>li.menu-item-has-children>a {
    padding-right:25px!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children>a::before,html body #header ul.main-menu>li.menu-item-has-children>a::before {
    content:""!important;
    display:block!important;
    position:absolute!important;
    right:10px!important;
    top:50%!important;
    width:6px!important;
    height:6px!important;
    margin-top:-5px!important;
    border:0!important;
    border-right:1.5px solid currentColor!important;
    border-bottom:1.5px solid currentColor!important;
    background:transparent!important;
    box-shadow:none!important;
    transform:rotate(45deg)!important;
    opacity:.82!important;
    transition:transform .18s ease,opacity .18s ease!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children:hover>a::before,html body #header #main-menu>ul>li.menu-item-has-children:focus-within>a::before,html body #header ul.main-menu>li.menu-item-has-children:hover>a::before,html body #header ul.main-menu>li.menu-item-has-children:focus-within>a::before {
    transform:translateY(2px) rotate(225deg)!important;
    opacity:1!important
  }
  html body #header #main-menu>ul>li>ul.sub-menu,html body #header ul.main-menu>li>ul.sub-menu,html body #header #main-menu>ul>li>ul,html body #header ul.main-menu>li>ul {
    display:block!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(8px)!important;
    transform-origin:top center!important;
    transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important
  }
  html body #header #main-menu>ul>li:hover>ul.sub-menu,html body #header #main-menu>ul>li:focus-within>ul.sub-menu,html body #header ul.main-menu>li:hover>ul.sub-menu,html body #header ul.main-menu>li:focus-within>ul.sub-menu,html body #header #main-menu>ul>li:hover>ul,html body #header #main-menu>ul>li:focus-within>ul,html body #header ul.main-menu>li:hover>ul,html body #header ul.main-menu>li:focus-within>ul {
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:176px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 22px!important;
    font-size:0!important;
    line-height:1!important;
    border-radius:9px!important;
    text-transform:none!important
  }
  html body #header a.ctabutton>*,html body #header .ctabutton>* {
    display:none!important
  }
  html body #header a.ctabutton::before,html body #header .ctabutton::before {
    content:none!important;
    display:none!important
  }
  html body #header a.ctabutton::after,html body #header .ctabutton::after {
    content:"Request a Quote  →"!important;
    display:inline-block!important;
    position:static!important;
    width:auto!important;
    height:auto!important;
    background:none!important;
    color:#FFFFFF!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:12px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:.05px!important;
    text-transform:none!important;
    transform:none!important
  }
}
@media (max-width: 991px) {
  html body #header #main-menu,html body #header .main-menu {
    background:#FBF8F2!important;
    border-top:3px solid #8B0000!important;
    box-shadow:0 16px 30px rgba(0,0,0,.16)!important
  }
  html body #header #main-menu>ul,html body #header ul.main-menu {
    padding:10px 12px 14px!important;
    background:#FBF8F2!important
  }
  html body #header #main-menu>ul>li+li,html body #header ul.main-menu>li+li {
    border-top:1px solid rgba(37,40,43,.07)!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    min-height:48px!important;
    padding:10px 12px!important;
    color:#2B2E31!important;
    background:transparent!important;
    border-radius:8px!important;
    font-size:14px!important;
    font-weight:600!important;
    letter-spacing:0!important
  }
  html body #header #main-menu>ul>li>a:hover,html body #header #main-menu>ul>li>a:focus,html body #header ul.main-menu>li>a:hover,html body #header ul.main-menu>li>a:focus {
    color:#8B0000!important;
    background:#F2E9DF!important
  }
  html body #header #main-menu>ul>li.current-menu-item>a,html body #header #main-menu>ul>li.current_page_item>a,html body #header #main-menu>ul>li.current-menu-parent>a,html body #header ul.main-menu>li.current-menu-item>a,html body #header ul.main-menu>li.current_page_item>a,html body #header ul.main-menu>li.current-menu-parent>a {
    color:#8B0000!important;
    background:#F2E9DF!important;
    box-shadow:inset 3px 0 0 #8B0000!important
  }
  html body #header #main-menu ul.sub-menu li>a,html body #header .main-menu ul.sub-menu li>a {
    min-height:41px!important;
    padding:8px 12px!important;
    color:#555A5F!important;
    font-size:13px!important;
    font-weight:500!important;
    background:transparent!important
  }
  html body #header #main-menu ul.sub-menu li>a:hover,html body #header #main-menu ul.sub-menu li.current-menu-item>a,html body #header .main-menu ul.sub-menu li>a:hover,html body #header .main-menu ul.sub-menu li.current-menu-item>a {
    color:#8B0000!important;
    background:#F2E9DF!important
  }
}
@media (min-width: 992px) {
  html body #header #main-menu>ul>li>ul.sub-menu,html body #header ul.main-menu>li>ul.sub-menu,html body #header #main-menu>ul>li>ul,html body #header ul.main-menu>li>ul {
    z-index:200000!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:176px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 22px!important;
    border-radius:9px!important;
    vertical-align:middle!important
  }
}
@media (max-width: 991px) {
  #main-menu.mainnav--sidepanel,.main-nav.mainnav--sidepanel {
    background:#17191B!important;
    background-image:none!important;
    color:#F5F2ED!important;
    border:0!important;
    box-shadow:none!important
  }
  #main-menu.mainnav--sidepanel .main-menu,#main-menu.mainnav--sidepanel .main-menu-nav,.main-nav.mainnav--sidepanel .main-menu,.main-nav.mainnav--sidepanel .main-menu-nav {
    background:#17191B!important;
    background-image:none!important;
    margin:0!important;
    padding:0!important
  }
  #main-menu.mainnav--sidepanel li,.main-nav.mainnav--sidepanel li {
    background:transparent!important;
    border-color:rgba(255,255,255,.10)!important
  }
  #main-menu.mainnav--sidepanel a,.main-nav.mainnav--sidepanel a,#main-menu.mainnav--sidepanel .main-menu-link,.main-nav.mainnav--sidepanel .main-menu-link {
    color:#E9E7E2!important;
    background:transparent!important;
    background-image:none!important;
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:15px!important;
    font-weight:500!important;
    line-height:1.2!important;
    letter-spacing:0!important;
    text-transform:none!important;
    text-decoration:none!important
  }
  #main-menu.mainnav--sidepanel>ul>li>a,.main-nav.mainnav--sidepanel>ul>li>a {
    min-height:58px!important;
    padding:0 28px!important;
    display:flex!important;
    align-items:center!important
  }
  #main-menu.mainnav--sidepanel li.current-menu-item>a,#main-menu.mainnav--sidepanel li.current_page_item>a,#main-menu.mainnav--sidepanel li.current-menu-parent>a,.main-nav.mainnav--sidepanel li.current-menu-item>a,.main-nav.mainnav--sidepanel li.current_page_item>a,.main-nav.mainnav--sidepanel li.current-menu-parent>a {
    color:#FFFFFF!important;
    background:rgba(139,0,0,.22)!important;
    box-shadow:inset 4px 0 0 #8B0000!important
  }
  #main-menu.mainnav--sidepanel a:hover,#main-menu.mainnav--sidepanel a:focus,.main-nav.mainnav--sidepanel a:hover,.main-nav.mainnav--sidepanel a:focus {
    color:#FFFFFF!important;
    background:rgba(255,255,255,.045)!important
  }
  #main-menu.mainnav--sidepanel ul.sub-menu a,.main-nav.mainnav--sidepanel ul.sub-menu a {
    min-height:52px!important;
    padding-left:38px!important;
    color:#D7D3CC!important;
    font-size:14px!important;
    font-weight:500!important
  }
  #main-menu.mainnav--sidepanel [class*="back"],.main-nav.mainnav--sidepanel [class*="back"] {
    color:#D6B28A!important;
    background:#111315!important;
    border-color:rgba(255,255,255,.10)!important
  }
}
@media (max-width: 991px) {
  html body ul#zn-res-menu.zn-res-menu-nav>li>a.main-menu-link.main-menu-link-top,html body #zn-res-menu>li.menu-item>a.main-menu-link,html body ul#zn-res-menu>li>a {
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:20px!important;
    font-weight:600!important;
    line-height:1.25!important;
    letter-spacing:0!important;
    min-height:64px!important;
    padding:18px 62px!important;
    display:flex!important;
    align-items:center!important;
    color:#C9C9C9!important
  }
  html body #zn-res-menu>li.current-menu-item>a.main-menu-link,html body #zn-res-menu>li.current_page_item>a.main-menu-link,html body #zn-res-menu>li.active>a.main-menu-link {
    color:#FFFFFF!important;
    background:rgba(255,255,255,.045)!important
  }
  html body #zn-res-menu ul.sub-menu>li>a.main-menu-link,html body #zn-res-menu ul.sub-menu>li>a {
    font-family:"Avenir Next","Segoe UI","Trebuchet MS",Arial,sans-serif!important;
    font-size:17px!important;
    font-weight:500!important;
    line-height:1.3!important;
    min-height:56px!important;
    padding-top:15px!important;
    padding-bottom:15px!important
  }
  html body #zn-res-menu .zn-res-menu-back,html body #zn-res-menu .zn-res-menu-back a,html body #zn-res-menu [class*="back"],html body #zn-res-menu [class*="back"] a {
    font-size:18px!important;
    font-weight:500!important
  }
}
@media (min-width: 992px) {
  html body #header #main-menu>ul>li:first-child,html body #header ul.main-menu>li:first-child {
    margin-right:12px!important
  }
}
@media (min-width: 992px) {
  html body #header a.ctabutton,html body #header .ctabutton {
    min-height:46px!important;
    height:46px!important;
    padding-left:22px!important;
    padding-right:22px!important;
    border-radius:8px!important;
    box-shadow:none!important
  }
  html body #header a.ctabutton:hover,html body #header .ctabutton:hover {
    background:#760000!important;
    border-color:#760000!important;
    transform:translateY(-1px)!important
  }
  html body #header #main-menu>ul>li>ul.sub-menu,html body #header ul.main-menu>li>ul.sub-menu,html body #header #main-menu>ul>li>ul,html body #header ul.main-menu>li>ul {
    box-shadow:0 16px 36px rgba(0,0,0,.16)!important
  }
}
@media (min-width: 992px) {
  html body #header .site-header-main-wrapper,html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    min-height:132px!important;
    height:132px!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0 18px!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm {
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:none!important;
    min-height:132px!important;
    height:132px!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:first-child {
    display:flex!important;
    flex:0 0 250px!important;
    width:250px!important;
    max-width:250px!important;
    min-width:250px!important;
    height:132px!important;
    align-items:center!important;
    justify-content:flex-start!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .logo-container,html body #header #logo-container,html body #header #logo,html body #header .site-logo,html body #header .logo-container>a,html body #header #logo>a,html body #header .site-logo>a {
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:230px!important;
    max-width:230px!important;
    height:116px!important;
    min-height:116px!important;
    margin:0!important;
    padding:0!important;
    float:none!important
  }
  html body #header .logo-container img,html body #header #logo img,html body #header .site-logo img,html body #header img.logo-img,html body #header img.site-logo-img {
    display:block!important;
    width:230px!important;
    max-width:230px!important;
    min-width:0!important;
    height:115px!important;
    max-height:115px!important;
    object-fit:contain!important;
    object-position:left center!important;
    margin:0!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:nth-child(2) {
    display:flex!important;
    flex:1 1 auto!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    height:132px!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .site-header-top-wrapper,html body #header .site-header-top,html body #header .site-header-main-top {
    min-height:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important
  }
  html body #header .site-header-row.site-header-main {
    position:relative!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:132px!important;
    height:132px!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .site-header-main-left:empty,html body #header .site-header-main-center:empty,html body #header .site-header-main-right-ext:empty {
    display:none!important;
    width:0!important;
    min-width:0!important;
    flex:0 0 0!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .site-header-main-right {
    position:relative!important;
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:132px!important;
    height:132px!important;
    margin:0!important;
    padding:0 190px 0 0!important
  }
  html body #header .site-header-main-right-top {
    position:static!important;
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:132px!important;
    height:132px!important;
    margin:0!important;
    padding:0!important
  }
  html body #header .main-menu-wrapper,html body #header #main-menu,html body #header #main-menu>ul,html body #header ul.main-menu {
    width:auto!important;
    max-width:none!important;
    min-width:0!important
  }
  html body #header .main-menu-wrapper {
    display:flex!important;
    flex:0 1 auto!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 auto!important;
    padding:0!important
  }
  html body #header #main-menu>ul,html body #header ul.main-menu {
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    min-height:132px!important;
    height:132px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    padding-left:10px!important;
    padding-right:10px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children>a,html body #header ul.main-menu>li.menu-item-has-children>a {
    padding-right:24px!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    position:absolute!important;
    top:50%!important;
    right:0!important;
    left:auto!important;
    bottom:auto!important;
    z-index:30!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:176px!important;
    height:46px!important;
    min-height:46px!important;
    margin:0!important;
    padding:0 22px!important;
    border-radius:8px!important;
    transform:translateY(-50%)!important;
    white-space:nowrap!important
  }
  html body #header a.ctabutton:hover,html body #header .ctabutton:hover {
    transform:translateY(-50%)!important
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    padding-left:12px!important;
    padding-right:12px!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:first-child {
    flex-basis:242px!important;
    width:242px!important;
    max-width:242px!important;
    min-width:242px!important
  }
  html body #header .logo-container,html body #header #logo-container,html body #header #logo,html body #header .site-logo,html body #header .logo-container>a,html body #header #logo>a,html body #header .site-logo>a,html body #header .logo-container img,html body #header #logo img,html body #header .site-logo img,html body #header img.logo-img,html body #header img.site-logo-img {
    width:230px!important;
    max-width:230px!important
  }
  html body #header .site-header-main-right {
    padding-right:146px!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    padding-left:2px!important;
    padding-right:2px!important;
    font-size:10px!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children>a,html body #header ul.main-menu>li.menu-item-has-children>a {
    padding-right:13px!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    min-width:138px!important;
    height:44px!important;
    min-height:44px!important;
    padding-left:10px!important;
    padding-right:10px!important
  }
}
@media (min-width: 1200px) {
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    width:min(1240px,calc(100% - 72px))!important;
    max-width:1240px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important
  }
  html body #header #logo-container.logo-container {
    position:static!important;
    left:auto!important;
    right:auto!important;
    transform:none!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:first-child {
    flex:0 0 230px!important;
    width:230px!important;
    min-width:230px!important;
    max-width:230px!important;
    overflow:visible!important
  }
  html body #header .logo-container,html body #header #logo-container,html body #header #logo,html body #header .site-logo,html body #header .logo-container>a,html body #header #logo>a,html body #header .site-logo>a,html body #header .logo-container img,html body #header #logo img,html body #header .site-logo img,html body #header img.logo-img,html body #header img.site-logo-img {
    width:230px!important;
    max-width:230px!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:nth-child(2),html body #header .site-header-row.site-header-main,html body #header .site-header-main-right,html body #header .site-header-main-right-top {
    min-width:0!important
  }
  html body #header .site-header-main-right {
    padding-right:178px!important
  }
  html body #header .site-header-main-right-top,html body #header .main-menu-wrapper {
    flex:1 1 auto!important
  }
  html body #header .main-menu-wrapper {
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    justify-content:center!important
  }
  html body #header #main-menu,html body #header #main-menu>ul,html body #header ul.main-menu {
    max-width:100%!important
  }
  html body #header #main-menu>ul,html body #header ul.main-menu {
    flex-wrap:nowrap!important;
    justify-content:center!important;
    gap:0!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    padding-left:7px!important;
    padding-right:7px!important;
    font-size:11.5px!important;
    letter-spacing:0!important;
    white-space:nowrap!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children>a,html body #header ul.main-menu>li.menu-item-has-children>a {
    padding-right:20px!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    right:0!important;
    min-width:160px!important;
    padding-left:16px!important;
    padding-right:16px!important
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    width:calc(100% - 24px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important
  }
  html body #header #logo-container.logo-container {
    position:static!important;
    left:auto!important;
    right:auto!important;
    transform:none!important
  }
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles>.fxb-row.fxb-row-col-sm>.fxb-col:first-child {
    flex:0 0 230px!important;
    width:230px!important;
    min-width:230px!important;
    max-width:230px!important
  }
  html body #header .site-header-main-right {
    padding-right:132px!important
  }
  html body #header #main-menu>ul>li>a,html body #header ul.main-menu>li>a {
    padding-left:1px!important;
    padding-right:1px!important;
    font-size:9.5px!important;
    letter-spacing:-0.05px!important
  }
  html body #header #main-menu>ul>li.menu-item-has-children>a,html body #header ul.main-menu>li.menu-item-has-children>a {
    padding-right:12px!important
  }
  html body #header a.ctabutton,html body #header .ctabutton {
    min-width:126px!important;
    padding-left:8px!important;
    padding-right:8px!important
  }
}

/* =========================================================
   BLOCK 13 — DESKTOP LOGO ALIGNMENT BETWEEN THE RED HEADER RULES
   Nudge the logo within the desktop header's visual band without changing
   padding, header height, or its horizontal positioning.
========================================================= */
@media (min-width: 992px) {
  html body #header #logo-container.logo-container {
    position: relative !important;
    top: 12px !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
}

/* =========================================================
   BLOCK 14 — DESKTOP MENU INDICATOR POSITION
   Keep active and hover underlines close beneath their menu labels.
========================================================= */
@media (min-width: 992px) {
  html body #header #main-menu > ul > li > a::after,
  html body #header ul.main-menu > li > a::after {
    bottom: 40px !important;
  }
}

/* =========================================================
   BLOCK 15 — SELECTED DESKTOP MENU ITEM
   Make the current page clear with a stronger label and brand-red marker.
========================================================= */
@media (min-width: 992px) {
  html body #header #main-menu > ul > li.active > a,
  html body #header #main-menu > ul > li.current_page_item > a,
  html body #header #main-menu > ul > li.current-menu-item > a,
  html body #header #main-menu > ul > li.current-menu-parent > a,
  html body #header #main-menu > ul > li.current-menu-ancestor > a,
  html body #header ul.main-menu > li.active > a,
  html body #header ul.main-menu > li.current_page_item > a,
  html body #header ul.main-menu > li.current-menu-item > a,
  html body #header ul.main-menu > li.current-menu-parent > a,
  html body #header ul.main-menu > li.current-menu-ancestor > a {
    color: #FFFFFF !important;
    font-weight: 700 !important;
  }

  html body #header #main-menu > ul > li.active > a::after,
  html body #header #main-menu > ul > li.current_page_item > a::after,
  html body #header #main-menu > ul > li.current-menu-item > a::after,
  html body #header #main-menu > ul > li.current-menu-parent > a::after,
  html body #header #main-menu > ul > li.current-menu-ancestor > a::after,
  html body #header ul.main-menu > li.active > a::after,
  html body #header ul.main-menu > li.current_page_item > a::after,
  html body #header ul.main-menu > li.current-menu-item > a::after,
  html body #header ul.main-menu > li.current-menu-parent > a::after,
  html body #header ul.main-menu > li.current-menu-ancestor > a::after {
    width: 38px !important;
    height: 3px !important;
    background: #E1262F !important;
  }
}

/* =========================================================
   BLOCK 16 — COMPACT MOBILE HEADER AND MENU
   Reduce the stacked mobile header height while keeping the logo centered and
   the menu button clear and easy to tap.
========================================================= */
@media (max-width: 991px) {
  html body #header .logo-container img,
  html body #header #logo img,
  html body #header .site-logo img,
  html body #header img.logo-img,
  html body #header img.site-logo-img {
    width: 190px !important;
    max-width: 64vw !important;
    height: auto !important;
    max-height: none !important;
  }

  html body #header .zn-res-menuwrapper {
    padding: 6px 12px 8px !important;
  }

  html body #header .zn-res-trigger {
    width: min(190px, 64vw) !important;
    max-width: 64vw !important;
    height: 52px !important;
    min-height: 52px !important;
    border-radius: 12px !important;
  }

  html body #header .zn-res-trigger::before {
    left: 22px !important;
    width: 22px !important;
    height: 16px !important;
    background-size: 22px 2px, 22px 2px, 22px 2px !important;
  }

  html body #header .zn-res-trigger::after {
    font-size: 16px !important;
  }

  html body #zn-res-menu.zn-res-menu-nav > li > a.main-menu-link.main-menu-link-top,
  html body #zn-res-menu > li.menu-item > a.main-menu-link,
  html body ul#zn-res-menu > li > a {
    min-height: 54px !important;
    padding: 14px 56px !important;
    font-size: 17px !important;
  }

  html body #zn-res-menu ul.sub-menu > li > a.main-menu-link,
  html body #zn-res-menu ul.sub-menu > li > a {
    min-height: 48px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    font-size: 15px !important;
  }
}

/* =========================================================
   BLOCK 17 — MATCH MOBILE LOGO AND MENU BUTTON WIDTHS
   Give the logo box, logo link, logo image, and burger/MENU control one shared
   responsive width so their edges line up on mobile and tablet.
========================================================= */
@media (max-width: 991px) {
  html body #header .logo-container,
  html body #header #logo-container,
  html body #header #logo,
  html body #header .site-logo,
  html body #header .logo-container > a,
  html body #header #logo-container > a,
  html body #header #logo > a,
  html body #header .site-logo > a,
  html body #header .logo-container img,
  html body #header #logo img,
  html body #header .site-logo img,
  html body #header img.logo-img,
  html body #header img.site-logo-img,
  html body #header .zn-res-trigger {
    width: min(190px, 64vw) !important;
    max-width: 64vw !important;
  }

  html body #header .logo-container,
  html body #header #logo-container,
  html body #header #logo,
  html body #header .site-logo,
  html body #header .logo-container > a,
  html body #header #logo-container > a,
  html body #header #logo > a,
  html body #header .site-logo > a {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body #header .zn-res-trigger {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* =========================================================
   BLOCK 18 — HORIZONTAL MOBILE HEADER
   Place the same-width logo and burger/MENU control on one row to reduce the
   stacked header height and bring the page content higher.
========================================================= */
@media (max-width: 767px) {
  html body #header .site-header-main-wrapper,
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    min-height: 0 !important;
    height: auto !important;
  }

  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles {
    padding: 6px 12px !important;
  }

  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 0 !important;
    height: auto !important;
  }

  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm > .fxb-col:first-child {
    flex: 0 0 50% !important;
    width: 50% !important;
    min-width: 0 !important;
    max-width: 50% !important;
    height: auto !important;
    justify-content: flex-start !important;
  }

  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm > .fxb-col:nth-child(2) {
    flex: 0 0 50% !important;
    width: 50% !important;
    min-width: 0 !important;
    max-width: 50% !important;
    height: auto !important;
    justify-content: flex-end !important;
  }

  html body #header .logo-container,
  html body #header #logo-container,
  html body #header #logo,
  html body #header .site-logo,
  html body #header .logo-container > a,
  html body #header #logo-container > a,
  html body #header #logo > a,
  html body #header .site-logo > a,
  html body #header .logo-container img,
  html body #header #logo img,
  html body #header .site-logo img,
  html body #header img.logo-img,
  html body #header img.site-logo-img,
  html body #header .zn-res-trigger {
    width: min(190px, 44vw) !important;
    max-width: 44vw !important;
  }

  html body #header .logo-container,
  html body #header #logo-container,
  html body #header #logo,
  html body #header .site-logo,
  html body #header .logo-container > a,
  html body #header #logo-container > a,
  html body #header #logo > a,
  html body #header .site-logo > a {
    margin: 0 !important;
    justify-content: flex-start !important;
  }

  html body #header .logo-container img,
  html body #header #logo img,
  html body #header .site-logo img,
  html body #header img.logo-img,
  html body #header img.site-logo-img {
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
  }

  html body #header .site-header-main-right,
  html body #header .site-header-main-right-top {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html body #header .zn-res-menuwrapper {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-end !important;
  }

  html body #header .zn-res-trigger {
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
  }
}

/* =========================================================
   BLOCK 19 — PREVENT MOBILE HEADER RESIZE ANIMATION
   Keep the logo and menu at their final responsive sizes from first render;
   leave unrelated page and menu-panel motion unchanged.
========================================================= */
@media (max-width: 767px) {
  html body #header .site-header-main-wrapper,
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles,
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm,
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm > .fxb-col:first-child,
  html body #header .site-header-main-wrapper .siteheader-container.header--oldstyles > .fxb-row.fxb-row-col-sm > .fxb-col:nth-child(2),
  html body #header .logo-container,
  html body #header #logo-container,
  html body #header #logo,
  html body #header .site-logo,
  html body #header .logo-container > a,
  html body #header #logo-container > a,
  html body #header #logo > a,
  html body #header .site-logo > a,
  html body #header .logo-container img,
  html body #header #logo img,
  html body #header .site-logo img,
  html body #header img.logo-img,
  html body #header img.site-logo-img,
  html body #header .zn-res-menuwrapper,
  html body #header .zn-res-trigger {
    transition: none !important;
    animation: none !important;
  }
}

/* =========================================================
   BLOCK 20 — FIXED MOBILE HEADER
   Keep only the mobile header fixed to the viewport. Reserve its responsive
   height in the page flow so the first content section does not sit underneath.
========================================================= */
@media (max-width: 767px) {
  html body {
    --ihf-mobile-header-height: min(107px, calc(22vw + 12px));
    padding-top: var(--ihf-mobile-header-height) !important;
  }

  html body #header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
  }

  html body.admin-bar #header {
    top: 46px !important;
  }
}

/* =========================================================
   BLOCK 21 — HOMEPAGE DESKTOP HEADER RULE SPACING
   Add space below the unchanged logo/menu row on the homepage only. This moves
   the header's bottom red rule lower so it clears the logo like inner pages.
   The desktop layout of every other page and all mobile layouts stay untouched.
========================================================= */
@media (min-width: 992px) {
  html body.home #header,
  html body.front-page #header {
    padding-bottom: 28px !important;
  }
}

/* =========================================================
END OF FILE: I-HOTEL-GLOBAL-CUSTOM-CSS-2026.09.24-V1.12.css
Purpose: Global CSS with a homepage-only desktop header-rule adjustment and a
         compact mobile header fixed during page scroll.
========================================================= */