

body {
    font-family: 'yekan-bakh', sans-serif;
    margin: auto;
}

::-webkit-scrollbar {
    width: 5px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: #f5f5f5 !important;
    border-radius: 10px !important;
}

::-webkit-scrollbar-thumb {
    background-color: rgb(0, 31, 51) !important;
    border: 2px solid rgb(0, 31, 51) !important;
    border-radius: 500px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgb(0, 31, 51) !important;
}

/*.competition-points-wrapper .competition-points-slider-wrapper {*/
/*    background-color: rgb(0, 31, 51);*/
/*    padding: 20px 0;*/
/*    width: 100%;*/
/*    overflow: hidden;*/
/*    position: relative;*/
/*}*/

/*.competition-points-wrapper .competition-points-slider {*/
/*    display: flex;*/
/*    !*align-items: center;*!*/
/*    gap: 100px;*/
/*    margin: 0;*/
/*    animation: slide var(--scroll-duration) linear infinite;*/
/*}*/

/*.competition-points-wrapper .competition-point {*/
/*    list-style: none;*/
/*    white-space: nowrap;*/
/*    flex-shrink: 0;*/
/*}*/

/*@keyframes slide {*/
/*    0% {*/
/*        transform: translateX(0);*/
/*    }*/
/*    100% {*/
/*        transform: translateX(-100%);*/
/*    }*/
/*}*/

/*.competition-points-wrapper .competition-points-slider li {*/
/*    list-style: none;*/
/*    position: relative;*/
/*}*/

/*.competition-points-wrapper .competition-points-slider li::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    left: -60px;*/
/*    bottom: 0;*/
/*    width: 20px;*/
/*    height: 20px;*/
/*    background-image: url("svg/star.svg");*/
/*}*/

.competition-points-wrapper .competition-point p {
    color: #fff;
    margin-bottom: 0;
}


:root {
    --gap-width: 20px;
    --slide-width: 200px;
    --slide-height: 20px;
    --slide-bg-color: rgba(18, 92, 251, 0.52);
    --overlay-bg-color: rgba(0, 0, 0, 0.5);
    --overlay-text-color: #fff;
    --overlay-transition: opacity 0.3s ease;
    --border-radius: 20px;
}

.carousel {
    overflow: hidden;
    width: 100%;
    background-color: rgb(0, 31, 51);
    padding: 20px 0;
    /*position: relative;*/
}

.carousel-track {
    display: flex;
    gap: 100px;
    animation: scroll var(--scroll-duration) linear infinite;
}

.competition-points-wrapper .competition-points-slider .competition-point {
    flex: 0 0 var(--slide-width);
    height: var(--slide-height);
    border-radius: var(--border-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
    /*flex-shrink: 0;*/
    position: relative;
    /*overflow: hidden;*/
}

.competition-points-wrapper .competition-points-slider .competition-point {
    list-style: none;
    position: relative;
}

.competition-points-wrapper .competition-points-slider .competition-point::after {
    content: '';
    position: absolute;
    left: -60px;
    bottom: 0;
    width: 20px;
    height: 20px;
    background-image: url("../svg/star.svg");
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-1 * var(--total-width)));
    }
}


