/* 
Blue = #0056ac
Green = #B5D800
Stone = #E3E2DE
Light blue  = #E5F6FD
*/

/* CSS default property reset */
@import url("css/reset.css") all;


body {
	margin:0;
	padding:0;
	background-color:#B5D800;
	font-family: helvetica,arial,sans-serif;
	font-size:75%;
	color:#333;
	line-height:1.3;
	min-width:817px;
}


a img {
	border:none;
}


address {
	font-style:normal;
}


/* For fixed width layout */

body {
	/*width:960px; */
	width:100%;
	margin:0 auto;
}

html>body {
	font-size:12px;
}


#top {
	/*position:relative;*/
	background-color:#0056ac;
}


	#header {
		background:url(../images/headershadow.png) bottom left repeat-x #0056ac;
		padding-bottom:15px;
		float:left;
		width:100%;
	}
	
	#header h1 {
		float:left;
		padding-left:30px;
	}
	
	#header #telnumber {
		float:right;
		padding-right:30px;
		padding-top:20px;
	}
	
	
	#navbar {
		margin:0 0 0 -16px;
		padding:0px;
		min-width:817px;
		clear:left;
	}

		#navbar ul {
			list-style:none;
		}

			#navbar ul li {
				float:left;
				border-right:1px solid #CEE0D7;
			}
			
			#navbar ul li a {
				color:#fff;
				text-decoration:none;
				margin:0 8px;
			}
			
				#navbar ul li a:hover {
					color:#B5D800;
				}


				#navbar ul li img {
					display:block;
					border:1px solid #fff;
					border-bottom:none;
				}
	
	
	#middle {
		position:relative;
		margin-right:500px;
		float:left;
		min-height:510px;
		padding-bottom:50px;
		margin-bottom:-2px; /* this is the same as the negative top margin on #treeimg */
	}


		#middle h2 {
			margin:0.5em 0 0.5em 0;
			font-weight:normal;
			font-size:170%;
			color:#EFD54A;
		}
		
		
		#middle h3 {
			margin:0 0 0.5em 0;
			font-weight:normal;
			font-size:130%;
			color:#EFD54A;
		}
		
		#middle h4 {
			margin:2em 0 0.5em 0;
			font-weight:normal;
			font-size:110%;
			color:#EFD54A;
		}
		
		
		#middle p {
			margin-bottom:0.65em;
			line-height:1.34;
		}

		#middle p.intro, div.intro {
			font-size:134%;
			line-height:1.3;
			margin-bottom:0.4em;
		}
		
		#middle ul, #middle ol {
			margin:1em 1em;
		}
		
		#middle li {
			margin:0.5em 0;
		}


	#middle #tree {
		margin-left:30px;
		float:right;
		position:absolute;
		top:0;
		right:0;
		height:100%;
	}

		#content #text {
			color:#E5F6FD;
			margin-left:30px;
			margin-right:30px;
		}
		
		#content a:link, #content a:visited {
			color:#B9B32B;
		}
		
		#content a:hover, #content a:active {
			color:#B5D800;
		}
		



		div.tip {
			position:relative;
			width:400px;
		}
		
		.fade {
			position:absolute;
			top:0;
		}

		#treeimg {
			position:absolute;
			top:-12px;  /* this is the same as the negative bottom margin on #middle */
			padding-bottom:12px;
			width:500px;
			height:100%;
			background:url(/images/tree.png) top right no-repeat;
		}

			#treeimg a.bubble {
				position:absolute;
				z-index:50;
			}

			#treeimg img {
				display:block;
				border:none;
			}

			body.casestudies #treeimg {
				background:url(/images/squigglebg.png) top right no-repeat;
			}



	#message {
		background:url(/../images/messagebotbg.gif) bottom left no-repeat #fff;
		margin-top:25px;
		padding:0 0 20px 0;
		width:367px;
		position:absolute;
		bottom:57px;
	}

		#message h3 {
			color:#555;
			font-size:110%;
			padding-left:65px;
			padding-top:8px;
			background:url(../images/messagetopbg.gif) top left no-repeat transparent;
		}

		#message p {
			color:#555;
			font-size:95%;
			padding-left:65px;
			width:250px;
		}

		#message *.more {
			position:absolute;
			bottom:20px;
			right:15px;
		}
	
	
	

#bottom {
	background:url(../images/bottombg.png) top left repeat-x #B5D800;
	padding-top:10px;
	padding-bottom:50px;
/*	width:960px;*/
}


#panels {

}

	#panels div.inner {
		width:939px;
		margin:0 auto;
	}

	div.panel {
		float:left;
		width:283px;
		padding:10px;
		margin:10px 15px 10px 15px;
		min-height:150px;
		min-width:227px;
		background-color:#e3e2de;
	}


#portfolio {
	padding:0;
	margin:40px 30px;

}


#footer {
	color:#0056AC;
	font-size:90%;
}

	#footer .innerwrap {
		padding:0 10px;
	}

.innerwrap {
	width:960px;
	margin:0 auto;
}

.portfolioitem {
	float:left;
	display:block;
	margin:10px;
	width:110px;
}

.portfolioitem {
	border:1px solid #B5D800;
}

.portfolioitem:hover {
	border:1px solid #fff;
}

.teamphoto {
	float:left;
	margin-right:1em;
	border:1px solid #fff;
}

.person {
	clear:left;
	overflow:auto;
	margin-top:2em;
}

	.person p {
		margin-left:145px;
	}

hr.clearer {
	clear:both;
	visibility:hidden;
}

.toggle {
	text-decoration:none;
}

.casestudy {
	margin-bottom:2em;
	padding-bottom:2em;
	border-bottom:1px solid #1563AF;
}

.casestudyexample {
	display:block;
	margin-top:1em;
}


.calltoaction {
	font-size:120%;
	padding:8px;
	background-color:#AFD7FF;
	color:#333;
}

/*  CONTACT FORM   */
#contactForm {

}

#contactForm label {
	display:block;
}

#contactForm input, #contactForm textarea {
	display:block;
	width:100%;
}


#contactForm #submit {
	width:auto;
}

#contactForm .error {
	color:#FDFF00;
}