@-webkit-keyframes scroll {
        0% {
            -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
        }
        100% {
            -webkit-transform: translate(-100%, 0);
            transform: translate(-100%, 0);
        }
    }

    @keyframes scroll {
        0% { transform: translate(0, 0); }
        100% { transform: translate(-100%, 0); }
    }

    .marquee {
        max-width: 100%;
        white-space: nowrap;
        overflow: hidden;
    }

    .marquee * {
        display: inline-block;
        padding-left: 100%;
        -webkit-animation: scroll 21s infinite linear;
        animation: scroll 21s infinite linear;
        font-size: 24px;
    }
    .marquee *:hover {
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }