
.project-grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  column-gap: 50px;
  row-gap: 10px;
  padding-top: 150px;
  padding-right:100px;
  padding-left:100px;

}

.project-preview{
  position: relative;
  background-color: white;
  
}

.video-info{

  font-size: 28px;
}

.thumbnail{
  width: 100%;
  opacity:1;
  transition: 0.5s ease;
}

.overlay{
  position: absolute;
  height: 15px;
  bottom:0;
  background: rgba(0, 0, 0, 0.5);
  color:white;
  width:100%;
  transition: 0.5s ease;
  opacity:0;
  font-size: 14px;
  padding:5px;
  text-align:center;
}

.thumbnail:hover{
  opacity:0.7;
}

.project-preview:hover .overlay{
  opacity:1;
}

.bio{
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 50px;
  row-gap: 40px;
  padding-left: 110px;
  padding-right: 110px;

}

.profile-pic{
  width: 100%;
}

.text{
  margin-top: 0px;
  font-size: 24px;
}

.cv-text-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 20px;
  row-gap: 20px;
  font-size: 24px;
}

.years-menu{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  border-style: solid;
  padding-left: 20px;
  padding-right: 20px;
}

.year{
  margin-bottom:0;
  margin-top: 50px;
}

.works-list{
  scroll-behavior:smooth;
}

.works-list-text{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  font-size: 32px;
  column-gap: 20px;
  row-gap: 20px;

}

.superscript{
  font-size:24px;
}


.photo{
  font-size: 12px;
}

.tab{
  margin-left: 120px;
}