@media (max-width: 1200px) {
  .left-links {
    gap:1rem;
  }
  .left-links > .left-links-menu {
    gap: 1rem;
  }
}

@media (max-width: 1350px) and (min-width: 1024px) {
  .right img {
      top: 30%;
      transform: scale(.8) translate(-50%, -50%);
  }
}
@media (max-width: 1024px) and (min-width: 991px) {
  .right img {
      top: 30%;
      transform: scale(.7) translate(-50%, -50%);
  }

}

@media (max-width: 992px) {
   .search-button-container {
    display: none;
  }
  .header-lobby-not-login-side-bar {
    display: none;
  }

  .left-links {
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    flex-wrap: wrap;
    align-content: center;
    text-align: center;
    background-color:var(--neutral-background);
    padding-top:6rem;
    padding-bottom:3rem;
    gap:40px;
    margin-top:-180%;
  }
  .left-links.animated {
     transition: margin-top 1s ease;
  }
  .left-links.open {
    margin-top:0;
  }
  .left-links > .left-links-menu {
    flex-direction: column;
    width: 100%;
    align-items: center;
    gap: 40px;
  }
 .left-links-search-wrap {
    display: block;
    width: 100%;
    max-width: 24rem;
    margin: 0 auto;
    padding: 0 1.5rem;
    order: 999;
  }

  .left-links-search-wrap .al-search-bar,
  .left-links-search__form.al-search-bar {
    margin: 0;
    width: 100%;
    max-width: 100%;
  }

  .header-lobby-not-login-header {
    margin-bottom: 0;
  }

  .header-lobby-not-login-login-btn,
  .header-lobby-not-login-sign-up-btn {
    display: none;
  }

  .header-lobby-not-login-navigation {
    height: 4.8rem;
  }

  .header-lobby-not-login-logo img {
    position: relative;
    transform: scale(1.15) translate(-50%, -50%);
    top: 50%;
    left: 35%;
  }

  .header-lobby-not-login-logo img.expand {
    transform: scale(1.15) translate(-50%, -50%);
  }

  
}
/* .container.content-area {
  background-color: #fff;
  max-width: min(100%, 87.9375rem);
  margin: 0 auto 7.875rem;
  padding: 3% 5%;
  position: relative;
  border-radius: 15px;
} */

@media (max-width: 640px) {
  .static-side-bar {
    width: min(15.0625rem, 100vw);
  }
  .static-side-bar .promo-block .image-wrapper {
    width: 5.625rem;
  }
  .static-side-bar .promo-block .image-wrapper img {
    bottom: 0;
    left: 0;
  }
  .static-side-bar .promo-block .text-container .title {
    font-size: 1.5rem;
  }
  .static-side-bar .promo-block .text-container .subtitle {
    font-size: 0.625rem;
  }
  .static-side-bar .link-wrapper .link-row img {
    width: 1.1875rem;
    height: 1.1875rem;
  }

  h1 {
    font-size: calc(2.7rem + 1.5vw);
  }
  h2 {
    font-size: 2.3rem;
  }
  h3 {
    font-size: 0.875rem;
  }
}