@import url(https://fonts.googleapis.com/css?family=Istok+Web);
/*
@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}
*/

@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
35% { left: -100%; }
45% { left: -200%; }
60% { left: -200%; }
70% { left: -300%; }
80% { left: -300%; }
90% { left: -400%; }
99.9% { left: -400%; }
100% { left: -500%; }
}


* {
  box-sizing: border-box;
}
body, figure { 
  margin: 0; background: #101010;
  font-family: Istok Web, sans-serif;
  font-weight: 100;
}
div#captioned-gallery { 
  width: 100%; overflow: hidden; 
}
figure.slider { 
  position: relative; width: 500%;
  font-size: 0; animation: 30s slidy infinite; 
}



figure.slider figure { 
  width: 20%; height: auto;
  display: inline-block;  position: inherit; 
}
figure.slider img { width: 100%; height: auto; }
figure.slider figure figcaption { 
  position: absolute; bottom: 50%;
  /*background: rgba(0,0,0,0.4);
  color: #fff; width: 100%;*/
  color: #F7BA08; 
  width: 100%;
  text-align: center;
  
  font-size: 3rem; padding: .6rem; 
}

/*figure.slider figure figcaption p{background-color: rgb(255,255,255,0.5);}*/
figure.slider figure figcaption p{text-shadow: 2px 2px #000}

@media screen and (max-width: 980px) {
	figure.slider figure figcaption { 
	  position: absolute; bottom: 0;	  
	  color: #fff; width: 100%;*/
	  color: #F7BA08; 
	  width: 100%;
	  text-align: center;
	  
	  font-size: 1rem; padding: .6rem; 
	}
}