
	.crossfade > figure:nth-child(1) { background-image: url('1.jpg'); }

	 

	.crossfade > figure:nth-child(2) {

	  animation-delay: 6s;

	  background-image: url('2.jpg');

	}

	 

	.crossfade > figure:nth-child(3) {

	  animation-delay: 12s;

	  background-image: url('3.jpg');

	}

	 

	.crossfade > figure:nth-child(4) {

	  animation-delay: 18s;

	  background-image: url('4.jpg');

	}

	 

	.crossfade > figure:nth-child(5) {

	  animation-delay: 24s;

	  background-image: url('5.jpg');

	}	 

	.crossfade > figure:nth-child(6) {

	  animation-delay: 30s;

	  background-image: url('6.jpg');

	}	 

	.crossfade > figure:nth-child(7) {

	  animation-delay: 36s;

	  background-image: url('7.jpg');

	}	 

	.crossfade > figure:nth-child(8) {

	  animation-delay: 42s;

	  background-image: url('8.jpg');

	}	 

	.crossfade > figure:nth-child(9) {

	  animation-delay: 48s;

	  background-image: url('9.jpg');

	}	 

	.crossfade > figure:nth-child(10) {

	  animation-delay: 54s;

	  background-image: url('10.jpg');

	}	 

	.crossfade > figure:nth-child(11) {

	  animation-delay: 60s;

	  background-image: url('11.jpg');

	}	 

	.crossfade > figure:nth-child(12) {

	  animation-delay: 66s;

	  background-image: url('12.jpg');

	}



.crossfade > figure {
 animation: imageAnimation 30s linear infinite 0s;

	  backface-visibility: hidden;

  background-size: cover;

  background-position: center center;

  color: transparent;

  height: 100%;

  left: 0px;

  opacity: 0;

  position: absolute;

 top: 100%;

 width: 100%;

	  z-index: 0;
margin:0px;
overflow:none;
}


@keyframes

	imageAnimation {  0% {

	 animation-timing-function: ease-in;

	 opacity: 0;

	}

	 8% {

	 animation-timing-function: ease-out;

	 opacity: 1;

	}

	 17% {

	 opacity: 1

	}

	 25% {

	 opacity: 0

	}

	 100% {

	 opacity: 0

	}

	}
	
	
	
	.img-container {
  height: 100vh;
  overflow: hidden;
  position: relative;
  width: 100vw;
}

.img-container img {
  height: 100%;
  left: 0;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}



	.img-container img.next {
  opacity: 1;
  z-index: 1;
}

.img-container img.prev {
  opacity: 1;
  z-index: 2;
}


.img-container img.fade-out {
  opacity: 0;
  transition: visibility 0s .5s, opacity .5s linear;
  visibility: hidden;
}


