


html[lang^="ar"] .urban-product-slider {
    direction: ltr !important;
}

html[lang^="ar"] .urban-product-slider * {
    direction: ltr;
}


html[lang^="ar"]  .contentbanner{
    background-image: linear-gradient(90deg, rgba(255, 242, 227, 0), rgba(255, 242, 227, 1), rgba(255, 242, 227, 1), rgba(255, 242, 227,1))!important;
}

html[lang^="ar"]  .bannerrightoverlay{
    background-image: linear-gradient(90deg, rgba(255, 242, 227, 1), rgba(255, 242, 227,0))!important;
}


[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover{
    background:transparent!important;
}


.urban-product-slider {
    width: 100%;
    position: relative;
    /* overflow: hidden; */
    background: transparent;
}


.urban-slider-container {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
}


.urban-slider-viewport {
    width: 100%;
    /* overflow: hidden; */
    position: relative;
}



.urban-slider-track {
    display: flex;
    align-items: center;

    gap: 0px;

    transform: translateX(0);

    transition:
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);

    will-change: transform;
}



.urban-slider-slide {
    flex: 0 0 60%;

    display: flex;
    align-items: center;
    justify-content: center;

    transition:
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.65s ease;
}



.urban-slider-image-wrap {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: scale(1);

    opacity: 0.65;

    transition:
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.65s ease;
}



.urban-slider-slide.is-active
.urban-slider-image-wrap {

    transform: scale(1.4);

    opacity: 1;
}



.urban-slider-image-wrap img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

    user-select: none;

    -webkit-user-drag: none;
}


.urban-slider-arrow {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 20;

    width: 46px;
    height: 46px;

    border: 0!important;

    border-radius: 999px;

    color: #333!important;

    display: flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

}


.urban-slider-arrow span {

    font-size: 34px;

    line-height: 1;

    font-family: Arial, sans-serif;
}


.urban-slider-arrow:hover {
background: none!important;
}


.urban-slider-prev {

    left: 18px;
}


.urban-slider-next {

    right: 18px;
}



.urban-slider-dots {

    display: none;

    justify-content: center;

    align-items: center;

    gap: 7px;

    margin-top: 12px;
}


.urban-slider-dot {

    width: 7px;

    height: 7px;

    padding: 0;

    border: 0;

    border-radius: 999px;

    background: #d0d0d0;

    cursor: pointer;

    transition:
        width 0.3s ease,
        background 0.3s ease;
}


.urban-slider-dot.is-active {

    width: 24px;

    background: #c89b72;
}



@media (max-width: 767px) {

    .urban-slider-track {

        gap: 0;
    }


    .urban-slider-slide {

        flex: 0 0 100%;
    }


    .urban-slider-image-wrap {

        transform: scale(0.88);

        opacity: 0.65;
    }


    .urban-slider-slide.is-active
    .urban-slider-image-wrap {

        transform: scale(1);
    }


    .urban-slider-arrow {

        width: 38px;

        height: 38px;
    }


    .urban-slider-arrow span {

        font-size: 28px;
    }


    .urban-slider-prev {

        left: 8px;
    }


    .urban-slider-next {

        right: 8px;
    }


    .urban-slider-dots {

        margin-top: 8px;
    }

}



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

    .urban-slider-slide {

        flex: 0 0 68%;
    }

}