/* inter-300 - latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    src: local(''),
    url('fonts/inter-v12-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('fonts/inter-v12-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* inter-regular - latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('fonts/inter-v12-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('fonts/inter-v12-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* inter-500 - latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    src: local(''),
    url('fonts/inter-v12-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('fonts/inter-v12-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* inter-700 - latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    src: local(''),
    url('fonts/inter-v12-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('fonts/inter-v12-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

* {
    margin: 0;
}

html {
    height: 100vh;
}

body {
    background: black;

    color: white;
    line-height: 1.1;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

/*Container*/
.flex {
    display: flex;
}

.flex-between {
    justify-content: space-between;
}

.flex-column {
    flex-direction: column;
}

.fixed {
    position: fixed;
}

.small-gap {
    gap: 2rem;
}

.big-gap {
    gap: 4rem;
}

.spacing-padding {
    padding: 4rem;
}

.full-height {
    box-sizing: border-box;
    height: 100%;
}

/*Fonts sizes and weights*/
.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

.light {
    font-weight: 300;
}

.medium {
    font-weight: 500;
}

.bold {
    font-weight: 600;
}

.f-16 {
    font-size: 16pt;
}

.f-24 {
    font-size: 24pt;
}

.f-32 {
    font-size: 32pt;
}

.f-36 {
    font-size: 36pt;
}

.f-48 {
    font-size: 48pt;
}

.f-96 {
    font-size: 96pt;
}

.line-1 {
    line-height: 1;
}

.on-time {
    color: #00ff00;
}

.delayed {
    color: #ff0000;
}

/*Clock*/
#clock-container {
    border-left: solid white 5px;
    padding: 1rem 0 1rem 1rem;
}

@keyframes clock-blink {
    to {
        visibility: hidden;
    }
}

#clock-time-separator {
    animation: 2s steps(2, jump-start) 0s infinite clock-blink;
}

/*Image*/
.flip {
    transform: scaleX(-1);
}

/*Bus*/
#schedule-container {
    background: black;
}

table {
    width: 100%;
    max-width: 1200px;
    border: none;
    border-collapse: separate;
    border-spacing: 0.75rem 1.25rem;
}

.line-number {
    border-radius: 30px;
    padding: 2px;
}

#slideshowIMG {
    /*Always rendered below everything else*/
    position: relative;
    z-index: -1;

    flex-grow: 1;
    width: 100%;

    background-repeat: no-repeat;
    background-size: contain;
    background-position-y: bottom;
}