#slides {overflow-y: auto !important; height: 20em;}

#slides .slidesjs-container {min-height: 18em !important; height: auto !important; width: 100% !important}
#slides .slidesjs-control {display: block; min-height: 18em !important; height: auto !important;}
#slides .slidesjs {width: 100%}

#slides .slidesjs-container div {display: block; clear: both;}
#slides .slidesjs-container .texto {z-index: 11; bottom: 4em; max-height: 4.6em; overflow: hidden; padding: 0.6em; margin: 0 0.1em; position: relative; background: url(../img/bg-slider.png) repeat; text-align: left; border-top: 2px solid #303427; display: block;}
#slides .slidesjs-container a span.texto  {text-align: right; font-size: 1.2em; color: #fff; line-height: 1.2em;}
#slides .slidesjs-container a span.texto strong {font-weight: normal}
#slides .slidesjs-container a span.texto strong:hover {border-bottom: 1px dotted #d1d1d1}
#slides .slidesjs-container a:hover{text-decoration: underline;}
#slides .slidesjs-container div img {width: 100%; height: 236px; z-index: 10; border: 1px solid #ccc;}
#slides .slidesjs-container .color1 {background: url(../img/bg-slider1.png) repeat;}
#slides .slidesjs-container .color2 {background: url(../img/bg-slider2.png) repeat;}

a.slidesjs-play, a.slidesjs-stop {background-image: url(../img/btns-next-prev.png); background-repeat: no-repeat; display:block; width:12px; height:18px; overflow: hidden; text-indent: -9999px; float: left; margin-left:15px; margin-top: 0.5em !important;}
a.slidesjs-play {width:15px; background-position: -25px 0;}
a:hover.slidesjs-play {background-position: -25px -18px;}
a.slidesjs-stop {width:18px; background-position: -41px 0;}
a:hover.slidesjs-stop {background-position: -41px -18px;}
#slides .slidesjs-navigation {margin-top:-11em;z-index: 12; position: relative;}
#slides .slidesjs-previous {margin-left: 5px;float: left;}
#slides .slidesjs-next {margin-right: 5px;float: right;}

.slidesjs-pagination {margin: 0.5em 39% 0.5em 39%; text-align: center; list-style: none;}
.slidesjs-pagination li {float: left; margin: 0 1px;}
.slidesjs-pagination li a {display: block; width: 16px; height: 0; padding-top: 16px; background-image: url(../img/pagination.png);
background-position: 0 0; float: left; overflow: hidden;}
.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {background-position: 0 -16px}
.slidesjs-pagination li a:hover {background-position: 0 -32px}

#slides a:link,
#slides a:visited {color: #fff}
#slides a:hover,
#slides a:active {color: #fff; text-decoration: none}

.container {margin: 0 auto;}

*+html #slides .slidesjs-container .texto {width: 75%; left: 6em; bottom: 4em;}
html.ie8 #slides .slidesjs-container .texto {width: 75%; left: 6em; bottom: 4em;}

/*-- MEIDA QUERIES --*/

@media (min-width: 950px) {
#slides .slidesjs-container .texto {width: 75%; left: 6em; bottom: 4em;}
}

@media (max-width: 949px) {
#slides {margin-top: 0.3em;}    
#slides .slidesjs-container .texto {background: #820082; max-height: 20em; bottom: 0; margin: 0; overflow: auto;}
#slides .slidesjs-navigation {margin-top:-12em;}
}

@media (min-width: 810px) and (max-width: 979px) {
#slides {height: auto !important;}
#slides .slidesjs-container div img {width: 100%; height: auto !important;}
#slides .slidesjs-control {height: auto !important;}
#slides .slidesjs-container {height: auto !important; width: 100% !important}
#slides .slidesjs-pagination {width: 100%;}
}

@media (min-width: 481px) and (max-width: 809px)  {
#slides {height: auto !important;}
#slides .slidesjs-container{width: 100%; height: 30em !important; min-height: 0 !important;}
#slides .slidesjs-container div img {width: 100%; height: auto !important;}
#slides .slidesjs-control {height: auto !important; }
#slides .slidesjs-container {height: auto !important; }
#slides .slidesjs-pagination {margin: 0 36%; width: 100%;}
#slides .slidesjs-navigation {margin-top:-14em;}
}

@media (max-width: 480px) {
#slides {overflow-y: auto !important; height: auto !important;}
#slides .slidesjs-container{width: 100%; height: auto !important; min-height: 0 !important;}
#slides .slidesjs-container .texto {bottom: 0em; left: 0;}
#slides .slidesjs-container div img {width: 100%; height: auto !important;}
#slides .slidesjs-control {height: auto !important;}
#slides .slidesjs-pagination {margin: 0 28%; width: 100%;}
#slides .slidesjs-navigation {display: none;}
}