
@media screen and (max-width: 1400px) {

   .container {
   margin: 0 auto;
   padding: 0;
   width: 1000px;
   }

   .header .container {
   padding: 0 50px;
   }

   .promo .banner-promo {
   display: none;
   }

   .promo .banner-promo-mobile {
   display: block;
   }

   .credit-form .container {
   padding: 30px 50px;
   }

   .models .container {
   padding: 30px 50px 0 50px;
   }

   .models .container .line .model .model-view {
   width: 50%;
   }

   .models .container .line .model .model-options {
   width: 40%;
   }

   .models .container .line .model .model-buttons {
   padding: 30px 0 0 0;
   width: 100%;
   }

   .models .container .line .model .model-buttons .title {
   margin: 30px 0 0 0;
   text-align: left;
   }

   .models .container .line .model .model-buttons .btn-group {
   flex-wrap: nowrap;
   }

   .models .container .line .model .model-buttons .btn-group .link-custom {
   margin: 20px 0 0 0;
   width: 30%;
   }

   .models .container .line .model .model-buttons .btn-group .btn-custom {
   width: 30%;
   font-size: 17px;
   }

   .callback-form .container {
   padding: 30px 50px;
   }

   .service-form .container {
   padding: 30px 50px;
   }

   .map .container {
   padding: 0 50px;
   }

   .model-overview .container {
   padding: 20px 50px 0 50px;
   }

   .model-overview .details .view {
   width: 700px;
   height: 430px;
   }

   .model-overview .details .options .items {
   padding: 25px 0 15px 0;
   width: 250px;
   }

   .model-overview .details .price {
   margin: 0 0 10px 0;
   line-height: 50px;
   font-size: 45px;
   }

   .model-overview .details .sets {
   margin: 0 5px 70px 0;
   }

   .model-overview .buttons .btn-custom {
   font-size: 18px;
   }

   .model-overview .buttons .color-select .colors .color {
   margin: 0 10px 0 0;
   width: 35px;
   height: 35px;
   }

   .advantages .container {
   padding: 40px 50px;
   }

   .advantages .container .items {
   padding: 30px 0;
   }

   .advantages .container .items .item {
   width: 130px;
   height: 130px;
   }

   .advantages .container .items .item .pict {
   background-position: 50% 0;
   background-size: 110px;
   }

   .advantages .container .items .item .label {
   font-size: 10px;
   }

   .legal .container {
   padding: 20px 50px 0 50px;
   }

   .header .container .menu ul li a {
      font-size: 16px;
   }

}


@media screen and (max-width: 1000px) {

   .block .title {
   margin: 0;
   padding: 30px 0 0 0;
   width: 100%;
   height: auto;
   background: none;
   text-align: center;
   }

   .block .title .text {
   position: static;
   justify-content: center;
   flex-wrap: wrap;
   padding: 0;
   line-height: 27px;
   font-size: 27px;
   white-space: normal;
   }

   .block .title .text::after {
   display: none;
   }

   .block {
   width: 100%;
   max-width: 500px;
   }

   .container {
   padding: 0 10px;
   width: 100%;
   }


   .header {
   height: 156px;
   }

   .header .container {
   padding: 0;
   }

   .header .container .h-block {
   position: relative;
   }

   .header .container .callback {
   margin: 0 0 0 10px;
   width: 260px;
   }

   .header .container .callback .address {
   display: none;
   }

   .header .container .logo-block {
   flex-wrap: wrap;
   width: 100%;
   height: 90px;
   }

   .header .container .logo-block .logo {
   margin: 0;
   padding: 0;
   width: 100%;
   }

   .header .container .logo-block .logo img {
   margin: 0 auto;
   }

   .header .container .logo-block .haval {
   margin: 25px 0 0 0;
   }

   .header .container .logo-block .okamitagil {
   flex-wrap: wrap;
   margin: 10px 0 0 0;
   }

   .header .container .logo-block .okamitagil::before {
   display: none;
   }

   .header .container .logo-block .okamitagil .image {
   margin: 0 auto;
   }

   .header .container .logo-block .okamitagil .label {
   position: static;
   /*margin: 10px 0 0 0;*/
   width: 100%;
   text-align: center;
   }

   .header .container .menu {
   width: 100%;
   }

   .header .container .menu .menu-mobile {
   position: absolute;
   top: 0;
   right: 0;
   z-index: 15;
   display: block;
   margin: -130px 0 0 0;
   background: #222 url('/img/menu_mobile.png') 50% no-repeat;
   }

   .header .container .menu ul {
   display: none;
   flex-wrap: wrap;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 10;
   margin: -90px 0 0 0;
   padding: 10px 20px;
   width: inherit;
   background: rgba(255, 240, 240, .9);
   border: 0;
   box-sizing: border-box;
   }

   .header .container .menu ul.opened {
   display: block;
   }

   .header .container .menu ul li {
   padding: 5px 0 0 0;
   width: 100%;
   }

   .header .container .menu ul li a {
      font-size: 19px;
   }

   .header .container .menu ul li:nth-child(1) {
   padding: 0;
   }

   .header .container .menu ul li::before {
   display: none;
   }

   .header .container .menu ul li .submenu::after {
   padding: 0 0 0 5px;
   line-height: 20px;
   font-size: 20px;
   content: '>';
   }

   .header .container .menu ul li ul {
   position: static;
   display: flex;
   margin: 0;
   padding: 0 0 0 15px;
   border: 0;
   background: none;
   }

   .header .container .menu ul li ul li {
   margin: 0;
   padding: 5px 0 0 0;
   text-align: left;
   }

   .header .container .menu ul li ul li:nth-child(1) {
   margin: 0;
   padding: 5px 0 0 0;
   }

   .promo {
   padding: 156px 0 0 0;
   }

   .promo .banner {
   width: 500px;
   height: 94vw;
   max-height: 470px;
   }

   .promo .banner .banner-image {
   display: none;
   }

   .promo .banner .banner-image-mobile {
   display: block;
   }

   .promo .slider-pagination {
   margin: 0 0 8px -175px;
   }

   .promo .slider-pagination .swiper-pagination-bullet {
   width: 8px;
   height: 8px;
   }

   .promo .slider-pagination .swiper-pagination-bullet-active {
   width: 10px;
   height: 10px;
   }

   .credit-form .container {
   padding: 20px;
   }

   .credit-form .container .form {
   position: relative;
   padding: 0 0 60px 0;
   }

   .credit-form .container .form .field {
   padding: 0 0 15px 0;
   width: 100%;
   }

   .credit-form .container .form .field label {
   padding: 0 0 5px 0;
   font-size: 15px;
   }

   .credit-form .container .form .success {
   font-size: 19px;
   }

   .credit-form .container .form .btn-group {
   position: absolute;
   bottom: 0;
   left: 0;
   z-index: 10;
   margin: 0;
   padding: 0;
   }

   .credit-form .container .form .agreement label {
   padding: 0 0 0 30px;
   }

   .credit-form .container .form .agreement .checkbox:checked + label {
   background-position: 0 0;
   }

   .credit-form .container .form .error label[for="callback_agreement"] {
   background-position: 0 0;
   }

   .models .container {
   padding: 30px 10px 0 10px;
   }

   .models .container .title {
   padding: 0;
   }

   .models .container .line .model .model-block {
   padding: 15px 0 0 0;
   width: 100%;
   }

   .models .container .line .model .model-view .title {
   font-size: 25px;
   text-align: left;
   }

   .models .container .line .model .model-view .view {
   height: 170px;
   }

   .models .container .line .model .model-options .title {
   padding: 0 0 20px 0;
   line-height: 25px;
   font-size: 25px;
   letter-spacing: 0;
   }

   .models .container .line .model .model-options .options .option {
   padding: 5px 0 0 0;
   font-size: 17px;
   }

   .models .container .line .model .model-buttons {
   padding: 25px 0 0 0;
   }

   .models .container .line .model .model-buttons .title {
   position: static;
   margin: 0;
   line-height: 30px;
   font-size: 30px;
   text-align: center;
   }

   .models .container .line .model .model-buttons .btn-group {
   padding: 15px 0 0 0;
   flex-wrap: wrap;
   }

   .models .container .line .model .model-buttons .btn-group .link-custom {
   width: 100%;
   }

   .models .container .line .model .model-buttons .btn-group .btn-custom {
   width: 100%;
   }

   .callback-form .container {
   padding: 20px;
   }

   .callback-form .container .form {
   position: relative;
   padding: 0 0 60px 0;
   }

   .callback-form .container .form .field {
   padding: 0 0 15px 0;
   width: 100%;
   }

   .callback-form .container .form .field label {
   padding: 0 0 5px 0;
   font-size: 15px;
   }

   .callback-form .container .form .success {
   font-size: 19px;
   }

   .callback-form .container .form .btn-group {
   position: absolute;
   bottom: 0;
   left: 0;
   z-index: 10;
   margin: 0;
   padding: 0;
   }

   .callback-form .container .form .agreement label {
   padding: 0 0 0 30px;
   }

   .callback-form .container .form .agreement .checkbox:checked + label {
   background-position: 0 0;
   }

   .callback-form .container .form .error label[for="callback_agreement"] {
   background-position: 0 0;
   }

   .service-form .container {
   padding: 50px 0 0 0;
   }

   .service-form .container .service {
   flex-wrap: wrap;
   }

   .service-form .container .service .service-block {
   position: relative;
   width: 100%;
   }

   .service-form .container .service .service-block .title {
   position: absolute;
   top: 0;
   left: 0;
   z-index: 10;
   margin: 0;
   padding: 10px;
   width: 100%;
   height: auto;
   background: linear-gradient(to bottom, rgba(0, 0, 0, .75), transparent);
   text-align: left;
   color: #fff;
   white-space: normal;
   box-sizing: border-box;
   }

   .service-form .container .service .form {
   padding: 10px 0 20px 0;
   background-color: #e3e3e3;
   }

   .map .container .title {
   padding: 30px 0 10px 0;
   }

   .map .ymap .contacts {
   margin: 20px 0 0 -120px;
   }

   .top-scroller {
   padding: 15px 0 0 0;
   width: 50px;
   height: 50px;
   }

   .model-overview {
   padding: 156px 0 0 0;
   }

   .model-overview .container {
   padding: 20px 0 0 0;
   }

   .model-overview .container .title .text {
   justify-content: flex-start;
   padding: 0 15px;
   }

   .model-overview .description {
   padding: 0 15px;
   font-size: 17px;
   }

   .model-overview .details {
   padding: 125px 0 50px 0;
   }

   .model-overview .details .view {
   width: 100%;
   height: 60vw;
   max-height: 300px;
   background-position: 50% 100%
   }

   .model-overview .details .options {
   margin: 0;
   padding: 15px;
   }

   .model-overview .details .options .items {
   padding: 0 0 25px 0;
   width: 100%;
   }

   .model-overview .details .options .items .item {
   margin: 20px 0 0 0;
   font-size: 15px;
   }

   .model-overview .details .options .items .item::before {
   margin: -13px 0 0 2px;
   width: 26px;
   height: 26px;
   }

   .model-overview .details .price {
   margin: 0 15px 10px 0;
   line-height: 35px;
   font-size: 35px;
   }

   .model-overview .details .sets {
   margin: 0 20px 50px 0;
   font-size: 16px;
   }

   .model-overview .buttons {
   padding: 0 15px 2rem;
   flex-wrap: wrap;
   }

   .model-overview .buttons .color-select {
   padding: 0 0 10px 0;
   width: 100%;
   }

   .model-overview .buttons .color-select .label {
   font-size: 18px;
   }

   .model-overview .buttons .color-select .colors .color {
   margin: 0 15px 0 0;
   width: 30px;
   height: 30px;
   }

   .model-overview .buttons .btn-custom {
   margin: 15px 0 0 0;
   width: 100%;
   font-size: 16px;
   }

   .video-preview .container {
   padding: 40px 0;
   }

   .video-preview .container .video {
   margin: 0;
   padding: 0;
   width: 100%;
   }

   .video-preview .container .video iframe {
   width: 100%;
   height: 70vw;
   max-height: 350px;
   }

   .advantages .container {
   padding: 30px 15px;
   }

   .advantages .container .text {
   font-size: 25px;
   text-align: center;
   }

   .advantages .container .items {
   flex-wrap: wrap;
   margin: 0 auto;
   padding: 0;
   width: 290px;
   }

   .advantages .container .items .item {
   margin: 30px 0 0 0;
   }

   .legal {
   padding: 156px 0 0 0;
   }

   .legal .container {
   padding: 20px 0 0 0;
   }

   .legal .container .title .text {
   justify-content: flex-start;
   padding: 0 15px;
   }

   .legal .container .article {
   padding: 0 15px;
   }

   .actions_title{
      padding: 0 1rem;
      font-size: 27px;
   }
}