/*

	root element for the scrollable.

	when scrolling occurs this element stays still.

*/

.scrollable {



	/* required settings */

	position:relative;

	overflow:hidden;

	width: 680px;

	height:100px;



	/* custom decorations */

	/*border:1px solid #ccc;*/

}



/*

	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;

	margin:20px 5px 20px 21px;

	background-color:#fff;

	padding:2px;

	border:0px solid #ccc;

	cursor:pointer;

	width:100px;

	height:75px;

	

	-moz-border-radius:4px;

	-webkit-border-radius:4px;

}



/* active item */

.scrollable .active {

	border:2px solid #ccc;

	z-index:9999;

	position:relative;

}