.image-container {
  margin: 1.25vw;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.image-with-hover {
  width: 100%;
  position: relative;
  padding: 1.25vw;
}

.overlay-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: none;
  transition: opacity 0.2s ease;
  padding: 1.25vw;
}

.image-with-hover:hover .overlay-image {
  display: inline;
}

@media all and (max-width: 799px) {
  .image-container {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin: 4vw
  }
  .image-with-hover{
    padding: 4vw;
  }

}
