/* --- 1. BRAND & TYPOGRAPHY --- */
/* Consolidated all headings for efficiency */
h1, h2, h3 { 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    font-weight: bold; 
    color: #990033; 
}
h1 { font-size: 15pt; }
h2 { font-size: 13pt; }
h3 { font-size: 11pt; }

/* EDIT: Combined all body text tags (p, lists, and the home page DL tags) 
   to ensure everything uses Arial and 10pt font. */
p, ul, ol, li, dl, dt, dd { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 10pt; 
}

/* Link Colors */
a:link { color: #990033; }
a:visited { color: black; }
a:hover { color: #ff6600; }
a:active { color: red; }

/* --- 2. LIST STYLES --- */
/* Custom bullet for standard lists */
ul { list-style-image: url(/images/bullet.gif); }

/* EDIT: Added styles to make the DL/DT/DD Home Page list act like a table */
.article-list dl {
    display: flex;      /* NEW: Puts date and text side-by-side */
    gap: 15px;          /* NEW: Space between date and description */
    margin-bottom: 20px;
}
.article-list dt {
    min-width: 100px;   /* NEW: Aligns all dates in a vertical column */
    font-weight: bold;
}
.article-list dd {
    margin: 0;          /* NEW: Removes the default browser indent */
}

/* --- 3. SITE NAVIGATION --- */
.main-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #FFFDE7;
    padding: 10px 20px;
    min-height: 50px;
}
.nav-links {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}
.nav-links li {
    margin-left: 20px;
    list-style-image: none; /* Removes bullets from the menu */
}
.nav-links li a {
    text-decoration: none;
    font-weight: bold;
    color: #990033;
}

/* --- 4. PAGE LAYOUT (The Columns) --- */
/* EDIT: Removed 'flex-wrap' and mobile instructions to keep columns 
   parallel on all screens. */
.content-wrapper {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    align-items: flex-start;
}
.main-pane {
    flex: 3;
    padding: 20px;
}
.right-col {
    flex: 1;
    padding: 20px;
}

/* --- 5. COMPONENT STYLES --- */
.letter-box {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    margin: 20px 0 20px 40px;
    max-width: 700px;
    padding: 40px;
}
.sidenav_head { 
    background-color: #CCCCCC; 
    margin-bottom: 0px; 
	padding: 2px 5px;
}
.sidenav_bullet {
    list-style-image: url(/images/bullet.gif);
    padding-left: 20px;
}

/* NEW: This forces the quotes and text to sit side-by-side */
.statement-container {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-top: 20px;
}

/* NEW: This allows the text to take up the middle space */
.statement-text {
    flex: 1;
}

.quote-open {
    float: left;
    margin-right: 15px;
    margin-bottom: 10px;
}

.quote-close {
    float: right;
    margin-left: 15px;
    margin-top: -20px; /* Pulls it up slightly to align with the last list item */
}

.highlight {
    font-family: "Times New Roman", Times, serif;
    font-weight: bold;
    font-style: italic;
    color: #990033;
    font-size: 10pt;
    clear: both; /* Added this to ensure it sits below the close-quote */
}