@font-face{
  font-family:DiaType;
  src: url(../fonts/ABCDiatypeVariable.ttf);
}

body{
  -moz-osx-font-smoothing:grayscale;
  -webkit-text-size-adjust:none;
  font-family: "DiaType",monospace;
  font-size: clamp(12px,.7vw,18px); 
  line-height:1.1;
  font-weight:700;
  color:black;
  background-color:white;
  margin:0;
  padding:0;
  overflow:hidden;
}

::selection{color:#a2a2a2;}

a{
  text-decoration:underline;
  color:inherit;
}

header{
  display:flex;
  align-items:left;
  width:100%;
  padding:5px 0 20px 10px;
  margin:0;
  cursor:pointer;
}

header span{
  width:50%;
}

header span:hover{color:#a2a2a2}

.about{
  display:none;
  position:relative;
  padding-bottom:20px;
  margin-left:10px;
  left:50%;
  width:48%;
}

.main-container{
  display: flex;
  width:100%;
}

.container{
  display:none;
  width:33%; 
  padding-left: 10px;
}

.feed{
  height:100vh;
  overflow-y:auto;
  scrollbar-width:none; 
}

.feed p{margin:0;}

.post-container img, .post-container video{
  width:100%;
  height:auto;
}

.description-overlay{
  font-size:smaller;
  position:relative;
  margin-bottom:10px;
}

.content{
  width:100%; 
  height:100vh;
  overflow-y:auto; 
  padding-left:10px;
}

.content img{pointer-events: none;}

.project{
  display:flex;
  justify-content:space-between;
  width:100%;
  padding:0;
  margin:0;
  cursor:pointer;
}

.project span{
  flex:1;
  text-align: left;
}

.project-details{
  display:block; 
  padding:0px;
}

.project-images{
  display:flex;
  overflow-x:auto;
  gap:5px;
  padding-top:5px;
  scroll-behavior:smooth; 
  scrollbar-width:none;
  cursor:grab;
}

.project-images:active{cursor:grabbing;}

.project-images img, video{
  height:80vh;
  width:auto;
  object-fit:cover;
}

.project-text{
  margin:10px 10px 0 50px;
  padding-bottom:17.5%;
}

/* RESPONSIVE */

@media (max-width:1000px){
  body{font-size:11px; text-align:justify;}
  .about{left:0; width:96%;}
  .container{width:96%; padding:10px;}
  .content{padding:10px;}
  .project span{flex:unset;}
  .project-text{width:100%; margin:10px 0;}
  .project-images img, video {height:82vw;}
}