body {
    font-family: 'Roboto', sans-serif;
    color: black;
    margin: auto;
    max-width: 50em;
    padding: 8px;
    margin-bottom: 2em;
}

.content-wrapper {
    display: flex;
    flex-direction: row;
}

@media screen and (max-width: 600px) {
    .content-wrapper {
        flex-wrap: wrap;
    }
    #content {
        flex-basis: 100%;
    }
    #posts {
        padding-left: 0px !important;
    }
    .right-column {
        flex-basis: 100%;
    }
}

#content {
    flex: 1;
}

.right-column {
    margin-top: 1em;
}

.right-list {
    margin-block-start: 0;
    margin-block-end: 0;
    list-style: none;
    padding-inline-start: 0;
}

blockquote {
    padding: 0 1em;
    color: #6a737d;
    border-left: .25em solid #dfe2e5;
}

#page-title h1 a, .post a, .right-column a {
    color: black;
}

.right-column .key {
    font-size: .8em;
}

.right-column .link a {
    text-decoration: underline;
}

a {
    text-decoration: none;
}

#page-title a:hover, .post a:hover {
    text-decoration: underline;
}

.date-time-title {
    display: inline-block;
}

.posts-listing {
    padding-inline-start: 0;
}

.post {
    padding-left: 1em;
}

.blog-post {
}

code {
    font-family: 'Source Code Pro', monospace;
}

pre {
    padding: 8px;
    white-space: pre-wrap;
    word-break: keep-all;
}

p code {
    background-color: #ddd;
    padding-left: 4px;
    padding-right: 4px;
}