:root {
    --mono: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, 'Courier New', monospace;
    --c1: #0074d9;
    --c2: #eee;
    --c3: #fff;
    --c4: #000;
    --c5: #fff;
    --m1: 8px;
    --rc: 8px;
}

html,
body {
    height: 100%;
    max-width: 100%;
    z-index: -1;
    font-family: monospace;
    line-height: 1;
    font-size: 11px;
    background-color: #000;
    color: #FFF;
}

pre {
    color: #FFF;
    background-color: #000;
    font-weight: 400;
    margin: 1em;
    font: 1em/1.6 var(--mono);
    background: var(--c4);
    padding: 1em;
    overflow: auto
}


@media (min-width: 50px) {
    pre {
        font-size: min(max(1rem, 2vw), 2px);
    }
}


@media (min-width: 320px) {
    pre {
        font-size: min(max(1rem, 2vw), 4px);
    }
}

@media (min-width: 576px) {
    pre {
        font-size: min(max(1rem, 2vw), 6px);
    }
}

@media (min-width: 768px) {
    pre {
        font-size: min(max(1rem, 2vw), 8px);
    }
}


@media (min-width: 992px) {
    pre {
        font-size: min(max(1rem, 2vw), 10px);
    }
}

@media (min-width: 1200px) {
    pre {
        font-size: min(max(1rem, 2vw), 12px);
    }
}

a,
a:link,
a:visited,
a:hover,
a:active {
    text-decoration: none;
    color: #FFF;
    font-weight: 400;
}