#slider {
 
    /* You MUST specify the width and height */
    width:500px;
    height:300px;
    position:relative; 
    overflow:hidden;
}
 
#mask-gallery {
     
    overflow:hidden;   
}
 
#gallery {
     
    /* Clear the list style */
    list-style:none;
    margin:0;
    padding:0;
     
    z-index:0;
     
    /* width = total items multiply with #mask gallery width */
    width:900px;
    overflow:hidden;
}
 
    #gallery li {
 
         
        /* float left, so that the items are arrangged horizontally */
        float:left;
    }
 
 
#mask-excerpt {
     
    /* Set the position */
    position:absolute; 
    top:0;
    left:0;
    z-index:500px;
     
    /* width should be lesser than #slider width */
    width:100px;
    overflow:hidden;   
     
}
     
#excerpt {
    /* Opacity setting for different browsers */
    filter:alpha(opacity=60);
    -moz-opacity:0.6; 
    -khtml-opacity: 0.6;
    opacity: 0.6; 
     
    /* Clear the list style */
    list-style:none;
    margin:0;
    padding:0;
     
    /* Set the position */
    z-index:10;
    position:absolute;
    top:0;
    left:0;
     
    /* Set the style */
    width:100px;
    background-color:#000;
    overflow:hidden;
    font-family:arial;
    font-size:10px;
    color:#fff;
}
 
    #excerpt li {
        padding:5px;
    }
     
 
 
.clear {
    clear:both;
}