/* =============================================================
   PRICE TICKER BAR
   Covers: the scrolling ticker strip at the bottom of the hero.
   Used in: .ticker-container
   ============================================================= */

.ticker-container {
    background-color: #34495e;
    padding: 10px;
    overflow: hidden;
    white-space: nowrap;
}

.ticker {
    display: flex;
    width: max-content;
    animation: tickerMove 20s linear infinite;
}

.ticker-group {
    display: flex;
}

.ticker-item {
    margin-right: 3rem;
    flex-shrink: 0;
}

.lastprice-ticker {
    color: #FFD369;
    font-family: Roboto, sans-serif;
    font-size: 1.2rem;
    font-weight: 500;
}

.current-ticker {
    color: #92C7CF;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 1.2rem;
    font-weight: 500;
}

.title-ticker {
    color: #F3F2EC;
}

.slogan {
    padding: 1.2rem;
    font-weight: bold;
    font-size: 1rem;
    white-space: nowrap;
    color: #ffffff;
}

@keyframes tickerMove {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}