@font-face {
    font-family: "defaultFont";
    src:url("fonts/Menlo.ttf");
}

body {
    background-color: white;
}

:root {
    --variable-name-color: #0C70A4;
    --braces-color: black;
    --var-highlight-color: #A23797;
    --let-highlight-color: #A23797;
    --separator-color: #d1d1d1;
    --string-highlight-color: #CA2B20;
    --comments-highlight-color: #2A791C;
    --function-highlight-color: #7446AB;
    --enum-name-color: #411FA2;
    --enum-value-color: #7446AB;
    --type-color: #c7caeb;
    --page-heading-color: #3d3d3d;
    --text-color: #000000;
}


@media (prefers-color-scheme: dark) {
    body {
        background-color: #1D1E1F;
    }
    
    :root {
        --variable-name-color: white;
        --separator-color: #ffffffea;
        --braces-color: white;
        --var-highlight-color: #ed5494;
        --let-highlight-color: #ed5494;
        --string-highlight-color: #ff544a;
        --comments-highlight-color: #9afc95;
        --function-highlight-color: #01b6af;
        --enum-name-color: #ffd064;
        --enum-value-color: #c7caeb;
        --type-color: #c7caeb;
        --page-heading-color: #f0f0f0;
        --text-color: #fff;
    }
    
}


pre {
    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

#mainDiv {
    position:absolute;
    color:#fff;
    top:50%;
    left:50%;
    padding:15px;
    -ms-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.var-highlight {
    color: var(--var-highlight-color);
}

.let-highlight {
    color: var(--let-highlight-color);
}

.string-highlight {
    color: var(--string-highlight-color);
}

.comments-highlight {
    color: var(--comments-highlight-color);
}

.function-highlight {
    color: var(--function-highlight-color);
}

.braces {
    color: var(--braces-color);
}

.variable-name {
    color: var(--variable-name-color);
}

.enum-name {
    color: var(--enum-name-color);
}

.enum-value {
    color: var(--enum-value-color);
}

.pageHeading {
    color: var(--page-heading-color)
}

.pageText {
    color: var(--text-color)
}

.separator {
    background-color: var(--separator-color);
}

/* a {
 text-decoration: none;
 } */

a:hover {
    text-decoration: none;
    border-bottom: 1px solid white;
}

#typewriter {
    font-size: 2em;
    margin: 0;
    font-family: defaultFont;
    color: var(--type-color);
}

#typewriter:after {
    content: "|";
    -webkit-animation: blink 500ms linear infinite alternate;
    animation: blink 500ms linear infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes blink {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}