/* CSS Document */


/*  ********** CSS SCROLL PRESENTATION ********** */

body {padding:0;}
#scroll {
	position:relative;
	height:460px;
	overflow:hidden;
	width:977px;
}

#tools {
	width:9999em;
	position:absolute;
	height:400px;
	top:100px;
	

}

.tool {
	float:left;
	width:970px;
	height:400px;
	background-repeat:no-repeat;
	background-position:0 0px;margin-left:10px;
	
}

.details {
	background-color:#fff;
	color:#666;
	float:left;
	font-size:20px;
	margin:270px 0px 0px 50px;
	padding:0px 0px 0px 0px;
	width:450px;
}

.demos {
	background-color:#fff;
	background-color:rgba(255, 255, 255, 0.8);
	border-left:1px solid #ddd;
	float:right;
	min-height:365px;
	padding:0 25px;
	width:240px;
}

.demos h2 {
	color:#065598;
	font-size:22px;
	display:block;
	padding:10px 0;
}

.demos a {
	color:#666;
	font-size:12px;
	text-decoration:none;
}

.demos p {
	margin:0 0 4px;
	background:transparent url(images/bullet.png) no-repeat scroll 0 2px;
	padding:2px 0 1px 22px;
}

#detailLink a {
	color:#44A323;
	font-size:14px;
	font-weight:bold;
	font-style:italic;
	display:block;
	padding:10px 0px 0px 60px;
}

#detailLink a:hover {
	color:#2DCF00;
}

#thumbs {
	background:url(images/menuNav.jpg) no-repeat;
	height:100px;
	position:absolute;
	top:0px;
	width:995px;
}

.t a {
	background:transparent url(images/menuNav.jpg) no-repeat scroll 0px 0px;
	display:block;
	width:150px;
	float:left;
	height:100px;
	cursor:pointer;
}

.t a.active {
	cursor:default !important;
}

.navi {
	margin-left:35px;
	_margin-left:25px;
}

/* CSS sprite for the navigation */
#t1			{ background-position:-35px -100px; }
#t1:hover 	{ background-position:-35px -200px; }
#t1:active	{ background-position:-35px -300px; }
#t1.active	{ background-position:-35px 0 !important; }

#t2			{ background-position:-185px -100px; }
#t2:hover 	{ background-position:-185px -200px; }
#t2:active	{ background-position:-185px -300px; }
#t2.active	{ background-position:-185px 0 !important; }

#t3			{ background-position:-335px -100px; }
#t3:hover 	{ background-position:-335px -200px; }
#t3:active	{ background-position:-335px -300px; }
#t3.active	{ background-position:-335px 0 !important; }

#t4			{ background-position:-485px -100px; }
#t4:hover 	{ background-position:-485px -200px; }
#t4:active	{ background-position:-485px -300px; }
#t4.active	{ background-position:-485px 0 !important; }

#t5			{ background-position:-635px -100px; }
#t5:hover 	{ background-position:-635px -200px; }
#t5:active	{ background-position:-635px -300px; }
#t5.active	{ background-position:-635px 0 !important; }

#t6			{ background-position:-785px -100px; }
#t6:hover 	{ background-position:-785px -200px; }
#t6:active	{ background-position:-785px -300px; }
#t6.active	{ background-position:-785px 0 !important; }


/*  ********** CSS FOR OVERLAY ********** */
/* the overlayed element */
.apple_overlay {
	display:none;
	background-image:url(images/transparentBGwhite-trigers.png);
	width:900px;		
	padding:35px;
	font-size:11px;
}

/* default close button positioned on upper right corner */
.apple_overlay div.close {
	background-image:url(images/close.png);
	position:absolute; right:5px; top:5px;
	cursor:pointer;
	height:35px;
	width:35px;
}

/* black version of the overlay. simply uses a different background image */
div.apple_overlay.black {
	background-image:url(images/transparentBGblack-trigers.png);		
	color:#fff;
	width:720px;	
	height:550px;
	padding:35px;
	font-size:11px;
}

div.apple_overlay h2 {
	margin:10px 0 -5px 0;
	font-weight:bold;
	font-size:14px;
}

div.black h2 {
	color:#fff;
}

#triggers img {
	cursor:pointer;
}

.bigImgInfo {
height:50px;
}

#mask { 
    background:#000000 url(images/mask_gradient_1000.png) 50% no-repeat;
}


/*  ********** CSS FOR FLOWPLAYER ********** */
div.overlay {
	padding:40px;	
	width:576px;  
	display:none;
	background-image:url(/img/overlay/white.png);	
}

div.overlay div.close {
	background:url(images/close.png) no-repeat;
	position:absolute;
	top:2px;
	right:5px; 
	width:35px;
	height:35px;
	cursor:pointer;
}

div.overlay a {
	height:450px;
	display:block;
}


