/* *** ADAPTIVE *** */

@media screen and (max-width: 1400px) {

    section {
        padding: 40px 15px;
    }

    h1 {
        font-size: 50px;
    }

    h2, section .block-title {
        margin-bottom: 60px;
    }

    .benefits .top_benefits_left h2 {
        font-size: 40px;
    }

    .benefits .benefits-card {
        max-width: 100%;
    }

    .benefits .benefits-card p {
        font-size: 20px;
    }

    .benefits .benefits-card h4 {
        margin-bottom: 35px;
    }

    .services .more-link {
        width: 352px;
        height: 352px;
    }

    .service-card .service-title a {
        font-size: 20px;
    }

    .services .more-link>a {
        font-size: 30px;
    }

    .doctors .doctor-info, main .doctor-info {
        width: 100%;
    }

    .map-block .map-contact-block h2 {
        margin-bottom: 50px;
    }

    .map-block .map-contact-block h2 {
        font-size: 35px;
    }

    .map_contacts {
        font-size: 22px;
    }

    .map-block .contact-item.address {
        padding-bottom: 36px;
    }

    .map-block .map-contact-block {
        right: 50px;
        padding: 30px 30px 30px 50px;
    }

    .map-block .map-contact-block .phone img {
        width: 25px;
        height: 25px;
    }

    .map-block .map-contact-block .city img {
        width: 20px;
        height: 25px;
    }

}

@media screen and (max-width: 1199px) {

    h2, section .block-title {
        margin-bottom: 50px;
    }

    .top_section .region-top-section-left {
        padding: 45px;
    }

    h1 {
        font-size: 40px;
    }

    .top_section .region-top-section-left h1 {
        line-height: 1.1;
        margin-bottom: 30px;
    }

    .benefits .top_benefits_left h2 {
        font-size: 36px;
    }

    .service-card .service-title a {
        font-size: 18px;
        min-height: 84px;
    }

    .services .more-link {
        bottom: 15px;
        right: 0px;
        width: 292px;
        height: 292px;
    }

    .services .more-link>a {
        font-size: 30px;
    }

    .form-block .webform-submission-add-form h3 {
        font-size: 30px;
    }

    .ds-2col>.group-left {
        float: none;
        width: 100%;
    }

    .ds-2col>.group-right {
        float: none;
        width: 100%;
    }
}

@media screen and (max-width: 991px) {

    h1, h2, h3, h4, h5, h6, p, .views-field-title, .block-title {
        word-break: break-word;
    }

    .top_section {
        margin-top: 30px;
    }

    .top_section .region-top-section-left {
        padding: 40px;
    }

    .services .more-link {
        display: flex;
        bottom: 5px;
        right: 5px;
        width: 292px;
        height: auto;
        padding: 0;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
    }

    .services .more-link>a::before {
        top: 10px;
        bottom: 0;
        left: 0;
        margin-left: 15px;
        width: 41px;
        height: 78px;

    }

    .services .more-link>a {
        padding: 20px;
    }

    .services .more-link>a::after {
        right: 30px;
        bottom: 25px;
    }

    .doctor-card img {
        width: 100%;
        height: auto;
    }

    .doctors .doctor-info, main .doctor-info {
        width: 100%;
    }

    .form-block .form-image img {
        height: 550px;
    }

    .form-block .form-control {

        max-width: 100%;
    }

    .form-block .form-submit {
        max-width: 100%;
    }

    #offcanvasNav .nav .dropdown-menu {
        display: none;
        position: static;
        border: 0px solid;
        background: transparent;
        padding: 10px 0;
    }

    #offcanvasNav li.nav-item {
        width: 100%;
    }
}

@media screen and (max-width: 981px) {
    .col-12.col-lg-7.col-md-7.top_section_left {
        float: none;
        width: 100%;
    }

    .col-12.col-lg-5.col-md-5.top_section_right {
        float: none;
        width: 100%;
        display: none;
    }

    .node--type-services.ds-2col .group-left {
        width: 100%;
    }

    .node--type-services.ds-2col .group-right {
        width: 100%;
    }

}

@media screen and (max-width: 767px) {
    section {
        padding: 30px 15px;
    }

    h2, section .block-title {
        font-size: 40px;
        margin-bottom: 40px;
    }

    .benefits .top_benefits_left h2 {
        font-size: 36px;
    }

    .benefits .region.region-top-benefits-right {
        margin-bottom: 30px;
    }

    .benefits .top_benefits_left h {
        font-size: 36px;
    }

    .benefits .benefits-card p {
        font-size: 16px;
    }

    .service-card .service-title a::after {
        right: 10px;
    }

    .form-block .form-image {
        display: none;
    }
}

@media screen and (max-width: 576px) {

    h2, section .block-title {
        font-size: 36px;
        margin-bottom: 35px;
    }

    .top_section .region-top-section-left p {
        font-size: 16px;
        margin-bottom: 0;
    }

    .service-card .field--name-node-title {
        padding: 10px;
    }

    .region.region-top-section-left img {
        display: none;
    }

    .service-card .service-title a {
        font-size: 16px;
        min-height: 80px;
    }

    .doctor-card img {
        width: 100%;
        height: auto;
    }

    .map-block .map-contact-block h2 {
        font-size: 25px;
        margin-bottom: 30px;
    }

    .map-block .map-contact-block {
        right: 50px;
        padding: 20px 15px 15px 25px;
    }

    .map_contacts {
        font-size: 16px;
    }

    .map-block .contact-item.socials {
        padding-bottom: 20px;
    }

    .map-block .contact-item.address {
        padding-bottom: 20px;
    }

    .map-block .map-contact-block .phone img {
        width: 20px;
        height: 20px;
    }

    .map-block .map-contact-block .city img {
        width: 16px;
        height: 19px;
    }

    header .col-logo img {
        width: 80%;
        height: auto;
    }

}


@media screen and (max-width: 470px) {

    #header-mob>* {
        padding: 0 5px;
    }

    h2, section .block-title {
        font-size: 30px;
        margin-bottom: 30px;
    }

    .top_section .region-top-section-left h1 {
        line-height: 1.1;
        margin-bottom: 25px;
        font-size: 30px;
    }

    .benefits .benefits-card img {
        display: none;
    }

    .benefits .top_benefits_left h2 {
        font-size: 25px;
    }

    .benefits .top_benefits_left p {
        font-size: 14px;
    }

    .form-block .form-content {
        padding: 50px 0 70px;
    }
}