html {
    --color-bg: rgb(13, 17, 23);
    --color-font: rgb(201, 209, 217);
    --color-border: #30363d;
    --color-border-muted: #21262d;
    --color-primary-bg: #fbc101;
    --color-primary-font: #000;

    font-family: 'Lato', sans-serif;
    font-size: 16px;
}

html, body {
    width: 100%;
    height: 100%;
}

body {
    background: var(--color-bg);
    color: var(--color-font);
}

.main-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.login-bar {
    padding: 10px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.login-bar .button {
    margin-left: 10px;
}

iframe {
    flex-grow: 1;
}

.login-data {
    font-weight: bold;
    font-size: 0.825rem;
}

.button {
    display: inline-block;

    background: var(--color-primary-bg);
    color: var(--color-primary-font);

    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;

    padding: 0.5em 1em;
    border-radius: 0.25em;

    cursor: pointer;

    border: 0;
}

.is-hidden {
    display: none;
}