/* 
URL: http://
Author: Matt Green   
Title: Web Developer/Flaxen Design 
Company: Flaxen Design

[Table Of Contents] 

1- Reset
2- Global Styles
3- Major Page Layout Elements
4- Header
5- Navigation 
6- Content 
7- Pages
8- Footer
*/

/* 1. Reset 
-------------------------------------------------------------- */
@import url("reset.css");

/* 2. Global Styles and General Selectors
-------------------------------------------------------------- */
@import url("global.css");

h1, h2, h3, h4, h5, ul, form, img, p { margin-bottom: 15px; }
h1, h2, h3, h4, h5 { font-family: Georgia, Times, serif; }
h3.home { color: #0e691f; font-size: 29px; }
h3 { color:#333; color: #0e691f; margin-bottom:10px; padding-top:7px; }
h4, h4 a, h5 { font-size: 14px; display: block; margin-bottom:10px; font-family: Georgia, Times, serif; text-decoration: none; color:#666; }
h3 a { font-size: 14px; display: block; margin-bottom:10px; font-family: Georgia, Times, serif; text-decoration: none; color:#666; }
h4 a:hover { display: block; width: 100%; height:100%; }
p, a, li, h5 { font-family: "lucida grande", "lucida sans", Arial, Verdana, sans-serif; }
p, li, a { line-height: 20px; color: #777; font-size: 12px; }
a { text-decoration: underline; }
a:hover { text-decoration: none; }
ul { list-style: disc; }
div.divider { height: 2px; width: 100%; border-bottom: dotted 1px #ccc; margin-bottom: 15px; }
form.gallery { margin: -8px 0px 10px 0px; }
.instruct { font-size:11px; line-height: 15px; }
.right ul.news {  }
.right ul.news li {  margin-bottom: 5px; }

/* Scott Strong memorial
-------------------------------------------------------------- */

.scott p {
	font-size: 10px;
	line-height: 16px;
} 

.scott_pic { 
	max-width: 570px;
	margin-left:160px;
}

.half_scott {
	float: left;
	width:45%;
}

.left_scott {
	padding-right: 4%;
	border-right: 1px #ccc solid;
}

.right_scott {
	padding-left: 5%;
}

/* 3. Major Page Layout Elements 
-------------------------------------------------------------- */

body { background: #dcdedd url(../images/body_bg.jpg) top center repeat-x; position: relative; }

#container {
	width:985px;
	margin:0px auto;
	position: relative;
	z-index: 2;
}

/* 4. Header 
-------------------------------------------------------------- */
.header {
	position: relative;
	background: url(../images/top_bar.png) top center no-repeat;
	margin-top: -15px;
	height:400px;
}

.sub_header { height:305px; }

/* logo */
h1#branding a {
	height: 154px;
	width: 154px;
	position: absolute;
	top:15px;
	left:44px;
	background: url(../images/logo.png) no-repeat;
	text-indent: -9999px;
}

/* green area and the content inside of it */
.head { 
	background: url(../images/header_bg.png) no-repeat;
	width:100%;
	height:273px;
	position: absolute;
	top:110px;	
	left:3px;
	z-index: 100;
}

.sub_head { background: url(../images/header_sub_bg.png) no-repeat;	height:177px; }
.head p, .head h2, .head a { width:510px; margin-left:210px; } 
.head p.employment { width:700px; }
.head p.testimonials { width:400px; }
.head p.in_mem { width:700px; font-size: 15px; font-style: italic; }

.head h2 { margin-top:30px; margin-bottom:5px; }

.sub_about { background: url(../images/subhead_about.png) no-repeat; }
.sub_ec { background: url(../images/subhead_ec.png) no-repeat; }
.sub_pg { background: url(../images/subhead_pg.png) no-repeat; }
.sub_engineering { background: url(../images/subhead_engineering.png) no-repeat; }
.sub_employment { background: url(../images/subhead_employment.png) no-repeat; }
.sub_testimonials { background: url(../images/subhead_testimonials.png) no-repeat; }

.head p {
	font-family: Georgia, Times, sans-serif;
	font-size: 14px;
	line-height: 22px;
	color: #fff;
	width:500px;
}

h2.headline{ width:500px; height:45px; text-indent: -9999px; }
h2.home { background: url(../images/headline_home.png) no-repeat; margin-top:50px; margin-bottom:15px;}
h2.about { background: url(../images/headline_about.png) no-repeat; }
h2.our_work { background: url(../images/headline_our_work.png) no-repeat; }
h2.engineering { background: url(../images/headline_engineering.png) no-repeat; }
h2.employment { background: url(../images/headline_employment.png) no-repeat; }
h2.contact { background: url(../images/headline_contact.png) no-repeat; }
h2.testimonials { background: url(../images/headline_testimonials.png) no-repeat; }
h2.in_memory { background: url(../images/headline_in_memory.png) no-repeat; }
h2.community { background: url(../images/headline_community.png) no-repeat; }

img.plug { position:absolute; right:-25px; top:15px;}
.head a#read_more img { margin-top: 10px; }

/* login form */
#login {
	position: absolute;
	right:0px;
	top:0px;
	z-index:101;
	border: none;
	margin: 0;
	padding: 0;
}

#login form#form { 
	background: url(../images/login_top.png) no-repeat;
	width:255px;
	height:96px;
	padding-top: 12px;
	margin:0px;
	display: none;
}

#login form p label { 
	width:60px;
	float: left;
	text-align: right;
	color:#ccc;
	margin:0px 8px 0px 23px;
	padding-top: 5px;
}

#login form p input[type="text"], 
#login form p input[type="password"] {
	width:130px;
	height:15px;
}

#login form input[type="submit"] {
	width:36px;
	height:19px;
	background: url(../images/go.jpg) no-repeat;
	text-indent: -9999px;
	border: none;
	float: right;
	margin-right: 29px;
}

a.login {
	display: block;
	width:255px;
	height:45px;
	text-indent: -9999px;
	background: url(../images/login_btn.png) no-repeat;
	cursor: pointer;
}

/* 5. Navigation 
-------------------------------------------------------------- */

ul#navigation {
	width:100%;
	height:31px;
	position: absolute;
	top:79px;
	left:204px;
}

ul#navigation li {
	position: relative;
	width:98px;
	height:23px;
	background: url(../images/btn_nav.png); 
	text-decoration: none;
	color:#387b51;
	font-size: 13px;
	padding:8px 0px 0px 20px;
	float: left;
	list-style: none;
	margin-left: 0px;
	cursor: pointer;
}

ul#navigation li.home { left:0px; z-index:30; padding-left:32px; width:86px; }
ul#navigation li.about { left:-18px; z-index:29; padding-left:10px; width:108px; }
ul#navigation li.our_work { left:-36px; z-index:28; padding-left:20px; }
ul#navigation li.engineering { left:-55px; z-index:27; padding-left:15px; width:103px; }
ul#navigation li.employment { left:-74px; z-index:26; padding-left:14px; width:104px; }
ul#navigation li.testimonials { left:-92px; z-index:25; padding-left:14px; width:104px; }
ul#navigation li.contact { left:-110px; z-index:24; padding-left:30px; width:88px; }


ul#navigation li#selected { background: url(../images/btn_selected.png); color:#fff; z-index: 31; }
ul#navigation li#selected a, ul#navigation li#selected_home a { color:white; }
ul#navigation li#selected_home { background: url(../images/btn_home_sel.png); color:#fff; z-index: 32; }
.header ul#navigation li:hover, ul#navigation li#selected:hover { background: url(../images/btn_rollover.png); color:#fff; cursor: pointer; z-index: 700;}

ul#navigation li a { color:#387b51; font-size: 13px; text-decoration: none; height:100%; width:100%; }
ul#navigation li:hover a, ul#navigation li:hover a.selected { color: white; z-index: 40; }

/* Second Level */
ul#navigation li ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 1px;
 z-index: 598;
 width: 100%;
}

ul#navigation li:hover { position: relative; z-index: 699; }
ul#navigation li:hover > ul { visibility: visible; }

ul#navigation li ul {
	 background: #3e3e3e;
	 width:125px;
	 padding:10px;
	 -moz-border-radius-bottomleft: 6px;
     -moz-border-radius-bottomright: 6px;
     -moz-border-radius-topright: 6px;
     -webkit-border-bottom-left-radius: 6px;
     -webkit-border-bottom-right-radius: 6px;
     -webkit-border-top-right-radius: 6px;
}	
	
ul#navigation li ul li {
	background-image:none;
	margin:0;
	width:125px;
	height:100%;
	border-bottom:1px #262626 solid;
	border-top:1px #616161 solid;
	margin:0;
	padding:4px 0px 4px 0px;
}

.header ul#navigation li ul li:hover { background: #555; }
ul#navigation li ul li a { font-size: 12px; font-weight: normal; display: block; }
ul#navigation li ul li a:hover { background:none; cursor: pointer; }
ul.navigation ul li.first { border-top: none; }
ul.navigation ul li.last { border-bottom: none; }


/* 6. Content
-------------------------------------------------------------- */

/* backgrounds of containers, the middle one is flexible */
#content_top {
	width: 985px;
	height: 18px;
	background: url(../images/content_top.png) no-repeat;
}

#content {
	width: 925px;
	padding:10px 30px;
	min-height: 400px;
	background: url(../images/content_middle.png) repeat-y;
}

#content_bottom {
	width: 985px;
	height: 18px;
	background: url(../images/content_bottom.png) no-repeat;
}

/* The left and right columns for the content area */
.left, .right { float: left; }
.left { width:600px; }
.left p, .left h4 { padding-right: 30px; }
.left ul li, .right ul li { margin-left: 15px; }
.right { width: 315px; }
.gallery_left, .gallery_right { width:460px; }
.gallery_right{ margin-left: 30px; width:430px; }
.half { width: 50%; }
.com_column { float:left; }
.com_left { width: 25%; }
.com_right { width: 75% }


/* Content boxes within content area */
.box, .box_half { border: 1px #e5e5e5 solid; padding:41px 10px 10px 10px; margin-bottom:20px; position:relative; float:left; }
.left .box { width:530px; }
.right .box { width:295px; }
.left .box_half, .right .box_half { width: 85%; }
.right .box_half { margin-left: 15px; }

/* Headline treatment, the h4 and the box overlaps */
.box h4, .box_half h4 { position: absolute; top:-1px; left: -1px; padding: 6px 0px 6px 10px; }
img.box_overlap { position: absolute; left:100%; top:-1px; }
.gold h4 { color: #4a4a4a; background: url(../images/h4_gold.jpg) repeat-x; width:542px; }
.green h4 { color: #fff; background: url(../images/h4_green.jpg) repeat-x; width:307px;}
.gold_half h4 { color: #4a4a4a; background: url(../images/h4_gold.jpg) repeat-x; width:405px; }
.green_half h4 { color: #fff; background: url(../images/h4_green.jpg) repeat-x; width:405px; }
.left .half { width: 50%; }

/* 2 buttons for any content boxes*/
.read_more, .view_gallery {
	width: 104px;
	height: 29px;
	text-indent: -9999px;
	float: left;
	margin-right: 10px;
}

.read_more { background: url(../images/read_more.jpg) no-repeat; }
.view_gallery { background: url(../images/view_more.jpg) no-repeat; }

img.cat_img {
	 width: 100px;
	 margin-right: 15px;
	 margin-bottom: 0px;
	 float: left;
	 margin-top: 7px;
}

/* 7. Pages
-------------------------------------------------------------- */

/* Home */
#home { }

/* About */
#about { }

/* Our Work */
#our_work .left h3 { margin:0; padding:0; }
#our_work .left h3 a { 
	padding: 6px 0px 0px 10px; 
	color: #4a4a4a; 
	background: url(../images/projects_bg.jpg) repeat-x; 
	width:559px; 
	height:23px;
	margin:0px; 
	border-right: 1px #e5e5e5 solid;
	border-bottom: 1px #e5e5e5 solid;
	border-left: 1px #e5e5e5 solid;
	border-top: 1px #e5e5e5 solid;
	cursor: pointer;
}

#our_work .left h3 a:hover, 
#our_work .left .ui-state-active a {
	background: url(../images/h4_gold.jpg) repeat-x;
	width:560px;
	border-right: 0px;
	border-bottom:0px;
	border-left: 0px;
	border-top:none;
	height:24px;
	padding: 7px 0px 0px 11px; 
	position: relative;
}

#our_work .left .ui-state-active a { height:31px; }
#our_work .left .ui-state-active a:hover { height:31px; }
#our_work .left h3 { background: url(../images/h4_box_gold.jpg) no-repeat top right; width: 571px; }
#our_work .right .box ul { margin-bottom: 5px; } 

#content #our_work .left #accordion div p, 
#content #our_work .left #accordion p { 
	width:534px;
	border-right: 1px #e5e5e5 solid;
	border-left: 1px #e5e5e5 solid;
	padding:12px 12px 15px 12px;
	position: relative;
	top:-7px;
	margin-bottom: -8px;
}

.view_pg {
	float: right;
	margin-right: 35px;
	margin-bottom: -10px;
}

/* Engineering */
#engineering ul li { margin-left: 15px; font-size: 12px; }
#engineering h5 { margin-bottom: 5px; color:#444; font-weight: bold; font-size: 12px; }
#engineering h5 + h5 { margin-top: 15px; }
#engineering img.eng_img { margin:7px 0px 13px; width:225px; }
#engineering .left .right ul, #engineering .left .right h5, #engineering .left .right img { padding-left: 20px; }
div.apply { margin:-70px 30px 0px 0px; float:right; }
div.apply img { margin:0; display: block; padding-right: 5px; }
div.apply a { margin-left: 4px; margin-top: -5px; }
div.project_list { float:right; margin:0px 0px 10px 15px; width:175px; }
div.project_list a img { float: left; margin-right:10px; }

/* Employment */
#employment ul li { margin-left: 15px; }

/* Contact */
#contact ul { list-style: none; }
#contact ul strong { color:#444; }
#contact ul.contact li { margin-left: 0px; }
#contact h5 { color:#222; font-weight: bold; margin-bottom: 10px; margin-top: 10px; }
#contact strong { color:#555; }
#contact .memberships_links p { margin-left: 15px; margin-bottom: 7px; }

/* Form */
form#form_page { padding-top:20px; text-align:center; }
form#form_page p label { width:100px; text-align: right; margin:0px 10px 0px 23px; padding-top: 5px; }
form#form_page p input[type="text"], 
form#form_page p input[type="password"] { width:150px; height:15px; }
form#form_page input[type="submit"] { margin-left: 200px; }

p.warning {
	padding:10px;
	border:1px dotted #666;
	background:#f6dada;
	font-weight:bold;
	color:black;
	font-size:12px;
	text-align: center;
	width:250px;
	margin-left: 335px;
}

p.success {
	padding:10px;
	border:1px dotted #666;
	background:#E6EFC2;
	font-weight:bold;
	font-size:14px;
	width:90%;
}

/* Testimonials */
p.test { font-style: italic; font-size: 11px; text-indent: 15px; position: relative; }
#testimonails .left p, #testimonails .right p { margin: 5px 0px; }
p.name { margin: -5px 0px 5px 0px; font-size: 11.5px; }
span.open_quote { font-size: 26px; color: #ccc; position: absolute; font-family: Verdana, sans-serif;  left:-18px;}
span.close_quote { font-size: 26px; color: #ccc; font-family: Verdana, sans-serif; position: absolute; bottom:0px; margin-left: -10px; }

/* Community */
.com_image { width: 200px; float: left; margin-right: 20px; margin-bottom: 20px; }

/* 8. Footer 
-------------------------------------------------------------- */
div.bottom_bg {
	position: absolute;
	bottom:170px;
	background:url(../images/bottom_bg.png) center bottom;
	width: 100%;
	height:800px;
	z-index: 1;
}

#footer {
	margin-top: 20px;
	width:100%;
	background: url(../images/footer_bg.jpg) repeat-x #121212;
	float: left;
	position: relative;
}

#footer_content { width:985px; margin:0px auto; }
#footer_content ul li { color: #ccc; font-size: 12px; list-style: none; }
#footer_content ul li a { color: #ccc; font-size: 12px; text-decoration: none; }
#footer_content ul li a:hover { color:#fff; }

#footer_content ul.column {
	width: 19%;
	height: 90px;
	float: left;
	margin: 30px 0px 50px 0px;
}

#footer_content ul.column li.indent { text-indent: 12px; }
#footer_content ul.column li.white { color:white; }

.one { border-right:#555 solid 1px; }
.two, .three, .four { border-left:#111 solid 1px; border-right:#555 solid 1px; }
.five { border-left:#111 solid 1px; }

.one li { padding-left: 80px; }
.two li { padding-left: 30px; }
.three li { padding-left: 30px; }
.four li { padding-left: 15px; }
.five li { padding-left: 15px; }