#s3slider { 
	
    width: 305px; /* important to be same as image width */ 
    height: 300px; /* important to be same as image height */
    padding:0px;
    position: relative; /* important */
    overflow: hidden; /* important */
}

#s3sliderContent {
    width: 400px; /* important to be same as image width or wider */
    position: absolute; /* important */
    top: 0; /* important */
    margin-left: 0; /* important */
}

 .s3sliderImage {
    margin:0px;
    float: left; /* important */
    position: relative; /* important */
    display: none; /* important */
}

 .s3sliderImage span {
    position: absolute; /* important */
    left: 0;
    font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 15px 13px;
    font-size:16px;
    text-align:center;
    font-weight:bold;
    width: 305px;
    background-color: #000;
    filter: alpha(opacity=70); /* here you can set the opacity of box with text */
    -moz-opacity: 0.7; /* here you can set the opacity of box with text */
    -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
    opacity: 0.7; /* here you can set the opacity of box with text */
    color: #fff;
    display: none; /* important */
    bottom: 0;

    /*
        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
    */
}





#s3slider2 { 
	
    width: 305px; /* important to be same as image width */ 
    height: 300px; /* important to be same as image height */
    padding:0px;
    position: relative; /* important */
    overflow: hidden; /* important */
}

#s3slider2Content {
    width: 400px; /* important to be same as image width or wider */
    position: absolute; /* important */
    top: 0; /* important */
    margin-left: 0; /* important */
}

 .s3slider2Image {
    margin:0px;
    float: left; /* important */
    position: relative; /* important */
    display: none; /* important */
}

 .s3slider2Image span {
    position: absolute; /* important */
    left: 0;
    font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 15px 13px;
    font-size:16px;
    text-align:center;
    font-weight:bold;
    width: 305px;
    background-color: #000;
    filter: alpha(opacity=70); /* here you can set the opacity of box with text */
    -moz-opacity: 0.7; /* here you can set the opacity of box with text */
    -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
    opacity: 0.7; /* here you can set the opacity of box with text */
    color: #fff;
    display: none; /* important */
    bottom: 0;

    /*
        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
    */
}