*{padding:0;margin:0;list-style:none;outline:none;}
body {
	
	color: #2c3e50;
	font-family:'Lato', sans-serif;
}


#wrapper {
    
     	width: 100%;
	max-width:878px; 
	margin: 0 auto;
    z-index:0;
    position: relative;
	}

ul#slideshow{
	
	list-style:none;
    width:100%;
    max-width:878px;
    height: 394px;
 
    overflow:hidden;
	position: relative;
	
}

ul#slideshow li {
    position: absolute;
    top: 0;
    left: 0;
    z-index:-1;
    border: 1em solid #1b1b1b;
    border-radius: 2px;
   
    
}

ul#slideshow li.previous {
    z-index: 1;
}

ul#slideshow li.current {
    z-index: 2;
}

ul#slideshow li img {
    display: block;
    width: 100%;
    height: auto;
}

/* preloader  */

#preloader  {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background-color: #fcfcfc;
     z-index: 99;
    height: 100%;
    width: 100%;
 }
#preloader h3 {
    text-align: center; 
    margin-top: 4em;
    font-style: italic;
    color: #2c3e50;
}
#status  {
     width: 60%;
     height: 60%;
     
     background-image: url(../ajax-loader.gif);
     background-repeat: no-repeat;
     background-position: center;
     margin: auto;
 }

 #statusSmall {
 	width: 30%;
 	height: 30%;
     position: absolute;
     background-image: url(../ajax-loader-spin.gif);
     background-repeat: no-repeat;
     background-position: center;
     margin: auto;
     z-index:5;
     
 }

 ul#slideshow {position: relative;}

ul#slideshow li .datetime {
    position: absolute;
    bottom: -1.4em;
    border-radius: 4px;
    background: #1c1c1c;
    font-size: 1.5em;
    border-top: 1px solid #333;
    height: 1.1em;
    padding: .1em 0;
    display: block;
    width: 90%;
    margin: 0 auto;
    text-align: center;
    
    color: #fcfcfc;
    left: 5%;
    font-family: monospace;
    }

span.date { 
    
    display: inline-block;
    margin-right: 1em
    
   
}

span.hour {
	    display: inline-block;
            margin-left: 1em


}