/* SAMPLES
*****************************************************************************************************/
#samples {
	width:700px;
	margin:0 auto;
	position:relative;
}

#sample-nav {
	width:702px;
	height:139px;
	overflow:hidden;
	margin:20px 0 0;
	position:relative;
}

	#sample-nav ul {
		width:20000em;
		color:#5c5c5c;
		font-size:11px;
		margin:0;
		padding:0;
/*		position:absolute;
		left:0;
		top:0;*/
		position:relative;
		padding:74px 0 0 0;
	}

	#sample-nav li {
		padding:0;
		margin:0 13px 13px 0;
		width:100px;
		height:57px;
		cursor:pointer;
		float:left;
		display:inline;
		border:1px solid #eee;
		padding:2px;
		min-height:0;
	}
	
	#sample-nav li.top {
		margin-top:-74px;
		margin-right:-119px;
	}

		#sample-nav li.active {
			color:#b0dafc;
			border:1px solid #27AFE1;
			background:#7fd2f0;
		}

	
a.sample-nav-previous, a.sample-nav-next {
	width:25px;
	height:25px;
	cursor:pointer;
	text-indent:-9999px;
	position:absolute;
	display:block;
	top:475px;
}

a.sample-nav-previous {
	background: url('../../../../../images/sample-scroll-controls.gif') no-repeat bottom left;
	left:-34px;
	
}

a.sample-nav-next {
	background: url('../../../../../images/sample-scroll-controls.gif') no-repeat top right;
	right:-34px;
}

	a.sample-nav-previous.inactive, a.sample-nav-next.inactive {
		filter:alpha(opacity=40);
		-moz-opacity:0.4;
		-khtml-opacity: 0.4;
		opacity: 0.4;
		cursor: default;
	}

.sample-page-bullets {
	margin:-10px 0 0 300px;
	overflow:hidden;
	display:inline;
	height:13px;
	float:left;
}

	/* items inside navigator */
	.sample-page-bullets a {
		width:11px;
		height:10px;
		float:left;
		margin:3px;
		background: url('../../../../../images/sample-page-controls.gif') 0px 0px;
		display:inline;
		cursor:pointer;
	}

		.sample-page-bullets a.active { background: url('../../../../../images/sample-page-controls.gif') 0 10px; }

#sample-view {
	width:702px;
	height:400px;
	overflow:hidden;
	position:relative;
}

#sample-view li {
	display:none;
	margin:0;
	border:1px solid #ccc;
	width:700px;
	height:400px;
	background:#333;
	overflow:hidden;
	position:absolute;
	top:0;
	left:0;
}

	#sample-view li.active {
		display:block;
	}
	
	#sample-view .caption-bottom {
		position:absolute;
		bottom:0;
		left:0;
	}