@charset "UTF-8";

body {
	color:#000000;
	line-height:1.5em;
	font-family:Arial;
	font-size:14px;
	background:#666666;
	margin:0; 
	padding:0;
	z-index:-10;
	
}

.body2  {
	max-width:1150px;
	margin: 0px auto 0px auto;
	position:center;
	background-color:#fff;
	z-index:-5;
}

.page {
	max-width:1000px;
	margin: 0px auto 0px auto;
	position:center;
	background-color:#fff;
}

header {
	width:100%;
	position:fixed;
	z-index:150;
}

.banner {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	max-width:1000px;
	height:120px;
	opacity:1;
	z-index:160;
}

.banner_right_spacer {
	position:absolute;
	top:30px;
	left:0px;
	height:55px;
	width:125%;
	max-width:1250px;
	z-index:170;
	display:inline-block;
}

.banner_right {
	float:right;
	top:0px;
	right:0px;
	height:50px;
	padding-right:37.5%;
	display:inline-block;
}

.header_mask1 {
	position:absolute;
	top:30px;
	left:0px;
	width:30px;
	height:55px;
	z-index:172;
	background-color:fff;
	opacity:1;
	background-repeat:no-repeat;background-size: 30 55px;
	background-image:url(images/header1.jpg);
	display:inline-block;
}

.header_logo {
	position:absolute;
	top:30px;
	left:2.5%;
	width:220px;
	height:55px;
	z-index:200;
	background-color:fff;
	display:inline-block;
	background-repeat:no-repeat;background-size: 220px 55px;
	background-image:url(images/header1.jpg);
}	

.logo_css {
	position:absolute;
	height:50px;
	width:50px;
	vertical-align:top;
	top:0px;
	left:0px;
}

header h1 {
	height:50px;
	width:125px;
}

header h2 {
	height:25px;
	width:150px;
}

h1#webb {
	position:absolute;
	vertical-align:text-top;
	top:5px;
	left:58px;
}

h2#arch {
	position:absolute;
	vertical-align:text-top;
	top:34px;
	left:58px;
}

h1{
	font-size:2.85em; 
	font-weight:bold; 
	color:#666666; 
	margin:0 0 0 0;
	padding:0 0 0 0;
}

h2 {
	font-size:1.25em; 
	font-weight:normal; 
	color:#666666; 
	margin:0 0 0 0;
	padding:0 0 0 0;
}

h3 {
	font-size:1.2em; 
	margin: 0 0 0 0;
}


p {
	margin: 0 0 0 0;
	padding:0 0 0 0;
	color:#999999;
	text-align:justify;
}

br.br_one {line-height:1em;}

br.br_three {line-height:3em;}

br {line-height:2em;}

@-moz-document url-prefix() { 
  br {display:block;margin-top: 10px;}
}

br.br_four {line-height:1.3em;}

br.br_five {line-height:.6em;}

strong {color:#666666}

i {font-size:.9em;}

a {color: #666666; text-decoration:none;}
a:hover {color:#999999;}

.clear_fix {clear:both; line-height:1px;}

footer {font-size: .9em; color: #999999; background-color:#fff; padding: 45px 30px 10px 30px}



/* --------------fade---------------------- */

.fade {
	position:absolute;
	max-width:1000px;
	width:100%;
	top:120px;
	height:auto;
	z-index:160;
}

.line1 {
	top:0px;
	position:absolute; 
	width:100%; 
	height:2px; 
	background-color:#fff; 
	opacity:98%	
}

.line {
	position:absolute; 
	width:100%; 
	height:1px; 
	background-color:#fff;
}

.l2  {top:2px; left:0px; opacity:95%}
.l3  {top:3px; left:0px; opacity:92%}
.l4  {top:4px; left:0px; opacity:89%}
.l5  {top:5px; left:0px; opacity:86%}
.l6  {top:6px; left:0px; opacity:83%}
.l7  {top:7px; left:0px; opacity:80%}
.l8  {top:8px; left:0px; opacity:77%}
.l9  {top:9px; left:0px; opacity:74%}
.l10  {top:10px; left:0px; opacity:71%}
.l11  {top:11px; left:0px; opacity:68%}
.l12  {top:12px; left:0px; opacity:65%}
.l13  {top:13px; left:0px; opacity:62%}
.l14  {top:14px; left:0px; opacity:59%}
.l15  {top:15px; left:0px; opacity:56%}
.l16  {top:16px; left:0px; opacity:53%}
.l17  {top:17px; left:0px; opacity:50%}
.l18  {top:18px; left:0px; opacity:47%}
.l19  {top:19px; left:0px; opacity:44%}
.l20  {top:20px; left:0px; opacity:41%}
.l21  {top:21px; left:0px; opacity:38%}
.l22  {top:22px; left:0px; opacity:35%}
.l23  {top:23px; left:0px; opacity:32%}
.l24  {top:24px; left:0px; opacity:29%}
.l25  {top:25px; left:0px; opacity:26%}
.l26  {top:26px; left:0px; opacity:23%}
.l27  {top:27px; left:0px; opacity:20%}
.l28  {top:28px; left:0px; opacity:17%}
.l29  {top:29px; left:0px; opacity:14%}
.l30  {top:30px; left:0px; opacity:11%}
.l31  {top:31px; left:0px; opacity:8%}
.l32  {top:32px; left:0px; opacity:5%}
.l33  {top:33px; left:0px; opacity:3%}


	
	

/* -------------- projects --------------------------- */

.project_one_spacer {
	width:100%;
	max-width:1000px;
	height:80px;
}


/* ------------ alt first proj container ------------ */

.project_one {
	max-width:1000px;
	width:100%;
	height:auto;
	border-top:50px solid #fff;
	padding:40px 0px 0px 0px;
}


/* ----------- project container-------------------- */

.project_container {
	max-width:1000px;
	width:100%;
	height:auto;
	border-top:50px solid #fff;
	padding:40px 0px 0px 0px;
}

.container {
	display:block;
	max-width:1000px;
	width: 100%;
	height:auto;
	padding-left:2%;
	padding-right:2%;
}

.photo {
	height:auto;
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:40px;
	box-shadow:-3px 5px 4px #666666;
}

.full {width:94%;}

.half {width:46%;}

.third {width:30%;}

.third_center {width:30%;}

.two_thirds {width:62%;}

.fourth {width:22%;}

.three_fourths {width:70%;}

.fifth {width:17.2%;}

.three_fifths {width:55.6%;}

.two_fifths {width:36.4%;}

.three_tenths {width:26.8%;}

.eighth {width:12%;}

.sixth {width:16%;}

.tenth {width:7.6%;}


/* ------------  B  ------------- */

.container_b {
	display:block;
	max-width:1000px;
	width: 100%;
	height:auto;
	padding-left:2%;
	padding-right:2%;
	padding-bottom:50px;
}

.photo_b {
	height:auto;
	float:left;
	margin-left:1%;
	margin-right:1%;
	box-shadow:-3px 5px 4px #666666;
}

.text_b {
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-top:10px;
}

.top {margin-top:20px;}

.container_t {
	max-width:1000px;
	width:100%;
	height:auto;
	border-top:0px solid #fff;
	padding:30px 0px 0px 0px;
}

.divider {
	width:100%;
	height:2px;
	background-color:#fff;
	margin-top:0px;
	margin-bottom:40px;
}

.divider_2 {
	width:100%;
	height:50px;
	background-color:#fff;
	margin-top:0px;
	margin-bottom:0px;
	
}

.divider_sq  {
	width:100%;
	height:auto;
	margin-top:0px;
	margin-bottom:0px;
	
}


/* ------------  C  ------------- */

.container_c {
	display:block;
	max-width:1000px;
	width: 100%;
	height:auto;
	padding-left:2%;
	padding-right:2%;
}

.photo_c {
	height:auto;
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:50px;
	box-shadow:-3px 5px 4px #666666;
}

.left_margin {
	float:left;
	height:1px;
	margin-left:1%;
	margin-right:1%;
}

.text_c {
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-top:0px;
	margin-bottom:50px;
}


/* ------------  D  ------------- */

.more {
	padding-left:2%;
	padding-right:2%;
}

.section_title {
	margin-left:2.5%;
	margin-bottom:30px;
}

.container_d {
	display:block;
	max-width:1000px;
	float:left;
	height:auto;
	padding:0px;
	margin-left:1%;
	margin-right:1%;
}

.photo_d {
	height:auto;
	width:100%;
	box-shadow:-3px 5px 4px #666666;
}

.text_d {
	font-size:.9em;
	padding-left:10px;
	padding-right:10px;
	width:94%;
	margin-top:3px;
	margin-bottom:40px;
}

.shadow {box-shadow:-3px 5px 4px #666666;}

.no_shadow {box-shadow:none;}

.border {
	border-top:1px solid #eee;
	border-right:1px solid #ddd;
}

.border_shadow {
	border-top:1px solid #eee;
	border-right:1px solid #ddd;
	box-shadow:-3px 5px 4px #666666;
}


/* ------------  F  ------------- */

.photo_f {
	height:auto;
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:5px;
	box-shadow:-3px 5px 4px #666666;
}

.text_f {
	font-size:.9em;
	padding-left:10px;
	padding-right:10px;
	width:94%;
	margin-top:3px;
	margin-bottom:40px;
}

/* ------------  G temp about ------------- */

.text_g {
	font-size:1em;
	padding-left:10px;
	padding-right:10px;
	width:94%;
	margin-top:3px;
	margin-bottom:12px;
}

/* -------------- slides -------------- */

.cycle-slideshow {
	width: 96%;
	margin-left:2%;
	margin-right:2%;
	margin-bottom:40px;	
	max-width: 960px;
	min-width:50px;
}

.cycle-slideshow img { width: 100%; }


/* ---------- front page and about ----------- */

.front h3 {font-size:1.1em; margin: 0;}
.front p {line-height:1.2em; font-size: .9em; margin-bottom: .5em;}

.front {background-repeat:no-repeat;background-size: 70px 60px;}
.front.five {background-size: 100px 60px;}
.front.six  {background-size: 100px 60px;}
.front.seven{background-size: 100px 60px;}

.front.one {background-image:url(images/wa_fid.jpg);}
.front.two {background-image:url(images/wa_fed.jpg);}
.front.three {background-image:url(images/wa_fsp.jpg);}
.front.four {background-image:url(images/wa_fha2.jpg);}

.front.five {background-image:url(images/wa_con5.jpg);}
.front.six {background-image:url(images/wa_con6.jpg);}
.front.seven {background-image:url(images/wa_con7.jpg);}

div.content {min-height:80px;}

.front_container {
	padding:20px 0px 15px 20px;
	border-top:15px solid #fff;
}

.front_container .front {
	width:33%;
	float: left;
	background-position:0px 2px;
}
.front_container .front .content {padding: 0px 30px 0px 80px;}
.front_container .front .contact {padding: 0px 30px 0px 110px;}

.cta {
	color:#666666;
}

.content.contact a {
	color: #666666;
	font-weight:bold;
	font-size:1em;
	
}

.contact a:hover {color:#ccc;}


/* --------------------- contact form ---------------------- */	














/* --------------------- main nav ---------------------- */			

.dropdown {
	display:none;
}

.nav_align {
	position:absolute;
	top:27px;
	left:0px;
	height:85px;
	width:100%;
	max-width:1000px;
	z-index:175;
	display:inline-block;
}

nav {
	position:absolute;
	float:right;
	top:0px;
	right:0px;
	height:85px;
	width:165px;
	padding-right:3%;
	background-color:#fff;		
	display:inline-block;
}

nav a {
	color:#666666;
	padding: 1px 0px 2px 10px;
	display:block;
	font-weight:bold;
	font-size:.95em;
	line-height:1.25em;
	text-align:right;	
}

nav a:hover { color:#ccc; }


/* ---------------- formatting for large to medium screens -------------------- */

@media only screen and (min-width:501px) and (max-width:800px) {

.banner {height:105px;}

.banner_right_spacer {
	width:100%;
	max-width:1000px;
}

.banner_right {padding-right:3%;}

.fade {top:140px;}

.nav_align {
	position:absolute;
	top:105px;
	left:0px;
	height:35px;
	width:100%;
	max-width:1000px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	z-index:180;
	display:inline-block;
}

nav {
	top:0px;	
	width:100%;
	max-width:1000px;
	height:35px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
}

nav a {
	float:left;
	padding: 0px 0px 0px 0px;
	display:inline-block;
}

#comm {
	width:32%;
	margin-left:7%;
	text-align:left;
}

#res {
	width:29%;
	text-align:center;
}

#about {
	width:25%;
	margin-right:7%;
	text-align:right;
}

.project_one_spacer {height:90px;}

.content.contact p {line-height:1em;}

p {text-align:left;

	/* -------------------font size-------------------------- */

}

p.text_b, .full  {text-align:justify;
	/* -------------------line-height--------1.2------------------ */
	/* -------------------font size------.75 ->.9?-------------------- */

}

.front_container {
	padding:20px 20px 15px 20px;
	border-top:8px solid #fff;
}

.front_container .front {background-position:0px 0px;}

.front_container .front .content {padding:70px 30px 0px 0px;}

}



/* ------------------- formatting for small screens mobile menu-------------------------- */

@media only screen and (min-width:50px) and (max-width:500px) {


.banner {
	
	height:105px;
	/*--------------------------height:-----------###############------*/
	
}

.banner_right_spacer {		
	width:50%;
	max-width:1000px;
}

.banner_right {						
	padding-right:17%;
	display:none;
}

.nav_align {top:30px;}

.nav_1 {display:none;}

.fade {
	
	top:105px;
	/*----------------------------- z-index:176; ------------##########
	top:-----------------*/
	
}

.dropdown {
	position:relative;
	display:inline-block;	
	top:0px;
	height:50px;
	width:100%;
	max-width:1000px;
}

.dropbtn {
	position:absolute;
	top:0px;
	right:0px;
	padding-right:3%;
	z-index:175;
}

.nav_2 {
	position:absolute;
	display:none;
	float:right;
	top:50px;
	margin-top:50px;
	height:80px;		/*------------ height / width -----------------###########--------*/
	right:0px;
	width:47%;
	min-width:180px;
	z-index:175;
	margin-right:3%;
	margin-top:0px;
	padding-top:16px;
	padding-bottom:16px;
	background-repeat:repeat;
	background-image:url(images/header1.jpg);
	opacity:92%;	
	box-shadow:-3px 5px 4px #666666;
}

.nav_2 a {
	color:666666;
	text-decoration:none;
	display:block;
	font-weight:bold;
	font-size:.95em;       /*------------ font-size -----------------###########--------*/
	line-height:2em;
	text-align:center;
	opacity:1;
}

.dropdown:hover .nav_2 {display:inline-block;}

.project_one_spacer {height:100px;}

/* ----------------------------------------------- */

p {text-align:left;}

p.text_b, .full {text-align:justify;}

.content.contact p {line-height:1em;}

footer {border-top: 1px solid #fff;}


/* ---------------------projects------------------ */

.project_one {padding-top:140px;}

.project_container {
	border-top:20px solid #fff;
	padding-top:20px;
}	

.photo {margin-bottom:20px;}

.front_container {
	padding:0px;
	border-top:none;
}

.front_container .front {
	width:auto;
	float:none;
	padding:10px 0px 0px 0px;
	background-position: 20px 13px;
	border-top:4px solid #fff;
}

.front_container .front .content {padding: 0px 20px 5px 100px;}
.front_container .front .contact {padding: 0px 30px 5px 130px;}

.front p {line-height:1.2em; font-size: .9em; margin-bottom: .5em;}

.about.go_full {width:94%;}

.hide {display:none;}

.divider {
	height:1px;
	margin-bottom:25px;
}


/* ------ B ------- */
	
.container_b {padding-bottom:25px;}

.top {margin-top:20px;}

.photo_b.three_fourths {width:94%;}

.photo_b.fourth {margin-top:20px;}

.text_b.fourth {width:70%;margin-top:20px;}


/* ------ C ------- */

.photo_c {margin-bottom:25px;}

.left_margin {display:none;}

.text_c {margin-bottom:25px;}

p.text_c.two_fifths {width:55.6%;}

p.text_c.third {width:62%;}


/* ------ D ------- */

.text_d {
	margin-top:2px;
	margin-bottom:20px;
	padding-left:0px;
	padding-right:0px;
}

}


