#sliderContainer { width: 100%; height: 400px; position: relative; margin: 0 auto; }
.slideContent { background:url("/images/contentBg.png") repeat scroll 0 0 transparent; position: absolute; bottom:50%; left:10px; padding: 15px; width: 400px;  }
.slideContent strong { display:block; font-family:'Exo 2', sans-serif; text-transform:uppercase; font-size:22px; padding-bottom:10px; font-weight:normal;}
.slide h3 { font: 700 26px/1em 'Open Sans', sans-serif; color: #FFF; margin: 0 0 10px 0; }
.slide p { font-size: 15px; line-height:25px; color: #FFF; margin: 0; }
#myController {position: absolute; top: 5px; right: 5px; }
.jFlowControl { background:url("/images/bullet.png") no-repeat scroll 0px 0px transparent; float: left; width: 15px; height: 15px;}
.jFlowControl:hover { background-position: -32px 0px; cursor: pointer; }
.jFlowSelected, .jFlowSelected:hover {background-position: -15px 0px; }    .jFlowSlideContainer { overflow: hidden; }
.jFlowSlideContainer a { color: #F90; text-decoration: none; font-style: italic; }
.jFlowSlideContainer a:hover { text-decoration: none; }
.jFlowSlideContainer a:focus { position: relative; top: 1px; }
.jFlowNext { display:none; background:url("/images/arrows.png") no-repeat scroll 0 -35px transparent; height:130px; position:absolute; top:75px; right: -50px; width:50px; cursor:pointer; }
.jFlowPrev { display:none; background:url("/images/arrows.png") no-repeat scroll -84px -35px transparent; height:130px; position:absolute; top:75px; left: -50px; width:50px; cursor:pointer; }
.jFlowPrev:hover { background-position: -84px -235px; }
.jFlowNext:hover { background-position: 0px -235px; }/* controller pagination */

@media screen and (max-width: 800px) { #sliderContainer { height:300px; overflow:hidden; } #mySlides { width:100%; } #mySlides img { margin-left:-250px; margin-top:-50px;} }

@media screen and (max-width: 480px) {
	#sliderContainer { width: 100%; } 
	#mySlides { width:100%; } #mySlides img { margin-left:-450px;} .slideContent { width:90%; }
}