:root {
    --bg-color: #252525;
    --border-color: #493434;
    --link-color: #ffe3a0;
    --heading-color: #ffffff;
    --text-color: #e0e0e0;
    --panel-color: #283131;
    --panel-border: #928585;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);

    /* Centered content */
    max-width: 800px;
    margin: 0 auto;     /* centers the block horizontally */
    padding: 1rem;      /* optional spacing from edges */
    text-align: left;

    /* Font properties */
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 16px;
    line-height: 1.5;
}

img {
    width: 100%;
    height: auto;
    border-radius: 5px 5px 0 0;
    /* box-shadow: 0 2px 8px rgba(20,20,20,2); */
    margin: 0.4em 0;
}

.post-content {
    background-color: var(--bg-color);
    border: 4px solid var(--border-color);
    border-radius: 10px;
    margin: 20px 10px;
    padding: 0px 16px;
}

/* Header styles */
h1 {font-size: 2.00rem; color: var(--heading-color);}
h2 {font-size: 1.50rem; color: var(--heading-color);}
h3 {font-size: 1.25rem; color: var(--heading-color);}
h4 {color: var(--heading-color);}
h5 {color: var(--heading-color); margin: 20px;}
h6 {color: var(--heading-color);}

/* Background for h3 */
h3 {
    background-color: var(--panel-color);
    border: 2px solid #928585;
    border-radius: 3px;
    margin: 0px;
    padding: 5px 10px;      /* Top and bottom */
}

p {}

ol {}
ul {}



/* Links */
a {text-decoration: none; color: var(--link-color);}
a:hover {color: #d0c0a3;}

/* Navigation Bar */
ul.navbar {
    background-color: var(--border-color);
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: left;
    position: sticky;
    top: 0;
}

/* Links in navigation bar */
ul li.n a:hover {background-color: #322A2B;}
ul li.n a {
    display: block;
    color: white;
    padding: 14px 16px;
    text-decoration: none;
}