:root {
    --bg-color: white;
    --text-color: black;
    --link-color: darkgreen;
    --visited-color: green;
}

[data-theme="dark"] {
    --bg-color: black;
    --text-color: hsl(0, 0%, 80%);
    --link-color: green;
    --visited-color: darkgreen;
}

.title {
    color: var(--text-color);
    font-family: Arial, Helvetica, sans-serif;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
}

nav {
    margin-top: 8px;
    margin-bottom: -6px;
    font-size: 100%;
}

h1 {
    color: var(--text-color);
    font-size: 2.0em;
    margin-bottom: 18px;
}

h2 {
    color: var(--text-color);
    font-size: 1.7em;
    margin-top: 8px;
    margin-bottom: -8px;
}

h3 {
    color: var(--text-color);
    font-size: 1.3em;
    margin-top: 4px;
    margin-bottom: -12px;
}

p {
    font-size: 1em;
}

a:link {
    color: var(--link-color);
}

a:visited {
    color: var(--visited-color);
}

a:hover {
    background-color: palegreen;
}

/*
ul {
}
*/

/*
ol {
}
*/

li {
    margin-bottom: 10px;
}