/* Default theme */
:root {
    --background-color: #2d2d2d;
    --headings-color: #ffffff;
    --font-color: #ffffff;
    --line-color: #ffffff;
    --link-color: #CC99FF;
}

/* Dark theme */
html[data-theme='dark'] {
    --background-color: #2d2d2d;
    --headings-color: #ffffff;
    --font-color: #ffffff;
    --line-color: #eeeeee;
    --link-color: #CC99FF;
}

body {
    background-color: var(--background-color);
    color: var(--font-color);
}

h1, h2, h3, h4, h5 {
    color: var(--headings-color);
    font-weight: bold;
}

hr {
    background-color: var(--line-color);
}

.overlay {
    border-bottom: 2px solid var(--line-color);
}

li a:hover {
    border-bottom: 3px solid var(--line-color);
    text-decoration: none;
}

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

a:hover {
    color: var(--font-color);
}