/*
    root element for the scrollable.
    when scrolling occurs this element stays still.
*/
div.scrollable {

    /* required settings */
    position:relative;
    overflow:hidden;
    width: 440px;
    height:62px;
    float: left;
    margin: 15px 0 10px 0;
}

/*
    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 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;
}

/*
    a single item. must be floated in horizontal scrolling.
    typically, this element is the one that *you* will style
    the most.
*/
div.scrollable div.items div {
    float:left;
    position: relative;
    width: 440px;
    height: 62px;
}
div.scrollable div.items div div {
    float:left;
    margin: 0 0 0 10px;
    position: relative;
    width: 62px;
    height: 62px;
}
div.scrollable div.items div div a {
    width: 62px;
    height: 62px;
    overflow: hidden;
    display: block;
}
div.scrollable div.items div div a img {
    margin: 0 !important;
    border: 1px solid black;
}

/* you may want to setup some decorations to active the item */
div.items div.active {
    border:0px inset #ccc !important;
    background-color:#fff;
}

.next
{
	display: block;
	float: left;
	width: 8px;
	height: 8px;
	margin: 35px 0 0 10px;
	font-size: 14px;
}

.prev
{
	display: block;
	float: left;
	width: 8px;
	height: 8px;
	margin: 35px 10px 0 10px;
	font-size: 14px;
}

a.disabled {
	visibility:hidden !important;
}