.project {
  display: flex;
  margin-bottom: 20px;
  padding: 5px 10px;
}

.project-img img {
  display: block;
  margin: auto;
  max-width: 100%;
}

.project-description {
  font-size: 14px;
}

@media screen and (max-width: 480px) {
  .project {
    flex-direction: column;
    border-bottom: 0.5px solid #9c9c9c;
  }

  .project-img {
    margin-bottom: 15px;
  }

  .project-img img {
    width: 100%;
  }
}

@media screen and (min-width: 481px) {
  .project-description {
    width: 65%;
  }

  .project-img {
    display: flex;
    width: 30%;
    margin-right: 30px;
  }
}

.project-name {
  font-family: franklin;
}

.year {
  font-family: ibm;
  font-size: 13px;
}

.other-projects {
  width: fit-content;
  margin: 30px auto 15px;
  padding: 5px 20px 8px;
  background-color: #ebebeb;
  font-family: franklin;
  font-size: 14px;
}

.other-projects a {
  text-decoration: none;
  cursor: pointer;
}