/*single*/
#slidercontainers { 
  position: relative; 
  overflow: hidden;   
}
#slidercontainers { 
  width: 100%;
  height: 350px; 
}
#css3sliders img { 
  width: 20%;
  min-height:350px;
  float: left;
}
#css3sliders { 
  position: absolute; 
  width:500%;  
  -webkit-animation-name:slider;
  -webkit-animation-duration:15s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count:infinite;
  -moz-animation-name:slider;
  -moz-animation-duration:15s;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count:infinite;
  -o-animation-name:slider;
  -o-animation-duration:15s;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count:infinite;
  animation-name:slider;
  animation-duration:15s;
  animation-timing-function: ease-in-out;
  animation-iteration-count:infinite;
}
/*footer*/
#slidercontainerf { 
  position: relative; 
  overflow: hidden;   
}

#slidercontainerf { 
  width: 100%;
  height: 250px; 
}


#css3sliderf img { 
  width: 20%;
  min-height: 250px; 
  float: left;
}

#css3sliderf { 
  position: absolute; 
  width:500%;  
  -webkit-animation-name:slider;
  -webkit-animation-duration:15s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count:infinite;
  -moz-animation-name:slider;
  -moz-animation-duration:15s;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count:infinite;
  -o-animation-name:slider;
  -o-animation-duration:15s;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count:infinite;
  animation-name:slider;
  animation-duration:15s;
  animation-timing-function: ease-in-out;
  animation-iteration-count:infinite;
}
/*slider*/
#slidercontainer { 
  position: relative; 
  overflow: hidden;   
}
#slidercontainer { 
  width: 100%;
  height: 600px; 
}
#css3slider .slider{ 
  width: 20%;
  height: 600px; 
  float: left;
}
#css3slider img { 
  width: 100%;
  min-height: 600px; 
  float: left;
}
#css3slider .blank {
  position: absolute;  
  width: 20%;
  height: 480px; 
  float: left;
}
@media screen and (max-width : 760px){    
  #slidercontainer { 
    width: 100%;
    height: 300px; 
  }
  #css3slider .slider{ 
  width: 20%;
  height: 300px; 
  float: left;
  }
  #css3slider img { 
    width: 100%;
    min-height: 300px; 
    float: left;
  }
  #css3slider .blank {
  position: absolute;  
  width: 20%;
  height: 280px; 
  float: left;
  }
}

#css3slider { 
  position: absolute; 
  width:500%;  
  -webkit-animation-name:slider;
  -webkit-animation-duration:15s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count:infinite;
  -moz-animation-name:slider;
  -moz-animation-duration:15s;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count:infinite;
  -o-animation-name:slider;
  -o-animation-duration:15s;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count:infinite;
  animation-name:slider;
  animation-duration:15s;
  animation-timing-function: ease-in-out;
  animation-iteration-count:infinite;
}

@-webkit-keyframes slider {     
  0% { left: 0; opacity: 1; }     
  2% { opacity: 1; }     
  20% { left: 0; opacity: 1; }     
  21% { opacity: 1; }     
  24% { opacity: 1; }     
  25% { left: -100%; opacity: 1; }       
  45% { left: -100%; opacity: 1; }     
  46% { opacity: 1; }     
  48% { opacity: 1; }     
  50% { left: -200%; opacity: 1; }     
  70% { left: -200%; opacity: 1; }     
  72% { opacity: 1; }     
  74% { opacity: 1; }    
  75% { left: -300%; opacity: 1; }   	
  95% { left: -300%; opacity: 1; }   	
  97%  { left: -300%; opacity: 1;}   	
  100% { left: 0; opacity: 1; }
} 

@-moz-keyframes slider {     
  0% { left: 0; opacity: 1; }     
  2% { opacity: 1; }     
  20% { left: 0; opacity: 1; }     
  21% { opacity: 1; }     
  24% { opacity: 1; }     
  25% { left: -100%; opacity: 1; }       
  45% { left: -100%; opacity: 1; }     
  46% { opacity: 1; }     
  48% { opacity: 1; }     
  50% { left: -200%; opacity: 1; }     
  70% { left: -200%; opacity: 1; }     
  72% { opacity: 1; }     
  74% { opacity: 1; }    
  75% { left: -300%; opacity: 1; }   	
  95% { left: -300%; opacity: 1; }   	
  97%  { left: -300%; opacity: 1;}   	
  100% { left: 0; opacity: 1; }
} 

@-o-keyframes slider {     
  0% { left: 0; opacity: 1; }     
  2% { opacity: 1; }     
  20% { left: 0; opacity: 1; }     
  21% { opacity: 1; }     
  24% { opacity: 1; }     
  25% { left: -100%; opacity: 1; }     
  45% { left: -100%; opacity: 1; }     
  46% { opacity: 1; }     
  48% { opacity: 1; }     
  50% { left: -200%; opacity: 1; }     
  70% { left: -200%; opacity: 1; }     
  72% { opacity: 1; }     
  74% { opacity: 1; }    
  75% { left: -300%; opacity: 1; }   	
  95% { left: -300%; opacity: 1; }   	
  97%  { left: -300%; opacity: 1; }   	
  100% { left: 0; opacity: 1; }
} 

@keyframes slider {     
  0% { left: 0; opacity: 1; }     
  2% { opacity: 1; }     
  20% { left: 0; opacity: 1; }     
  21% { opacity: 1; }     
  24% { opacity: 1; }     
  25% { left: -100%; opacity: 1; }     
  45% { left: -100%; opacity: 1; }     
  46% { opacity: 1; }     
  48% { opacity: 1; }     
  50% { left: -200%; opacity: 1; }     
  70% { left: -200%; opacity: 1; }     
  72% { opacity: 1; }     
  74% { opacity: 1; }    
  75% { left: -300%; opacity: 1; }   	
  95% { left: -300%; opacity: 1; }   	
  97%  { left: -300%; opacity: 1; }   	
  100% { left: 0; opacity: 1; }
}