css3 slideshow

HTML

<div class="container">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_1.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_2.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_3.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_4.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_5.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_1.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_2.jpg">
	<img src="http://www.alessioatzeni.com/CSS3-Cycle-Image-Slider/images/img_3.jpg">
</div>

CSS

.container {
	position:relative;
}
.container img {
	position:absolute;
    width:500px;
    height:auto
}

@keyframes xfade{
  0%{
    opacity: 1;
  }
  12.5% {
    opacity:1;
  }
  18.5% {
    opacity:0;
  }
  96% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
.container img:nth-child(8) {
  animation: xfade 5s 0s infinite;
}
.container img:nth-child(7) {
  animation: xfade 5s 15s infinite;
}
.container img:nth-child(6) {
  animation: xfade 5s 30s infinite;
}
.container img:nth-child(5) {
  animation: xfade 5s 45s infinite;
}
.container img:nth-child(4) {
  animation: xfade 5s 60s infinite;
}
.container img:nth-child(3) {
  animation: xfade 5s 75s infinite;
}
.container img:nth-child(2) {
  animation: xfade 5s 90s infinite;
}
.container img:nth-child(1) {
  animation: xfade 5s 105s infinite;
}