/* === Project 1: External CSS (required rules included) === */

/* Body: background, font color, font family, 10px margin */
body {
  background-color: #f7f7fb;
  color: #222;
  font-family: Arial, Helvetica, sans-serif;
  margin: 10px;              /* required 10px margin */
  line-height: 1.6;
}

/* Center the main page header */
h1 {
  text-align: center;
  margin: 0.2em 0 0;
}

/* Center the site navigation */
nav {
  text-align: center;
  margin: 8px 0 12px;
}

/* Center the footer information */
footer {
  text-align: center;
  margin-top: 24px;
}

/* Optional: nicer nav link spacing/hover (still plain text links) */
nav a {
  text-decoration: none;
  padding: 0 6px;
}
nav a:hover {
  text-decoration: underline;
}

/* Images: responsive and centered without inline styles */
main img {
  display: block;
  margin: 12px auto;
  max-width: 100%;
  height: auto;
}

/* Figure/figcaption styling */
figure {
  margin: 16px auto;
  text-align: center;
}
figcaption {
  font-size: 0.95rem;
  color: #555;
  margin-top: 6px;
}

/* HR spacing/appearance */
hr {
  border: 0;
  height: 1px;
  background: #ddd;
  margin: 16px 0;
}

/* Adjustment: no iframe border (replaces obsolete frameborder attr) */
iframe {
  border: none;
  display: block;
  margin: 12px auto;
  max-width: 100%;
}

/* Optional: keep audio tidy */
audio {
  display: block;
  margin: 8px auto;
  width: 100%;
  max-width: 560px;
}