@charset "UTF-8";
/* CSS Document */

/*
Red: #a90823;
*/


html { margin:0; padding:0; 
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; }
body { margin:0; padding:0;  }

/* ---------------------    Header   ------------------ */

.header { width:100%; position:fixed; top:0; z-index:10; }
.header_container { width:100%; height:100px; background:#a90823; }
.header_container#homepage { background:none; }
#desktop_header { width:960px; margin:0px auto; height:100px; line-height:100px; }

#logo { float:left; }
#logo_container { width:220px; position:relative; top:15px; }
#logo_container img { width:100%; }

#header_link { text-transform:uppercase; font-size:22px; letter-spacing:5px; margin-left:50px; 
	float:left; text-align:center; line-height:20px; top:25px; position:relative; }
#donate { text-transform:uppercase; font-size:22px; letter-spacing:5px; margin-left:35px; height:55px; 
	line-height:20px;  text-align:center;
	padding:10px 20px 2px 20px; border:1px solid #FFFFFF; float:left; position:relative; top:16px;}
#donate:hover { border:1px solid #000000; }

.header a { font-decoration:none; color:#FFFFFF; }
.header a:hover { color:#000000; /*text-shadow:1px 1px 3px #000000;*/ }

/* ---------------------    End Header   ------------------ */


/* ---------------------    Homepage   ------------------ */

.homepage_top { width:100%; background-size:cover; height:600px; position:relative; top:-120px; background:#000000;
	 background:url(../images/system/SuperiorExteriors1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
#homepage_top_content { max-width:960px; margin:0px auto; position:relative; top:200px; }

#homepage_top_text { font-size:35px; font-weight:100; color:#FFFFFF; text-align:center; margin-top:40px; }
#homepage_top_icon_container { max-width:700px; margin:0px auto; margin-top:40px; }
#homepage_top_icon { width:32%; text-align:center; float:left; text-transform:uppercase; font-size:26px; letter-spacing:2px;
	 color:#FFFFFF; }
	 
.homepage_headline { max-width:80%; width:300px; text-align:center; border-bottom:3px solid #000000; text-transform:uppercase;
	margin:40px auto 20px auto; font-size:30px; letter-spacing:6px; }
	 
.homepage_showoff { position:relative;  top:-40px; margin-top:90px; }
.homepage_showoff img { max-width:90%; position:relative; left:190px; }

.homepage_boxes { max-width:700px; width:90%; margin:0px auto; }
.homepage_boxes #box_left { float:left; width:60%; margin-right:10%; }
.homepage_boxes #box_right { float:left; width:30%; }
#box_right img { width:100%; position:relative; top:30px; }

.color_title { width:500px; height:40px; line-height:40px; border:2px solid #FFFFFF; background:#a90823;
	color:#FFFFFF; font-size:26px; letter-spacing:2px; text-transform:uppercase; text-align:center; 
	margin:20px auto; font-family: 'Lusitana', serif; }

.content { max-width:960px; margin:0px auto; }
.homepage_content { position:relative; top:-100px; max-width:960px; margin:0px auto; }

.homepage_content a { color:#000000; text-decoration:none; }

#showoff_text { background:rgba(0,0,0,0.7); width:450px; padding:25px; margin:0px auto; height:100px; 
	position:relative; top:-20px; color:#FFFFFF; font-size:18px; }
#showoff_text a { color:white; }
	
.homepage_estimate { width:500px; text-align:center; margin:0px auto; background:rgba(0,0,0,0.7); height:100px; 
	border:3px solid #FFFFFF; color:#FFFFFF; font-size:30px; text-transform:uppercase; }
.homepage_estimate #estimate_text { position:relative; top:15px; }

.homepage_img_box { width:100%; height:500px; }

.gathering_icons { max-width:535px; margin:0px auto; }
.concept_icon { width:128px; height:120px; padding:35px 15px 0px 15px; display:block; 
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; 
	float:left; margin:10px 10px; text-align:center; text-transform:uppercase; color:#FFFFFF;
	font-size:18px; }
.concept_icon#black:hover, .concept_icon#one:hover, .concept_icon#two:hover, .concept_icon#three:hover, .concept_icon#four:hover, .concept_icon#five:hover, .concept_icon#six:hover, .concept_icon#seven:hover, .concept_icon#eight:hover { background:#2f488b; cursor:pointer; }
.concept_icon#black { background:#4D4D4D; }
.concept_icon#one { background:#a38e18; }
.concept_icon#two { background:#1a5f83; }
.concept_icon#three { background:#7c6c12; }
.concept_icon#four { background:#0a2f4f; }
.concept_icon#five { background:#82211d; }
.concept_icon#six { background:#c2a91b; }
.concept_icon#seven { background:#a82a25; }
.concept_icon#eight { background:#621714; }
/*#concept_icon img:hover { box-shadow:2px 2px 5px #000000;  }*/

#latest_left { width:50%; float:left; }
#latest_left img { display:block; width:80%; margin:0px auto; }
#latest_left_text { margin:20px auto 0px auto; width:80%; font-size:18px; }

#latest_right_placeholder { background:#555555; color:#FFFFFF; width:80%; height:430px; line-height:40px; 
	text-align:center; font-size:20px; margin:0px auto;
	webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; }
	
#involved_left { float:left; width:33%; cursor:pointer; }
#involved_title { width:100%; text-align:center; font-weight:700; text-transform:uppercase; letter-spacing:10px; font-size:34px; }
#involved_left img { display:block; margin:10px auto; }
#involved_text { width:80%; margin:30px auto; font-size:18px; }

#about_col_left { width:45%; float:left; margin-left:10px; text-align:justify; }
#about_col_right { width:45%; float:right; margin-right:10px; text-align:justify; }
#about_col img { margin:0px auto; }

.consultation { text-transform:uppercase; margin:10px auto; max-width:500px; width:90%; background:#2f488b;
	color:#FFFFFF; webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;
	text-align:center; font-size:28px; line-height:30px; padding:20px 0px; box-shadow:3px 3px 10px #000000;  }
.consultation:hover { background:#970E10; }

		
/* ---------------------    About  ------------------ */

.services_page { max-width:960px; width:100%; margin:30px auto; }

#about_text { width:90%; margin:0px auto 20px auto; }
#about_headline { height:50px; line-height:60px; width:90%; margin:90px auto 20px auto; font-size:28px; text-transform:uppercase; font-weight:700; letter-spacing:12px; /*border-bottom:2px solid #9E0B0F;*/ background:#9E0B0F; color:#FFFFFF; text-align:center; }

#leadership_content { width:25%; float:left; margin-bottom:35px; }
#leadership_content img { width:50%; display:block; margin:5px auto; }
#leadership_name { text-align:center; font-size:18px; }
#leadership_title { text-align:center; font-style:italic; font-size:14px; }

#staff_content { width:33%; float:left; }
#staff_content img { width:50%; display:block; margin:5px auto; }
#staff_name { text-align:center; font-size:18px; }
#staff_title { text-align:center; font-style:italic; }

/* ---------------------    End About  ------------------ */

/* ---------------------    Client Info Page  ------------------ */

.client_info_page { max-width:400px; width:100%; margin:30px auto 200px auto; }

#wrong { border:2px solid #C51619; background:#EDCBCC; }

#client_label_1 { width:140px; float:left; height:36px; line-height:36px; margin-right:10px; margin-bottom:10px; 
	text-align:right; font-size:16px;   }
#client_label_2 { width:80%; margin:0px auto; border-bottom:1px solid #000000; font-weight:700; 
	text-align:center; margin-bottom:15px; }

.client_info_page input { float:right; width:60%; height:30px; border:0; margin-bottom:10px; 
	-webkit-appearance: none;
	 -webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; border:2px solid #000000; font-size:18px; font-family: 'Crimson Text', serif; }
.client_info_page textarea { width:95%; border:0; margin-top:10px; height:112px; margin-bottom:-5px; -webkit-appearance: none; position:relative; left:9px; resize:none; -webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; border:2px solid #000000; font-size:18px; font-family: 'Crimson Text', serif;  }
.client_info_page #submit { float:right; width:140px; height:40px; margin-right:3px; 
	-webkit-appearance: none; background:#2f488b; border:0; color:#FFFFFF; letter-spacing:1px; 
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-align:center; line-height:40px; }
.client_info_page #submit:hover { background:#9E0B0F; cursor:pointer; -webkit-appearance: none; }

/* ---------------------    End Client Info Page  ------------------ */

/* ---------------------    Concept  ------------------ */

.concept { }
.concept a { text-decoration:none; }

#gathering_text { width:70%; margin:15px auto; }
#gathering_button { max-width:400px; width:70%; padding:15px; font-size:24px; letter-spacing:2px; background:#056839; margin:10px auto; 	
	webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; color:#FFFFFF; 
	text-align:center; text-transform:uppercase; line-height:22px; cursor:pointer; }
#gathering_button:hover { background:#9E0B0F; }

/* ---------------------    End Concept  ------------------ */

/* ---------------------    Support  ------------------ */

.support { }
.support a { color:#000000; }

#support_text { width:80%; margin:30px auto; }
#support_headline { width:80%; font-size:28px; text-transform:uppercase; font-weight:700; letter-spacing:12px;  }
#support_paragraph { margin-bottom:45px; }

#vol_text { width:80%; margin:15px auto 25px auto; font-size:18px; }

#donate_icon { display:block; margin:0px auto; }
#paypal { margin:40px auto; width:300px; }

/* ---------------------    End Support  ------------------ */


/* ---------------------    End Homepage  ------------------ */

.other_page { max-width:800px; width:90%; margin:130px auto 20px auto;  }
#gallery_block { width:33%; float:left; height:200px; overflow:none; background:#FFFFFF; }
#gallery_block img { height:100%; }

/* ---------------------    Contact   ------------------ */

#contact_left { width:50%; float:left; }

#contact_right { width:50%; float:left; }
#contact_right_content { text-align:left; font-size:24px; line-height:26px; margin-top:40px; margin-left:50px; }
#contact_right_content iframe { width:100%; height:310px; position:relative; top:-40px; }

#contact { width:70%; float:right; margin-right:40px; }

#contact input { width:90%; margin-left:5%; height:30px; border:0; margin-top:10px; -webkit-appearance: none;
	 -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px; border:2px solid #000000; font-size:18px;  }
#contact textarea { width:90%; margin-left:0%; border:0; margin-top:10px; height:112px; margin-bottom:-5px; -webkit-appearance: none; position:relative; left:9px; resize:none; -webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; border:2px solid #000000; font-size:18px; }
#contact #submit { float:right; width:180px; height:40px; margin-right:3px; 
	-webkit-appearance: none; background:#2f488b; border:0; color:#FFFFFF; letter-spacing:1px; }
#contact #submit:hover { background:#9E0B0F; cursor:pointer; -webkit-appearance: none; }

#text { }
#text_headline { text-align:center; font-size:24px; text-transform:uppercase; }
#text_text { }
#contact_left { width:50%; float:left; margin-top:50px; font-size:20px; }
#contact_right { width:50%; float:right; margin-top:20px; }
#contact2 { }
#contact_success { margin-top:35px; text-align:center; float:left; width:250px; padding:25px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; border:2px solid #056839; }
#contact_failure { margin-top:35px; text-align:center; float:left; width:250px; padding:25px; -webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px; border:2px solid #9E0B0F; color:#000000; }
#contact_failure:hover { background:#AC4849; }
#contact_failure a { color:#000000; }
#contact_failure a:hover { color:#9E0B0F; }

#contact_right a { color:#000000; }
#contact_right a:hover { color:#9E0B0F; }


.contact_letterhead { max-width:960px; min-height:200px; width:90%; margin:20px auto; }
.contact_letterhead img { float:left; height:170px; }
        
#letterhead_right { float:right; width:85%; margin-top:14px; border-bottom:2px solid #000000; padding-bottom:8px; }
        	
#letterhead_top { margin:0px auto; font-size:36px; text-align:center; }
#letterhead_top_2 { margin:0px auto; font-size:22px; text-align:center; position:relative; top:-13px; }
            
#letterhead_left_2 { float:left; font-size:20px; line-height:22px; }
            
#letterhead_right_2 { float:right; font-size:20px; line-height:22px; text-align:right; }


/* ---------------------    End Contact   ------------------ */


/* ---------------------   Footer   ------------------ */

.footer { width:100%; text-align:center; margin-top:20px; margin-bottom:50px; }
.footer_container { max-width:960px; margin:0px auto; }
#footer_text { width:100%; color:#000000; text-decoration:none; }

.footer a { text-decoration:none; color:#000000; }
.footer a:hover { color:#9E0B0F; }

.flags { margin:10px auto; width:60%; }
.flags img { height:60px; margin:0px 5%; }

/* ---------------------    End Footer   ------------------ */

/* ---------------------    Friends   ------------------ */

#friend_text { font-size:18px; width:90%; margin:0px auto; }

#friend_logos { margin:30px auto; }
#friend_logos img { width:15%; margin-left:5%; float:left; }
        
#friend_offers { width:100%; }
#friend_offers #headline { width:90%; margin:0px auto 70px auto; font-size:36px; text-align:center; }
            
#friend_offers .col_1 { width:30%; float:left; margin-right:3%; font-size:18px; line-height:20px; }
#friend_offers .col_2 { width:45%; float:left; margin-right:3%; font-size:18px; line-height:16px; }
#friend_offers .col_3 { width:17%; float:left; font-size:26px; }
#friend_offers #title { font-weight:700; font-size:22px; }
#friend_offers #title_hr { background:#000000; height:1px; width:100%; border:0; margin-bottom:30px; }

#friend_clear { clear:both; width:100%; height:70px; }
#friend_clear hr { background:#000000; margin:0px auto; width:70%; height:1px; position:relative; top:50%; border:0; }

			
/* ---------------------    End Friends   ------------------ */


/* ---------------------    Mobile Header   ------------------ */

#mobile_header { display:none; }
#nav > a { display: none; text-decoration:none; }
#nav li { position: relative; }
#nav li a { color: #fff; display: block; text-decoration:none; }
#nav li a:active { background-color:# rgba(0,0,0, 0.65 ); !important; } 
/* first level */
#nav > ul { width:100%; height: 3.75em; /* 60 */ background-color:rgba(41,41,41,1.00); list-style:none;	}
#nav > ul > li { width: 100%; height: 100%; float: left; }
#nav > ul > li > a { height: 100%; font-size: 20px;  line-height: 10px; text-align: center; }
#nav > ul > li:not( :last-child ) > a { border-right: 1px solid #FFFFFF; }
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a { color:#9E0B0F; }


@media only screen and ( max-width: 40em ) {

.homepage_top { background-attachment:scroll; }
.header_container { height:70px; }
#logo_container { width:80px; margin-left:20px; float:left; top:10px; }
.color_title { width:80%; font-size:14px; }
#homepage_top_text { width:70%;  margin-left:auto; margin-right:auto; font-size:22px; }
#homepage_top_icon { width:33%; font-size:18px; }
#homepage_top_icon img { width:70%; }
#concept_icon { width:33%; }
#concept_icon img { width:80%; display:block; margin:0px auto; }
#latest_left { float:none; width:100%; margin-bottom:50px; }
#involved_left img { width:80%; }
#involved_title { font-size:18px; letter-spacing:1px; }
#contact_left, #contact_right { float:none; width:100%; margin:0px;  }
#contact { width:90%; margin:0px auto 80px auto; float:none; }
#contact_right_content { text-align:left; margin:0px auto; width:80%; }
#footer_text { width:90%; margin:0px auto; }
#leadership_content { width:50%; }
#staff_content { width:80%; margin:0px auto 40px auto; float:none; }
.contact_page .color_title { font-size:14px; }
#about_col_left, #about_col_right { width:90%; margin:0px auto; padding:10px; float:none; }
.flags { width:90%; margin:20px auto; }
.flags img { height:50px; margin:0px 2%; }
.homepage_showoff img { left:5%; }



#friend_offers #title { display:none; }
#friend_offers #title_hr { background:#000000; margin:30px auto; width:70%; height:1px; position:relative; top:50%; }
#friend_offers .col_1 { float:none; width:90%; margin-bottom:25px; text-align:center; }
#friend_offers .col_2 { float:none; width:90%; margin:0px auto 30px auto;  }
#friend_offers .col_3 { float:none; width:90%; margin:0px auto; text-align:center; }

.contact_letterhead { max-width:960px; min-height:200px; width:90%; margin:20px auto; }
.contact_letterhead img { height:120px; display:none; }      
#letterhead_right { width:100%; height:170px; float:none; }
#letterhead_top { font-size:28px;  }
#letterhead_top_2 { font-size:18px; top:-13px; }            
#letterhead_left_2 { font-size:16px; line-height:18px; }         
#letterhead_right_2 { font-size:16px; line-height:18px;  }

#contact_right_content iframe { top:0px; }

.homepage_circles { display:none; }

#desktop_header { display:none; }
#mobile_header { display:inherit; position:relative; z-index:10; }

#nav { float:right; padding-right:10px; padding-top:0px; }
#nav > a { width: 3.125em; height: 3.125em; text-align: left; text-indent: -9999px; position: relative; top:15px; }
#nav > a:before, #nav > a:after { position: absolute; border: 3px solid #FFFFFF; top:10%; left: 25%; right: 25%; content: ''; }
#nav > a:after { top: 40%; }
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type { display: block; }
/* first level */
#nav > ul { height: auto; display: none; position: absolute; top:50px; left: 0; right: 0; }
#nav:target > ul { display: block; }
#nav > ul > li { width: 100%; float: none; }
#nav > ul > li > a { height: 60px; line-height:60px; text-align: left; padding: 0 0.833em; text-transform:uppercase; }
#nav > ul > li:not( :last-child ) > a { border-right: none; border-bottom: 1px solid #FFFFFF; }
}
/* ---------------------    End Mobile Header   ------------------ */