.projects {
  padding: 4rem 0 8rem 0;
}

.projects .project_samples {
  width: 72rem;
  max-width: 100%;
  margin: 3.5rem auto 0 auto;
  padding: 0;
}

.projects .project_samples a {
  width: 22.5rem;
  height: 26rem;
  margin: 0.75rem;
  float: left;
  position: relative;
  overflow: hidden;
  border-radius: 0.35rem;
  opacity: 0;
  -webkit-animation: project_animation 0.5s ease-out;
          animation: project_animation 0.5s ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.projects .project_samples a img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
  -webkit-transition: all 0.275s ease;
  transition: all 0.275s ease;
}

.projects .project_samples a:hover img {
  -webkit-transform: scale(1.15);
          transform: scale(1.15);
}

@-webkit-keyframes project_animation {
  0% {
    -webkit-transform: translate3d(0, 4rem, 0);
            transform: translate3d(0, 4rem, 0);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes project_animation {
  0% {
    -webkit-transform: translate3d(0, 4rem, 0);
            transform: translate3d(0, 4rem, 0);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 1399px) {
  .projects .project_samples a {
    width: 22.25rem;
  }
}

@media (max-width: 1199px) {
  .projects .project_samples {
    width: 100%;
  }
  .projects .project_samples a {
    width: 18.5rem;
    height: 22.5rem;
  }
}

@media (max-width: 991px) {
  .projects .project_samples a {
    width: 21rem;
    height: 24.5rem;
  }
}

@media (max-width: 767px) {
  .projects .project_samples a {
    width: 17.75rem;
    height: 21rem;
  }
}

@media (max-width: 575px) {
  .projects .project_samples a {
    width: calc(50% - 0.85rem);
    height: auto;
    margin: 0.35rem;
    display: inline-block;
    float: none;
  }
}
