div.scrollerNavi {
	position: absolute;
	height:auto;
	width:20px;
	z-index: 9998;
}
div.scrollerNavi a.active {
	background-position:0 -16px;
}
div.scrollerNavi a {
	background:transparent url('/img/layout/navigator.png') no-repeat scroll 0 0;*/
	cursor:pointer;
	float:left;
	height:8px;
	margin:3px;
	width:8px;
}

/*  
    root element for the scrollable.  
    when scrolling occurs this element stays still.  
*/ 
div.scrollable {
    /* required settings */ 
	position: relative;
	margin-left: -5px;
	margin-right: -35px;
	border: 1px solid #e2e2e2;
	background: #f4f4f4;
	overflow: hidden;
	height: 158px;
}

 
 
span.productContainer {
	position: relative;
	display: block;
	float: left;
	text-align: center;
	background-color: #F9F9F9;
	border: 1px solid #888;
	margin: 2px;
	cursor: pointer;
	height: 136px;
	width: 136px;
	margin: 10px;
	overflow: hidden;
}
span.productContainer img {
	width: 136px;
	height: 136px;
}
span.productContainer p {
	display: block;
	padding:  3px;
	line-height: 14px;
	width: 100%;
	position: absolute;
	bottom: 0px;
	margin-bottom: 0px;
	font-size: 10px;
	text-align: center;
	color: #fff;
	background: transparent url('/img/layout/bg50b.png') repeat;
	border-top: 1px solid #888;
}
/*  
    root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable div.items {     
    /* this cannot be too large */ 
    width: 100%;
    position:absolute; 
    font-size:8px;
} 
 
/*  
    a single item. must be floated on horizontal scrolling 
    typically this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable div.items div {
	position: relative; 
    height:158px;
    margin: 0 auto;
    width: 632px;
} 
 
/* you may want to setup some decorations to active item */ 
div.items div.active {       
    
}