.scrollable {

	/* required settings */
	float: left;
	position: relative;
	overflow: hidden;
	width: 600px;
	height: 150px;
	height: 200px;

	/* custom decorations */
	border: 1px solid #cccccc;
	background: url('../img/scrollable-gradient.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 {
	background-color: #ffffff;
	padding: 2px;
	margin: 16px 16px 10px 16px;
	border: 1px solid #cccccc;
	width: 160px;
	height: 120px;
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

/* active item */
.scrollable .active {
	border: 1px solid #e0e0e0;
	z-index: 9999;
	position: relative;
}