body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  padding: 2rem;
}
dim {
  opacity: 0.25;
}
h1 {
  font-size: 3rem;
  font-weight: 100;
  margin-bottom: 0.5rem;
}
.subheader {
  font-size: 1.25rem;
  font-weight: 150;
  margin-bottom: 1rem;
}
.username { font-weight: bold; }
.links { margin-top: 2rem; }
.links li {
  display: inline-block;
  margin-right: 0.25rem;
}
.divider { display: inline-block; }
.divider:after {
  content: "|";
  color: #f0f1f2;
  font-weight: 100;
  margin-left: 0.25rem;
}
p { margin-top: 3rem; }
.links a,
.links a:visited,
.links a:active {
  border-bottom: solid 1px #222;
  bottom: 0;
  color: #222;
  position: relative;
  text-decoration: none;
  transition: all 0.5s;
}
.links a i, .links a img { margin-right: 0.25rem; }
.github a:hover i { color: #4183c4; }
.linkedin a:hover i { color: #0077b5; }
.twitter a:hover i { color: #55acee; }
.instagram a:hover i { color: #3f729b; }
.npm a img {
  filter: grayscale(1);
  -webkit-filter: grayscale(1);
  position: relative;
  top: 1px;
  width: 13px;
}
.npm a:hover img {
  filter: grayscale(0);
  -webkit-filter: grayscale(0);
}
.github a:hover { border-bottom: solid 700px #4183c4; }
.linkedin a:hover { border-bottom: solid 700px #0077b5; }
.twitter a:hover { border-bottom: solid 700px #55acee; }
.instagram a:hover { border-bottom: solid 700px #3f729b; }
.npm a:hover { border-bottom: solid 700px #cb3837; }