@font-face {
    font-family: "Dwarven Axe BB";
    src: url("fonts/dwarvenaxebb.otf");
}

@font-face {
    font-family: "IM Fell English ";
    src: url("fonts/imfellenglish.ttf");
}
:root {
    --color-white: #111111;
    --color-main-light: #8dc63f;
    --color-main-dark: #444444;
    --color-accent-light: #8dc63f;
    --color-accent-dark: #f26522;
}

.body-content h1, .body-content h2, .body-content h3 {
    font-family: "Dwarven Axe BB", "Monsterrat", sans-serif;
    color: color-mix(in srgb, var(--color-main-light), 90% white);
    filter: drop-shadow(0 0 4px #ffffff88);
    margin-left: 0;
    margin-bottom: -1em;
    width: 100%;
    text-align: center;
}

.body-content p {
    font-family: "IM Fell English", "Monsterrat", sans-serif;
    color:  color-mix(in srgb,  var(--color-main-light), 50% white);
    max-width: 798px;
    padding: 1em;
    margin: 2em auto;
}

.body-content p i {
    filter: drop-shadow(0 0 2px #ffffff88);
    color: color-mix(in srgb,  var(--color-main-light), 90% white);
}

.body-content p b {
    filter: drop-shadow(0 0 2px white);
    color: white;
    font-weight: normal;
}

.body-content a {
    color: white;
    color: color-mix(in srgb,  var(--color-main-light), 90% white);
}

.body-content a:hover {
    color: var(--color-accent-light);
    color: color-mix(in srgb,  var(--color-accent-light), 90% white);
}

.body-content a:visited {
    color: var(--color-accent-dark);
    color: color-mix(in srgb,  var(--color-accent-dark), 90% white);
}