div.scrollable-bg
{
	margin-top: 20px;	
	background: transparent url(../images/scrollable/bg.png) top left no-repeat;
	height: 60px;
}

/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
div.scrollable
{
	/* required settings */
	position:relative;
	overflow:hidden;	 	
	width: 800px;	
	height:500px;	

	/* custom decorations */
	padding: 0;
}

/* 
	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:20000em;	
	position:absolute;
	clear:both;		
	
	/* decoration */
	margin-left:10px;
}

/* single scrollable item */
div.scrollable div.items .item {
	float:left;
	
	/* custom decoration */
	width:190px;
	padding:35px 0px;
	margin-right: 10px;	
}

.scrollable .details {}
.scrollable .crest { float: left; margin-right: 5px; }
.scrollable .item h5
{
	font: normal 11px georgia, arial, sans-serif !important;
	margin: 0 0 0 40px; 
	padding: 3px 0 3px 5px;
	background: #619cd2 url(../images/custom/product-list-blue-bg.jpg) top right no-repeat;
}
.scrollable h5 a { color: #fff; text-decoration: none; }
.scrollable a { text-decoration: none; }

.scrollable .price-box { margin: 0 0 0 40px; padding: 0; }
.scrollable .price-box .label { font-size: 11px; font-weight: normal; background-color: #619cd2; padding: 3px 5px 3px 5px; margin: 0; color: #fff; }
.scrollable .price { display: inline; font-size: 11px; font-weight: normal; background-color: #619cd2; padding: 3px 5px 3px 5px; margin: 0; color: #fff; }

.scrollable .form-button
{
	text-transform: uppercase; 
	color: #ffd448;
	border: 0; 
	font: normal 11px georgia, arial, sans-serif !important; 
	background-color: #619cd2; 
	padding: 3px 3px 3px 3px;
}
.scrollable .form-button span { margin: 0; padding: 0; }

.scrollable p.add-to
{
	font-size: 11px; 
	font-weight: normal; 
	background-color: #619cd2; 
	padding: 3px 5px 3px 5px; 
	margin: 0 25px 0 40px; 
}
.scrollable .add-to a { color: #fff !important; font-weight: normal !important; text-transform: uppercase; text-decoration: none; }
.scrollable p.view-detail
{
	font-size: 11px; 
	font-weight: normal; 
	background-color: #0e2d6d; 
	padding: 3px 5px 3px 5px; 
	margin: 0 55px 0 40px; 
}
.scrollable .view-detail a { color: #fff; text-decoration: none; }

/* active item */
div.scrollable div.items div.active {
}