
/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(images/btn_slide.png) no-repeat;
	display:block;
	width:22px;
	height:120px;
	float:left;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right { background-position: -66px 0px; clear:right; margin-right: 0px; margin-left:0px;position:relative;float:left;}
a.right:hover 		{ background-position:-44px 0px; }


/* left */
a.left				{ padding-left: 0px;padding-right:0px; } 
a.left:hover  		{ background-position:-22px 0; }




/* disabled navigational button */
a.disabled {
	/*visibility:hidden !important;		*/
} 	



.infiniteCarousel {
  width: 575px;
  position: relative;
   height:130;
}

.infiniteCarousel .wrapper {
   /* 315.infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  overflow: auto;
  height: 120px;
  margin-top: 0px;
  margin-bottom:0px;
  margin-right:25px;
  margin-left:50px;
 
  top: 0;
}
.wrapper {
  width: 450px; /* 315.infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  position: absolute;
}

.infiniteCarousel ul img {
  border: 2px solid #000;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  width:100px;
  height:80px;
}

.infiniteCarousel .wrapper ul {
  width: auto; /*840px single item * n */
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0;
  padding:0;
  position: absolute;
  top: 0;
}

.infiniteCarousel ul li {
  display:block;
  float:left;
  padding: 5px;
  height:auto;
  width: auto;/*85px;*/
}

.infiniteCarousel ul li img {
    -webkit-transition: border-color 400ms;
}

.infiniteCarousel ul:hover li img {
  border-color: #000;
}

.infiniteCarousel ul:hover li:hover img {
  border-color: #333;
}

.infiniteCarousel ul li a img {
  display:block;
}

.infiniteCarousel .arrow {
  display: block;
  height: 120px;
  width: 22px;
 /* background: url("images/btn_slide.png") no-repeat scroll 0 0;*/
  text-indent: -999px;
  position: absolute;
  
  cursor: pointer;
  outline: 0;
}

.infiniteCarousel .forward {
/*  background-position: -66 0;
  right: 0;*/
  background: url("images/btn_slide_r.png") no-repeat scroll 0 0;
  width:22px;
  height: 120px;
  position:relative;
  float:right;
}

.infiniteCarousel .back {
/*  background-position:  -22px 0;
  left: 0;*/
  background: url("images/btn_slide_l.png") no-repeat scroll 0 0;
    width:22px;
  height: 120px;
}
/*
.infiniteCarousel .forward:hover {
  background-position: 0 -36px;
}

.infiniteCarousel .back:hover {
  background-position: 0 -108px;
}
*/


