.ticker-tape {
    display: flex;
    width: 100%;
    overflow: hidden;
    height: var(--height);
    padding-left: 100%;
}

.ticker-tape .ticker {
    height: var(--height);
    line-height: var(--height);
    white-space: nowrap;
    padding-right: 100%;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-name: ticker;
    -webkit-animation-duration: var(--speed);
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-name: ticker;
    animation-duration: var(--speed);
}

.ticker-tape .ticker__item {
    display: inline-block;
    padding: 0 2rem;
}

@-webkit-keyframes ticker {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

@keyframes ticker {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}