html, body {
  height: 100%; 
  margin: 0px;
  font-family: lato;
}

.wrapper {  
  display: flex;
  justify-content: center;
}

.profile-pic {
  width: 50%;
}

.summary {
  text-align: center;
  width: 50%;
}

#headshot {
  border-radius: 15%; 
  display: block;
  margin: auto; 
  max-height: 350px;
}

header {
  background: #757272;
  color: aliceblue;
  display: flex;
  justify-content: flex-end;
  padding: 0 2%;
  position: fixed;
  width: 96%;
}



.nav-buttons {
    background-color: #757272;
    border: none;
    color: aliceblue;
    font-size: 1em; 
    padding: 0 4%;
}

.curr-selection {
    background-color: #5f5c5c;
}

.title {
    margin-right: auto; 
}

.social {
    margin-top: 5%;
}

.social-link {
  background-color: #757272;
  margin: 0 3%;
  padding: 3% 2%;
  color: aliceblue;
  text-decoration: none;
}

.social-link:hover {
  background-color: #5f5c5c;
}

.about-text {
  padding: 10px;
}

main {
  margin: auto; 
  max-width: 800px;
  padding-top: 10%;
}

.canvas {
  background: grey;
  width: 100%;
}

.divider {
  border-top: 3px dashed #bbb;
}