/* ----- individual blog post pages (shared by all posts) ----- */

.blog-post{
    margin: 0 auto;
    box-sizing: border-box;
    max-width: calc(65ch + 2em);
    padding: 1em;
    background-color: #4c8a5e;
    color: var(--black-forest-2);
    border: .25em solid #3b6b48;
    border-radius: 1em;
    line-height: 1.4;
}
.coding-dude-img{
    display: flex;
    width: 70%;
}

.blog-post h2,
.blog-post h3{
    width: max-content;
    max-width: 100%;
    margin: 0 0 0.5em;
    padding: 0.5em 8px 0.25em 0;
    border-bottom: 3px solid var(--black-forest);
}

.blog-post .footnote{
    font-size: 0.75em;
    font-style: italic;
}

.blog-post hr{
    border: none;
    border-top: 1px dotted var(--black-forest);
}


.blog-post img{
    display: block;
    max-width: 100%;
}


.blog-post pre{
    overflow-x: auto;
    padding: 0.75em;
    background-color: var(--black-forest-2);
    color: var(--alabaster-grey);
    border-radius: 0.5em;
}