@font-face {
    font-family: 'Display';
    src: url('../fonts/Display.woff2') format('woff2'),
        url('../fonts/Display.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 24px;
    background-color: #000000;
    color: #FFFFFF;
    font-size: 5vw;
}

.description {
    margin-bottom: 24px;
    font-size: 3vw;
}

.description div {
    border-left: 0.3vw solid #FFFFFF;
    padding-bottom: 20px;
    padding-left: 8px;
    margin-right: 24px;
}

.departures {
    font-family: 'Display', sans-serif;
    color: #FFCC38;
    margin-bottom: 40px;
}

.departures__row {
    margin-bottom: 12px;
}

.description,
.departures__row {
    display: grid;
    grid-template-columns: 15% 70% 15%;
}

.ticker {
    font-family: 'Display', sans-serif;
    width: 100%;
    overflow: hidden;
    color: #FFCC38;
    white-space: nowrap;
    box-sizing: border-box;
    font-size: 1.2em;
    padding: 8px 0;
    margin-top: 24px;
}
.ticker-marquee {
    display: inline-block;
    padding-left: 100%;
    animation: ticker-marquee 60s linear infinite;
}
@keyframes ticker-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

.blink {
    animation: blink 1.5s steps(2, start) infinite;
}
@keyframes blink {
    to {
        visibility: hidden;
    }
}