/* Simple, clean CSS with Courier New monospace font */
body {
    font-family: "Courier New", monospace;
    font-size: 16px; /* Increased for readability with monospace */
    line-height: 1.5; /* Adjusted for better text flow */
    margin: 0;
    padding: 20px;
    background-color: #f4f4f4;
    color: #333;
}

header, main, footer {
    max-width: 800px;
    margin: 0 auto;
    padding: 10px;
}

h1 {
    color: #1a2968;
    font-size: 24px; /* Slightly smaller to balance monospace width */
}

h2 {
    color: #333;
    font-size: 20px; /* Slightly smaller to balance monospace width */
}

h3 {
    color: #333;
    font-size: 16px; /* Slightly smaller to balance monospace width */
}


a {
    color: #333;
    text-decoration: none;
}

a:hover {
    color: #1a2968;
    text-decoration: underline;
}

footer {
    margin-top: 10px;
    font-size: 14px; /* Adjusted for monospace readability */
    text-align: center;
}

.social {
    text-align: center;               /* Center the whole line */
    margin: 1.5rem 0;                  /* Space above/below the line */
}

/* Make each icon the same size as the heading (h1) */
.social img {
    height: 1em !important;   /* forces the height */
    width: auto !important;
    margin: 0 0.5rem;                  /* Small horizontal gap between icons */
    vertical-align: middle;           /* Align nicely with the baseline */
}