html {
  background: #F9F8FF;
  color: #333533;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  min-height: 100vh;
}

body {
  margin: 0;
  padding-top: 50px;
  padding-left: 50px;
  padding: 50px 20px 20px 50px;
  max-width: 600px;
}

.name {
  margin: 0;
  font-weight: normal;
}

.occupation {
  font-size: 2.7em;
}

.contact {
  color: #333533;
  text-decoration:underline;
}

.contact:hover {
  color: #333;
}

ul.contacts {
  list-style: none;
  padding: 0;
  margin: 50px 0 0;
}

ul.contacts li {
  margin: 0.8em 0;
}

@media (prefers-color-scheme: dark) {
  html {
    color: #F4F4F6;
    background: #5C5562;
  }

  .contact {
    color: #F4F4F6;
  }

  .contact:hover {
    color: #D2D2DA;
  }
}

@media (max-width: 768px) {
  body {
    padding: 50px 30px 20px 30px;
  }
}