﻿@import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap");

/* Parent container for the slider */
.mou .slider {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    overflow: hidden;
    backdrop-filter: blur(7.4px);
    -webkit-backdrop-filter: blur(7.4px);
}

/* Keyframe for scrolling animation */
@keyframes scrolling {
    0% {
        transform: translateX(100%); /* Start from right */
    }

    100% {
        transform: translateX(-100%); /* Move fully to the left */
    }
}

/* The slider-items container */
.mou .slider-items {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    animation: scrolling 20s linear infinite; /* Infinite animation */
    width: calc(200%); /* Ensures smooth loop effect */
}

    /* Images inside slider-items */
    .mou .slider-items img {
        width: 150px; /* Fixed width for images */
        height: 100px;
        margin: 10px;
        flex-shrink: 0; /* Prevent images from shrinking */
    }
