body {
   background: #464c9b;
}
.wrapper { 
  margin: 0 auto;
  width: 160px;
  overflow: hidden;
  margin-top: 20px;
}
@keyframes fade {
  0%{ opacity: 0; }
  10%{ opacity: 1; }
  20%{ opacity: 1; }
  30%{ opacity: 1; }
  40%{ opacity: 0; }
  50%{ opacity: 0; }
  60%{ opacity: 0; }
  70%{ opacity: 0; }
  80%{ opacity: 0; }
  90%{ opacity: 0;} 
  100% { opacity: 0; }
}	

.wrapper img { 
  position:left; 
  margin: 0 auto;
  width: 160px;
  overflow: hidden;
  opacity:0; 
  animation-name: fade; 
  animation-duration: 20s; 
  animation-iteration-count: infinite; 
}
.wrapper img:nth-child(1) { animation-delay: 0s;  }
.wrapper img:nth-child(2) { animation-delay: 5s;  }
.wrapper img:nth-child(3) { animation-delay: 10s;  }
.wrapper img:nth-child(4) { animation-delay: 15s;  }

</body>