/* Hide all images by default */
.mySlides1, .mySlides2 , .mySlides3 , .mySlides4 {
  display: none;
}

/* Add transition effect for the images */
.fade {
  animation-name: fadeEffect;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
}

/* Keyframes for fade animation */
@keyframes fadeEffect {
  from { opacity: 0; }
  to { opacity: 1; }
}