/*
  Slideshow
*/

#slides {
  position:relative;
  top:0;
  left:0;
  z-index:100;
}
#slides img{
    
    vertical-align: middle;
    max-height: 250px;
    max-width: 300px;
}
/*
  Slides container
  Important:
  Set the width of your slides container
  Set to display none, prevents content flash
*/

.slides_container {
  width:300px;
  overflow:hidden;
  position:relative;
  display:none;
}

/*
  Each slide
  Important:
  Set the width of your slides
  If height not specified height will be set by the slide content
  Set to display block
*/

.slides_container div.slide {
  width:300px;
  height:225px;
  display:block;
}


/*
  Next/prev buttons
*/

#slides .next,#slides .prev {
  position:absolute;
  top:100px;
  left:7px;
  padding: 4px;
  display:block;
  z-index:101;
  opacity: 0.25;
  background-color: #fff;
  border-radius: 50px;
}
#slides .next:hover,#slides .prev:hover {
  
  opacity: 0.9;
}
#slides .next:hover,#slides .prev:hover {
  
  opacity: 0.9;
}

#slides .next {
  left:268px;
}

/*
  Pagination
*/

.pagination {
  margin:10px auto 0;
  width:140px;
}

.pagination li {
  float:left;
  margin:0 1px;
  list-style:none;
}

.pagination li a {
  display:block;
  width:12px;
  height:0;
  padding-top:12px;
  background-image:url(http://www.elfaro.net/templates/elfaro/img/Slider/pagination.png);
  background-position:0 0;
  float:left;
  overflow:hidden;
}

.pagination li.current a {
  background-position:0 -12px;
}

/*
  Caption
*/

.caption_slide {
  z-index:500;
  position:absolute;
  bottom:-35px;
  left:0;
  height:30px;
  padding: 0 10px 7px 10px;
  background:#000;
  background:rgba(0,0,0,.5);
  width:280px;
  font-size:12px;
  line-height:1.33;
  color:#fff;
  text-align: center;
  font-weight: bold;
}