:root {
    --color: #2c3e50;
    --secondary-color: #54799f;
    --bg-col: white;
    --a-col: blue;
    --a-vis-col: purple;
    --a-hov-bg: transparent;
    --a-hov-col: blue;
    --input-bg: white;
    --input-chosen-bg: lightgreen;
    --input-chosen-col: black;
    --input-nonchosen-bg: darkred;
    --input-nonchosen-col: white;
    --btn-bg: #555555;
    --btn-hov-bg: #444444;
    --btn-col: white;
}

@media (prefers-color-scheme: dark) {
    :root {
	--color: rgba(255, 255, 255, 87%);
	--secondary-color: #9494c9;
	--bg-col: #1f2d33;
	--a-col: #f4a261;
	--a-vis-col: #e76f51;
	--a-hov-bg: #483d8b;
	--a-hov-col: white;
	--input-bg: rgba(255, 255, 255, 87%);
	--input-chosen-bg: lightgreen;
	--input-chosen-col: black;
	--input-nonchosen-bg: #e63947;
	--input-nonchosen-col: white;
	--btn-bg: rgba(255, 255, 255, 87%);
	--btn-hov-bg: rgba(240, 240, 240, 87%);
	--btn-col: rgba(0, 0, 0, 87%);
    }
}


body {
    font-family: Open Sans,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
    margin: 40px auto;
    width: 80rem;
    max-width: 85%;
    color: var(--color);
    background-color: var(--bg-col);
}

#change-language {
    background-color: var(--bg-col);
    border: 0;
    padding: 0 0;
    font-size: 2em;
    text-decoration: none;
}