.auto-scroll {
    display: flex;
    animation: scroll-horizontal 20s linear infinite;
    width: calc(80% ); /* Adjust as needed, e.g., double the width of the container */
}

@keyframes scroll-horizontal {
    0% {
        transform: translateX(100%); /* Start position: all items out of view on the right */
    }
    100% {
        transform: translateX(-100%); /* End position: all items scrolled out of view on the left */
    }
}

.auto-scroll:hover {
    animation-play-state: paused; /* Pauses the animation when hovered */
}