.horiz_scroll_box .scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
	float:left;	

	width: 870px;
	height:160px;
}

.horiz_scroll_box .scrollable .items {
	width:20000em; /* this cannot be too large */
	padding-top:20px;
	position:absolute;
	clear:both;
}

/* the slide determines scroll distance. Each scroll event will move to the beginning of the next item, so it must be set to have the same width as the .items box */
.horiz_scroll_box .items div.slide {
	float:left;
	width:870px;
}


/* active item */
.scrollable .active {
	border:2px solid #000;
	position:relative;
	cursor:default;
}

/* --------------------------------------------------------- controls button  ---------------------------------------------------------------- */

.horiz_scroll_box a.browse {
	background:url(/images/boxes/arrow.png) no-repeat;
	display:block;
	width:17px;
	height:120px;
	float:left;
	margin:20px 7px;
	cursor:pointer;
	font-size:1px;
}
.horiz_scroll_box a.browse:hover {
  filter:alpha(opacity=60);
  opacity:0.6;
}

.horiz_scroll_box a.right  { 
	clear:right; 
	margin-left: 7px; 
	background-position: 0px center;
	} 


.horiz_scroll_box a.left {
	margin-right: 7px;
	background-position: -17px center;
}

.horiz_scroll_box a.disabled {
	visibility:hidden !important;		
} 	

/* --------------------------------------------------------- various box sizes  ---------------------------------------------------------------- */



/* horiz_scroll_box.w_100:  defaults above work for this box size */
.horiz_scroll_box.w_100 {
	width:935px;
	height:160px;
	background: url(/images/boxes/light_blue_grunge_w_100.jpg)  -2px top no-repeat;
	margin:10px 0;
}


/* horiz_scroll_box_w_50: must overwrite defaults above as follows */


.horiz_scroll_box.w_50 {
	width: 450px;
}
.horiz_scroll_box.w_50 .scrollable {
	width: 365px;
}
.horiz_scroll_box.w_50 .slide {
	width: 365px;
}