#s3slider { 

   width: 960px; /* important to be same as image width */ 

   height: 380px; /* important to be same as image height */

   position: relative; /* important */

   overflow: hidden; /* important */

}



#s3slider a.but, #s3slider a.but:visited

{

	color:#fff;

	padding:4px 4px; 

	/*background-color:#444; filter: alpha(opacity=90); opacity: 0.9;*/ 

	border:solid 2px #363637;

	margin:25px 0px 0px 200px;

	width:80px;

	display:block;

}



a.but:hover

{

	/*background-color:#ff0000;*/

	border:solid 2px #2D84B6 !important;

	

}







#s3sliderContent {

   width: 960px; /* important to be same as image width or wider */

   /*position: absolute;  important */

   /*top: 0;  important */

   margin:0px ;/* important */

   list-style-type:none !important;

   

}

ul#s3sliderContent li{ width:960px;}



.s3sliderImage {

   float: left; /* important */

   position: relative; /* important */

   display: none; /* important */

   llist-style-type:none !important;

}

.s3sliderImage img{
	
	border:1px solid #ddd;
	background:#f0f0f0;
	padding:5px;
	border-bottom:none;
	max-width:945px;
}

.s3sliderImage div {

   /*position: absolute;  important 

   right:0;

   top:0;*/

   font-size: 12px;

   width: 100%;

   height:auto;
   
   float:left;

   padding:10px 7px 10px 7px;

   background-color: #2D84B6;

   /*filter: alpha(opacity=60);  here you can set the opacity of box with text */

   /*opacity: 0.6;  here you can set the opacity of box with text */

   color: white;

   display: none; /* important 

   bottom: 0px;*/



   /*

       if you put

       top: 0; -> the box with text will be shown at the top of the image 

       if you put

       bottom: 0; -> the box with text will be shown at the bottom of the image

   */

}

.s3sliderImage div h1{font-size:20px; color:#fff; line-height:20px; text-align:center;}



.clear {

   clear: both;

}