/*https://arkwright.github.io/scaling-react-server-side-rendering.html for reference*/

body {
    display: flex;
    flex-direction: column;
    background-color: #c4c3c3;
    font-family: 'Courier New', Courier, monospace;
    margin-left: auto;
    margin-right: auto;    
    width: 800px;
}

.body-class {
    /* display: flex; */
    /* flex-direction: column; */
    box-sizing: border-box;
    /* font-size: 90%; */
    /* background-color: #606060; */
    color: #444;
    flex: 1 1 auto;
    /* padding: 2rem; */
    


}

/* * {
    outline: auto;
} */

hr {
    border: 0.5px dashed #797979;
    margin-right: 30%;

}

.hr-full {
    border: 0.5px dashed #797979;

}

.header-class {
    position: sticky;
    max-width: 100%;
    /* background-color: #444; */
    /* padding-left: 16px; */

}

.subheader {
    font-size: 16px;
    font-style: italic;
}

.quote-author {
    text-align: right;
}

nav {
    margin-bottom: 1.5em;
    text-decoration: none;
    
}

main {
    display: block;
    /* outline: 2px solid red; */
    /* justify-content: center;     */
    /* padding: 2em; */
}

.post-preview {
    background-color: #c5c4c4;
    padding: 26px;
    margin-bottom: 3.5rem;
    border: 0px solid rgb(189, 189, 189);
    border-radius: 16px;
    box-shadow: 
        12px 12px 16px 0 rgba(92, 92, 92, 0.55),
        -2px -4px 10px 0 rgba(241, 241, 241, 0.723);
}

.header-class {
    min-height: 16 em;
    max-height: 16 em;
    background-color: #c5c4c4;
    padding: 26px;
    margin-bottom: 3.5rem;
    border: 0px solid rgb(189, 189, 189);
    border-radius: 16px;
    box-shadow: 
        12px 12px 16px 0 rgba(92, 92, 92, 0.55),
        -2px -4px 10px 0 rgba(241, 241, 241, 0.723);
}

.date {
    font-style: italic;
    font-size: 14px;
}

#post-title {
    margin-bottom: 8px;
}