:root {
    /* Background of the whole page */
    --background-fallback: #550079;
    --background-gradient: linear-gradient(180deg, #808080 30%, #740000 100%);
    --pattern: url("./resources/images/xxx.png");
    /* Background of the floating box with words in it */
    --main-box: rgba(254, 243, 243, 0.8);
    /* Used to lighten/darken boxes */
    --overlay-color: rgba(255,255,255,0.3);
    /* Text color */
    --text: black;
    /* Accent color: borders, mostly */
    --accent: #832317;
    /* The width of the box */
    --box-width: 65ch;
}

/* Adjustments for dark theme */
@media only screen and (prefers-color-scheme: dark) {
    :root {
        /* Background of the whole page */
        --background-fallback: #302a2a;
        --background-gradient: linear-gradient(180deg, #470000 65%, #000001 100%);
        --pattern: url("./resources/images/xxx.png");
        /* Background of the floating box with words in it */
        --main-box: rgb(34, 34, 34);
        /* Used to lighten/darken boxes */
        --overlay-color: rgba(0,0,0,0.3);
        /* Text color */
        --text: rgb(255, 255, 255);
    /* Accent color: borders, mostly */
    --accent: #808080;
    /*link */
        a:link {color: #9D716B;}
        a:visited {color: #6B979D}    
}