/* -------------------------------------------- */
/* Master CSS : MESH studios 					*/
/* Author: Erik Smith, erik@pendergraphics.com  */
/* Employed By: Pendergraphics Design Group     */
/* -------------------------------------------- */



/* Global Elements             */
/* --------------------------- */

* {
	margin:0px;
	padding:0px;
}

.genClear {
	clear:both;
}

body {
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	background-color:#e1e1e1;
}

h1 {
	width:200px;
	height:45px;
	background:#fff url(../../images/newlogo.jpg) no-repeat center left;
}

h2 {
	font-size:20px;
	font-family:Arial, Helvetica, sans-serif;
	color:#fff;
	font-weight:normal;
	margin:0 0 15px 0;
}

h3 {
	font-size:14px;
}

a {
	color:#222;
}





/* Structure Elements          */
/* --------------------------- */

#wrapper {
	position:relative;
	width:863px;
	margin:0px auto;
	background-color:#FFF;
	padding:10px;
}




	/* ---- [ Main Navigation ] ---- */

	#mainNav {
		float:left;
		width:140px;
		position:relative;
		top:10px;
		left:0px;
		background:#fff;
	}
	
		#mainNav h3 {
			color:#c5242c;
			margin:0 0 0 20px;
			font-size:11px;
		}
		
	#mainNav ul {
		float:right;
		margin:0 20px 0 0;
		display:inline;
	}
		
		#mainNav ul li {
			list-style-type:none;
		}
		
			#mainNav ul li.cParent a {
				background:#fff url(../../images/arrow-white.gif) no-repeat left center;
			}
	
			#mainNav ul li a {
				border-bottom:1px solid #111;
				display:block;
				background:#fff;
				color:#000;
				text-decoration:none;
				font-size:11px;
				height:12px;
				padding:5px 20px 5px 20px;
			}
			
			#mainNav ul li a:hover {
				background-color:#e4e4e4;
			}
			
			#mainNav ul li ul{
				display:none;
			}
	
	
	
	
	#topHeader{
		float:right;
		width:100%;
		height:52px;
		background:#fff;
	}
	
		
		#topHeader ul{
				float:right;
				width: auto;
				height:15px;
				margin-top:24px;
				list-style:none;
				text-align: right;
	
			}
			
				#topHeader li{
					float:left;
					font-size:12px;
					color:#77787b;
					padding:0 4px;
				}
					
					#topHeader li a{
						color:#77787b;
						font-size:11px;
						text-decoration:none;
					}
					
						#topHeader li a:hover{
							color:#9d9d9f;
						}
			
				#topHeader h1 span {
					margin-left:-5000px;
				}
				
			#chrome {
				height:7px;
				background-color:#c7c7c7;
				margin-bottom:3px;
			}
	
	
	
	
	
	
	#main {
		float:right;
		width:693px;
		border-left:15px solid #fff;
	}
	
	
	
	
	/* ---- [ Header ] ---- */
	
			
			#header-image {
				/*height:182px;
				background:#fff url(../../images/header-ourfirm2.jpg);*/
			}
			
			
			
			
			
		/* ---- [ Middle Section ] ---- */
			
		#mid {
			background:#DFE1E8;
			height:100px;
			clear:both;
			margin:3px 0 0 0;
			padding:10px 0 10px 0;
		}
		
			#subNav {
				width:150px;
				margin:0 0 0 10px;
				float:left;
			}
			
				#subNav ul li {
					list-style-type:none;
				}
				
					#subNav ul li.cPage a {
						background:#DFE1E8 url(../../images/arrow-grey.gif) no-repeat left center;
					}
			
					#subNav ul li a {
						border-bottom:1px solid #fff;
						display:block;
						background:#DFE1E8;
						color:#000;
						text-decoration:none;
						font-size:11px;
						height:12px;
						padding:5px 20px 5px 20px;
					}
			
				#subNav h3 {
					color:#999;
				}
				
			#callout {
				float:right;
				margin: 10px 10px 0 0;
				font-size:14px;
				font-weight:bold;
				color:#000;
				text-align:right;
				width:300px;
				line-height:20px;
			}
			
			
			
			
			
		/* ---- [ Content Area ] ---- */
		
		#content {
			width:693px;
			background:#BAB8AC;
			margin:3px 0 0 0;
			padding:20px 0 20px 0;
			position:relative;
		}
		

			
			#right {
				float:left;
				margin:0 0 0 100px;
				/* Sick of correcting these, */
				display:inline;
				width:500px;
				line-height:18px;
			}
			
				#right h2 {
					position:relative;
					left:-70px;
					font-weight:bold;
				}
				
				h2.noLeft {
					left:25px;
					position:relative;
					border-bottom:1px solid #fff;
					line-height:20px;
					width:640px;
				}
				
			#reader {
				margin: 0 0 0 20px;
				width:200px;
				padding:10px 0 0 120px;
				background:#BAB8AC url(../../images/reader.gif) no-repeat left center;
				text-align:left;
				font-style:italic;
				font-size:10px;
				height:30px;
				width:111px;
				clear:both;
				display:block;
			}
			
			#adobe {
				margin: 0 0 0 20px;
				width:100px;
				padding:40px 0 0 0;
				background:#BAB8AC url(../../images/adobe.gif) no-repeat;
				text-align:left;
				font-style:italic;
				font-size:10px;
				height:30px;
				width:111px;
				clear:both;
				display:block;
			}
			
			
			
	/* ---- [ Footer ] ---- */
			
	#footer {
		clear:both;
		height:30px;
		margin-top:15px;
		font-size:10px;
		color:#888;
	}
	
	#footer a {
		color:#444;
	}
	
		#footer a:hover {
			color:#F8A412;
		}
			
		#footer span.contact {
			float:left;
			margin:10px 0 0 0;
		}
		
		#footer span.copyright {
			float:right;
			margin:10px 30px 0 0;
			display:inline;
		}
		
	#footerbar {
		height:17px;
		background:#BAB8AC url(../../images/footer-right.jpg) no-repeat top right;
	}
	
	#afterFooter{
		background-color:#bab8ac;
		display:block;
		height:17px;
		width:100%;
		position:relative;
	}
	
		#footerColor{
			width:209px;
			height:17px;
			position:absolute;
			right:25px;
			top:0px;
			background-color:#e92121;
			display:block;
			font-size:1px;
		}
			
		


		
			
		
/* --------- [ Articles ] ------------- */

#leftNews {
	float:left;
	width:150px;
}

#rightNews {
	float:left;
	width:480px;
	margin:0 0 0 20px;
}

#rightNews div.article {
	margin: 0 0 25px 0;
	padding: 0 0 20px 0;
	border-bottom:1px solid #888;

}

#rightNews div.article h3 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-variant:small-caps;
}

	#rightNews div.article h3 a {
		text-decoration:none;
	}

#rightNews div.article h4 {
	font-size:12px;
	color:#444;
	font-weight:normal;
}



/* --- News Archives --- */

#archives {
	margin: 0 0 0 15px;
	width:120px;
	text-align:right;
	float:left;
}

#archives h4 {
	margin: 0 0 15px 0;
}

	#archives li {
		list-style-type:none;
	}
		#archives li a {
			padding:4px 15px 4px 15px;
			margin: 0 0 10px 0;
			width:105px;
			display:block;
			font-size:14px;
			font-variant:small-caps;
			text-align:right;
			text-decoration:none;
			background:#BAB8AC url(../../images/portCatBg.jpg) no-repeat center right;
		}

/* --- Team Page --- */
	
	
	#teamList{
		width:120px;
		padding:20px;
		float:left;
		background-color:#d7d6cf;
	}
	
		#teamList li{
			list-style-type:none;
			padding:5px 0 5px 0;
		}
		
			#teamList li a{
				border-bottom:1px solid #FFF;
				padding:0.2em;
				padding:0px 0.4em 0px 0.4em;
				color:#535353;
				text-decoration:none;
				width:100px;
				line-height:150%;
				display:block;
			}
			
			#teamList li a:hover{
				background-color:#c9c7bc;
			}
		
	div.defaultShow{
		float:left;
		width:450px;
		background-color:#d7d6cf;
	}
	
	#teamWrapper{
		float:left;
		width:470px;
		height:500px;
		background-color:#fff;
		overflow:hidden;

	}
	
	div.teamMember{
		display:block;
		float:left;
		width:450px;
		padding:10px;
		background-color:#fff;
		position:relative;
	}
	
		div.teamMember img{
			float:left;
			width:100px;
			margin:10px;
		}	
		
		div.teamMember div{
			float:left;
			width:250px;
			padding:0 10px 10px 10px;
			margin-bottom:20px;
			background-color:#fff;
		}
			



			










/* ---- [ Portfolio ] ---- */	

	#portfolioTitle {
		border-bottom:1px solid #fff;
		line-height:20px;
		margin:0 20px 20px 20px;
	}
	
	#portfolio_title {
		width:400px;
		float:right;
	}
	
	#portfolio_mid {
		background:#DFE1E8;
		clear:both;
		margin:3px 0 0 0;
		padding:10px 0 10px 0;
	}
	
		
	
		
		
		
		/* --- PROJECT SINGLE DETAILS --- */

		#ProjectImage {
			float:left;
			display:inline;
			margin:0 0 0 15px;
			width:650px;
			position:relative;
			background:#fff;
			padding:6px 6px 20px 6px;
		}
		
			#portfolio_title {
				color:#222;
				padding:0px 10px 0px 10px;
				font-size:12px;
				width:635px;
				
			}
			
				#portfolio_title h3 {
					font-size:22px;
					color:#222;
				}
				
				#portfolio_text {
					color:#555;
					padding:10px;
					font-size:12px;
					width:580px;
					line-height:18px;
					height:100px;
					overflow:auto;
					clear:both;
				}
				
				#expand {
					display:block;
					width:90px;
					height:21px;
					padding:0px;
					color:#fff;
					position:absolute;
					z-index:200;
					top:6px;
					left:6px;
					text-decoration:none;
					background-image:url(../../images/full-screen.jpg);
					opacity: .80;
					filter: alpha(opacity=80); /* IE */
					text-align:center;
					
				}
				
				
		
		.back {
			display:block;
			float:left;
			color:#777;
			font-size:11px;
			text-decoration:none;
			margin-right:20px;
			text-transform:lowercase;
			padding:3px;
			border:1px solid #ddd;

		}
		
		.back:hover {
			color:#888;
			border:1px solid #aaa;
		}
		
		#goback {
			margin-left:10px;
			padding-bottom:20px;
		}
		
		#thumbs {
			width:630px;
			float:left;
			display:inline;
			background:#242633;
			border:none;
			margin:5px 15px 0 -4px;
			position:relative;
			left:4px;
			padding:10px;
			top:-18px;
		}
	
		
		#thumbs li {
			list-style-type:none;
			margin:0 8px 0 8px;
			width:95px;
			float:left;
		}
		
		#thumbs li a {
			display:block;
			width:95px;
			height:75px;
			border:3px solid #31364F;
		}
		
			#thumbs li a:hover {
				border:3px solid #fff;
			}	


	
	p.empty {
		margin:0 0 0 10px;
	}
	

	#note {
		font-style:italic;
		clear:both;
		position:absolute;
		right:6px;
		top:6px;
		background:#242633;
		opacity: .80;
		filter: alpha(opacity=80); /* IE */
		color:#fff;
		padding:4px 10px 4px 10px;
	}
	
	
	
	
	
	
	
		/* --- LIST OF PROJECTS --- */
				
				#Projects {
					margin:10px 0 0 25px;
				}
				
				#Projects li {
					list-style-type:none;
					margin:15px;
					float:left;
					width:125px;
					padding:10px 10px  10px 10px;
					text-align:center;
					position:relative;
				}
				
				#Projects li a {
					text-decoration:none;
				}
				
				#Projects li a.image {
					width:75px;
					height:65px;
					display:block;
					padding:3px;
					margin: 0 0 0 22px;
					
				}
				
				#Projects li a.title {
					display:block;
					width:125px;
					font-weight:bold;
					color:#333;
					font-size:11px;
					text-transform:uppercase;
					padding-bottom:10px;
				}
				
					#Projects li p {
						font-size:14px;
						padding-top:6px;
					}
					
						#Projects li p span {
							font-size:11px;
							color:#777;
						}
						
				h2.ProjectCatTitle {
					margin:5px 0 0 35px;
				}
				
					h2.ProjectCatTitle a {
						font-size:11px;
						float:right;
						margin:-15px 40px 0 0;
						text-decoration:none;
					}
			
				
				#ProjectCatsContent {
					float:left;
					width:420px;
					margin: 3px 0 0 45px;
					line-height:18px;
				}

				#CatsText {
					margin-left:35px;
				}
				
				
				

	
	
	
	
	/* --- SINGLE PROJECTS EFFECTS --- */

	
		#Projects li p.hoverBlock {
			position:absolute;
			background:#fff;
			width:200px;
			height:200px;
			bottom:140px;
			left:20px;
			overflow:hidden;
			border:5px solid #fff;
			z-index:101;
			padding:5px;
		}

		#Projects li p.hoverBlock span {
			display:block;
			width:200px;
			background:#fff;
			position:relative;
			z-index:100;
			color:#000;
			padding:0 0 10px 0;
			color:#333;
		}
		
		#Projects li p.hoverBlock span em{
			background:#fff;
			color:#000;
			font-size:16px;	
			display:block;
			font-style:normal;
			text-transform:uppercase;
		}

		#Projects li p.hoverBlock img {
			position:relative;
			z-index:98;
			left:0px;
		}
		

	
	/* --- PROJECT CATEGORIES ---- */
	

	#ProjectCats  {
		width:120px;
		float:left;
		margin:0 0 0 0px;
	}

		#ProjectCats li {
			list-style-type:none;
		}
	
		#ProjectCats li a {
			padding:4px 15px 4px 15px;
			width:120px;
			display:block;
			font-size:14px;
			font-variant:small-caps;
			text-align:right;
			text-decoration:none;
			margin:0 15px 0 0;
		}
		
		#ProjectCats li a:hover {
			background:#BAB8AC url(../../images/portCatBg.jpg) no-repeat center right;
		}
		
		
		.holdDetails {
			position:absolute;
			right:64px;
			top:64px;
			background-color: #000;
			opacity: .80;
			filter: alpha(opacity=80); /* IE */
			color:#fff;
			padding-top:10px;
		}
		
			.holdDetails a {
				color:#fff;
				font-size:18px;
				padding:3px 10px 3px 10px;
				text-decoration:none;
			}
			
			.holdDetails p {
				padding:3px 10px 3px 10px;
			}
			
		
	
	
	#lighteffect {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 90;
		width: 100%;
		height: 100%;
		background-color: #000;
		filter:alpha(opacity=60);
		-moz-opacity: 0.6;
		opacity: 0.6;
		display:none;
	}	
	
	
	#mScroll1, #mScroll2, #mScroll3, #mScroll4, #mScroll5 {
		display:none;
	}
	
	
	.mScroll {
		z-index:200;
		position:absolute;
	}
	
	
	
	
	
	/* --- FORM STYLES ---- */
	
	.form tr td {
		padding:10px;
	}
	
	.form {
		color:#222;
		font-size:12px;
		margin-top:20px;
	}
	
	.form label {
		width:130px;
		display:block;
		text-align:left;
	}
	
	.form input {
		padding:2px 4px 2px 4px;
		background:#DFE1E8;
	}
	
	.form textarea {
		height:110px;
		background:#DFE1E8;
	}