div#work_sample_area{
	position: relative;
	width: 905px;
	height: 320px;
	margin: 0 0 0 50px;
	z-index: 90;
}

div#ws_loader{
	position: absolute;
	width: 375px;	
	z-index: 100;
	text-align: center;	
	color: #999;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
}

div.nojs{
	height: auto !important;
	margin-left: 221px !important;
}

div#work_sample_area h3{
	position: absolute;
	left: 0;
	top: 0;
	width: 134px;
}

div.nojs h3{ left: -211px !important; }

div#ws_desc{
	position: absolute;
	top: 60px;
	left: 0;
	width: 134px;
	font-size: 11px;
	line-height: 1.4em;
}
	div#ws_desc p{
		margin: 20px 0 0 0;
		padding: 0;
	}
	div#ws_desc div.ws_comp{
		color: #333;	
		font-weight: bold;
		font-size: 12px;
	}	
	div#ws_desc div.ws_title{	
	}
	
div.nojs div#ws_desc{ display: none !important; }
	div.nojs div.ws_comp{ 
		margin-top: 30px;
		font-weight: bold; 
		font-size: 14px; 
	}
	
div#asterisk_ws{
	position: absolute;
	top: 8px;
	right: 13px;
	z-index: 120;	
}
	div.nojs div#asterisk_ws{ display: none; }

	div#asterisk_ws img{
		display: none;
		visibility: hidden;
	}

div.ws_frame{
	position: absolute;
	top: 0;
	left: 161px;	
	background: url(../images/ws/ws_frame_24.png) no-repeat top left;
	width: 723px;
	height: 296px;
	z-index: 115;	
}

div.ws_frame:hover, div#work_sample_area div.iehover{
	cursor: pointer;	
}

div.nojs div.ws_frame{
	display: none;
}

div.scrollable {	
	position: relative;
	left: 173px;
	top: 13px;
	overflow: hidden;	
	width: 697px;	 
	height: 270px;
}

div.nojs div.scrollable{
	left: auto;
	overflow: visible;
	height: auto;
	top: 0;
}

/* prev, next, prevPage and nextPage buttons */
a.prev, a.next{	
	position: absolute;
	top: 123px;	
	width:21px;
	height:43px;
	background: transparent url(../images/ws/ws_button_arrows.png) -63px 0 no-repeat;
	cursor:pointer;
	font-size:1px;
}
div.nojs a.prev, div.nojs a.next{
	display: none;
}
a.next{
	left: 884px;
	background-position: -21px 0;		
}
a.prev{
	left: 140px;
}
a.prev:hover{
	background-position: -42px 0;		
}
a.next:hover{
	background-position: 0 0;		
}
a.disabled {
	visibility:hidden !important;		
}

/*********** navigator ***********/
/* position and dimensions of the navigator */
div.navi {
	position: absolute;
	top: 309px;
	right: 33px;
	height:20px;
}

div.nojs div.navi{ display: none; }

div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin: 0 0 0 5px;
	background:url(../images/ws/ws_bullets.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
	cursor: pointer;
}

div.navi a:hover {
	background-position: -16px 0;      
}

div.navi a.active {
	background-position: -8px 0;     
} 	

/* Work Samples */

/*
NOTE: THESE STYLES NEED TO BE ON THE PAGE ITSELF
	#work_samples {}
	
	div.nojs #work_samples{}
*/

div.work_sample {
	float: left;
	width: 697px;
	height: 270px;
	cursor: pointer;
	position: relative;
}

div.nojs div.work_sample{
	float: none;
	height: auto;
	margin-bottom: 50px;
}

div.desc, div.ws_port{
	display: none;
}

div.nojs div.desc, div.nojs div.ws_port{
	display: block;
}
	
div.work_sample img.ws_photo{
	position: absolute;
	top: 0;
	left: 0;
	width: 697px;
	height: 270px;
	z-index: 100;
}

div.nojs img.ws_photo{
	position: relative;
}

div.work_sample div.ws_asterisk{
	display: none;
	visibility: hidden;
}

/*********************** Work Sample Portfolio Popup ***********************/
div#work_sample_portfolio_view{
	text-align: center;
	
}

div#work_sample_portfolio_view div.ws_scrollable {	
	position: absolute;
	left: 38px;
	top: 44px;
	overflow: hidden;
	width: 835px;	 
	height: 574px;	
	text-align: left;
}

/* prev, next, prevPage and nextPage buttons */
div#work_sample_portfolio_view a.prev, div#work_sample_portfolio_view a.next{
	display:block;
	position: absolute;
	top: 630px;	
	width:19px;
	height:25px;
	background: transparent url(../images/ws/ws_popup_nav.png) -19px 0 no-repeat;
	cursor:pointer;
	font-size:1px;
}

div#work_sample_portfolio_view a.next{
	left: 454px;
	background-position: -57px 0;		
}

div#work_sample_portfolio_view a.prev{
	left: 437px;
}

div#work_sample_portfolio_view a.prev:hover{
	background-position: 0 0;		
}
div#work_sample_portfolio_view a.next:hover{
	background-position: -38px 0;		
}

/*********** navigator ***********/
/* position and dimensions of the navigator */
div#work_sample_portfolio_view div.navi {	
	position: relative;
	top: -147px;
	bottom: 0;
	right: 0;
	margin: 0 auto;
	height: 20px;
}

div#work_sample_portfolio_view div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin: 0 2px;
	background:url(../images/ws/ws_bullets.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

div#work_sample_portfolio_view div.navi a:hover {
	background-position: -16px 0;      
}

div#work_sample_portfolio_view div.navi a.active {
	background-position: -8px 0;     
} 	

/* Work Samples */
div#work_sample_portfolio_view div.portfolio {	
	position: absolute;
	width: 20000em;	
	clear: both;	
}

div#work_sample_portfolio_view div.portfolio div.asset{
	float: left;
	width: 835px;
	height: 574px;
	cursor: pointer;
	position: relative;
	text-align: center;
	overflow: hidden;
}
	div#work_sample_portfolio_view div.asset p{
		display: block;		
		position: absolute;
		bottom: 2px;
		left: 0;
		font-size: 10px;
		line-height: 10px;
		height: 1em;
		margin: 0;
		padding: 0;
	}
	div#work_sample_portfolio_view div.video{
		margin-top: 25px;
		z-index: 1;
	}
	
div#work_sample_portfolio_view div.content{
	margin: 675px 38px 0 38px;
}
div#work_sample_portfolio_view div.ws_comp, div#work_sample_portfolio_view div.ws_title, div#work_sample_portfolio_view p{
	text-align: left;
	line-height: 1.5em;
}
div#work_sample_portfolio_view div.ws_comp{
	margin-top: 25px;
	color: #333;	
	font-weight: bold;
	font-size: 14px;
	height: 20px;
}
div#work_sample_portfolio_view div.ws_title{
	margin-top: 1px;
	font-size: 12px;
	height: 20px;
}
div#work_sample_portfolio_view p{
	margin-top: 17px;
	font-size: 12px;
	height: 65px;
}
