figure img {
  width: 12rem;
  height: 15rem;
}
.projectsarticle {
  padding-top: 5rem;
}
.container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  height: 100vh;
}

.container a {
  text-decoration: none;
  color: #031829;
}
.container a:hover {
  transform: scale(0.8) rotate(-15deg);
  transition: transform 0.5s ease-in-out;
}
figcaption {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-style: normal;
  color: #031829;
}

@media (max-width: 1430px) {
  figure img {
    width: 9rem;
    height: 12rem;
  }
}
@media (max-width: 1200px) {
  .container {
    flex-wrap: wrap;
  }
}
@media (max-width: 767px) {
  figure img {
    width: 7rem;
    height: 10rem;
  }
}
@media (max-width: 546px) {
  .container {
    gap: 1rem;
  }
}
@media (max-width: 506px) {
  .container {
    margin: 4rem 0;
  }
}
@media (max-width: 346px) {
  .projectsarticle {
    padding-bottom: 40rem;
    padding-top: 13rem;
  }
}
@media (max-height: 667px) {
  .projectsarticle {
    padding-top: 5rem;
    padding-bottom: 7rem;
  }
}
@media (max-height: 658px) {
  .projectsarticle {
    padding-top: 5rem;
    padding-bottom: 35rem;
  }
}
@media (max-height: 640px) {
  .projectsarticle {
    padding-top: 5rem;
    padding-bottom: 8rem;
  }
}