@media screen and (max-width:1170px) {
    .container {
        max-width: 992px;
        padding-left: 10px;
        padding-right: 10px
    }

    .calc .bottom .form-group .form-files .form-file label {
        border-radius: 9px;
        padding: 13px 12px
    }
}

@media screen and (max-width:991px) {
    img {
        width: 100%
    }

    .container {
        max-width: 767px
    }

    header .logo {
        width: 36%
    }

    header .address {
        display: none
    }

    header .phone {
        width: 23%;
        display: flex;
        flex-direction: column;
    }

    header .contacts {
        width: 41%
    }

    .calc {
        margin: 0 0 40px
    }

    .calc h2 {
        margin: 0 0 30px
    }

    .calc .top .slider {
        width: 100%;
        margin: 0 0 20px
    }

    .calc .top .results {
        width: 100%;
        padding: 0
    }

    .calc .bottom .form-group .form-control {
        width: 100%;
        text-align: center
    }

    .calc .bottom .form-group .form-files {
        width: 65%
    }

    .calc .form {
        border: 1px solid #f7f7f7;
        padding: 45px 70px 40px 70px
    }

    .info {
        margin: 0 0 40px
    }

    .info h2 {
        margin: 0 0 30px
    }

    .info .inner .item {
        width: 100%;
        margin: 0 0 30px;
        padding-top: 1rem;
    }

    .ben {
        display: none;
    }

    .ben,
    .hww,
    .insta,
    .reviews {
        margin: 0 40px
    }

    .hww h2,
    .reviews h2 {
        margin: 0 30px 30px
    }

    .hww .inner .item {
        width: 50%;
        margin: 0 0 20px
    }

    .insta .container .car {
        position: static;
        margin: 0;
        height: auto;
        max-width: 100%
    }

    footer .logo {
        display: none
    }

    footer .contacts {
        width: 37%
    }

    footer .address {
        width: 43%
    }

    footer .phone {
        width: 20%
    }
}

@media screen and (max-width:765px) {
    .container {
        max-width: 540px
    }

    .main-menu {
        display: none
    }

    .page-top .main-menu {
        display: block;
        position: absolute;
        left: 0;
        width: 100%;
        height: 100vh;
        z-index: 1001;
        background: #fff;
        top: -100vh;
        overflow-x: hidden;
        overflow-y: auto
    }

    .page-top .main-menu .container {
        padding: 0
    }

    .page-top .main-menu .address,
    .page-top .main-menu .contacts,
    .page-top .main-menu .phone {
        display: block;
        text-align: center
    }

    .page-top .main-menu .address,
    .page-top .main-menu .phone {
        margin: 0 0 20px
    }

    .page-top .main-menu .address p {
        margin: 0;
        font-size: 16px
    }

    .page-top .main-menu .phone a {
        font-size: 16px;
        color: #000
    }

    .page-top .main-menu .contacts {
        display: block
    }

    .page-top .main-menu .contacts .socials {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 70px;
        margin: 0 auto 20px
    }

    .page-top .main-menu .contacts .socials a {
        display: block;
        width: 30px;
        height: 30px;
        font-size: 0;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat
    }

    .page-top .main-menu .contacts .socials a.whatsapp {
        background-image: url(../images/whatsapp.svg)
    }

    .page-top .main-menu .contacts .socials a.viber {
        background-image: url(../images/viber.svg)
    }

    .page-top .main-menu .contacts .button {
        max-width: 180px;
        width: 100%;
        margin: 0 auto
    }

    .page-top .main-menu .close {
        position: absolute;
        left: 20px;
        top: 20px;
        display: block
    }

    .page-top .main-menu .menu {
        margin: 60px 0 35px 0
    }

    .page-top .main-menu .menu>ul {
        display: block
    }

    .page-top .main-menu .menu>ul>li {
        padding: 0;
        font-size: 13px;
        text-transform: uppercase;
        font-weight: 700;
        width: 100%
    }

    .page-top .main-menu .menu>ul>li a {
        padding: 20px 20px;
        color: #000;
        display: block
    }

    .page-top .main-menu .menu>ul>li.current a {
        color: #fff;
        background: #13130f
    }

    header {
        padding: 10px 0
    }

    header .mobile-menu {
        display: block;
        width: 50px
    }

    header .logo {
        width: calc(100% - 100px);
        text-align: center
    }

    header .logo img {
        display: inline-block
    }

    header .phone {
        display: none;
        width: 50px;
        text-align: right
    }

    header .phone a {
        font-size: 0;
        padding: 0 0 0 21px;
        height: 21px;
        display: block;
        background: url(../images/call-answer.svg) no-repeat center/contain
    }

    header .contacts {
        width: 100%;
        margin: 10px 0 0 0;
        padding: 10px 0 0 0;
        border-top: 1px solid #ebebeb;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        flex-wrap: wrap;
    }

    header .contacts .mobile-phones a {
        color: #000;
        text-decoration: underline !important;
    }

    header .contacts .mobile-phones {
        flex-basis: 100%;
        display: flex;
        justify-content: space-between;
        padding: 0 1rem;
        margin-bottom: 0.5rem;
    }

    body {
        padding: 112px 0 0
    }

    .calc h2,
    .reviews h2 {
        font-size: 18px
    }

    .calc .form {
        padding: 20px 20px 25px 20px
    }

    .calc .top .slider .irs-block {
        width: calc(100% - 100px)
    }

    .calc .top .slider .controls {
        width: 100%;
        padding: 0
    }

    .info h2 {
        font-size: 18px;
        margin: 0 0 15px
    }

    .hww h2,
    .insta h2 {
        font-size: 18px;
        margin: 0 0 30px
    }

    .h-form {
        margin: 0
    }

    .h-form .form .form-group .form-control,
    .h-form .form .form-group .form-input {
        width: 100%
    }

    .h-form .form .form-group .form-input {
        margin: 0 0 15px
    }

    .h-form .form {
        padding: 40px 30px
    }

    footer .address {
        width: 100%;
        text-align: center;
        margin: 0 0 20px
    }

    footer .phone {
        width: 100%;
        text-align: center;
        margin: 0 0 20px
    }

    footer .contacts {
        width: 100%;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
    }

    .ben .item {
        width: 50%
    }
}

@media screen and (max-width:540px) {
    .container {
        max-width: 375px
    }

    .home-slider .swiper-slide {
        height: 150px
    }

    .home-slider .swiper-slide .inner .heading,
    .home-slider .swiper-slide .inner h1 {
        font-size: 15px
    }

    .calc .form {
        /*padding:0*/
        ;
        border: none
    }

    .calc .top .slider label {
        width: 100%;
        margin: 0 0 30px
    }

    .calc .top .slider .irs-block {
        width: 100%
    }

    .calc .bottom .form-group .form-control,
    .calc .bottom .form-group .form-input {
        width: 100%
    }

    .calc .bottom .form-group .form-files {
        width: 100%;
        margin: 0 0 15px
    }

    .hww .inner .item p {
        font-size: 11px
    }

    .hww .inner .item .thumb {
        margin: 0 0 15px;
        height: 80px
    }

    .hww .inner .item .thumb:after {
        width: 20px;
        height: 10px;
        margin-top: 13px
    }

    .hww .inner .item .thumb img {
        max-width: 90px
    }

    .info .inner .item p,
    .insta p {
        font-size: 14px
    }

    .h-form .form {
        border-radius: 0
    }
}

@media screen and (max-width:374px) {
    .container {
        max-width: 320px
    }

    .hww .inner .item .thumb:after {
        right: -4px
    }
}