.projects {
    padding-bottom: 10rem;
    letter-spacing: 1.2px;
}

.project .name {
    margin-top: 15px;
}

.projects .project {
    overflow: hidden;
    color: white;
    background-color: #7fabd0;
    max-width: 535px;
    min-height: 211px;
    margin: 1rem;
    display: flex;
}

.projects .progress {
    text-align: center;
}
  
.projects .moreInfo {
    margin-top: 1em;
    line-height: 1.3em;
}
  
.projects .project-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
  
.projects .leftImage {
    width: 45%;
    height: 100%;
    float: left;
}
  
.projects .leftImage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    /* max-width: 240px; */
    min-width: 154px;
}
  
.projects .rightDesc {
    position: relative;
    padding: 1em;
    padding-bottom: 80px;
}
  
  /* Text Formatting */
.projects .topName {
    display: flex;
    align-items: baseline;
}
  
@media only screen and (max-width: 500px) {
    .projects .name {
      font-size: 8vw !important;
    }
  
    .projects .engname {
      font-size: 1rem;
    }
    
    .projects .list {
        /* display: none; */
        font-size: 3vw;
    }
}
  
.projects .name {
    font-size: 40px;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
}
  
.projects .engname {
    font-size: 20;
}

  
.projects .list {
    color: #43464b;
    font-size: 20;
    position: absolute;
    bottom: 5px;
}

  
  /* CSS Animations */
  
.projects .project {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
  
.projects .project:hover {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}