/* Sample 1*/

#box1{

	position:absolute;

}

#box1 span{

	display:block;

	float:left;

}



/* Sample 2*/

#box2{

	position:absolute;

}

#box2 span{

	display:block;

	float:left;

}



/* Sample 3*/

#box3{

	position:absolute;

}

#box3 span{

	display:block;

	float:left;

}



/* Sample 4*/

#box4{

	position:absolute;

}

#box4 div{

	width:500px;

	height:240px;

	float:left;

	background:#eee;

}



#box4 h3, #box4 p, #box4 ul{

	padding:5px 10px;

}

#box4 p{

	text-indent:16px;

}

#box4 img{

	width:200px;

	width:150px;

	float:left;

	margin:0 10px 10px 15px;

}

#info4{

	background:#fff !important;

	color:red !important;

	cursor:default

}



/* Sample 5*/

#box5{

	position:absolute;

	width:378px;

}

#box5 span{

	display:block;

}

#info5{

	bottom:0;

}



/* Sample 6*/

#box6{

	position:absolute;

	width:378px;

}

#box6 span{

	display:block;

}

#handles6_1{

	float:left

}

#handles6_2{

	float:right

}

.mask6{

	position:absolute;

	left:50%;

	margin-left:-120px;

	width:378px;

	height:180px;

	overflow:hidden;

}

.sample6 .buttons{

	clear:both;

	text-align:center;

}



/* Sample 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;

}



/* 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;

}



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



.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:378px;

	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:378px;

	height:238px;

	overflow:hidden;

}

.mask3{

	position:relative;

	width:480px;

	height:240px;

	overflow:hidden;

}



span img{

	display:block;

	border:none;

}