@media (max-width: 1300px) {
    #offer .offer-boxes .offer-box {
        flex: 0 0 calc(50% - 50px);
        max-width: 50%;
    }

    body.page-template-offer #offer .offer-boxes .offer-box {
        flex: 0 0 calc(50% - 50px);
        max-width: 50%;
    }
}

@media (max-width: 1250px) {
    #offer__second .offer-content .offer-box {
        flex: 0 0 calc(50% - 60px);
        max-width: 50%;
    }
}

@media (max-width: 1200px) {
    #about-company .content-about-company {
        flex-direction: column;
        gap: 50px 0;
    }

    #about-company .content-about-company .left {
        width: 100%;
        padding: 0;
        gap: 25px 0;
    }

    #about-company .content-about-company .right {
        width: 100%;
        height: auto;
        min-height: 500px;
    }
}

@media (max-width: 1150px) {
    #team .team-content .team-member {
        width: calc(50% - 29px);
    }
}

@media (max-width: 1100px) {
    #gallery-page .gallery-content ul>li {
        display: flex;
        flex: 0 0 calc(33% - 12px);
        max-width: 33.33%;
    }
}

@media (max-width: 1050px) {
    #why-us .boxes {
        flex-wrap: wrap;
    }

    #why-us .boxes .box {
        flex: 0 0 calc(50% - 67px);
        max-width: 50%;
    }
}

@media (max-width: 1000px) {
    #contact .contact-content {
        gap: 0 20px;
    }
}

@media (max-width: 1000px) {
    #contact-page #contact .contact-content {
        gap: 0 20px;
    }

    #contact-page #contact .contact-content .left-contact {
        width: 35%;
    }

    #contact-page #contact .contact-content .right-contact {
        width: calc(65% - 50px);
        padding: 25px;
        justify-content: space-around;
    }
}

@media (max-width: 950px) {
    #content-about-us .text-photo-offer {
        flex-direction: column;
        gap: 25px 0;
        height: auto;
    }

    #content-about-us .text-photo-offer.right .photo-offer {
        width: 100%;
        height: 300px;
        padding: 0;
        order: 2;
    }

    #content-about-us .text-photo-offer .text-offer,
    #content-about-us.first .text-photo-offer .text-offer,
    #content-about-us.second .text-photo-offer .text-offer {
        width: 100%;
        padding: 0;
        align-items: center;
        height: auto;
        order: 1;
    }

    #content-about-us .text-photo-offer .text-offer .button__container {
        gap: 16px;
        justify-content: center;
        width: 100%;
    }

    #content-about-us .text-photo-offer .text-offer .content {
        max-width: unset;
    }
}

@media (max-width: 900px) {
    #header {
        height: 80px;
    }

    #header .top-header {
        display: none;
    }

    #header .border-header {
        display: none;
    }

    #header .bottom-header {
        align-items: center;
    }

    #header .bottom-header .menu-header {
        display: none;
    }

    #header .bottom-header .mobile-menu-header {
        display: block;
    }

    #background-photo {
        overflow: visible;
    }
}

@media (max-width: 850px) {
    #gallery .photos .swiper-wrapper .photo {
        filter: none;
    }
}

@media (max-width: 800px) {
    #about-company .content-about-company .left {
        align-items: center;
    }

    #about-company .content-about-company .right {
        display: flex;
        flex-direction: column;
    }

    #about-company .content-about-company .right .photo {
        display: flex;
        height: 250px;
        justify-content: center;
        position: relative;
        overflow: hidden;
    }

    #about-company .content-about-company .right .photo:nth-child(1) {
        display: flex;
        height: 250px;
        justify-content: center;
        position: relative;
        overflow: hidden;
    }

    #about-company .content-about-company .left .button__container {
        justify-content: center;
    }
}

@media (max-width: 775px) {
    #contact .contact-content {
        flex-direction: column;
        gap: 20px 0;
    }

    #contact .contact-content .left-contact {
        width: 100%;
        align-items: center;
        gap: 25px 0;
    }

    #contact .contact-content .left-contact .company-data {
        align-items: center;
    }

    #contact .contact-content .right-contact {
        width: calc(100% - 50px);
        gap: 25px 0;
        padding: 25px;
    }


    #contact-page #contact .contact-content {
        flex-direction: column;
        gap: 20px 0;
    }

    #contact-page #contact .contact-content .left-contact {
        width: 100%;
        align-items: center;
        gap: 25px 0;
    }

    #contact-page #contact .contact-content .left-contact .company-data {
        align-items: center;
    }

    #contact-page #contact .contact-content .right-contact {
        width: calc(100% - 50px);
        gap: 25px 0;
    }

    #contact .title span {
        text-align: center;
    }

    #contact .contact-content .left-contact .company-data .contact-company {
        justify-content: center;
    }

    #contact-page #contact .contact-content .company-data .top-data .company-contact {
        justify-content: center;
    }

    #contact-page #contact .contact-content .company-data {
        width: 100%;
        padding: 0;
        gap: 50px 0;
    }

    #contact-page #contact .contact-content .company-data .top-data {
        align-items: center;
    }

    #contact-page #contact .contact-content .company-data .bottom-data {
        align-items: center;
    }
}

@media (max-width: 768px) {
    body.home #background-photo {
        padding: 0 1rem 3rem;
    }

    #partners .content .partners .partner {
        width: calc(50% - 16px);
        max-width: 50%;
    }
}

@media (max-width: 750px) {
    #why-us .boxes .box {
        flex: 0 0 calc(100% - 38px);
        max-width: 100%;
    }

    #gallery .photos .swiper-wrapper .photo {
        filter: none;
    }

    #gallery-page .gallery-content ul>li {
        display: flex;
        flex: 0 0 calc(50% - 12px);
        max-width: 50%;
    }
}

@media (max-width: 700px) {
    #offer .offer-boxes .offer-box {
        flex: 0 0 calc(100% - 40px);
        max-width: 100%;
        justify-content: center;
    }

    body.page-template-offer #offer .offer-boxes .offer-box {
        flex: 0 0 calc(100% - 40px);
        max-width: 100%;
        justify-content: center;
    }

    #footer .top-footer .menu-header ul {
        flex-direction: column;
    }

    #footer .top-footer .menu-header ul>li {
        border-right: none;
        padding: 10px 0;
    }

    #footer .bottom-footer p {
        text-align: center;
    }

    #footer .bottom-footer p span {
        display: block;
        margin: 10px 0;
    }

    #offer.icon .offer-boxes .offer-box {
        flex: 0 0 calc(100% - 40px);
        max-width: 100%;
    }
}

@media (max-width: 650px) {
    #contact-page #contact .contact-content {
        flex-direction: column;
        gap: 0;
    }

    #contact-page #contact .contact-content .company-map {
        width: calc(100% - 2px);
        height: 250px;
    }

    #offer__second .offer-content .offer-box {
        flex: unset;
        width: 100%;
        max-width: 100%;
    }

    #team .team-content .team-member {
        width: 100%;
    }

    #contact-page #contact .contact-content .company-data .bottom-data .button {
        margin: 0 0 25px;
    }
}

@media (max-width: 600px) {
    #opinions .opinions-boxes .swiper-wrapper {
        justify-content: center;
    }

    #opinions .opinions-boxes .opinion-box {
        padding: 20px;
        width: calc(100% - 42px) !important;
    }

    #opinions .opinions-boxes .opinion-box .icon-opinion,
    #opinions .opinions-boxes .opinion-box .icon-opinion svg {
        width: 50px;
        height: 50px;
    }

    #opinions .opinions-boxes .opinion-box .opinion-content .title-opinion {
        flex-direction: column;
        gap: 5px 0;
    }

    #opinions .opinions-boxes .opinion-box .opinion-content .title-opinion p {
        margin: 5px 0;
    }

    #about-company,
    #why-us,
    #opinions,
    #offer,
    #gallery,
    #contact,
    #content-about-us,
    #team,
    #contact-page #contact,
    #partners {
        width: calc(100% - 20px);
        padding: 30px 10px;
    }

    #footer {
        width: calc(100% - 20px);
        padding: 20px 10px 10px;
    }

    .container {
        width: calc(100% - 30px);
        padding: 15px;
    }
}

@media (max-width: 550px) {

    #contact .wpcf7-form-control-wrap[data-name="your-name"],
    #contact .wpcf7-form-control-wrap[data-name="your-email"],
    #contact .wpcf7-form-control-wrap[data-name="your-phone"],
    #contact .wpcf7-form-control-wrap[data-name="your-subject"] {
        width: 100%;
    }

    #contact-page #contact .contact-content .right-contact .top-contact-form .customer-data input {
        width: calc(100% - 30px);
    }

    #contact .contact-content .right-contact .bottom-contact-form {
        flex-direction: column;
        gap: 15px 0;
        align-items: center;
    }

    #contact .contact-content .right-contact .bottom-contact-form .accept {
        width: 100%;
        margin-top: 25px;
    }

    #contact .contact-content .right-contact .bottom-contact-form .send {
        width: 100%;
    }

    #slider .title-slider h1 {
        font-size: 36px;
    }

    #contact-page #contact .contact-content .right-contact .bottom-contact-form {
        flex-direction: column;
        gap: 15px 0;
        align-items: center;
    }

    #contact-page #contact .contact-content .right-contact .bottom-contact-form .accept {
        width: 100%;
    }

    #contact-page #contact .contact-content .right-contact .bottom-contact-form .send {
        width: 100%;
    }

    #contact .contact-content .right-contact .bottom-contact-form .send button.page-button.orange {
        width: 100%;
    }
}

@media (max-width: 500px) {

    #opinions .opinions-boxes .opinion-box .icon-opinion,
    #opinions .opinions-boxes .opinion-box .icon-opinion svg {
        width: 25px;
        height: 25px;
    }

    #content-about-us .text-photo-offer .text-offer .button__container a.page-button {
        width: calc(50% - 8px);
    }

    #content-about-us .text-photo-offer .text-offer .button__container a.page-button span {
        font-size: 10px;
    }

    #partners .content .partners .partner {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 450px) {
    #gallery-page .gallery-content ul>li {
        display: flex;
        flex: 0 0 100%;
        max-width: 100%;
    }
}