:root {
    --white-brown:#f0eee9;
    --brown-white:#836953;
    --purple-otha:#a95c68;
    --main-font:'AkkuratMono';
}
body {
    background-color:var(--white-brown);
    color: var(--brown-white);
	background-size:40px;
	background-attachment: fixed;
    background-position:center;
	font-family: var(--main-font);
	font-size: 1em;
	text-align: left;
}
.glue{margin:auto;width:45%;height:90%;}

.title {font-family:'myrtille_pixel';color:var(--purple-otha);font-size:3em;}

.txt{background-color:var(--white-brown)}

.ascii {
    font-family:'jgs5';
    color:var(--brown-white);
    font-size:1em;
}

@media (prefers-color-scheme: dark) {
    :root {
    --white-brown:#836953;
    --brown-white:#f0eee9;
    --purple-otha:#9babc5;}
    body{background-color:var(--white-brown)}
}

html {color-scheme: light;}
@media (prefers-color-scheme: dark) {
    html {color-scheme: dark;}}

/* -------------------------------------------------------- */
/* customisations */
/* -------------------------------------------------------- */
::-webkit-scrollbar {width:5px;height:5px;background-color:var(--white-brown);border:1px solid var(--brown-white);}
::-webkit-scrollbar-thumb {background-color:var(--brown-white);}
a {
    color:var(--brown-white);
    text-decoration: none; text-transform:uppercase;
    border-bottom: 1px dotted var(--brown-white);
}
a:hover {
    text-transform:lowercase;
}
::-moz-selection {
    background:var(--purple-otha);
    color:var(--white-brown);
}
::selection {
    color:var(--white-brown);
    background:var(--purple-otha);
}
@font-face {
    font-family: 'myrtille_pixel';
    src: url(/files/fonts/myrtille-pixel.otf) format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'jgs5';
    src: url(/files/fonts/jgs5.woff) format('woff'), url(/files/fonts/jgs5.woff2) format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'AkkuratMono';
    src: url(/files/fonts/AkkuratMon.woff) format('woff'), url(/files/fonts/AkkuratMono.woff2) format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@media only screen and (max-width: 768px) {
    .glue{
        margin: auto;
        width: 90%;
        height: 90%;}
}