.navbar {
    position: fixed;
    z-index: 102;
    width: 100%;
    height: 44px;
    top: 0;
    left: 0;

    list-style: none;
    margin: 0;
    padding: 0;

    -webkit-backdrop-filter: saturate(110%) blur(20px);
    backdrop-filter: saturate(110%) blur(20px);
    background-color: rgba(22, 22, 23, .8);

    transition: height 0.2s ease-out, background-color 350ms linear;
  }

  .navbar.show {
    background-color: #161617;
  }

  .navbar-content {
    height: 44px;
  }

  .navbar-content > li > a {
    font-size: 12px;
  }

  .animation-1 {
    animation: flyAnimation 0.55s forwards;
  }

  .animation-2 {
    animation: flyAnimation 0.65s forwards;
  }

  .animation-3 {
    animation: flyAnimation 0.7s forwards;
  }

  .animation-4 {
    animation: flyAnimation 0.75s forwards;
  }

  .animation-5 {
    animation: flyAnimation 0.8s forwards;
  }

  .animation-6 {
    animation: flyAnimation 0.85s forwards;
  }

  .animation-7 {
    animation: flyAnimation 0.9s forwards;
  }

  .animation-8 {
    animation: flyAnimation 0.95s forwards;
  }

  .animation-9 {
    animation: flyAnimation 1s forwards;
  }
  .animation-10 {
    animation: flyAnimation 1.05s forwards;
  }
  .animation-11 {
    animation: flyAnimation 1.10s forwards;
  }
  .animation-12 {
    animation: flyAnimation 1.15s forwards;
  }
  .animation-13 {
    animation: flyAnimation 1.20s forwards;
  }

  @keyframes flyAnimation {
    0% {
      opacity: 0;
      transform: translateY(-4px);
    }
    100% {
      opacity: 1;
      transform: translateY(0px);
    }
  }

  #flyout-list {
    transition: none;
  }

  #flyout-header,
  #flyout-list,
  .navbar #language-switcher,
  .navbar #social-icons {
    opacity: 1;
    transition: none;
  }

  .flyout-content {
    display: flex;
    align-items: center;
    padding-bottom: 20px;
  }

  .flyout-content > #language-switcher > li {
    padding-top: 0px;
  }

  .flyout-content > #social-icons > li {
    padding-top: 0px;
  }

  #language-switcher,
  #social-icons,
  #flyout-list {
    flex: 1;
  }

  #language-switcher,
  #social-icons {
    margin-right: 10px;
  }

  .language-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 10px;
}

  #flyout-header,
  #language-list {
    margin: 0;
    padding: 0;
  }

  #language-list li {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .language-social-container {
    display: flex;
    flex-direction: column;
  }

  #language-switcher,
  #social-icons {
    flex: 1;
    margin-bottom: 10px;
  }

  .flyout-content {
    align-items: normal;
    margin-top: 40px;
  }

  .flyout-content > #social-icons > ul > li + li {
    margin-left: 0;
  }

  .flyout-content > #flyout-list .sub-initial {
    opacity: 0;
  }

  .flyout-content > #flyout-list .sub {
    padding-top: 7px;
    margin-left: 0;
    margin-top: 0;
  }

  .flyout-content > #flyout-list .sub a {
    font-size: 24px;  
    font-weight: 500;
  }

  #flyout-content > li {
    font-size: 12px;
  }

  #flyout-list > li {
    display: flex;
    align-items: flex-start;
  }

  #language-switcher, #social-icons, #flyout-list {
    flex: none;
  }


  /* MOBILE NAVIGATION */

  .navbar-mobile {
    height: 48px;
  }

  .navbar-mobile.show {
    background-color: #161617;
  }

  .navbar-mobile .home-icon img {
    width: 26px;
    margin: 10px;
  }

  .navbar-mobile-content > li {
    height: 48px;
    width: 48px;
  }

  #nav-burger {
    height: 100%;
  }

  #nav-burger > span {
    display: block;
    width: 16px;
    height: 2px;
    background: #fff;
    border-radius: 3px;
    transform-origin: center;
    transform: rotate(0deg);
    transition: transform 0.125s linear, margin 0.125s linear 0.125s;
  }

  #nav-burger > span:first-of-type {
    margin-bottom: 5px;
    margin-top: -4px;
  }

  .nested-flyout-list > li > * {
    font-size: 28px;
  }

  #globalnav .globalnav-submenu-list-item {
    font-size: 17px;
  }

  .navbar-mobile #language-switcher {
    padding-top: 46px;
  }

  .navbar-mobile #language-switcher > ul, .navbar-mobile #social-icons > ul {
    padding-top: 14px;
  }

  .navbar-mobile #social-icons {
    padding-top: 30px;
  }