﻿/* Examples - Tiny Carousel */
#slider1 { height: 1%; overflow:hidden; padding: 0 0 10px;   }
#slider1 .viewport { float: left; width: 240px; height:250px; overflow: hidden; position: relative; }
#slider1 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative; }
#slider1 .next { background-position: 0 0; margin: 30px 0 0 10px;  }
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; width: 240px; left: 0; top: 0; }
#slider1 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 250px; border: 1px solid #dcdcdc; width: 236px;}

#slider2 { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;   }
#slider2 .viewport { float: left; width: 800px; height: 250px; overflow: hidden; position: relative; }
#slider2 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#slider2 .next { background-position: 0 0; margin: 50px 0 0 10px; }
#slider2 .disable { visibility: hidden; }
#slider2 .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0; }
#slider2 .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 250px;  width: 130px;}


#sliderTable { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;  margin-left:40px; }
#sliderTable .viewport { float:left; width: 760px; height: 200px; overflow: hidden; position: relative; }
#sliderTable .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderTable .next { background-position: 0 0; margin: 50px 0 0 10px; }
#sliderTable .disable { visibility: hidden; }
#sliderTable .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0; }
#sliderTable .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 200px;  width: 130px;}


#sliderMonitor { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;  margin-left:40px; }
#sliderMonitor .viewport { float: left; width: 760px; height: 210px; overflow: hidden; position: relative; }
#sliderMonitor .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderMonitor .next { background-position: 0 0; margin: 50px 0 0 10px;  }
#sliderMonitor .disable { visibility: hidden; }
#sliderMonitor .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0;  margin-top:10px;}
#sliderMonitor .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 250px;  width: 130px;}

/*
#sliderAccessories { height: 1%; overflow:hidden; position: relative; padding: 0 0 50px; background-color:#fff;margin-right:20px;margin-left:15px; border-radius:5px; border:1px solid #CCC;  }
#sliderAccessories .viewport { float: left; width: 760px; height: 170px; overflow: hidden; position: relative; }
#sliderAccessories .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderAccessories .next { background-position: 0 0; margin: 50px 50 0 10px;  }
#sliderAccessories .disable { visibility: hidden; }
#sliderAccessories .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0; }
#sliderAccessories .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 121px;  width: 130px;}
*/
#sliderAccessories { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px; margin-left:40px;  }
#sliderAccessories .viewport { float: left; width: 760px; height: 220px; overflow: hidden; position: relative; }
#sliderAccessories .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderAccessories .next { background-position: 0 0; margin: 30px 0 0 10px;  }
#sliderAccessories .disable { visibility: hidden; }
#sliderAccessories .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0; margin-top:10px;}
#sliderAccessories .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 22px;  width: 130px;}


#sliderRelatedProduct { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;   margin-left:40px; }
#sliderRelatedProduct .viewport { float:left; width: 760px; height: 240px; overflow: hidden; position: relative; }
#sliderRelatedProduct .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderRelatedProduct .next { background-position: 0 0; margin: 50px 0 0 10px;  }
#sliderRelatedProduct .disable { visibility: hidden; }
#sliderRelatedProduct .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0;  margin-top:10px;}
#sliderRelatedProduct .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 240px;  width: 120px;padding-left:10px; padding-right:10px;}


#sliderNewProduct { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;  margin-left:40px; }
#sliderNewProduct .viewport { float: left; width: 760px; height: 250px; overflow: hidden; position: relative; }
#sliderNewProduct .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 50px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative;}
#sliderNewProduct .next { background-position: 0 0; margin: 50px 0 0 10px;  }
#sliderNewProduct .disable { visibility: hidden; }
#sliderNewProduct .overview { list-style: none; position: absolute; width: 140px; left: 0; top: 0;  margin-top:10px;}
#sliderNewProduct .overview li{ float: left; text-align:center;margin: 0 20px 0 0; padding: 1px;height: 250px;  width: 130px;padding-left:10px; padding-right:10px;}

/*#slider2 .buttons:hover { background:url("../images/buttons1.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative; }

#slider2 { height: 1%; overflow:hidden; position: relative; padding: 0 0 10px;   }
#slider2 .viewport { float: left; width: 780px; height: 125px; overflow: hidden; position: relative; }
#slider2 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative; }
#slider2 .next { background-position: 0 0; margin: 30px 0 0 10px; }
#slider2 .disable { visibility: hidden; }
#slider2 .overview { list-style: none; position: absolute; width: 240px; left: 0 top: 0; }
#slider2 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px;}*/





#slider3 { height: 1%; overflow:hidden; padding: 0 0 10px 0; }
#slider3 .viewport { width: 240px; height: 125px; float: left; overflow: hidden; position: relative; }
#slider3 .pager { overflow:hidden; list-style: none; clear: both; margin: 0 0 0 45px; }
#slider3 .pager li { float: left; }
#slider3 .pager a { background-color: #fff; text-decoration: none; text-align: center; padding: 5px; color: #555555; font-size: 14px; font-weight: bold; display: block; }
#slider3 .pager .active { color: #fff; background-color:  #555555; }
#slider3 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px;  position: relative; }
#slider3 .next { background-position: 0 0; margin: 30px 0 0 10px; }
#slider3 .disable { visibility: hidden; }
#slider3 .overview { list-style: none; position: absolute; width: 240px; left: 0 top: 0; }
#slider3 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px;}

#slider4 { height: 1%; overflow:hidden; display: block; padding: 0 0 10px 0; margin: 0 0 0 50px;}
#slider4 .viewport { width: 500px; height: 257px; overflow: hidden; position: relative; }
#slider4 .pager { overflow:hidden; height: 1%; list-style: none; clear: both; margin: 0 0 10px; }
#slider4 .pager li { float: left; }
#slider4 .pagenum { background-color: #fff; text-decoration: none; text-align: center; padding: 5px; color: #555555; font-size: 14px; font-weight: bold; display: block; }
#slider4 .active { color: #fff; background-color:  #555555; }
#slider4 .overview { list-style: none; position: absolute; width: 500px; left: 0 top: 0; }
#slider4 .overview .page{ float: left; padding: 5px; height: 245px; border: 1px solid #dcdcdc; width: 488px;}

#slider5 { height: 1%; overflow:hidden; padding: 0 0 10px; margin: 0 0 0 50px;  }
#slider5 .viewport { width: 240px; height: 125px; overflow: hidden; position: relative; }
#slider5 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 0 0 5px 100px; background-position: 0 -74px; text-indent: -999em; width: 39px; height: 37px; overflow: hidden; position: relative; }
#slider5 .next { background-position: 0 -112px; margin: 5px 0 0 100px;  }
#slider5 .disable { visibility: hidden; }
#slider5 .overview { list-style: none; position: absolute; width: 240px; left: 0 top: 0; }
#slider5 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px;}

#slider6 { height: 1%; overflow:hidden; padding: 0 0 10px; margin: 0 0 0 50px;  }
#slider6 .viewport { float: left; width: 240px; height: 125px; overflow: hidden; position: relative; }
#slider6 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative; }
#slider6 .next { background-position: 0 0; margin: 30px 0 0 10px;  }
#slider6 .disable { visibility: hidden; }
#slider6 .overview { list-style: none; position: absolute; width: 240px; left: 0 top: 0; }
#slider6 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px;}

#slider7 { height: 1%; overflow:hidden; padding: 0 0 10px 0; }
#slider7 .viewport { width: 240px; height: 125px; float: left; overflow: hidden; position: relative; }
#slider7 .buttons { background:url("../images/buttons.png") no-repeat scroll 0 0 transparent; display: block; margin: 30px 10px 0 0; background-position: 0 -38px; text-indent: -999em; float: left; width: 39px; height: 37px; overflow: hidden; position: relative; }
#slider7 .next { background-position: 0 0; margin: 30px 0 0 10px; }
#slider7 .disable { visibility: hidden; }
#slider7 .overview { list-style: none; position: absolute; width: 240px; left: 0 top: 0; }
#slider7 .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px;}