@import url('hover.css');

/************************************/
/*****General*****/
/************************************/

/*note to self*/
/*Box shadow #14083b before*/

#homePic{
	margin: 40px 0px 0px 0px;
	-moz-box-shadow: 3px 3px 10px #14083b;
	-webkit-box-shadow: 3px 3px 10px #14083b;
	box-shadow: 3px 3px 10px #14083b;
}

body{
	width: 100%;
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	/* background: #eff; */
	background: #fff;
	color: #039;
}
a{
	text-decoration: none;
	color: #039;
}
a img{
	outline: none;
	border: none;
}

h1{
	font-size: 44px;
}
h2{
	font-weight: normal;
	font-size: 22px;
}
h3{
	font-weight: normal;
	font-size: 24px;
	margin: 15px 0px 0px 0px;
}
h4{
	font-weight: normal;
	font-size: 16px;
	margin: 15px 0px 0px 0px;
}

.empty{
	clear: both;
}

.blueLine{
	height: 4px;
	background: #039;
}

#wrapper{
	width: 100%;
}

#pageHeader{
	height: 92px;
	width: 100%;
	background: url(../images/header_bg.png) repeat-x;
}

#pageNavigation{
	width: 1024px;
	height: 92px;
	margin: 0px auto;
	padding: 0px;
	background: url(../images/header.png) no-repeat center;
}
	#logo{
		margin: 8px 0px 0px 31px;
		float: left;
	}

	#pageNavigation ul{
		padding: 0px;
		margin: 0px 31px 0px 0px;
		list-style: none;
		float: right;
	}
		#pageNavigation li{
			display: block;
			width: 90px;
			height: 80px;
			margin: 10px 0px 0px 25px;
			padding: 0px;
			float: left;
		}
			#pageNavigation #activeBtn{
				background: url(../images/navSelect2.png) repeat top left;
			}
				#pageNavigation #activeBtn li a:hover{
					background: none;
				}
		
		#pageNavigation li a{
			display: block;
			width: 90px;
			height: 70px;
			margin: 0px 0px 0px 0px;	
		}
			#pageNavigation li a:hover{
				background: url(../images/navSelect2.png) repeat top left;
			}

#pageContent{
	width: 960px;
	margin: 0px auto 40px auto;
	font-size: 18px;
	min-height: 50px;
}
	#pageContent #aboutLeft{
		width:640px;
		float: left;
	}
	#pageContent #aboutRight{
		width:230px;
		float: left;
		margin: 20px 0px 0px 90px;
	}
		#pageContent #aboutRight img{
			-moz-box-shadow: 3px 3px 10px #14083b;
			-webkit-box-shadow: 3px 3px 10px #14083b;
			box-shadow: 3px 3px 10px #14083b;
		}
	
	#pageContent .thumbs{
		width: 960px;
		margin: 20px auto;
	}
		
		#pageContent .thumbs .portfolioObject{
			float: left;
			position: relative;
			width: 220px;
			height: 138px;
			margin: 10px 10px 10px 10px;
			outline: 0px solid #039;
			
			-moz-box-shadow: 3px 3px 10px #14083b;
			-webkit-box-shadow: 3px 3px 10px #14083b;
			box-shadow: 3px 3px 10px #14083b;
		}
			
			.portfolioObject .caption{
				display: none;
				position: absolute;
				bottom: 0px;
				left:0px;
				background: #000;
				width: 100%;
/* 				height: 100% */;
				padding: 0px 0px 10px 0px;
				color: #fff;
				opacity: 0.7;
				filter: alpha(opacity=70);
			}
				.portfolioObject .caption h3{
					margin: 10px 10px 0px 10px;
					font-size: 16px;
				}
				.portfolioObject .caption a{
					display: block;
					width: 21px;
					height: 21px;
					margin: 10px;
					position: absolute;
					top: 0px;
					right: 0px;
					background: red;
					color: #fff;
				}
				
				.portfolioObject .caption img{
					width: 21px;
					height: 21px;
					margin: 10px;
					position: absolute;
					bottom: 0px;
					right: 0px;
				}
	

		#pageContent iframe{
			margin: 25px 25px 0px 25px;
			padding: 0px;
			
			-moz-box-shadow: 3px 3px 10px #14083b;
			-webkit-box-shadow: 3px 3px 10px #14083b;
			box-shadow: 3px 3px 10px #14083b;
		}
		
.aLink{
	display: block;
	width: 245px;
	background: #039 url(../images/header_bg.png) repeat-x top left;
	padding: 10px;
	color: #fff;
}
	.aLink:hover{
		background-position: bottom;
	}

#pageFooter{
	width: 960px;
	min-height: 50px;
	margin: 0px auto;
	border-top: 2px solid #999;
}

#contactSocial{
	width: 300px;
	margin-top: 40px;
	float: right;
}
	#contactSocial h2{
		margin: 0px;
	}
	#contactSocial p{
		margin: 5px 0px;
	}
	#contactSocial .socialObject{
		display: block;
		height: 30px;
		width: 150px;
		float: left;
		margin: 10px 0px;
	}
		#contactSocial .socialObject a span{
			display: block;
			float: left;
			vertical-align: middle;
			line-height: 30px;
		}
			#contactSocial .socialObject a span:hover{
			color: #06f;
		}
			#contactSocial .socialObject a img{
				width: 30px;
				float: left;
				margin-right: 8px;
				-moz-box-shadow: 2px 2px 10px #14083b;
				-webkit-box-shadow: 2px 2px 10px #14083b;
				box-shadow: 2px 2px 10px #14083b;
			}

#contactForm{
	width: 500px;
	margin-top: 40px;
	float: left;
}
	#contactForm fieldset{
		outline: none;
		border: none;
	}
		#contactForm fieldset label{
			float: left;
			width: 110px;
			display: block;
			margin: 5px 0px 20px 0px;
		}
		#contactForm fieldset input[type=text]{
			float: left;
			display: block;
			width: 300px;
			height: 25px;
			border: 1px inset #069;
			text-indent: 5px;
			font-size: 16px;
		}
		#contactForm fieldset textarea{
			float: left;
			display: block;
			width: 350px;
			height: 150px;
			border: 1px inset #069;
			text-indent: 5px;
			font-size: 16px;
		}
		#contactForm fieldset input[type=submit]{
			display: block;
			padding: 0px 10px;
			height: 40px;
			border: none;
			background: #039 url(../images/header_bg.png) repeat-x top left;
			margin: 20px 0px 0px 112px;
			font-size: 16px;
			color: #fff;
			cursor: pointer;
		}
			#contactForm fieldset input[type=submit]:hover{
				background-position: bottom;
			}