/* Default Styles */
* {margin:0;padding:0}
div,p,li{font-size:12px}
li{margin-left:16px;}
h1{color:#0061CA;text-align:center;padding-bottom:10px}
h2{color:#999;font-size:15px;font-weight:normal}
pre{background:#666; color:#fff; padding:10px; margin:10px; height:auto; overflow:auto; font:12px Verdana,Courier,sans-serif}
* html pre {width:100%}
.description{padding:16px;margin:10px 0;background:#eee}
.sample{padding:20px 30px; margin:4px 0 25px 0; border:0px solid #e1e1e1}
h4.stitle{color:#666;margin:0 0 5px 0}
.links {padding:10px;margin-top:20px}
.links a{font-size:14px;color:#0080FF;text-decoration:none}
.links a:hover{font-weight:bold}
#cont{width:800px;margin:0 auto;background:#fff;text-align:left;padding:20px}
.buttons{padding:5px;}
.buttons span{color:#0080FF;padding:0 5px;cursor:pointer;font:10px Verdana}
.buttons span.active, .buttons span:hover{background:#0080FF;color:#fff}

/* Sample 6 */
#box6{position:absolute;width:560px;}
#box6 span{display:block; float: left;}
#handles6_1{float:left;}
#handles6_2{float: right;}

.clear { clear: both; }
.mask6{position:absolute;margin-left:6px;width:560px;height:314px;overflow:hidden;}
html>body .mask6 {margin-left:6px;}
.sample6 .buttons{clear:both;text-align:center;}
.sample{clear:both;padding:4px;height:327px;}

/* Sample 8 */
#box8{position:absolute;}
#box8 div{width:480px;float:left;}
#box8 .buttons{text-align:left;}
#box8 .next{float:right;}
.sample8 .buttons{text-align:center;clear:both;}
.sample8 .mask1{border-top:1px solid #ccc;border-bottom:1px solid #ccc;}

/* ********************************** */
.hidden{visibility:hidden; position:relative;}
.thumbs{width:532px; position: absolute; top: 462px;  margin-left: 6px; height: 56px;}
.thumbs div{display:block;width:85px;height:56px;margin:0px 0;cursor:pointer; float: left;}
.thumbs div img{display:block;width:100%;height:100%;border:none;}
.info{width:560px;xheight:250px;background:#000;position:absolute; overflow: hidden; bottom: 0;}
.info h7 p {color:#fff;padding:3px 8px;font-family:Arial;font-size:15pt;}
.info h7 a {color:#fff; text-decoration:none; letter-spacing:-.01em;}
.info h7 a:hover {color:#09F;}

.info font {color:#999;padding:3px 8px;font-family:Arial;font-size:100%; margin-left:12px; font-style:normal;}
.info font a {color:#999; text-decoration:none;}
.info font a:hover {color:#09F;}

.info p, .info h4{color:#fff;padding:3px 8px;font-family:Arial;}
.info p a {color:#fff; text-decoration:none; font-size:90%;}
.info p a:hover {color:#FFCC00;}
.info h4{font-size:15pt; margin-bottom:4px; font-weight:bold;}
.info h4 a{float:right;background:#fff;color:#000;font-size:10px;padding:0 3px;text-decoration:none; margin-left:10px; margin-right:-4px;}
.info h4 a:hover{background:#F00; color:#fff;}
.mask1{position:relative;width:480px;height:140px;overflow:hidden;}
.mask2{position:relative;width:240px;height:180px;overflow:hidden;}
.mask3{position:relative;width:480px;height:240px;overflow:hidden;}
span img{display:block;border:none;}