/* styles.css */
body {
  font-family: Arial, sans-serif;
}

header,
footer {
  background-color: #f8f9fa;
  padding: 20px;
  text-align: center;
}

main {
  padding: 20px;
}

/* styles.css */
body {
  font-family: Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;
}

h1 {
  font-size: 2em; /* 32px */
}

h2 {
  font-size: 1.75em; /* 28px */
}

h3 {
  font-size: 1.5em; /* 24px */
}

h4 {
  font-size: 1.25em; /* 20px */
}

h5 {
  font-size: 1em; /* 16px */
}

h6 {
  font-size: 0.75em; /* 12px */
}

p {
  font-size: 1em; /* 16px */
  line-height: 1.5;
}

/* Responsive styles */
@media (max-width: 768px) {
  h1 {
    font-size: 1.5em; /* 24px */
  }

  h2 {
    font-size: 1.25em; /* 20px */
  }

  h3 {
    font-size: 1em; /* 16px */
  }

  h4,
  h5,
  h6 {
    font-size: 0.875em; /* 14px */
  }
}