/* WORKS PAGE */

#content.works.gallery { position:relative;height:422px; }
	#content.works.gallery  #ninjaworksgallery { position:absolute;top:50%;margin-top:-110px;margin-left:0px; }

/* CLIENT PAGE */

.gridcontainer { margin:0 auto -20px;text-align:center; }
	.gridcontainer table { margin:0 auto;text-align:left; }
	.gridcontainer table p { line-height:1em; }
.clientslot .client { display:block;overflow:hidden;zoom:1;width:80px;height:80px;border:1px solid #333;margin:0 40px 40px 0; }
	.clientslot a.client:hover img { display:none; } 
	.clientslot .client img { width:80px;height:80px; }


/* CASE HISTORY PAGE */

.casehistory-container { position:relative;padding-bottom:10px; }
	.case-controls { position:absolute;right:0;top:-55px;width:512px; }
		.case-controls a.nav-arrow { float:left;position:relative;width:50%;height:17px;text-decoration:none !important; }
			.case-controls a.nav-arrow.left { display:block;background:url(../images/black/casehistory/arrow_left_off.png) no-repeat;color:#333 !important; }
			.case-controls a.nav-arrow.left:hover { background:url(../images/black/casehistory/arrow_left_on.png) no-repeat;color:#D22020 !important;  }
				.case-controls a.nav-arrow.left span { position:absolute;left:16px;top:-1px; } 	 
			.case-controls a.nav-arrow.right { background:url(../images/black/casehistory/arrow_right_off.png) no-repeat right;text-align:right;color:#333 !important; } 
			.case-controls a.nav-arrow.right:hover { background:url(../images/black/casehistory/arrow_right_on.png) no-repeat right;color:#D22020 !important;  }
				.case-controls a.nav-arrow.right span { position:absolute;right:16px;top:-1px; }
				
	#text-contents, #media-contents { float:left;padding-bottom:20px; }
	#text-contents { width:390px; }
		#text-contents .header { font-size:13px;line-height:1.4; }
			#text-contents .header.red { color:rgb(210, 32, 32); }
			#text-contents .header div { overflow:hidden:zoom:1;clear:both;padding:2px; }
				#text-contents .header div span { float:left;display:block;width:70px; } 
		#text-contents h1, #text-contents h2, #text-contents h3 { margin:15px 0 0;font-style:normal;font-size:12px; }
		#text-contents p { margin:0 0 .5em;padding:0 25px 0 0;font-size:12px;line-height:1.3em; }
	
	#media-contents { position:relative;overflow:hidden;zoom:1;width:507px;height:400px;padding-left:5px; }
		#media-contents h4 { padding:0 0 10px;background:#000;font-size:14px;font-style:normal;font-weight:normal;color:#333333; }
		#case-images, #case-movies { position:absolute;top:0px;right:0px; }
			#case-images img { display:none;  }
			#case-movies { display:none; }
				#case-movies ul { position:relative;overflow:hidden;zoom:1;width:505px;height:310px; }
			
			#b-fullscreen, #b-fullscreen:link { 
				position:absolute;
				display:block;
				width:15px;height:9px;
				top:315px;right:0;z-index:999;
				background:url(../images/black/casehistory/fullscreen_icon.png) no-repeat;
				overflow:hidden;
				text-indent:-999em;
				cursor:pointer; 
				} #b-fullscreen:hover {
					background-position:0 -9px;					
					}
		
		.media-controls { position:absolute;top:350px;width:80px;overflow:hidden;zoom:1; }
			.media-controls .button { display:block;float:left;width:22px;height:15px;overflow:hidden;zoom:1;margin-right:15px;border:1px solid #000;text-indent:-999em; }
				#b-images { background:url(../images/black/casehistory/images_icon.png) no-repeat; }
					#b-images.selected { background:url(../images/black/casehistory/images_icon_on.png) no-repeat 0 0px;  }
				#b-videos { background:url(../images/black/casehistory/videos_icon.png) no-repeat 0 1px; }
					#b-videos.selected { background:url(../images/black/casehistory/videos_icon_on.png) no-repeat 0 1px;  }


/* ----------------------
 * IMAGE GALLERY
 * ---------------------- */
.cycleElementsContainer {
	padding: 2px;
	margin-bottom:30px;
	overflow: hidden;
	border: 1px solid #000;
	} 	
	.cycleElementsContainer ul {
		overflow:hidden;
		height:163px !important;
	}
	.cycleElementsContainer div {
		float: left;
	}
	.cycleElementsContainer #cycleElementsLeft, #cycleElementsRight {
		width: 20px;
		height: 160px;		
		float:left;
		overflow:hidden;
		zoom:1;
		outline: none;
		}
		#cycleElementsLeft span, #cycleElementsRight span {
			display:block;
			width: 20px;
			height: 160px;
			text-indent:-999em;
		}
	#cycleElementsLeft span {
		background:url('/media/website/images/black/gallery/arrow_left_off.gif') no-repeat center;
		}
		#cycleElementsLeft:hover span {
			background:url('/media/website/images/black/gallery/arrow_left_on.gif') no-repeat center;
			}
	#cycleElementsRight span {
		background:url('/media/website/images/black/gallery/arrow_right_off.gif') no-repeat center;
		}
		#cycleElementsRight:hover span {
			background:url('/media/website/images/black/gallery/arrow_right_on.gif') no-repeat center;
			}

	.cycleElementsContainer li {
		display: block;
		width: 160px;
		height: 160px;
		float: left; 
		margin: 0 20px;
		background: no-repeat center center;
		line-height: 80px;
		text-align: center;
		color: #333;
		font-size: 18px;
		font-weight: bold;
	}
	.cycleElementsContainer li a,
	.cycleElementsContainer li a:link,
	.cycleElementsContainer li a:visited,
	.cycleElementsContainer li a:active {
		width: 160px;
		height: 160px;
		display: block;
		overflow:hidden;
		zoom:1;
		border: 1px solid #333;
		}
		.cycleElementsContainer li a:hover {
			border:1px solid #555;
			}
			.cycleElementsContainer li img {
				filter:alpha(opacity=30);
				-moz-opacity:0.3;
				-khtml-opacity: 0.3;
				opacity: 0.3;
				width:160px;
				height:160px;
				}