/* 6*/
	
#box6{
position:absolute;
width:240px;
}
 #box6 span{
display:block;
} 

	
#handles6_1{
float:left
}
	#handles6_2{
float:right
}

	#handles6_3{
float:left; z-index:1;
}
	#handles6_4{
float:right;z-index:2;}   /*  JL Add   */

	
.mask6{
	position:absolute;
left:50%;
margin-left:-120px;
	width:240px;
height:180px;
overflow:hidden;
}
	
.sample6
	.buttons{
clear:both;
text-align:center;
}

/* 7   */

	
	
#box7{
position:absolute;
}	 
#box7 span{
display:block;
	float:left;
}
	

#thumbs7{
position:relative;
width:486px;
	clear:both;
height:41px;
overflow:hidden;
margin-top:200px;
}

	#thumbs7 .thumbs, 
	#thumbs_handles7, 
	#thumbs_mask7{
position:absolute;
top:0;
width:100%;
height:41px;
}

	#thumbs7 .thumbs div, 
	#thumbs_handles7 span{
display:block;
width:60px;
height:41px;
margin:0;
float:left;
cursor:pointer;
}

	
#thumbs7 .thumbs div img{
width:54px;
float:right;
}
	
#thumbs_handles7 span{
background:url(thumb_invisible.gif) no-repeat;
}

	
#thumbs_mask7{
width:1200px;
background:url(thumbs_mask.gif) no-repeat center top;
}


/* ********************************** */


.thumbs {
width:54px;
}

.thumbs div{
display:block;
	width:54px;
	height:41px;
	margin:3px 0;
	cursor:pointer;
}


.thumbs div img{
display:block;
	width:100%;
height:100%;
	border:none
}



.info{
	width:240px;
height:50px;
background:#000;
 position:absolute;
}

.info p, .info h4{
color:#fff;
	padding:3px 8px;
	font-family:Arial;
}

.info h4{
font-size:14px;
}

.info h4 a{
float:right;
	background:#fff;
color:#000;
font-size:10px;
padding:0 3px;
text-decoration:none
}



.mask1{
	position:relative;
	width:480px;
	height:180px;
	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;
}

* {margin:0;padding:0}


/*body{background:#666;
  font-family:'Lucida Sans Unicode',Arial,sans-serif;
  color:#333;text-align:center;padding:50px 0}

 		pre{background:#666; color:#fff; 		*/   
div,p,li{font-size:12px}

      li{margin-left:16px;}

h1{color:#0061CA;text-align:center;padding-bottom:10px}

h2{color:#999;font-size:16px;font-weight:normal}


pre{background:#089494; color:#089494; padding:10px; margin:10px; height:auto; overflow:auto; font:12px Verdana,Courier,sans-serif}

* html pre {width:100%}



.sample{padding:20px 30px; margin:4px 0 25px 0; border:1px solid #e1e1e1}


h4.stitle{color:##089494;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:550px;margin:0 auto;background:##089494;text-align:left;padding:20px}