body {
  font-family: 'Karla', serif;
}

a {
  color: black;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  cursor: pointer;
}

.content {
  margin: 9em 50% 1em 5em;
  text-align: justify;
}

.name-wrapper {
  width: 10em;
}

.name {
  background-color: #35373c;
  color: white;
  font-size: 5em;
  margin: 2px;
  display: inline-block;
  padding-right: 1em;
}

#firstname {
  padding-right: .5em;
}

#middlename {
  padding-right: 1.5em;
}

@media only screen
  and (max-width: 767px) {
    .content {
      margin: 5em 2em 1em 2em;
    }

    .name {
      font-size: 3em;
      letter-spacing: -3px;
    }
}