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

        /* required settings
        position:relative;
        overflow:hidden;
        width: 50%;
        height:100%;
        background-color: green;

        /* custom decorations */
       /* border:1px solid #ccc;*/
       /* background:url(/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;
        }

.items div 
        {
        float:left;
        width:80%;
        }

/* single scrollable item
.scrollable img {
        float:left;
        margin:20px 5px 20px 21px;
        background-color:#fff;
        padding:2px;
        border:10px solid #ccc;
        width:100px;
        height:75px;
        
        -moz-border-radius:4px;
        -webkit-border-radius:4px;
}     */

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