/* ========================================== 1. GLOBAL STYLES (Applies to all pages) ========================================== */ /* This applies to the entire body of your pages */ body { background-image: url("DNA bkgd.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center; background-attachment: fixed; background-color: #f9f9f9; /* Default light background if image fails */ color: #333333; /* Default dark gray text */ font-family: 'Trebuchet MS', sans-serif; /*Georgia', serif*/ line-height: 1.6; margin: 0; padding: 20px; } /* Default Headline styles */ h1, h2, h3, h4, h5, h6 { font-family: 'Trebuchet MS', sans-serif; color: #2c3e50; /* Default dark blue headline color */ margin-top: 1em; } /* Default Link styles */ a:link { color: #0066cc; text-decoration: none; } a:hover { color: #ff6600; text-decoration: underline; } a:visited { color: #800080; } /* ========================================== 2. DARK PAGE OVERRIDES (Only triggers when is used) ========================================== */ /* Styles for the dark-themed page body */ body.dark-page { /* The DNA image stays active because we didn't turn it off here */ background-color: #000000; /* Dark background color blend */ color: #cccccc; /* Light gray regular text */ } /* FIX: This makes headlines light and readable ONLY on the dark page */ body.dark-page h1, body.dark-page h2, body.dark-page h3, body.dark-page h4, body.dark-page h5, body.dark-page h6 { color: #ecf0f1; /* Bright light gray/off-white color */ } /* Adjust link colors for better contrast ONLY on dark pages */ body.dark-page a:link { color: #66ccff; } body.dark-page a:hover { color: #ffcc00; } body.dark-page a:visited { color: #9999ff; } /* ========================================== 3. CUSTOM BOXES AND TABLES ========================================== */ .large-text { font-size: 150%; } .content-box { width: 65%; margin: 40px auto; padding: 40px; background-color: #56514D; /* Note: This is a dark gray box */ border: none; /* Fixed: Added missing semicolon */ } .content-table { width: 80%; margin: 0 auto; padding: 20px; border-collapse: collapse; /* Fixed: Removed broken HTML comments that were breaking the code */ } .content-table td { padding: 15px; font-family: 'Georgia', serif; font-size: 1em; color: #333; /* Note: This forces table text to stay dark gray */ } /* Custom size for the main page title */ .giant-title { font-size: 3rem; /* Makes it about 3 times larger than normal text */ font-weight: bold; /* Ensures it stays thick and bold */ letter-spacing: -1px; /* Optional: tightens up the letters for a clean look */ } .light-bg-table { background-color: #e0e0e0; /* Light gray background */ color: #000000; /* Forces text to be pure black */ }