body {
  padding-left: 5em;
  padding-top: 5em;
  max-width: 70%;
}

h1 {
  color: var(--accent-dark);
  font-family: "Cinzel Decorative";
  font-size: 40px;
  font-weight: normal;
  line-height: 1;

  max-width: 600px;

  padding-bottom: 25px;
  margin-bottom: 30px;

  border-bottom: 1px solid var(--accent);
}

h1::first-letter {
  font-size: 60px;
}

p,
ul,
ol {
  color: var(--text);
  font-family: "Crimson", serif;
  font-size: 1.2rem;
  max-width: 1000px;
}

ul {
  list-style: none;
  padding: unset;
  margin: unset;
}

strong {
  font-weight: bolder;
  text-shadow: 0 0.5px;
}

a {
  font-family: "Crimson";
  font-weight: normal;
  text-decoration: none;

  color: var(--url);
}

a::before {
  content: "◆";
  font-size: 0.5em;
  padding-right: 3px;
  position: relative;
  bottom: 4px;
}

a:hover {
  animation: glow 0.2s ease-in-out both;
}

/* animations */

@keyframes glow {
  from {
    font-weight: normal;
  }

  to {
    filter: drop-shadow(0.5px 0.5px 2px);
  }
}

/* small screens */

@media (max-width: 600px) {
  body {
    padding-top: 5%;
    padding-left: 5%;
    padding-right: 5%;
    max-width: unset;
  }
}