body {
  font-family: "Segoe UI", sans-serif;
  background: #322b58ef;
  color: #f6f3f3;
  line-height: 1.8;
}

.page-title {
  margin: 1vh 2vw 1vh 1vw;
  padding: 2%;
  border-radius: 10px;
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.5);
  background-color: #392f58;
}

h1 {
  text-align: center;
  margin: 1vh 2vw 1vh 1vw;
  padding: 2%;
  border-radius: 10px;
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.5);
  background-color: #4e2d51;
  color: hsl(62, 64%, 92%);
  margin-bottom: 20px;
}

h2 {
  display: inline-block;
  margin: 4vh 1vw 2vh 1vw;
  padding: 0.1% 2% 0.1% 2%;
  border-radius: 10px;
  background-color: #adbe70fa;
  color: hsl(60, 6%, 7%);
}

h3 {
  margin: 0.4vh 1vw 2vh 1vw;
  padding: 0.1% 2% 0.1% 2%;
  border-radius: 10px;
}

.parts ul {
  padding-left: 25px;
}

.parts li {
  padding: 1%;
  margin: 1vh 2vw 1vh 1vw;
  list-style-type: none;
  border-radius: 10px;
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.5);
  background-color: #cbf4be;
}

.parts a {
  text-decoration: none;
  color: #2563eb;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 4px;
}

.parts li:hover {
  background: #2563eb;
}
.parts li:hover a {
  color: #c0f4b0;
}