body {
    font-size: 18px;
    background: #212121; /* Dark background for retro feel */
    color: #E0E0E0; /* Light gray text for readability */
    margin: auto;
    padding: 20px;
    font-family: "Courier New", monospace; /* Monospace for retro look */
    max-width: 780px;
    align-content: center;
    line-height: 1.5; /* Increase line spacing for readability */
    font-weight: 600; /* Slightly bold text */
}

/* content*/

.responsive-listing, .responsive-listing-sub {
    max-width: 100%;
    background: #3B3B3B; /* Deep gray for content boxes */
    overflow-x: auto;
    text-align: justify;
    padding: 1em;
    border: 0.5px double #FF00FF; /* Neon pink double border for retro touch */
    white-space: pre-wrap;
    border-width: 5px;
}

.responsive-listing-sub {
    margin-bottom: -15px;
    border-top: 1px solid #FF00FF; /* Neon pink border for top */
    border-bottom: 1px solid #FF00FF; /* Neon pink border for bottom */
    background: none; /* Removed background */
    color: #E0E0E0; /* Light text color */
}


/* header */

header {
    font-size: 3em;
    color: #FF00FF; /* Neon pink for header text */
    text-align: center;
    text-shadow: 2px 2px 4px #FF00FF; /* Adding glow effect for the retro vibe */
}


/* date element */

date {
    color: #FFEB3B; /* Neon yellow for date text */
    font-size: 0.9em;
}

/* links */
a {
    color: #39FF14; /* Neon green links */
    background: #212121; /* Dark background for contrast */
    text-decoration: none;
    font-weight: bold; /* Bold links */
}

/* blockquote */

blockquote {
    border-left: 3px dotted #FF00FF; /* Neon pink dotted border */
    padding-left: 1em;
    font-style: italic;
    margin-bottom: -15px;
}

/* underline */
uline {
    text-decoration-line: underline;
}

@media (max-width: 600px) {
    .responsive-listing {
        font-size: 0.8em; /* Slightly larger font for readability */
        padding: 1.2em;
        white-space: pre-line;
    }
}

hr {
    height: 1px;
    margin: 10px 0;
    background: #FF00FF;
    border: none;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #333; /* Dark track for scrollbar */
    border-radius: 0;
}

::-webkit-scrollbar-thumb {
    background: #FF00FF; /* Neon pink scrollbar thumb */
    border-radius: 0;
}

::-webkit-scrollbar-thumb:hover {
    background: #FFEB3B; /* Neon yellow on hover */
}
