.blog-container {
    margin: 0 auto;
    max-width: 900px;
    padding: 5px 18px;
}

h1 {
    text-align: center;
    padding-bottom: 0px;
    margin: 4px;
}

p {
    white-space: preserve;
}

.blog-container > p {
    text-align: left;
}

.blog-container > p:first-of-type {
    margin: 4px;
    text-align: center;
    font-size: 1.3rem;
    font-style: italic;
    opacity: 0.8;
    padding: 2px 10px;
    font-family: "Avara","Atkinson Hyperlegible", sans-serif;
}

.blog-post-date, .blog-listing-date {
    text-align: center;
    font-size: 18px;
    font-style: italic;
}

.blog-listing-date {
    margin-top: 8px;
}

.blog-entry {
    text-decoration: none;
    background-color: var(--highlight-1);
    display: block;
    padding: 8px;
    border-radius: 8px;
    transition: all 0.05s linear;
}

.blog-entry:hover {
    background-color: var(--highlight-2);
}

.blog-preview > h1 {
    font-size: 28px;
    margin: 2px;
}

.blog-preview > p {
    font-size: 15px;
    margin: 2px;
}