@charset "utf-8";
/* CSS Document */

/* 1st thumbnail scroller - horizontal fixed size */
#ts_container{position:relative; margin:200px 350px; width:600px; background:#444; border:1px solid #999;}
#ts_container .thumbScroller{position:relative; overflow:hidden;}
#ts_container .thumbScroller, #ts_container .thumbScroller .container, #ts_container .thumbScroller .content{height:168px;}
#ts_container .customScrollBox .horWrapper{position:relative; left:0;}
#ts_container .thumbScroller .container{position:relative; left:0; display:inline-block; *display:inline;}
#ts_container .thumbScroller .content{float:left;}
#ts_container .thumbScroller .content div{padding:5px 5px; height:100%;}
#ts_container .thumbScroller img{border:5px solid #fff;}
#ts_container .thumbScroller .content div a{display:block; -moz-box-shadow:0 0 5px #000; -webkit-box-shadow:0 0 5px #000; box-shadow:0 0 5px #000;}
#ts_container .thumbScroller .content div a:hover{-moz-box-shadow:0 0 15px #000; -webkit-box-shadow:0 0 15px #000; box-shadow:0 0 15px #000;}

/* 2nd thumbnail scroller - vertical fixed size */
#ts2_container{position:absolute; top:200px; left:60px; width:240px; padding:0 5px; height:600px; border-top:1px solid #999; border-bottom:1px solid #999;}
#ts2_container .thumbScroller{position:relative; overflow:hidden; height:100%;}
#ts2_container .thumbScroller .container{position:relative; top:0;}
#ts2_container .thumbScroller .content{clear:both;}
#ts2_container .thumbScroller .content div{padding:10px; height:100%;}
#ts2_container .thumbScroller img{border:none;}
#ts2_container .thumbScroller .content div a{display:block;}
#ts2_container .thumbScroller .content div a:hover{-moz-box-shadow:0 0 15px #333; -webkit-box-shadow:0 0 15px #333; box-shadow:0 0 15px #333;}

/* 3rd thumbnail scroller - horizontal liquid size 100% */
#ts3_container{position:absolute; left:0; top:10px; width:100%; border-top:1px solid #000; border-bottom:1px solid #999; -moz-box-shadow:inset 1px 1px 20px black; -webkit-box-shadow:inset 1px 1px 20px black; box-shadow:inset 1px 1px 20px black;}
#ts3_container .thumbScroller{position:relative; width:100%; overflow:hidden;}
#ts3_container .thumbScroller, #ts3_container .thumbScroller .container, #ts3_container .thumbScroller .content{height:168px;}
#ts3_container .customScrollBox .horWrapper{position:relative; left:0;}
#ts3_container .thumbScroller .container{position:relative; left:0; display:inline-block; *display:inline;}
#ts3_container .thumbScroller .content{float:left;}
#ts3_container .thumbScroller .content div{padding:10px 15px; height:100%;}
#ts3_container .thumbScroller img{border:5px solid #fff;}
#ts3_container .thumbScroller .content div a{display:block; -moz-box-shadow:0 0 5px #000; -webkit-box-shadow:0 0 5px #000; box-shadow:0 0 5px #000;}
#ts3_container .thumbScroller .content div a:hover{-moz-box-shadow:0 0 15px #000; -webkit-box-shadow:0 0 15px #000; box-shadow:0 0 15px #000;}

/* 4th thumbnail scroller - vertical liquid size 80% */
#ts4_container{position:absolute; top:200px; right:30px; width:240px; height:60%; border:1px solid #666; background:#000; -moz-box-shadow:0 0 15px #000; -webkit-box-shadow:0 0 15px #000; box-shadow:0 0 15px #000;}
#ts4_container .thumbScroller{position:relative; overflow:hidden; height:100%;}
#ts4_container .thumbScroller .container{position:relative; top:0;}
#ts4_container .thumbScroller .content{clear:both;}
#ts4_container .thumbScroller .content div{padding:10px 5px; height:100%;}
#ts4_container .thumbScroller img{border:5px solid #fff;}
#ts4_container .thumbScroller .content div a{display:block;}

/* demo thumbnail scroller - horizontal fixed size */
#tsh_container{position:relative; margin:10px auto; width:1050px; background:#333; border:1px solid #999;}
#tsh_container .thumbScroller{position:relative; overflow:hidden;}
#tsh_container .thumbScroller, #tsh_container .thumbScroller .container, #tsh_container .thumbScroller .content{height:148px;}
#tsh_container .customScrollBox .horWrapper{position:relative; left:0;}
#tsh_container .thumbScroller .container{position:relative; left:0; display:inline-block; *display:inline;}
#tsh_container .thumbScroller .content{float:left;}
#tsh_container .thumbScroller .content div{padding:10px 15px; height:100%;}
#tsh_container .thumbScroller img{border:5px solid #fff;}
#tsh_container .thumbScroller .content div a{display:block; -moz-box-shadow:0 0 5px #000; -webkit-box-shadow:0 0 5px #000; box-shadow:0 0 5px #000;}
#tsh_container .thumbScroller .content div a:hover{-moz-box-shadow:0 0 15px #000; -webkit-box-shadow:0 0 15px #000; box-shadow:0 0 15px #000;}

/* demo thumbnail scroller - vertical fixed size */
#tsv_container{position:relative; margin:30px auto; width:242px; padding:0 5px; height:600px; border-top:1px solid #000; border-bottom:1px solid #000;}
#tsv_container .thumbScroller{position:relative; overflow:hidden; height:100%;}
#tsv_container .thumbScroller .container{position:relative; top:0;}
#tsv_container .thumbScroller .content{clear:both;}
#tsv_container .thumbScroller .content div{padding:10px; height:100%;}
#tsv_container .thumbScroller img{border:1px solid #000;}
#tsv_container .thumbScroller .content div a{display:block;}
#tsv_container .thumbScroller .content div a:hover{-moz-box-shadow:0 0 15px #000; -webkit-box-shadow:0 0 15px #000; box-shadow:0 0 15px #000;}

/* demo thumbnail scroller - horizontal liquid size 100% */
#tshf_container{position:fixed; left:0; bottom:30px; width:100%; border-top:1px solid #666; border-bottom:1px solid #fff; -moz-box-shadow:inset 1px 1px 20px #666; -webkit-box-shadow:inset 1px 1px 20px #666; box-shadow:inset 1px 1px 20px #666; background:#ccc;}
#tshf_container .thumbScroller{position:relative; width:100%; overflow:hidden;}
#tshf_container .thumbScroller, #tshf_container .thumbScroller .container, #tshf_container .thumbScroller .content{height:168px;}
#tshf_container .customScrollBox .horWrapper{position:relative; left:0;}
#tshf_container .thumbScroller .container{position:relative; left:0; display:inline-block; *display:inline;}
#tshf_container .thumbScroller .content{float:left;}
#tshf_container .thumbScroller .content div{padding:10px 15px; height:100%;}
#tshf_container .thumbScroller img{border:none;}
#tshf_container .thumbScroller .content div a{display:block; border:5px solid #ddd;}
#tshf_container .thumbScroller .content div a:hover{border-color:#fff;}

/* demo thumbnail scroller - vertical liquid size 100% */
#tsvf_container{position:fixed; top:0; left:2px; width:240px; height:100%; border:1px solid #333; background:#000; -moz-box-shadow:0 0 25px #000; -webkit-box-shadow:0 0 25px #000; box-shadow:0 0 25px #000;}
#tsvf_container .thumbScroller{position:relative; overflow:hidden; height:100%;}
#tsvf_container .thumbScroller .container{position:relative; top:0;}
#tsvf_container .thumbScroller .content{clear:both;}
#tsvf_container .thumbScroller .content div{padding:2px 5px; height:100%;}
#tsvf_container .thumbScroller img{border:none;}
#tsvf_container .thumbScroller .content div a{display:block; border:5px solid #111;}
