.scrollable { 
/* required settings */
position:relative; overflow:hidden; width:816px; height:124px; left:22px; 
/* custom decorations */

/* border:1px solid #ccc; 
	/*background:url(http://flowplayer.org/tools/img/global/gradient/h300.png) repeat-x;*/
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items { 
/* this cannot be too large */
width:20000em; position:absolute; clear:both; }

/* single scrollable item */
.scrollable img { float:left; border:2px solid #000; background-color:#000; padding:0; cursor:pointer; }
.scrollable img:hover,.scrollable img.active { border:2px solid #FFDE00; }

/* this makes it possible to add next button beside scrollable */
.scrollable { float:left; }

/* prev, next, prevPage and nextPage buttons */
a.browse { background:url(/img/carousel-arrow.gif) no-repeat; display:block; width:10px; height:20px; float:left; margin:40px 10px; cursor:pointer; font-size:1px; }

/* right */
a.right { background-position:0 -20px; clear:right; margin-right:0; position:absolute; right:0; }
a.right:hover { background-position:-10px -20px; }
a.right:active { background-position:-20px -20px; }

/* left */
a.left { margin-left:0; position:absolute; left:0; }
a.left:hover { background-position:-10px 0; }
a.left:active { background-position:-20px 0; }

/* disabled navigational button */
a.disabled { visibility:hidden!important; }