body {
  background-image: url(homework.webp);
  background-repeat: repeat;
  font-family: "Courier New", Courier, monospace;
  margin: 0;
  padding: 0;
}

article#chapter_box {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
  padding: 40px 20px;
  text-align: center;
}

header {
  text-align: center;
  color: white;
  background-color: #1a1a1a;
  padding: 60px 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

header#chapter01,
header#chapter02,
header#chapter03,
header#chapter04,
header#exam,
header#chapter05,
header#chapter06,
header#chapter07,
#chapter08,
#chapter09,
#chapter10,
#final_exam {
  display: inline-block;
  text-align: center;
  color: white;
  background-color: #1a1a1a;
  border-radius: 12px;
  padding: 20px 30px;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

header#chapter01:hover,
header#chapter02:hover,
header#chapter03:hover,
header#chapter04:hover,
header#exam:hover,
header#chapter05:hover,
header#chapter06:hover,
header#chapter07:hover,
#chapter08:hover,
#chapter09:hover,
#chapter10:hover,
#final_exam:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
}

header#chapter01 { border: 3px solid #ff4444; }
header#chapter02 { border: 3px solid #73ad21; }
header#chapter03 { border: 3px solid #4488ff; }
header#chapter04 { border: 3px solid #37e6d1; }
header#exam { border: 3px solid #f0fa36; }
header#chapter05 { border: 3px solid #c6c0c8; }
header#chapter06 { border: 3px solid #441254; }
header#chapter07 { border: 3px solid #ffa500; }
#chapter08 { border: 3px solid #ff1493; }
#chapter09 { border: 3px solid #00ff7f; }
#chapter10 { border: 3px solid #87cefa; }
#final_exam { border: 3px solid #ff0000; }

table {
  border: 1px solid #444;
  border-collapse: collapse;
  width: 50%;
  color: white;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
  border-radius: 8px;
  overflow: hidden;
}

th,
td {
  padding: 12px 16px;
  border: 1px solid #444;
  text-align: left;
  color: white;
}

tr:nth-child(even) {
  background-color: #4a4a4a;
}

tr:nth-child(odd) {
  background-color: #2a2a2a;
}

th {
  background-color: #1a1a1a;
  font-weight: bold;
}
