.clients{
    background-color: white;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.clients-main-container{
    padding: 100px 10px;
    width: 100%;
    max-width: 1124px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    overflow: hidden;
}
.client-logos-container{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.logo-slide{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    justify-content: flex-start;
    animation: slide 25s linear infinite;
}
.client-logo{
    width: 150px;
}

.client-logos-container:hover .logo-slide{
    animation-play-state: paused;
}

.client-logo img{
    width: 100%;
}
.client-logo.big{
    width: 300px;
}

@keyframes slide {
    from {
        transform: translateX(0); 
    }
    to {
        transform: translateX(-100%); 
    }
}