a:active
{
    outline: none;
}

:focus
{
    -moz-outline-style: none;
}

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable
{
    /* required settings */
    position: relative;
    overflow: hidden;
    width: 940px;
    height: 120px; /* custom decorations */
    border: 1px solid #ccc;
    /* background: url(/img/global/gradient/h300.png) repeat-x; */
    margin-left:8px;
}

/*
	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 should be too large - http://bugs.jquery.com/ticket/7193 doesn't allow 10,000 or larger until jQuery 1.5! */
    width: 9999px;
    position: absolute;
    clear: both;
}

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

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

.scrollable img
{
    width: 100px;
    margin: 20px 5px 20px 21px;
}
.scrollable img.hover
{
    background-color: #123;
}