/* section produits */
    .container_produits{
        display: flex;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 1rem;
        overflow-x: scroll;
        padding-bottom: .5rem;
    }

    .container_produits::-webkit-scrollbar{
        width: .2rem;
        height: .2rem;
    }

    .container_produits:hover::-webkit-scrollbar{
        width: .4rem;
        height: .4rem;
        border-radius: 50%;
    }
    
    .container_produits::-webkit-scrollbar-track{
        background-color: transparent;
        border-radius: .5rem;
    }
    
    .container_produits::-webkit-scrollbar-thumb{
        background-color: var(--light-black);
        border-radius: .5rem;
    }
/* section produits */


/* section annonce */
    .container_annonce-wrapper {
        position: relative;
    }

    .container_annonce-wrapper .slide-button {
        position: absolute;
        top: 47%;
        outline: none;
        border: none;
        height: 2.5rem;
        width: 2.5rem;
        z-index: 5;
        color: white;
        display: flex;
        cursor: pointer;
        font-size: 1.2rem;
        background: var(--orange);
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        transform: translateY(-50%);
    }

    .container_annonce-wrapper .slide-button:hover {
        background: var(--blue);
    }

    .container_annonce-wrapper .slide-button#prev-slide-annonce {
        left: -15.6px;
        display: none;
    }

    .container_annonce-wrapper .slide-button#next-slide-annonce {
        right: -15.6px;
    }

    .container_annonce-wrapper .list_annonce-annonce {
        display: grid;
        height: 25rem;
        grid-template-columns: repeat(50, 1fr);
        gap: .6rem;
        list-style: none;
        margin-bottom: .6rem;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
    }

    .container_annonce-wrapper .list_annonce-annonce::-webkit-scrollbar {
        display: none;
    }

    .container_annonce-wrapper .list_annonce-annonce .item_annonce {
        width: 25rem;
        height: 25rem;
    }

    .container_annonce-wrapper .list_annonce-annonce .item_annonce img {
        object-fit: cover;
    }

    .text{
        position: relative;
        width: inherit;
        height: inherit;
        background-color: #000000b9;
        scale: 0;
        transition: 1s;
    }

    .text_content{
        position: relative;
        width: 97%;
        height: 15rem;
        top: 50%;
        transform: translateY(-50%);
        padding: 1rem;
        overflow-y: scroll;
        color: white;
        white-space: pre-line;
    }

    .text_content::-webkit-scrollbar{
        width: .3rem;
    }
    
    .text_content::-webkit-scrollbar-track{
        background-color: var(--light-black);
        border-radius: 1rem;
    }
    
    .text_content::-webkit-scrollbar-thumb{
        background-color: var(--orange);
        border-radius: 1rem;
    }

    .text_content p{
        white-space: pre-line;
        text-align: justify;
    }

    .container_annonce-wrapper .list_annonce-annonce .item_annonce:hover .text {
        position: relative;
        scale: 1;
        top: -101.7%;
    }

    .container_annonce .slider-scrollbar {
        width: 100%;
        display: flex;
        align-items: center;
    }

    .container_annonce .slider-scrollbar .scrollbar-track {
        background: var(--light-black);
        width: 100%;
        height: 1.25px;
        display: flex;
        align-items: center;
        border-radius: 2.5px;
        position: relative;
    }

    .container_annonce .slider-scrollbar:hover .scrollbar-track {
        height: 4px;
    }

    .container_annonce .slider-scrollbar .scrollbar-thumb {
        position: absolute;
        background: var(--orange);
        top: 0;
        bottom: 0;
        width: 50%;
        height: 100%;
        cursor: grab;
        border-radius: inherit;
    }

    .container_annonce .slider-scrollbar .scrollbar-thumb:active {
        cursor: grabbing;
        height: 5px;
        top: -1.2px;
    }

    .container_annonce .slider-scrollbar .scrollbar-thumb::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -6.25px;
        bottom: -6.25px;
    }
/* section annonce */


/* section faqs */
    .content_faqs{
        width: 100%;
        margin: 0 auto;
        border: var(--border);
        border-radius: .5rem;
        padding: 15px;
    }

    .content_faqs:not(:last-child){
        margin-bottom: 1rem;
    }

    .content_faqs label{
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 18px;
        cursor: pointer;
        font-weight: 600;
    }

    .content_faqs label + input[type="radio"]{
        display: none;
    }

    .content_answer{
        line-height: 25px;
        height: 0;
        overflow: hidden;
        transition: max-height .5s;
        text-align: justify;
        white-space: pre-line;
    }

    .content_faqs label + input[type="radio"]:checked + .content_answer{
        height: auto;
    }
/* section faqs */


/* section blog */
    .container_blog{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 1rem;
    }

    .content_blog{
        width: 22rem;
        padding: .8rem;
        border: var(--border);
        border-radius: .5rem;
    }

    .box_img_blog{
        width: 100%;
        height: 12rem;
    }  
    
    .box_img_blog img{
        border-radius: .4rem .4rem 0 0;
        object-fit: cover;
    }

    .date_comment{
        display: flex;
        justify-content: space-between;
        padding: .5rem 0;
    }

    .date_comment i{
        color: var(--orange);
    }

    .blog_heading{
        position: relative;
        line-height: 1.38rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-weight: bolder;
        color: var(--blue);
        text-align: justify;
    }

    .text_blog{
        text-align: justify;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: .5rem;
    }
/* section blog */


/* section annonce */
    /* Styles for mobile and tablets */
        @media only screen and (max-width: 1023px) {
            .container_annonce-wrapper .slide-button {
                display: none !important;
            }

            .container_annonce-wrapper .list_annonce-annonce {
                gap: .5rem;
                margin-bottom: 9.3px;
                scroll-snap-type: x mandatory;
            }

            .slider-scrollbar .scrollbar-thumb {
                width: 20%;
            }
        }
    /* Styles for mobile and tablets */

    @media screen and (max-width: 610px) {
        .text_content p{
            font-size: 15px;
        }
    }

    @media screen and (max-width: 500px) {
        .container_annonce-wrapper .list_annonce-annonce {
            height: 21.8rem;
        }

        .container_annonce-wrapper .list_annonce-annonce .item_annonce {
            width: 21.8rem;
            height: 21.8rem;
        }
    }

    @media screen and (max-width: 480px) {
        .text_content p{
            font-size: 14px;
        }
    }

    @media screen and (max-width: 450px) {
        .container_annonce-wrapper .list_annonce-annonce {
            height: 18.75rem;
        }
        
        .container_annonce-wrapper .list_annonce-annonce .item_annonce {
            width: 18.75rem;
            height: 18.75rem;
        }

        .text_content{
            height: 12rem;
        }
    }

    @media screen and (max-width: 380px) {
        .container_annonce-wrapper .list_annonce-annonce {
            height: 16.88rem;
        }
        
        .container_annonce-wrapper .list_annonce-annonce .item_annonce {
            width: 16.88rem;
            height: 16.88rem;
        }

        .text_content{
            height: 10rem;
        }

        .text_content p{
            font-size: 13px;
        }
    }
/* section annonce */


/* section services */
    @media screen and (max-width: 1164px) {
        .content_services{
            width: 800px;
        }

        .box_img_services{
            width: 500px;
            height: 180px;
        }
    }

    @media screen and (max-width: 680px) {
        .content_services{
            width: 600px;
        }

        .box_img_services{
            width: 300px;
            height: 150px;
        }
    }

    @media screen and (max-width: 610px) {
        .titre_services{
            font-size: 18px;
        }

        .text_services{
            font-size: 15px;
        }
    }

    @media screen and (max-width: 550px) {
        .content_services{
            width: 400px;
        }

        .box_img_services{
            width: 250px;
            height: 120px;
        }
    }

    @media screen and (max-width: 480px) {
        .titre_services{
            font-size: 18px;
        }

        .text_services{
            font-size: 14px;
        }
    }

    @media screen and (max-width: 450px) {
        .content_services{
            width: 350px;
            flex-wrap: wrap;
        }

        .box_img_services{
            width: 100%;
            height: 140px;
        }

        .content_services:nth-child(odd) .box_img_services{
            order: 1;
        }

        .content_services:nth-child(odd) .container_text{
            order: 2;
        }
        
    }

    @media screen and (max-width: 380px) {
        .titre_services{
            font-size: 17px;
        }

        .text_services{
            font-size: 13px;
        }
    }

    @media screen and (max-width: 350px) {
        .content_services{
            width: 100%;
        }
    }

    @media screen and (max-width: 325px) {
        .box_img_services{
            height: 125px;
        }
    }
/* section services */


/* section faqs */
    @media screen and (max-width: 610px) {
        .content_faqs label{
            font-size: 16px;
        }

        .content_answer{
            font-size: 15px;
        }
    }

    @media screen and (max-width: 480px) {
        .content_faqs label{
            font-size: 15px;
        }

        .content_answer{
            font-size: 14px;
        }
    }

    @media screen and (max-width: 400px) {
        .content_faqs{
            padding: 15px 10px;
        }
    }

    @media screen and (max-width: 380px) {
        .content_answer{
            font-size: 13px;
        }
    }
/* section faqs */


/* section blog */
    @media screen and (max-width: 835px) {
        .content_blog{
            width: 20rem;
        }
    }

    @media screen and (max-width: 764px) {
        .content_blog{
            width: 30rem;
        }
    }

    @media screen and (max-width: 610px) {
        .blog_heading{
            font-size: 18px;
        }

        .text_blog{
            font-size: 15px;
        }
    }

    @media screen and (max-width: 480px) {
        .blog_heading{
            font-size: 17px;
        }

        .text_blog{
            font-size: 14px;
        }
    }

    @media screen and (max-width: 400px) {
        .box_img_blog{
            height: 10rem;
        }
    
        .date_comment, .text_blog{
            font-size: 15px;
        }
    }

    @media screen and (max-width: 380px) {
        .date_comment, .text_blog{
            font-size: 14px;
        }

        .blog_heading{
            font-size: 16px;
        }

        .text_blog{
            font-size: 13px;
        }
    }
/* section blog */