/* root element for the whole scrollable setup */
#thumbs{
  position:absolute;
  width:6200px;
  clear:both;
  border:0px solid #222;
}
/* custom positioning for navigational links */

#thumbs div{
  float:left;
  width:120px;
  height:145px;
  color:#fff;
  border-left:0px solid white;
  cursor:pointer; cursor:hand;
  margin-left: 2px;
  margin-right: 2px;
}
/* style when mouse is over the item */

#thumbs div.active{
  background-color:transparent;
  cursor:pointer; cursor:hand;
}

#thumbs div.hover{
  background-color:transparent;
}
/* style when element is active (clicked) */

#thumbs h3 em{
  font-style:normal;
  color:#666666;
}
/* this makes it possible to add next button beside scrollable */

#thumbs span{
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:11px;
  color:#666666;
}

a.disabled{
  visibility:hidden !important;
}
/* next button uses another background image */

a.next,a.nextPage{
  background-image:url(../imgs/right.png);
  clear:right;
}
/*********** navigator ***********/
/* position and dimensions of the navigator */

a.prev,a.next{
  margin-top:0px;

}
/* single item */

a.prev,a.prevPage{
  display:block;
  width:25px;
  height:80px;
  background:url(../imgs/left2.png) no-repeat;
  float:left;
  cursor:pointer; cursor:hand;
}

a.next,a.nextPage{
  display:block;
  width:25px;
  height:80px;
  background:url(../imgs/right2.png) no-repeat;
  float:right;
  cursor:pointer; cursor:hand;
}


/* mouseover state */

a.prev:hover,a.next:hover,a.prevPage:hover,a.nextPage:hover{
  cursor:pointer; cursor:hand;
}
/* disabled navigational button */

div.navi{
  width:100px;
  height:20px;
  position: static;
}
/* items inside navigator */

div.navi a{
  width:8px;
  height:8px;
  float:left;
  margin:3px;
  background:url(../imgs/navigator.png) 0 0 no-repeat;
  cursor:pointer; cursor:hand;
}
/* mouseover state */

div.navi a.active{
  background-position:0 -0px;
}

div.navi a:hover{
  background-position:0 -0px;
}
/* active state (current page state) */

div.scrollable{
  float:left;
  margin-left: 12px;
}
/* prev, next, prevPage and nextPage buttons */

div.scrollable{
  position:relative;
  overflow:hidden;
  width:620px;
  height:145px;
}
/*
	root element for scrollable items. It is
	absolutely positioned with large width.
*/
