.hover-img-swap {
   display: flex;
  position:relative;
  width: 100%; /* Set container size */
  height: 600px;
   background-image: url('images/week12/I quit.jpg');
  background-repeat: repeat; /* Tiles both ways */
  background-size: 180px;
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}

.hover-img-swap::after {
    content: '';
   display: flex;
  position:absolute;
  top: 0;
  left: 0; 
  width: 100%; /* Set container size */
  height: 600px;
   background-image: url('images/week12/free.jpg');
  background-repeat: repeat; /* Tiles both ways */
  background-size: 100% 100%;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.hover-img-swap:hover::after {
  /* Swap to the second repeating image on hover */
  opacity: 1;
}