/* --- Global Reset & Base Styles --- */
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Helvetica Neue', Arial, sans-serif;
background-color: #f7f7f7;
color: #333;
line-height: 1.6;
padding: 20px;
}
/* --- Navigation Bar --- */
/* Assumes the nav is wrapped in an element with class "navbar" */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #004d99;
padding: 10px 20px;
margin-bottom: 20px;
}
.navbar a {
color: #fff;
text-decoration: none;
margin-right: 15px;
font-weight: bold;
transition: color 0.3s ease;
}
.navbar a:hover {
color: #ffd700;
}
/* --- Header & Title --- */
/* Assumes a header element for the main title */
header {
text-align: center;
margin-bottom: 20px;
}
header h1 {
font-size: 2.5em;
margin-bottom: 10px;
color: #004d99;
}
/* --- Main Container --- */
/* A wrapper for the main content area */
.container {
max-width: 1000px;
margin: 0 auto;
background-color: #fff;
padding: 20px;
border-radius: 6px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
/* --- Section Titles --- */
/* Use this class for titles of sections like "Question Reader" or "Question Database" */
.section-title {
font-size: 1.8em;
margin: 20px 0 10px;
padding-bottom: 5px;
border-bottom: 2px solid #004d99;
color: #004d99;
}
/* --- Buttons & Links --- */
/* For interactive elements like Tossups/Bonuses links */
.btn {
display: inline-block;
padding: 10px 20px;
margin: 10px 5px 10px 0;
background-color: #004d99;
color: #fff;
border-radius: 4px;
text-decoration: none;
transition: background-color 0.3s ease;
}
.btn:hover {
background-color: #003366;
}
/* --- Feature of the Day Block --- */
/* Stylize blockquotes or special feature sections */
.feature-of-day {
background-color: #e6f2ff;
border-left: 5px solid #004d99;
padding: 15px;
margin: 20px 0;
font-style: italic;
}
/* --- Footer --- */
footer {
text-align: center;
margin-top: 30px;
font-size: 0.9em;
color: #777;
}
/* --- Responsive Adjustments --- */
@media (max-width: 768px) {
.navbar {
flex-direction: column;
}
.navbar a {
margin: 5px 0;
}
header h1 {
font-size: 2em;
}
}