/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;

/* Pastel Color Palette:
    Light Purple: #D7BDE2
    Light Blue: #A2D9CE
    Light Pink: #F5B7B1
    White: #FFFFFF
    Accent/Text Color: #4A235A (darker purple)
*/

body {
    background-color: #A2D9CE; /* Light blue background */
    color: #4A235A; /* Darker text for contrast */
    font-family: 'Orbitron', sans-serif; /* Y2K futuristic font */
    margin: 0;
    padding: 0;
    text-align: center;
}

header {
    background-color: #D7BDE2; /* Light purple header */
    padding: 20px 0;
    border-bottom: 3px solid #4A235A;
}

h1 {
    font-size: 2.5rem;
    margin: 0;
    text-shadow: 2px 2px #F5B7B1; /* Pink drop shadow for effect */
}

nav ul {
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
    display: flex;
    justify-content: center;
    gap: 20px;
}

nav ul li a {
    color: #4A235A;
    text-decoration: none;
    font-weight: 700;
    padding: 5px 10px;
    border: 1px solid #4A235A;
    border-radius: 15px; /* Bubbly buttons */
    transition: background-color 0.3s;
}

nav ul li a:hover {
    background-color: #F5B7B1; /* Pink hover effect */
    color: #FFFFFF;
}

main {
    padding: 40px 20px;
}

.container {
    background-color: #FFFFFF; /* White container for content */
    padding: 20px;
    border-radius: 10px;
    max-width: 600px;
    margin: 0 auto;
    box-shadow: 5px 5px 0px 0px #F5B7B1; /* Another pink shadow */
    border: 1px solid #4A235A;
}

h2 {
    color: #D7BDE2;
    text-shadow: 1px 1px #4A235A;
}

p {
    line-height: 1.5;
}

.y2k-graphic {
    margin-top: 20px;
    max-width: 100px; /* Adjust size as needed */
    /* Add some animation or special effect if it's a GIF */
}

footer {
    background-color: #D7BDE2;
    padding: 10px 0;
    margin-top: 40px;
    border-top: 3px solid #4A235A;
}