@font-face {
    font-family: "BonaNova";
    src: url("../Fonts/BonaNova-Regular.otf");
}

@font-face {
    font-family: "BonaNova";
    src: url("../Fonts/BonaNova-Bold.otf");
    font-weight: bold;
}

@font-face {
    font-family: "BonaNova";
    src: url("../Fonts/BonaNova-Italic.otf");
    font-style: italic;
}


body {
    margin: min(2em, 5%);
    auto;
    max-width: 40em;
    font-size: 18pt;
    line-height: 1.6;
    color: #000000;
    padding: 0 10px;
    font-family: BonaNova, serif;
    font-display: swap;
}

b {
}

i {
}

h1, h2, h3 {
    font-family: "PT Sans Narrow", sans-serif;
    font-size: 72pt;
    font-weight: bold;
    line-height: 1.2;
    margin: 0 0 0 -10px;
    color: #5E0703;
}

h2 {
    font-size: 27pt;
}

h3 {
    font-family: "BonaNova", serif;
    font-size: 24pt;
}

a {
    color: #5E0703;
}

hr {
    display: block;
    height: 0.5px;
    width: 75%;
    border: 0;
    border-top: 1px solid #5E0703;
    margin: 1em 0;
    padding: 0; 
}

img, video {
    width: 560px;
}

figcaption {
    font-size: 12pt;
}

time {
    font-style: italic;
}

ul {
    list-style: "–"; /* en dash */
    margin: 5px 0 0 0;
}

li {
    padding-left: 1em;
}

code {
    font-size: 12pt;
}

pre {
    padding: 1em;
    inline-size: min-content;
}

.tag {
    font-style: italic;
}

.figure-number {
    font-weight: bold;
}

h3.latest-posts {
    margin: 15px 0 0 0;
}

.thumbnail {
    width: 300px;
    height: auto;
}