/**
 * Global header. Same rules on every page. Not aggregated, so DevTools
 * shows this file: css/izi-travel-2.header.css
 */

/* Out of flow before main.css arrives, or the menu pushes the page down. */
.navigation__offscreen {
  position: fixed;
  top: 0;
  bottom: 0;
  left: -16.875em;
  width: 16.875em;
  z-index: 10000;
  overflow: auto;
}

@media (max-width: 1099px) {
  .navigation--top .block-menu,
  .navigation--top .region-primary-menu .menu--main,
  .navigation--top .navigation__menu {
    display: none !important;
    position: static !important;
    transform: none !important;
  }

  .navigation--top .navigation__logo {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 132px;
    height: 32px;
    margin: 0 0 0 0.2rem !important;
  }
}

@media (min-width: 1100px) {
  .navigation--top .navigation__container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    min-height: 4.75rem;
    flex-wrap: nowrap !important;
  }

  .navigation--top .navigation__brand {
    display: flex !important;
    align-items: center;
    flex: 0 0 auto !important;
    z-index: 2;
  }

  .navigation--top .navigation__hamburger {
    height: 2.75rem;
    margin: 0;
    background-size: 28px;
  }

  .navigation--top .navigation__logo {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    float: none !important;
    margin: 0 0 0 0.35em !important;
  }

  .navigation--top .region-primary-menu,
  .navigation--top .navigation__container .region-primary-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    flex: 1 1 auto !important;
    min-width: 0;
    gap: 0 !important;
    position: static !important;
    padding-right: 0 !important;
    pointer-events: auto !important;
  }

  .navigation--top .block-menu,
  .navigation--top .navigation__container .block-menu,
  .navigation--top .region-primary-menu .menu--main,
  .navigation--top .navigation__menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    float: none !important;
    flex: 1 1 auto !important;
    min-width: 0;
    pointer-events: auto !important;
    z-index: 1;
  }

  .navigation--top .block-menu > ul.menu,
  .path-frontpage .navigation--top .block-menu > ul.menu {
    display: flex !important;
    align-items: center !important;
    width: max-content !important;
    max-width: 100%;
    margin: 0 auto !important;
    padding: 0 !important;
    gap: 1.5rem !important;
    float: none !important;
  }

  .navigation--top .block-menu > ul.menu > li,
  .navigation--top .block-menu > ul.menu > .navigation__item + .navigation__item {
    position: relative;
    flex-shrink: 0;
    white-space: nowrap;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .navigation--top .block-language-switcher-enhanced,
  .navigation--top .navigation__container .block-language-switcher-enhanced {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 0.25rem 0 0 !important;
    pointer-events: auto !important;
    z-index: 8;
  }
}
