:root {
    --gradient-macha: linear-gradient(114.41deg, var(--color-shockingly-green) 20.74%, var(--color-lt-green) 65.5%);
    --gradient-orange-crush: linear-gradient(111.45deg, var(--color-orangey) 19.42%, #f7bdf8 73.08%);
    --gradient-lipstick: linear-gradient(165.72deg, #f7bdf8 21.15%, #cd237f 81.93%);
    --gradient-purple-haze: linear-gradient(153.58deg, #f7bdf8 32.25%, #2f3cc0 92.68%);
    --gradient-skyfall: linear-gradient(131.77deg, #0a157a 30.82%, #15bfe4 81.82%);
    --gradient-emerald-city: linear-gradient(166.9deg, var(--color-shockingly-green) 53.19%, #0085d0 107.69%);
    --gradient-summer-fair: linear-gradient(144.02deg, var(--color-blue) 4.56%, var(--color-pink) 72.98%);
}

.populars .slick-next,
.populars .slick-prev {
    display: none !important;
}



.tag-list {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    gap: 1rem 0;
    position: relative;
    padding: 1.5rem 0;
    overflow: hidden;
}

.demo div.our-brand {
    padding: 15px;
    border-radius: 15px !important;
}
.demo div.our-brand img {
    border-width: 2px;
    overflow: hidden;
    border-radius: 15px !important;
    border-style: solid;
}

.shop_article_txt {
    font-size: 16px !important;
    font-weight: 600;
    height: auto;
}
.shop_article_dsc {
    font-size: 14px;
}

/*.articles,
.populars,*/
#carouselExampleControls {
    background: rgba(235,235,235,0.6);
}

footer {
    margin-top: 100px;
}
footer, .bottom_footer_sec {
    background: #ebebeb;
    border: 0;
}
.bg-darkest {
    background: #fff;
    box-shadow: 0px 5px 25px 0px rgba(79, 105.00000000000004, 139, 0.09);
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
}
.support h4, footer p,
.footer_content ul li a,
.footer_content h4 {
    color: #212529;
}

#certificates {
    direction: ltr;
}
#certificates a {
    display: block;
    width: 100%;
    height: 72px;
    text-align: center;
    padding: 10px;
    border: 0.5px solid #757C9C;
    background: #fff;
    border-radius: 15px;
    margin: 0 auto 10px;
}
#certificates a img {
    height: 50px;
    margin: 0 auto;
}
.bottom_footer_sec h4 {
    padding: 25px 0;
}

.carousel-item .text-boxed {
    padding-top: 170px;
    direction: rtl;
}

.bottom_footer_sec span {
    color: #212529;
}
.bottom_footer_sec.copy {
    border-top: 1px solid #757C9C;
}

footer p {
    margin-bottom: 0;
}

@media (max-width: 768px) {

    .title_sec {
        font-size: 25px;
    }
    .desc_sec {
        font-size: 17px;
    }
    #carouselExampleControls {
        padding-top: 80px;
    }
    .carousel-item dotlottie-player {
        width: 200px !important;
        height: 200px !important;
    }
    .carousel-item h2 {
        font-size: 1.3rem;
    }
    .carousel-item h3 {
        font-size: 1rem;
    }
    .carousel-item h4 {
        font-size: 0.85rem;
    }
    .carousel-item .py-5 {
        padding: 2rem 0.5rem !important;
    }
    .carousel-item .col-ms-12,
    .carousel-item .row {
        max-width: 100vw;
    }
    .carousel-item .text-boxed {
        padding-top: 20px;
        text-align: center;
    }
    .carousel-item .py-5 {
        padding-top: 0 !important;
    }
    .text-body {
        display: block;
    }
    .articles .slick-prev, .articles .slick-next,
    .services .slick-prev, .services .slick-next,
    #certificates .slick-prev, #certificates .slick-next {
        display: none !important;
    }
    #accordionExample .card-header {
        padding: 5px 10px;
    }
    #accordionExample .btn {
        font-size: 0.8rem;
    }
    .services .service-icon {
        top: -5px;
        left: -5px;
    }
    .mobile-fix {
        padding-bottom: 32px;
    }
    #progress-bar-container #line-progress {
        width: 22%;
    }

}

@media (max-width: 988px) {
    #progress-bar-container #line-progress {
        width: 18%;
    }
}









.container .slogan-in {
    border: 1px solid #9f62c3;
    padding: 1rem;
}
.bg-light {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}
.align-self-center {
    align-self: center !important;
}
.container .slogan-in img {
    opacity: .6;
}
.text-a {
    color: #7e37a9;
    font-size: 15px;
}