/* css for scrollable **************************************************************** */
/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
div.scrollable { /* required settings */ position:relative; overflow:hidden; width: 622px; height:185px; /* custom decorations */ padding:0;  border:
 -moz-border-radius:10px;
}
/* 
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
#thumbs { /* this cannot be too large */ width:20000em; position:absolute; clear:both; /* decoration */ margin-left:15px; left: -1px; top: 4px; }
/* single scrollable item */
#thumbs div { float:left; /* custom decoration */
	text-align:center; width:180px; padding:0px; border:2px solid #333333; margin-right: 20px; -moz-border-radius:10px; font: Arial, Helvetica, sans-serif; height: 175px; background: #FFFFFF; }
#thumbs div.hover { background: #CCCCCC; }
#thumbs div.active { background-color:#FFFFFF; cursor:default; border: 2px solid #FF9900; }
.thumbsimg { border-bottom:1px solid #999999; -moz-border-radius:10px; }
#thumbs h3 { margin:6px 0 0; color:#333333; font: bold 1em/1.2em Tahoma, Verdana, Arial, sans-serif; padding-bottom: 3px; text-align: center; padding-top: 2px; }
#thumbs p,
#thumbs span { font-size: .9em; text-align: center; }
#thumbs h3 em { font-style:normal; color:yellow; }
/* css for navigation ******************************************************************** */
/* this makes it possible to add next button beside scrollable */
div.scrollable { float: left; }
/* prev, next, prevPage and nextPage buttons */
a.prev,
a.next,
a.prevPage,
a.nextPage { display:block; width:42px; height:43px; background:url(/content/PizzaTools/images/scroll/left.png) no-repeat; float:left; margin:73px 5px 0; cursor:pointer; }
/* mouseover state */
a.prev:hover,
a.next:hover,
a.prevPage:hover,
a.nextPage:hover { background-position:0px -44px; }
/* disabled navigational button */
a.disabled { visibility:hidden !important; }
/* next button uses another background image */
a.next,
a.nextPage { clear:right; background: url(/content/PizzaTools/images/scroll/right.png) no-repeat; }
/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi { margin-left:328px; width:200px; height:20px; }
/* items inside navigator */
div.navi a { width:8px; height:8px; float:left; margin:3px; background:url(/content/PizzaTools/images/scroll/navigator.png) no-repeat 0 0; cursor:pointer; }
/* mouseover state */
div.navi a:hover { background-position:0 -8px; }
/* active state (current page state) */
div.navi a.active { background-position:0 -16px; }