*{margin:0;padding:0;box-sizing:border-box}body{transition:background 1s ease-in-out}.section{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:#fff;font-family:sans-serif;font-size:72px;font-weight:600;text-transform:uppercase;&[data-bg="yellow"]{color:#333}}@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-100%)}}.logos{overflow:hidden;padding:20px 0;background:transparent;white-space:nowrap;position:relative}.logos:hover .logos-slide{animation-play-state:paused}.logos-slide{display:inline-block;animation:15s slide infinite linear}.logos-slide img{height:80px;margin:0 50px}.char{transform:translateY(175px);transition:transform .8s}