.logo-marquee {
    overflow: hidden;
    width: 100%;
    position: relative;
}

/* The moving strip */
.logo-track {
    display: flex;
    flex-wrap: nowrap;
    width: max-content;
    animation: logoScroll linear infinite;
}

/* Each logo */
.logo-track img {
    flex: 0 0 auto;         /* don’t shrink, don’t wrap */
    height: 100px;
    object-fit: contain;
    opacity: 0.9;
    filter: grayscale(100%);
    margin-right: 10px;     /* spacing between logos */
}
.row1 .logo-track img {
    height:120px;
}
.rfm-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
}
.rfm-overlay::before, .rfm-overlay::after {
    background: linear-gradient(to right, var(--gradient-color), transparent);
    content: "";
    height: 100%;
    position: absolute;
    width: var(--gradient-width);
    z-index: 2;
    pointer-events: none;
    touch-action: none;
}
.rfm-overlay::after {
    right: 0;
    top: 0;
    transform: rotateZ(180deg);
}

/* Keyframes for seamless infinite scroll */
@keyframes logoScroll {
    0% {
        transform: translateX(0);
    }
    100% {
        /* since we are rendering the logo list twice,
           moving by -50% lines up the 2nd copy exactly 
           where the 1st started, so restart is invisible */
        transform: translateX(-50%);
    }
}