.marquee { overflow: hidden !important; width: 100%; position: relative; } .marquee-track { display: flex; align-items: center; width: max-content !important; max-width: none; gap: 60px; transform: translateX(0); will-change: transform; animation-name: fcs-marquee; animation-timing-function: linear; animation-iteration-count: infinite; animation-duration: var(--marquee-duration, 20s); animation-play-state: paused; opacity: 0; transition: opacity .25s ease; } .marquee-track.marquee-ready { animation-play-state: running; opacity: 1; } .marquee-group { flex: 0 0 auto; width: auto !important; white-space: nowrap; margin: 0 !important; padding: 0 !important; } @keyframes fcs-marquee { from { transform: translateX(0); } to { transform: translateX(calc(-1 * var(--marquee-distance))); } }