﻿/* Modern CSS - Maintains exact visual appearance of original */

:root {
    /* Colors - matching original exactly */
    --color-bg: #fefdf9;
    --color-bg-content: #FFFFFF;
    --color-primary: #000066;
    --color-secondary: #44570f;
    
    /* Typography - matching original */
    --font-family-body: Georgia, "Times New Roman", Times, serif;
    
    /* Layout - matching original 85% width */
    --article-width: 85%;
}

/* Reset */
* {
    box-sizing: border-box;
}

/* Body - matching original */
body {
    background-color: #fefdf9;
    font-family: "Times New Roman", Times, serif;
    margin: 0;
    padding: 0;
}

/* Header - matching original */
header {
    background-color: #fefdf9;
    text-align: left;
}

header img {
    display: block;
}

/* Main container */
main {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Article - replaces table, maintains 85% width and white background */
.article {
    width: 80%;
    background-color: #FFFFFF;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;  /* Add table cell padding for proper gutters */
    box-sizing: border-box;
}

/* h1 and date are outside the article (on body background) - matching original */
h1 {
    color: #000066;
    text-align: center;
}

h2 {
    color: #44570f;
    text-align: center;
    margin: 1em 0;
}

h3 {
    color: #44570f;
    text-align: center;
    margin: 1em 0;
}

/* Date paragraph styling */
body > p {
    text-align: left;
    margin: 10px;
}

/* Article content - matching auto-style4 justify */
/* Tables have default cell padding - matching table cell padding */
.article-content {
    text-align: justify;
    padding: 1px;
}

.article-content p {
    text-align: justify;
    margin: 0 0 1em 0;
}

.article-content p:last-of-type {
    margin-bottom: 0;
}

/* Headings - matching original colors */
main h2, article h2, aside h2 {
    color: #44570f;
    text-align: center;
    margin: 1em 0;
}

main h3, article h3, aside h3 {
    color: #44570f;
    text-align: center;
    margin: 1em 0;
}

.article-content h4 {
    color: #44570f;
    text-align: center;
    margin: 1em 0;
}

/* Quote attribution */
.quote-attribution {
    text-align: center;
    margin: 0 0 1em 0;
    font-style: italic;
}

/* Horizontal rule */
hr {
    border: none;
    border-top: 1px solid #ccc;
    margin: 1em 0;
}

/* Article note - for the address section */
.article-note {
    margin: 1em 0;
}

.article-note p {
    margin: 0 0 0.5em 0;
}

.contact-address {
    font-style: normal;
    margin: 0.5em 0;
    line-height: 1.6;
}

/* Article footer - matching auto-style3 */
.article-footer {
    text-align: center;
}

.article-source {
    font-size: small;
    text-align: center !important;
    margin: 0;
}

/* Site footer - matching auto-style1 */
.site-footer {
    text-align: center;
    margin: 1em 0;
}

.footer-logo {
    text-align: center;
    margin: 0;
}

.footer-logo img {
    display: inline-block;
}

/* Centered image styling */
.center-image {
    text-align: center;
    margin: 1em 0;
}

.center-image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

/* Alternative centered image class for direct image styling */
img.centered {
    display: block;
    margin: 0 auto 1em auto;
    max-width: 100%;
    height: auto;
}

/* Links */
a {
    color: #000080;
    text-decoration: underline;
}

/* Responsive - maintains appearance on smaller screens */
@media (max-width: 768px) {
    .article {
        width: 85%;
    }
}

@media (max-width: 480px) {
    .article {
        width: 90%;
    }
    .article-content {
        text-align: left;
    }
    .article-content p {
        text-align: left;
    }
}

