.scrollable
        {
            /* required settings */
            position: relative;
            overflow: hidden;
            width: 685px;
            height: 76px; /* 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: 680px;
        }
        /* single scrollable item */.scrollable img
        {
            float: left;
            margin: 12px 3px 0 3px;
            /*background-color: #fff;*/
            /*padding: 2px;*/
           /* border: 1px solid #ccc;*/
            width: 108px;
            height: 55px;
           /* -moz-border-radius: 4px;
            -webkit-border-radius: 4px;*/
            cursor:pointer;
        }
        
        .scrollable img:hover
        {
            cursor:pointer;
        }
        
        /* active item */.scrollable .active
        {
            border: 2px solid #000;
            position: relative;
            cursor: default;
        }
        /* this makes it possible to add next button beside scrollable */.scrollable
        {
            float: left;
        }
        /* prev, next, prevPage and nextPage buttons */a.browse
        {
            
            display: block;
            width: 12px;
            height: 21px;
            float: left;
            margin: 30px 5px;
            cursor: pointer;
            font-size: 1px;
        }
        /* right */a.right
        {
            /*clear: right;*/
            margin-right: 0px;
            background: url(/objetosmidia/ExibirObjetoMidia?Id=6344) no-repeat center;
        }
        /*a.right:hover
        {
            background-position: -30px -30px;
        }
        a.right:active
        {
            background-position: -60px -30px;
        }*/
        /* left */a.left
        {
            margin-left: 5px;
            background: url(/objetosmidia/ExibirObjetoMidia?Id=6343) no-repeat center;
        }
        /*a.left:hover
        {
            background-position: -30px 0;
        }
        a.left:active
        {
            background-position: -60px 0;
        }*/
        /* up and down */a.up, a.down
        {
            background: url(../img/scrollable/arrow/vert_large.png) no-repeat;
            float: none;
            margin: 10px 50px;
        }
        /* up */a.up:hover
        {
            background-position: -30px 0;
        }
        a.up:active
        {
            background-position: -60px 0;
        }
        /* down */a.down
        {
            background-position: 0 -30px;
        }
        a.down:hover
        {
            background-position: -30px -30px;
        }
        a.down:active
        {
            background-position: -60px -30px;
        }
        /* disabled navigational button */a.disabled
        {
            visibility: hidden !important;
        }