

@media only screen and (max-width: 1280px) {
    .tab-menu ul {
        display: flex;
        gap: 20px;
    }
    .fea-text {
        height: 215px;
    }


}

@media only screen and (max-width: 1024px) {
.exp-slider .owl-next {
    right: -5%;
}
.exp-slider .owl-prev {
    left: -5%;
}
.fea-text p {
    font-size: 15px;
}


}


@media only screen and (max-width: 912px) {
    .urban-ban-2-text h1 {
        font-size: 35px;
    }

    .fea-text {
        height: 175px;
    }
    .exp-slider .owl-prev {
        left: -10%;
    }
    .exp-slider .owl-next {
        right: -10%;
    }
    .ser-text h1 {
        font-size: 20px;
    }





}

@media only screen and (max-width: 820px) {
    .exp-slider .owl-next {
        right: -5%;
    }
    .exp-slider .owl-prev {
        left: -5%;
    }
    .var-head h1 {
        font-size: 30px;
    }
    .vari-to-1 {
        font-size: 16px;
    }

}



@media only screen and (max-width: 712px) {
    .ser-text h1 {
        font-size: 18px;
    }
    .ser-text p {
        font-size: 16px;
    }
    .image-hover-text-bubble {
        height: 68px;
    }

    .fea-text p {
        font-size: 12px;
    }
    .exp-slider .owl-prev {
        width: 30px;
        height: 30px;
        left: -10%;
    }

    .exp-slider .owl-prev span, .exp-slider .owl-next span {
        font-size: 37px;
    }
    .exp-slider .owl-next {
        width: 30px;
        height: 30px;
        right: -10%;
    }
    .varients-area .owl-prev, .segment-area .owl-prev {
        width: 30px;
        height: 30px;
    }
    .varients-area .owl-prev span, .varients-area .owl-next span, .segment-area .owl-prev span, .segment-area .owl-next span {
        font-size: 37px;
    }
    .varients-area .owl-next, .segment-area .owl-next {
        width: 30px;
        height: 30px;
    }
    .tab-menu ul li a {
        font-size: 18px;
    }

}



@media only screen and (max-width: 600px) {
.varients-top {
    flex-direction: column;
    text-align: center;
}
.vari-to-1 {
    width: 50%;
    margin: 0 auto;
}
.image-hover-image img{
    height: 277px;
    object-fit: cover;
}
.exp-slider .owl-next {
    right: -7%;
}
.exp-slider .owl-prev {
    left: -7%;
}
.exp-head h1 {
    font-size: 20px;
}
.var-head h1 {
    font-size: 25px;
}
.tab-menu ul {
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}


}


@media only screen and (max-width: 540px) {
.fea-area {
    width: 70%;
    margin: 0 auto;
}
.exp-slider .owl-next {
    right: 2%;
}
.exp-slider .owl-prev {
    left: 2%;
}
.exp-slider .owl-prev span, .exp-slider .owl-next span {
    top: -60%;
}
.fea-text p {
    font-size: 15px;
}
.ser-text h1 {
    font-size: 14px;
}
.ser-text p {
    font-size: 13px;
}


}


@media only screen and (max-width: 430px) {
    .urban-ban-2-text h1 {
        font-size: 25px;
    }
    /* end banner */

    .fea-area {
        width: 82%;
        margin: 0 auto;
    }
    .exp-slider .owl-prev {
        left: 0%;
    }
    .exp-slider .owl-next {
        right: 0%;
    }
    .ser-text h1 {
        font-size: 13px;
    }
    .ser-text p {
        font-size: 12px;
    }
    .vari-to-1 {
        font-size: 14px;
    }

}


@media only screen and (max-width: 393px) {
    .fea-area {
        width: 87%;
    }

}

@media only screen and (max-width: 375px) {
    .ser-text h1 {
        font-size: 12px;
    }
    .ser-text p {
        font-size: 11px;
    }
  




}

@media only screen and (max-width: 360px) {
    .fea-text p {
        font-size: 13px;
    }



}














