@import url(reset.css);
@import url(variables.css);
@import url(layout.css);
@import url(swiper.css);
@import url(fonts.css);

body {
   font-family: 'AtypText', sans-serif;
   font-size: 14px;
   font-weight: 400;
   overflow-x: hidden;
   position: relative;
}

.menu__btn,
.phone__nav {
   display: none;
}


@media(max-width:1170px) {
   .logo img {
      width: 100px;
   }

   .menu li {
      padding: 0 10px;
   }

   .main__title {
      font-size: 32px;
      line-height: 37px;
   }

}

@media(max-width:1000px) {
   .header {
      width: 100%;
      height: 68px;
      padding: 0;
      background: var(--base__color);
   }

   .desktop__nav {
      display: none;
   }

   .menu__btn {
      display: flex;
      flex-direction: column;
      justify-content: center;
      background: var(--base__color);
      cursor: pointer;
      position: relative;
      border: none;
      margin: 0;
      padding: 0;
      height: 30px;
      width: 30px;
   }

   .menu__btn-line {
      width: 30px;
      display: block;
      height: 1px;
      background: var(--primary__text);
      margin: 3px 0;
   }

   .menu__btn-active #menu__btn-line2 {
      display: none;
   }

   .menu__btn-active #menu__btn-line1 {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      margin: 0;
   }

   .menu__btn-active #menu__btn-line3 {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      margin: 0;
   }


   .phone__nav {
      position: absolute;
      top: 68px;
      right: 0;
      background: var(--base__color);
      z-index: 100;
      width: 450px;
      height: 100vh;
      padding: 25px 15px 0 15px;
   }

   .phone__nav-active {
      display: block;
   }

   .phone__nav-item {
      padding-bottom: 45px;
      border-bottom: 1px solid var(--primary__text);
      margin-bottom: 45px;
   }

   .phone__nav-item:nth-child(2) {
      margin: 0;
      border: none;
   }

   .phone__nav-item .menu {
      flex-direction: column;
      align-items: start;
   }

   .phone__nav-item .menu li {
      padding: 0;
      margin-bottom: 20px;
   }

   .phone__nav-item .menu li a {
      font-size: 12px;
   }

   .phone__nav-item .menu li:last-child {
      margin-bottom: 0;
   }

   .phone__nav-title {
      margin-bottom: 30px;
      font-size: 20px;
   }

   .header__nav-contacts li {
      padding: 0;
      font-size: 12px;
      margin-bottom: 30px;
      font-weight: 600;
      color: var(--primary__text);
      max-width: 290px;
      line-height: 22px;
   }

   .header__nav-contacts li a {
      color: var(--primary__text);
      font-size: 12px;
      font-weight: 400;
   }

   .header__nav-contacts li a img {
      margin: 0 0 -3px 3px;
   }

   .header__nav-active {
      border-bottom: 1px solid var(--primary__text);
   }

   .phone__nav .footer__social-wrap {
      display: flex;
      flex-direction: column;
      align-items: end;
   }

   .phone__nav .footer__social-wrap a {
      margin: 0 0 20px;
   }

   .main__screen .container {
      padding: 0;
      flex-direction: column;
   }

   .main__screen-img {
      order: -1;
      height: 460px;
   }

   .main__screen-content,
   .main__screen-img {
      width: 100%;
      border-radius: 0;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      -ms-border-radius: 0;
      -o-border-radius: 0;
   }

   .offer__title {
      font-size: 20px;
      line-height: 23px;
      background: url(../img/draws/2.svg)no-repeat center bottom/contain;
      padding: 30px 0 20px;
      border: none;
   }

   .offer__text {
      padding: 25px;
   }

   .rooms__wrap-item {
      flex-direction: column;
   }

   .room__slider {
      width: 100%;
      margin-right: 0;
      margin-bottom: 20px;
   }

   .offer__section {
      flex-direction: column;
      padding: 20px 10px;
   }

   .offer__section-content {
      margin: 0 0 20px 0;
   }

   .offer__section-link {
      width: 100%;
      justify-content: center;
      padding: 30px 10px;
   }

   .leisure__wrap {
      grid-template-columns: 1fr;
   }

   .leisure__wrap-item img {
      max-height: 340px;
      object-fit: cover;
   }

   .leisure__item-content {
      padding: 10px 0 10px 20px;
   }

   .leisure__wrap-item:nth-child(3) .leisure__text,
   .leisure__wrap-item:nth-child(4) .leisure__text {
      display: none;
   }

   .leisure__wrap-item:nth-child(3) .leisure__descr,
   .leisure__wrap-item:nth-child(4) .leisure__descr {
      margin-bottom: 0;
   }

   .down__form .main__form {
      padding: 0;
   }

   .footer .container {
      flex-direction: column;
   }

   .footer__item {
      padding: 10px 0 10px 20px;
      margin: 0 0 35px 0;
   }

   .footer__root {
      position: relative;
      text-align: center;
      padding: 20px 0 0;
      right: 0;
   }

   #empty__span2 {
      display: none;
   }

   .footer__social-phone {
      top: 63%;
   }

   .footer__social-wrap {
      display: flex;
      flex-direction: column;
      align-items: end;
   }

   .footer__social-wrap a {
      margin: 0 0 20px 0;
   }

   .footer__item li {
      max-width: 100%;
   }
}

@media(max-width:768px) {
   .header__nav-contacts li {
      max-width: 100%;
   }

   .swiper {
      height: 260px;
   }

   .phone__nav {
      width: 100%;
   }

   .main__screen-img {
      height: 350px;
   }

   .room__title {
      margin-bottom: 24px;
   }

   .room__content {
      width: 100%;
   }

   .room__content-features {
      justify-content: space-between;
   }

   .room__content-features br {
      display: none;
   }

   .room__content-cta {
      position: relative;
      padding-top: 20px;
      align-items: normal;
      text-align: center;
   }

   .slider__button {
      display: none;
   }

   .swiper-pagination-bullet {
      width: 18px;
      height: 18px;
      background: var(--base__text);
      opacity: 1;
   }

   .swiper-pagination-bullet-active {
      background: var(--base__color);
   }

   .gallery__item-img {
      height: 210px;
   }

   .gallery__wrap-item:first-child {
      grid-template-columns: 1.5fr 2fr;
   }

   .gallery__wrap-item:last-child {
      grid-template-columns: 2fr 1.5fr;
   }

   .gallery__wrap-item:first-child .gallery__item-img:nth-child(2),
   .gallery__wrap-item:last-child .gallery__item-img:nth-child(2) {
      display: none;
   }

   .gallery__wrap-item:nth-child(2) {
      display: grid;
   }

   .gallery__wrap-item:nth-child(2) .gallery__item-img {
      height: 250px;
      margin-bottom: 10px;
   }

   .home__space .container {
      justify-content: space-between;
   }

   .home__space-title {
      font-size: 20px;
      line-height: 23px;
      text-align: center;
   }

   .home__space-logo {
      height: 22px;
      margin-right: 20px;
   }
}

@media(max-width:570px) {
   .room__content-features {
      flex-direction: column;
   }
}

@media(max-width:390px) {
   .offer__section-img {
      margin-right: 10px;
      height: 30px;
   }
}

@media(min-width:768px) {
   .swiper-pagination {
      display: none;
   }
}
/* Widget iframe height management */
.widget-iframe {
   transition: height 0.2s ease;
}