/*** responsive CSS Start ***/
@media only screen and (min-width: 360px) and (max-width: 576px) {
    .section-space {
        padding: 30px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 100px;
    }

    .section-padding {
        padding: 25px 0;
    }

    /** about section start here ***/
    .about-section-content p {
        font-size: 14px;
    }

    .service-overlay {
        padding: 20px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        width: 45px !important;
        height: 45px !important;
    }

    .service-overlay h3 {
        font-size: 18px;
    }

    .service-sec-img img {
        height: 350px;
    }

    .section-title .back-text {
        position: absolute;
        left: 0;
        top: -30px;
        z-index: -3;
    }

    .back-text strong {
        font-size: 50px !important;
    }

    canvas {
        width: 100%;
        height: 11%;
    }

    .page-title-area {
        min-height: 330px;
    }

    .services-warpper {
        border: none;
        box-shadow: none;
    }

    .services-warpper-content {
        padding: 20px 10px;
        background-color: var(--while-color);
    }

    .services-warpper-content h3 {
        font-size: 22px;
    }

    .services-warpper-content p {
        font-size: 14px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 768px) {
    .section-space {
        padding: 40px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 100px;
    }

    .section-padding {
        padding: 35px 0;
    }

    .service-overlay {
        padding: 25px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        width: 45px !important;
        height: 45px !important;
    }

    .service-overlay h3 {
        font-size: 22px;
    }

    .service-sec-img img {
        height: 450px;
    }

    .section-title .back-text {
        position: absolute;
        left: 0;
        top: -35px;
        z-index: -3;
    }

    .back-text strong {
        font-size: 65px !important;
    }

    canvas {
        width: 100%;
        height: 12%;
    }

    .page-title-area {
        min-height: 330px;
    }

    .page-title-content h1 {
        font-size: 48px;
        letter-spacing: 0.5px;
    }

    .services-warpper {
        border: none;
        box-shadow: none;
    }

    .services-warpper-content {
        padding: 20px 20px;
        background-color: var(--while-color);
    }
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    .section-space {
        padding: 50px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 100px;
    }

    .slider__area-2 .slider__content h1 {
        font-size: 48px;
    }

    .section-padding {
        padding: 50px 0;
    }

    .service-overlay {
        padding: 20px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        width: 45px;
        height: 45px;
    }

    .service-overlay h3 {
        font-size: 18px;
    }

    .service-sec-img img {
        height: 400px;
    }

    .section-title .back-text {
        position: absolute;
        left: 0;
        top: -45px;
        z-index: -3;
    }

    .back-text strong {
        font-size: 75px !important;
    }

    canvas {
        width: 100%;
        height: 15%;
    }

    .page-title-area {
        min-height: 330px;
    }

    .page-title-content h1 {
        font-size: 56px;
        letter-spacing: 0.5px;
    }

    .services-warpper {
        border: none;
        box-shadow: none;
    }

    .services-warpper-content {
        padding: 20px 20px;
        background-color: var(--while-color);
    }
}

@media only screen and (min-width: 993px) and (max-width: 1199px) {
    .section-space {
        padding: 60px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 100px;
    }

    .slider__area-2 .slider__content h1 {
        font-size: 52px;
    }

    .section-padding {
        padding: 45px 0;
    }

    .service-overlay {
        padding: 20px;
    }

    .service-overlay h3 {
        font-size: 18px;
    }

    .service-sec-img img {
        height: 400px;
    }

    .section-title .back-text {
        position: absolute;
        left: 0;
        top: -55px;
        z-index: -3;
    }

    .back-text strong {
        font-size: 85px !important;
    }

    canvas {
        width: 100%;
        height: 15%;
    }

    .page-title-area {
        min-height: 350px;
    }

    .page-title-content h1 {
        font-size: 62px;
        letter-spacing: 0.5px;
    }

    .footer__widget.grey-light .footer__list-contact li .ftc-desc span {
        font-size: 15px !important;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .section-space {
        padding: 75px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 35%;
    }

    .slider__area-2 .slider__content h1 {
        font-size: 60px;
    }

    .slider__area-2 {
        height: 100vh;
    }

    .section-padding {
        padding: 65px 0;
    }

    .section-title h2 {
        font-size: 38px;
    }

    .service-overlay h3 {
        font-size: 18px;
    }

    .service-sec-img img {
        height: 400px;
    }

    .section-title .back-text {
        position: absolute;
        left: 0;
        top: -85px;
        z-index: -3;
    }

    .back-text strong {
        font-size: 105px !important;
    }

    canvas {
        width: 100%;
        height: 20%;
    }

    .page-title-area {
        min-height: 370px;
    }

    .page-title-content h1 {
        font-size: 70px;
        letter-spacing: 0.5px;
    }

    .footer__widget.grey-light .footer__list-contact li .ftc-desc span {
        font-size: 15px !important;
    }
}

@media only screen and (min-width: 1400px) and (max-width: 1920px) {
    .section-space {
        padding: 90px 0;
    }

    /*** slider section start here ***/
    .slider__content {
        padding-top: 15%;
    }

    .slider__area-2 .slider__content h1 {
        font-size: 70px;
    }

    .slider__area-2 {
        height: 100vh;
    }

    .service-overlay h3 {
        font-size: 20px;
    }

    .service-sec-img img {
        height: 450px;
    }

    .page-title-area {
        min-height: 400px;
    }

    .page-title-content h1 {
        font-size: 75px;
        letter-spacing: 0.5px;
    }

    .owl-carousel .owl-stage-outer {
        top: 50px !important;
    }
}