body{
  padding: 20px;
}

.page-title{
color:rgb(250, 187, 234);
  font-family:'Oswald', sans-serif;
  font-size:8rem;
 line-height:0.9;

  font-weight:400;

  margin-bottom:30px;
}

.projects-list{
  width:100%;
}

.project-row{
  width:40%;

  margin-left:600px;

  display:flex;

  align-items:flex-start;

  gap:50px;

  padding:40px 40px;
}

.project-info{
  width:140px;

  flex-shrink:0;

  display:flex;
  flex-direction:column;

  gap:6px;
}


.project-number{
  font-size:1rem;

  letter-spacing:0.08em;

  opacity:0.7;
}


.project-title{
  font-size:1.1rem;

  font-style:italic;

  letter-spacing:0.1em;

  font-weight:40;

  line-height:1;
}

.project-year{
  font-size:0.8rem;

  letter-spacing:0.08em;

  opacity:0.7;
  
  padding-top: 40px;
  
}

.project-image{
  flex:1;

  display:block;
}
.project-image img{
  width:100%;

  max-width:800px;

  height:auto;

  display:block;

  transition:0.3s ease;
}

.project-image:hover img{
  opacity:0.8;

  transform:scale(1.01);
}

.divider{
  width:100%;

  height:1px;

  background:white;

  opacity:0.4;
}

@media (max-width:1100px){

  .page-title{
     font-size: 5rem;
    font-weight: 400;

    margin-bottom:5px;
  }

  .project-row{
    flex-direction:column;

    align-items:flex-start;

    gap:20px;

     width:90%;

  margin:0 auto;
  }

.project-title{
  font-size:0.9rem;
  font-weight: 20 ;
}
.project-number{
  font-size:0.8rem;
}

.project-year{
  font-size:0.7rem;

  padding-top: 20px;
  
}
  .project-image{
    width:100%;
  }

}