body{
  margin-left: 20%;
  margin-top: 4%;
  width: 60%;
  font-family: 'Josefin Sans', sans-serif;
}
#website-header{
  text-align: center;
}
/* Navigation Bar  */
#navbar{
  background-color: black;
  color:white;
  padding-top: 1%;
  padding-bottom: 1%;
  font-size: 20px;
  padding-left: 20%;
  border-radius: 4px;
  margin-bottom: 3%;
}
.nav-link{
  margin-right: 10%;
}
.active{
  color: #6666ff;
}
.nav-link:hover{
  color: #6666ff;
  cursor: pointer;
}
.intro{
  text-align: center;
}
/* Logos  */
.logos{
  margin-top: 4%;
  text-align: center;
}
.logos img{
  height: 54px;
  width: 66px;
}
.logos img:hover{
  transform: scale(1.5,1.5);
}
.logos > a:first-child{
  margin-left: 10%;
}
.logos a{
  margin-right: 10%;
}
/* Resume Styling */
#resume-div{

}
#resume-div .resume-pdf{
  height:700px;
}
/* About Styling */
#about-div{
  font-family: 'Noto Serif SC', serif;
  font-size: 18px;
}
.image-left{
  float: left;
  width:20%;
}

#about-div img{
  height: 90%;
  width: 90%;
  border-radius: 10%;
  vertical-align: top;
  margin-bottom: 2%;
}
/* Projects styling */
.project-card{
  border: 10px solid blue;
  border-image-source: linear-gradient(lightblue, darkblue);
  border-image-slice: 20;
  width: 30%;
  padding: 1%;
  margin: 1%;
  text-align: center;
}
.project-card li{
  text-align: left;
}
.project-card span{
  display: inline-block;

}
.project-card a{
  text-decoration: none !important;
  color: #6666ff;
}
.project-card a:hover{
  text-decoration: none !important;
  color: goldenrod;
}
.flex-grid{
  display: flex;
  justify-content: space-between;
}