/* --- General Body and Font Style --- */
body {
  background-color: #C8C8C8; /* Chrome Silver */
  background-image: url('images/stars.gif');
  color: #000000; /* Black for readability */
  /* Using common "digital" system fonts for that retro feel */
  font-family: 'Verdana', 'Geneva', sans-serif;
  margin: 0;
  padding: 20px;
}

/* --- Header Style --- */
header {
  background-color: #007AFF; /* Digital Blue */
  color: #FFFFFF; /* White text */
  text-align: center;
  padding: 10px;
  border: 4px solid #32CD32; /* Lime Flash Green */
  margin-bottom: 20px;
}

h1 {
  font-size: 2.5em;
  text-transform: uppercase;
}

/* --- Main Content Area --- */
main {
  background-color: #C8C8C8;
  padding: 20px;
  border: 4px dotted #FF69B4; /* Bubblegum Pink */
}

/* --- Post List Styling --- */
#post-list {
  list-style-type: none; /* Removes the default bullet points */
  padding: 0;
}

#post-list li {
  margin-bottom: 10px;
}

/* --- Link Styling --- */
a {
  color: #007AFF; /* Digital Blue */
  font-weight: bold;
  text-decoration: none; /* No underlines for a cleaner look */
}

a:hover {
  background-color: #FF69B4; /* Bubblegum Pink on hover */
  color: #FFFFFF;
}

/* Image Styling */
img {
  max-width: 400px; /* Adjust this value as desired */
  height: auto; /* Maintain aspect ratio */
  display: block; /* Helps with centering if needed later */
  margin: 15px 0; /* Adds some space above/below and aligns the image on the left */
  border: 2px solid #32CD32; /* Optional: Add a subtle border */
}

/* --- Header Logo Styling --- */
header h1 {
  display: flex;
  align-items: center;
  justify-content: center;
}

header h1 img {
  height: 200px; /* Adjust the size of the logo */
  width: auto; /* Maintain aspect ratio */
  margin-right: 15px; /* Add space between logo and text */
}

/* Prevent hover background on header logo link */
header h1 a:hover {
  background-color: transparent;
}