#scroller-wrapper {margin: 0px; padding: 0px; }
#scroller-pane { width: 363px; /* Mask + Buttons + 2 border... */ }

#scroller-pane .buttons{height: 45px; /* height 135px - padding 50px */ width: 44px; text-align: center; font-weight: bolder;  position: absolute; z-index:5; /* Careful with z-index... could override other layers!? */  /* Fake middle alignment */ background: transparent url("css/img/blank.gif") top left repeat; /* Background is necessary to fool IE that the z-index element is solid and doesn't fire mouseleave! Gotta love IE !!! */ padding-top: 50px; }
span.chevron { width: 32px; height: 33px;   }
#left-button {margin-left: 0px;  }
#right-button { margin-left: 319px; /* Width of pane-button.width */}
div#preloader {width: 363px; padding-top: 10px; text-align: center;  color: #fff; }

div.slider {
	clear: both; 
	width: 363px; /* Buttons + Mask Area */
	height: 16px;
	/*background: #161b1f url('new_slider.tmp/slider-bk.jpg') top left repeat-x;*/
}
div.slider div.knob {
	width: 16px;
	height: 16px;
	cursor: pointer; 
	background: transparent url('img/scroller/scroller-control.gif') top left no-repeat; 
	margin-top: -1px; 
}
div#value {
	height: 50px;
}

div#mask {
	width: 363px;  
	height: 150px; 
	overflow: hidden; 
	

}
div#mask div#contents {width: 10000px; height: 135px; }
div.product {width: 90px; height: 135px; float: left; margin-right: 30px; }
span.loading-message {font-size: 10px; }

/* Tooltip */
/* http://www.mootools.net/docs/more/Interface/Tips for Styling ref... */
.product-tooltip {background-color: #000; padding: 1px; color: #fff; width: 150px;  }
.product-tooltip .tip {border: 1px solid #fff;  padding: 15px; text-align: center;  }
.product-tooltip .tip-title {font-weight: bolder; text-align: center;   }
.product-tooltip .tip-text { text-align: center;  }

#products {padding-left: 15px; }