* {
  padding: 0;
  margin: 0
}



.crossfade > figure {
  animation: imageAnimation 102s linear infinite; 
  backface-visibility: hidden;
  background-size: cover;
  background-repeat: no-repeat;
  /*background-position: 50% -8%;*/
  color: transparent;
  height: 100%;
  left: 280px;
  opacity: 0;
  position: absolute;
  top: 0px;
  width: /*88%*/99%; 
  z-index: 98;
}




/*Media Querie*/
@media screen and (max-width: 923px) {
  .crossfade > figure {
  animation: imageAnimation 102s linear infinite; 
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  left: auto;
  opacity: 0;
  position: absolute;
  width: 50%;
  top: 42px;
  width: 100%;
  background-repeat: no-repeat;
  z-index: 80;
   
}
 }







@media screen and (max-width: 880px) {
    .crossfade > figure {
  animation: imageAnimation 102s linear infinite; 
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  left: auto;
  opacity: 0;
  position: absolute;
  width: 50%;
  top: 42px;
  width: 100%;
  background-repeat: no-repeat;
  z-index: 80;
   
}
 }

@media screen and (max-width: 847px) {
  .crossfade > figure {
  animation: imageAnimation 102s linear infinite; 
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  left: auto;
  opacity: 0;
  position: absolute;
  width: 50%;
  top: 42px;
  width: 100%;
  background-repeat: no-repeat;
  z-index: 80;
   
}
 }






/*nächstes Bild eingeblendet alle 11sec.*/
.crossfade > figure:nth-child(1) {
 background-image: url('../pics/slider_start/BASK_Slider_0_Auf derLauerPauli_K.jpg');
 
}
.crossfade > figure:nth-child(2) {
  animation-delay: 11s;
  background-image: url('../pics/slider_start/BASK_Slider_1_ValLeventina_I.jpg');
}
.crossfade > figure:nth-child(3) {
  animation-delay: 21s;
  background-image: url('../pics/slider_start/BASK_Slider_2_BernViererfeld_K.jpg');
}
.crossfade > figure:nth-child(4) {
  animation-delay: 31s;
  background-image: url('../pics/slider_start/BASK_Slider_3_Diessen_I.jpg');
}
.crossfade > figure:nth-child(5) {
  animation-delay: 41s;
  background-image: url('../pics/slider_start/BASK_Slider_4_Unterwetzikon_K.jpg');
}


.crossfade > figure:nth-child(6) {
  animation-delay: 51s;
  background-image: url('../pics/slider_start/BASK_Slider_5_Diessen_I.jpg');
}

.crossfade > figure:nth-child(7) {
  animation-delay: 61s;
  background-image: url('../pics/slider_start/BASK_Slider_6_BernViererfeld_K.jpg');
}

.crossfade > figure:nth-child(8) {
  animation-delay: 71s;
  background-image: url('../pics/slider_start/BASK_Slider_7_Diessen_I.jpg');
}

.crossfade > figure:nth-child(9) {
  animation-delay: 81s;
  background-image: url('../pics/slider_start/BASK_Slider_8_Sargans_K.jpg');
}

.crossfade > figure:nth-child(10) {
  animation-delay: 91s;
  background-image: url('../pics/slider_start/BASK_Slider_9_AmAmmersee_I.jpg');
}



@keyframes imageAnimation {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
  }
  1% {
    animation-timing-function: ease-out;
    opacity: 1;
  }
  12% {
    opacity: 1
  }
  18% {
    opacity: 0
  }
  24% {
    opacity: 0
  } 
	
  32% {
    opacity: 0
  } 
	
	38% {
    opacity: 0
  } 
	
	40% {
    opacity: 0
  } 
	
	48% {
    opacity: 0
  } 
	
100% {
    opacity: 0
  } 
}