.page-content{
    padding: 0!important;
}
.main-header{
    padding: 0;
    width: 100%;

}
.main-header .bg-container img{
    width: 100%;
}
.shop-page-container{
    /*margin-top: -150px;*/
    /* padding: 0 50px ;*/
}
.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow {

    right: unset!important;
    left: 4px !important;

}
.card-img-top-container{
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 300px;
}

.card-img-top-container img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/*.card-img-top-container img{
    width: 100%;
    height: auto;
    object-fit: unset;
}*/
.title-container{
    position: absolute;
    left: 0;
    width: 100%;
    display: flex;
    justify-content:center;
    align-items:unset;
    height: 100vh;
    /*  background-color: rgba(17, 17, 17, 0.31);*/
    color: white;
    font-family: Arial, sans-serif;
}
.kilometrage-section {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 8rem;
    overflow: hidden;
    text-shadow: -1px 0px 20px #f9f5f5;
    margin-top: 310px;
    padding-right: 40px;


}
.letter {
    position: absolute;
    opacity: 0;
    transform: translateY(-100px);
    transition: opacity 0.5s, transform 0.5s;
}
.pagination .active span{
    border: 1px solid #ff7c01 !important;
}
.cat-icons{
    width: 75%;
}
/*.icon-75{
    width: 75%;
}*/
.cat-icon-container{
    cursor: pointer;
}
.cat-icon-container{
    padding-bottom: 10px!important;
}
.cat-active{

    box-shadow: 0 0 7px 2px #ff7c01;
    border-radius: 15%;
    background: rgba(238, 238, 238, 0.31);

}

.semi-theme a,
.light-theme a{
    color:black!important;
}
.dark-theme a{
    color: #FFF!important;
}

.category_card{
    background: linear-gradient(to bottom, #0b0f2a 0%, #0f154f 50%, #000013 100%)!important;
}

.product-info .col-12{
    font-size: 16px;
}

.card-icon-feature{
    max-width: 35px!important;
}

/* Container to hide the overflow and style the banner */
.marquee-container {
    width: 100%;
    overflow: hidden;
    background: #ff7c01;
    color: #fff;
    padding: 30px 0;
    box-sizing: border-box;
    direction: rtl; /* Optional: adjust for right-to-left text */
    position: relative;


}



/* The inner container that will be animated  0.375rem */
.marquee-text {
    position: absolute;
    top:15px;
    display: inline-block;
    white-space: nowrap;


}
.marquee-text1{
    animation: marquee 50s linear infinite;
}

.marquee-text2{
    transform: translateX(-100%);
    animation: marquee 50s linear infinite;
    animation-delay: 25s;
}


/* Optional: Style each text block */
.marquee-text div {
    display: inline-block;
    font-size: 1.2em;
    margin-right: 70px;
}

@keyframes marquee {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}



.banner-img-container img{
    display: block;
    width: 100%;
}