@media (max-width:767px) {
    .modal-body .btn-close {
        color: #fff !important
    }
}


@media (max-width:451px) {
    .main-tab a{
        margin-top: 3px;
    }
}

@media (max-width:992px) {

    body p {
        font-size: 12px;
    }

    body p.t-sm-center {
        text-align: justify;
        text-align-last: center;
    }

    body .cardMap .cardDesc p {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 7 !important;
        line-clamp: 7 !important;
        -webkit-box-orient: vertical;
        font-size: 11px;
    }

    .packageCard .ty-70 {
        transform: translateY(70px) translateX(100px) !important
    }

    .navbar-brand img {
        object-fit: contain;
        max-width: 90px
    }


    .carouselServices .carousel-control-next i,
    .carouselServices .carousel-control-prev i {
        display: none;
    }

    .carouselServices .carousel-control-prev {
        display: none;
    }

    .carouselServices .carousel-control-next {
        display: none;
    }

    .cursor,
    .cursor-follower {
        display: none !important
    }

    .bgMenuCircle {
        width: 200px;
        height: 200px;
        /* background: #2c0055; */
        background: #FF0000;
        /* background: linear-gradient(148deg, rgb(78 0 151 / 73%) 50%, rgb(0 1 18 / 48%) 100%); */
        background: linear-gradient(148deg, hsla(0, 100%, 50%, 0.73) 50%, rgba(0, 1, 18, 0.48) 100%);
        border-radius: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -45%);
        z-index: -1;
        animation: 3s bubble infinite alternate-reverse
    }

    .serviceHome .owl-item.active.center {
        transform: scale(1) translateY(20px)
    }

    .ab1,
    .ab2,
    .ab3,
    .ab4,
    .ab5,
    .ab6,
    .ab7,
    .ab8,
    .ab9,
    .ab10,
    .ab11,
    .ab12,
    .ab13 {
        position: relative !important;
        transform: translate(0, 0) !important;
        margin: 20px auto
    }

    .ab1::before,
    .ab2::before,
    .ab3::before,
    .ab4::before,
    .ab5::before,
    .ab6::before,
    .ab7::before,
    .ab8::before,
    .ab9::before,
    .ab10::before,
    .ab11::before,
    .ab12::before,
    .ab13::before {
        display: none !important
    }

    .cardAbout .bgShades {
        display: none
    }
}

@media (max-width:1400px) {

    .conLine5 {
        position: absolute;
        bottom: 110px !important;
        left: 2px !important;
        background: url(../img/testi/l5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 150px;
        height: 120px;
        z-index: -1;
        transform: rotate(5deg);
    }

    /*     
    .conLine5 {
        position: absolute;
        bottom: 100px;
        left: 0;
        background: url(../img/testi/l5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 50px;
        height: 100px;
        z-index: -1;
        transform: rotate(5deg)
    } */

    .conLine7 {
        position: absolute;
        bottom: 30px;
        left: 0;
        background: url(../img/testi/l5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 70px;
        height: 100px;
        z-index: -1;
        transform: rotate(20deg)
    }

    .projectRoundedCard2::before {
        content: '';
        position: absolute;
        top: 40px;
        left: -330px;
        transform: rotate(6deg);
        background: url(../img/decor/vec-2.png) no-repeat;
        width: 420px;
        height: 380px;
        background-size: 100% 100%
    }

    .projectRoundedCard::before {
        content: '';
        position: absolute;
        top: 30px !important;
        right: -330px !important;
        transform: rotate(-9deg);
        background: url(../img/decor/vec-1.png) no-repeat;
        width: 420px;
        height: 390px;
        background-size: 100% 100%
    }

    .step0 {
        position: absolute;
        width: 70%;
        top: -300px;
        left: 66%;
        transform: translateX(-50%) scale(.7)
    }

    .step01 {
        position: absolute;
        width: 70%;
        top: -200px;
        left: 50px;
        transform: scale(.6)
    }

    .step02 {
        position: absolute;
        width: 70%;
        top: -120px;
        right: -100px;
        transform: scale(.7)
    }

    .step02 img.mapMark {
        height: 250px;
        object-fit: contain
    }

    .step03 {
        position: absolute;
        width: 70%;
        top: 190px;
        left: -100px;
        transform: scale(.7)
    }

    .step03 img.mapMark {
        height: 270px;
        object-fit: contain
    }

    .step04 {
        position: absolute;
        width: 70%;
        top: 290px;
        right: -70px;
        transform: scale(.7)
    }

    .step04 img.mapMark {
        height: 290px;
        object-fit: contain
    }

    .serviceCircle {
        width: 200px;
        height: 200px
    }

    .clientImages .videoParent01 {
        position: absolute
    }

    .clientImages .videoParent01 .contVideo {
        position: relative;
        width: 200px;
        height: 200px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .clientImages .videoParent02 {
        position: absolute;
        right: 30px;
        top: 43%
    }

    .clientImages .videoParent02 .contVideo {
        position: relative;
        width: 220px;
        height: 220px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .clientImages .videoParent03 {
        position: absolute;
        right: 220px;
        bottom: 110px
    }

    .clientImages .videoParent03 .contVideo {
        position: relative;
        width: 130px;
        height: 130px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .ab1 {
        position: relative
    }

    .ab1::before {
        content: '';
        position: absolute;
        bottom: -110%;
        left: 30%;
        transform: translateX(-50%);
        background: url(../img/decor/l1.png);
        width: 334px;
        height: 339px;
        background-repeat: no-repeat;
        background-size: contain
    }

    .ab2 {
        position: relative;
        transform: translateY(280px) translateX(130px) scale(.9)
    }

    .ab2::before {
        content: '';
        position: absolute;
        bottom: -140%;
        left: 111%;
        transform: translateX(-50%);
        background: url(../img/decor/l2.png);
        width: 590px;
        height: 427px;
        background-repeat: no-repeat;
        background-size: contain
    }

    .cardAbout.ab3 {
        position: relative;
        transform: translateY(310px) translateX(11px) scale(.88)
    }

    .ab3::before {
        content: '';
        position: absolute;
        bottom: -140%;
        left: 112%;
        transform: translateX(-50%);
        background: url(../img/decor/l3.png);
        width: 275px;
        height: 496px;
        background-repeat: no-repeat;
        background-size: contain;
    }

    .cardAbout.ab4 {
        position: relative;
        transform: scale(.84) translate(-80px, 590px)
    }

    .ab4::before {
        content: '';
        position: absolute;
        bottom: -125%;
        left: -67%;
        transform: translateX(-50%);
        background: url(../img/decor/l4.png);
        width: 415px;
        height: 556px;
        background-repeat: no-repeat;
        background-size: contain
    }

    .ab5 {
        position: relative;
        transform: scale(.79) translate(90px, 430px)
    }

    .ab5::before {
        content: '';
        position: absolute;
        bottom: -50%;
        left: 180%;
        transform: translateX(-50%);
        background: url(../img/decor/l6.png);
        width: 590px;
        height: 170px;
        background-repeat: no-repeat;
        background-size: contain
    }

    .ab6 {
        position: relative;
        transform: scale(.7) translate(-220px, 370px)
    }

    .ab8 {
        position: relative;
        transform: scale(.7) translate(1100px, -10px);
    }

    .ab9 {
        position: relative;
        transform: scale(.7) translate(-710px, -20px);
    }
}

@media (max-width:1200px) {

    .projectRoundedCard2::before,
    .projectRoundedCard::before {
        display: none
    }

    .step01 {
        position: absolute;
        width: 60%;
        top: -230px;
        left: 50px;
        transform: scale(.6)
    }

    .step02 {
        position: absolute;
        width: 70%;
        top: -170px;
        right: -80px;
        transform: scale(.7)
    }

    .step04 {
        position: absolute;
        width: 70%;
        top: 290px;
        right: -120px;
        transform: scale(.7)
    }

    .owl-theme.portfolio1 .owl-nav,
    .owl-theme.portfolio2 .owl-nav {
        position: relative !important;
        top: 20px
    }

    .clientImages .videoParent01 {
        position: absolute
    }

    .clientImages .videoParent01 .contVideo {
        position: relative;
        width: 150px;
        height: 150px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .clientImages .videoParent02 {
        position: absolute;
        right: 30px;
        top: 46%
    }

    .clientImages .videoParent02 .contVideo {
        position: relative;
        width: 180px;
        height: 180px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .clientImages .videoParent03 {
        position: absolute;
        right: 220px;
        bottom: 110px
    }

    .clientImages .videoParent03 .contVideo {
        position: relative;
        width: 130px;
        height: 130px;
        background: #ff0707;
        border-radius: 100%;
        box-shadow: 0 4px #00b9ff;
        overflow: hidden
    }

    .ab8 {
        position: relative;
        transform: scale(.7) translate(970px, -10px);
    }

    .ab9 {
        position: relative;
        transform: scale(.7) translate(-650px, -20px);
    }
}

@media (max-width:1600px) {

    .conLine1 {
        position: absolute;
        top: 78px;
        left: 150px;
        background: url(../img/testi/l1.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 260px;
        height: 110px;
        z-index: -1;
    }

    .conLine4 {
        position: absolute;
        bottom: -30px;
        right: 80px;
        background: url(../img/testi/l4.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 180px;
        height: 100px;
        z-index: -9;
        transform: rotate(5deg)
    }

    .conLine5 {
        position: absolute;
        bottom: 170px;
        left: 40px;
        background: url(../img/testi/l5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 50px;
        height: 100px;
        z-index: -1;
        transform: rotate(5deg);
    }

    .conLine7 {
        position: absolute;
        bottom: 50px;
        left: -8px;
        background: url(../img/testi/l5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 70px;
        height: 100px;
        z-index: -1;
        transform: rotate(20deg);
    }
}