/* @override 
	http://marylandroofers.com/roofpro.css
	http://www.marylandroofers.com/roofpro.css
*/

* { margin: 0; padding: 0; }

/*div { border: 1px solid #FF0000; }*/
 
html, body {    
	height: 100%; 
	}

body {
	font-size: 62.5%;  
	background: #FFF url('img/head-back2.gif') repeat-x;
	text-align:center;
	font-family: 'lucida grande',tahoma,sans-serif;
	}   
  
a img {
	border: none;
	border:0;
	}	

  	
hr {display:none;}


.btn-blue { margin-top: 12px; }

.btn-blue a:link, .btn-blue a:visited { color: #FFF; }

div.btn-blue a {
	text-decoration: none;
	padding: 5px 14px;
	color #FFF;
	border: 1px solid #224762;
	background: #2A587A url(img/button-alpha.png) repeat-x 0 50%;
	border-radius: 14px;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;	
}

div.btn-blue a:hover {background-color: #2874AA; }
 
/*


.btn { margin-top: 12px; }

.btn a:link, .btn a:visited { color: #FFF; }

div.btn a {
	text-decoration: none;
	padding: 5px 14px;
	color #FFF;
	border: 1px solid #4D1D19;
	background: #1b4e73 url(img/button-alpha.png) repeat-x 0 50%;
	border-radius: 14px;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;	
}

 
div.btn a:hover {background-color: #2874AA; }
 
*/



.clear {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	}

#skip {display:none;}	
	

h1 {
	clear: none;
	margin: 10px 0 2px 0;
	padding-bottom: 3px;
	font: bold 1.8em/1.8em helvetica,sans-serif;
	color: #000;	 
	}
h2 {
	clear: none;
	margin: 10px 0 2px 0;
	padding-bottom: 3px;
	font: bold 1.4em/1.5em helvetica,sans-serif;
	color: #000;	 
	}
h3 {
	clear: none;
	margin: 10px 0 2px 0;
	padding-bottom: 3px;
	font: bold 1em/1em 'lucida grande',tahoma,sans-serif;
	color: #000;	 
 	text-transform: uppercase;
 	letter-spacing: 1px;
	}
	 		
h4 {
	clear: none;
	margin: 7px 0 2px 0;
	font: bold 1em/1em 'lucida grande',tahoma,sans-serif;
	color: #2E4B32;	 
	text-transform: uppercase;
	}

h5 {
	clear: none; 
	margin: 0 0 4px 0;
	padding-bottom: 3px;
	font: 1.2em/1em 'lucida grande',tahoma,sans-serif;
	letter-spacing: 1px;
	color: #fff;
	text-transform: uppercase;
	border-bottom: 1px solid #ccc;
	}


#header { height: 145px; width: 915px;}
  
#introtext {
	width: 885px;
	background: #d3e8f5;
	padding: 15px;
}
#home-center p {	font: 1.3em/1.6em 'lucida grande',tahoma,sans-serif;}
#introtext p {	font: bold 1.3em/1.5em 'lucida grande',tahoma,sans-serif;}
#home-promo { 
	height: 213px;
	width: 100%;
	margin-bottom: 20px;
	}

#home-promo-text { 
	position: absolute;
	top: 155px;
	left: 600px;
	width: 32em;
  	font: bold 1em/1em 'lucida grande',tahoma,sans-serif;
  }
#fb-wrap { 
	position: absolute;
	top: 315px;
	left: 600px;
	width: 320px;
  }


#contactbox {
	background: #D5E8F5;
	height: 53em;
	padding: 15px;
	float:right;
	width: 285px;
	margin-top: 15px;
	position: relative; 
}

#workman {
	position: absolute;
	top: -20px;
	left: -15px;
	width: 138px;
	height: 117px;
	z-index: 1;
	background: transparent url('img/workman.png') no-repeat;
}


#global-wrap { width: 100%; position; relative; }	

#global-innie { width: 915px; margin: 0 auto; text-align: left; position: relative; }


iframe { border: none; overflow: hidden; padding: 0; margin:0; }

#ourwork { 
	width: 560px;
	background: #dacebb;
	padding: 15px 15px;
}

.home-promos {
	background: #ece6dd;
	margin-top: 15px;
	width: 256px;
	padding: 15px;
	 font-size: 90%;
	 height: 17em;
}

.home-promos ul li { font-size: 1.2em/1.4em; }

#home-center {
	width: 590px;
	margin-right: 15px;
	margin-top: 35px;
}
#footer {
	height: auto;
	position: relative;
	background:transparent; 
	text-align:left;
	/*color:#59310E;*/
	clear:both;
}
	#footer a { color: #2A587A; text-decoration: underline;}
 
#footer-in { 	
	padding-top: 15px;
	font: 10px/15px 'lucida grande',tahoma,sans-serif;
	min-height: 12em;
	/* border: 1px solid #FFF; */
} 

 
#footer-in p { margin-bottom: 6px; }

#foot-left { 
	width: 35%;
	float:left;
	}

 #foot-right {float:right; width: 38%; font: 1.2em/1.5em  'lucida grande',tahoma,sans-serif; }

 

#head-logo {
	position: absolute;
	top: 20px;
	left: 25px;
	width: 255px;
	height: 71px;
	z-index: 1;
	background: transparent url('img/roofpro-logo.png') no-repeat;
}
	#head-logo em { visibility: hidden; }
	
	#head-logo a {
		position: absolute;
		width: 255px;
		height: 71px;
		top: 0; 
		left: 0;
		text-decoration: none;
	}

#motto {
	font: 1.3em/1.6em Georgia, serif; 
	font-style: italic;   
 	position: absolute;
 	color: #FFF;
 	top:110px;
 	right: 0;
 	text-align: right;
}
 
#head-phone {
	font: 1.4em/1.6em helvetica,arial,sans-serif;    
	width: 22em; 
 	position: absolute;
 	top:25px;
 	right: 0;
 	text-align: right;
}
#head-phone a:link, #head-phone a:visited { color: #20435C; }
#head-phone a:hover { color: #37729C; }

#head-phone .btn-blue a {
	color: #FFF;
}
#head-motto span { text-indent: -3000px; overflow: hidden; display: block; }
 

#home-right {
	padding: 20px 0;
	width: 250px;
	float:right;
	line-height: 1.7em;
  	}
  	#home-right img {margin-left: -7px; }
  	
#home-left {
	padding: 20px 0;
	width: 380px;
	font: 1.3em/1.9em 'lucida grande',tahoma,sans-serif;
	min-height: 263px;		
  	}
	
#home-wrap {
	text-align:left;
	width: 840px;
	margin: 0 auto;
	position:relative;
	min-height: 303px;
	background: transparent url('/img/columns.jpg') no-repeat 290px 0; 
	}
 

#services-promo {
	width: 565px;
	height: 183px;
	background-image: url(img/services-promo.jpg); 
	position: relative; 
}

#promo-menu a {
	position: absolute;
	width: 164px;
	height: 154px;
	text-decoration: none;
	top: 9px;
	left: 8px;
}

#promo-menu a i { visibility: hidden; }

/*a#promo-new {  left: 8px; }*/
a#promo-repair { left: 195px;  }
a#promo-siding {  left: 381px; }

a#promo-new:hover,
a#promo-repair:hover,
a#promo-siding:hover { border: 6px solid #ABC5E0; }


#right {
	float:right;
	background: #DACEBB;
	/*border-left: 1px solid #999;*/
	width: 220px;
	padding: 15px;
	margin-left: 10px;
	font: normal 1.2em/1.6 Georgia, Times, serif;
}
	#right h1 {
	font: 1.4em Georgia,  serif;  
	margin-bottom:2px; 
	}	
 
#right-w {
	float:right;	 
	width: 250px;
	margin-left: 10px;
	font: normal 1.2em/1.6 Georgia, Times, serif;
}
 .bio-title {
	font-size: .85em;
	text-transform: uppercase;
	letter-spacing: 2px;
}

#left {
	font: normal 1.3em/1.6em "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
	width: 646px;
	text-align:left;
	min-height: 35em;
}
	#left h1  {
		font: 2.5em Georgia,  serif; 
		color: #000; 
		/* border-bottom: 1px solid #999; */
		margin-bottom:6px; 
		}	
	#left h2  {
		font: bold 1.3em/1.8 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
		color: #2A587A; 		 
		margin:.6em 0 0;
		}	
 
	#left p { margin-bottom: .5em;}
	#left a:link, #right a:link, #right a:visited {color: #2A587A; }
 
	#left a:hover, #right a:hover { color: #438CC3;   }
	#left img a {text-decoration: none; }
	 

	#left ul, #right ul, .arrows ul {
		list-style: none;
		margin: .5em 0 1em 0;
		padding-left: 20px;
		}
	#left ul li, #right ul li  {
		padding: 0 0 4px 13px;
		background: url(/img/arrow.gif) no-repeat 0 5px;
		}
.arrows ul li {
		padding: 0 0 4px 13px;
		background: url(/img/arrow.gif) no-repeat 0 2px;
		}
		
		#left ol li {
 		margin-left: 3em;
	}
	
.splashpix-r {float:right; padding:0 0 3px 5px;}
.splashpix-l {float:left;  padding:0 5px 3px 0;}

 
 
#crumbs { 
	margin: 4em 0 0 220px;
	font-size: 9px; 
	padding: 0; 
	text-transform: uppercase; 
	text-align: left;
	color: #779173; 
	letter-spacing: 1px;
}
#crumbs-top {
	font-size: 9px; 
	padding: 0; 
	text-transform: uppercase; 
	text-align: left;
	color: #779173; 
	letter-spacing: 1px;
}
	#crumbs a, #crumbs-top a { margin: 0 4px; }
	#crumbs a:link, #crumbs a:visited, #crumbs-top a:link, #crumbs-top a:visited {color: #64A539;}
	#crumbs a:hover, #crumbs-top a:hover {color: #223A28}
 
sup {font-size: 9px; font-weight:normal;}

 	
 
img.whiteborder {
	border: 1px solid #666;
	padding: 5px;
	background: #FFF;
} 

.whiteborder { margin: 0 0 .7em 0; }

 
#search {
	position: absolute;
	right: 10px;
	top: -23px;
	width: 160px;
	height: 33px;	
 	z-index:100;
}
#search form {display:inline;}

#searchresults { width: 550px; overflow: hidden; }

#bioside {
	float:right;
	padding: 20px;
	width: 212px;
	color: #333;
	line-height: 120%;
	background: #E7D9B8;
	 }
#bioside h3 { 
	color: #000;
	background: #AAA;
	font-weight: bold;
	padding: 4px 4px 4px 17px;
	}
  
 
#biopic img { border: 5px solid #FFF; margin-bottom: 1em;}
 

/* nav menu
----------------------------------------------------------------------------*/
#nav {
	position:absolute;
 	top: 97px;
 	left: 11px; 
	height: 42px;
	width: 610px;
	}

	#navigation-primary ul {
		/*width: 800px;*/
		list-style: none; 
		}

	#navigation-primary li {
		float: left;
		height: 42px;
		position: relative;
		 
		}

	#navigation-primary a {
		display: block;
		height: 42px;
		text-indent: -3000px; overflow: hidden;
		color: #2E4B32;
		}

	#navigation-primary a:hover {
		background-position: 0 -42px;
		 
		}
 
		#nav-home a {
			width: 110px;
			background: transparent url(img/nav_home.gif) no-repeat;
			}
		#nav-about a {
			width: 114px;
			background: transparent url(img/nav_about.gif) no-repeat;
			}
		#nav-portfolio a {
			width: 134px;
			background: transparent url(img/nav_portfolio.gif) no-repeat;
			}
		#nav-services a {
			width: 130px;
			background: transparent url(img/nav_services.gif) no-repeat;
			}		
		#nav-contact a {
			width: 116px;
			background: transparent url(img/nav_contact.gif) no-repeat;
			}
 
 	#navigation-primary li ul li {
		height: auto;
		}

	#navigation-primary li ul li a {
		display: block;
		height: auto;
		padding: .75em .75em;
		background: transparent; color: #fff;
		border-bottom: 1px solid #57705D;
		text-indent: 0;
		text-decoration: none;
		position: relative;
		width: 20em;
		font: normal 1.1em/1.6 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
		text-align:left;
		}

	#navigation-primary li ul a:hover {
		background: #203726; color: #fff;
		}

	#navigation-primary li ul {
		position: absolute;
		left: -3000px;
		width: 23.75em;
		background: #2D4C35 ;
		padding: 0;
		z-index: 200000;
		}

	#navigation-primary li:hover ul, #navigation-primary li.sfhover ul {
		left: auto;
		}
 
body#home #nav-home	a,
body#about #nav-about a,
body#portfolio #nav-portfolio a,
body#services #nav-services a,
body#contact #nav-contact a 
{background-position: 0 -42px;}
 
 
 
 

/* inside page specific 
----------------------------------------------------------------------------*/
 
 
   
.arrows ul ol {
	margin: .5em 0 1em 1em;
	padding-left: 18px; 
	}
.arrows  ol li {
	padding: 0 0 4px 0;
	line-height: 1.4em;
	background: none;
	}
 


#authorship {  color: #FFF; font-size: 10px;}


 
 
 
.quoter { text-align:right; font-size: 90%;}

   
.quote {
	/* font: italic 1.1em/1.4 Georgia, "Times New Roman", serif;  */ 
	margin: 30px 0 30px 30px;
	padding: 6px 0 6px 26px;
	background: url("/img/quote-left.gif") no-repeat 0 3px;
	color: #FFF;
}
.quoter { float:right; text-align:right; padding: 0 5px 5px 0; font-size: 11px;   }
.quote a { color: #A1FF7D;}

.dropcap {
	float:left;
	margin-top: 7px;
	width:40px;
	font-size: 60px; 
	line-height:40px;
	font-family: Georgia, serif;
} 
.indent {text-indent: 2em;}	 

 

.floatright
{
	float: right;
	margin: 0 0 10px 10px;
	padding: 2px;
}
.floatleft
{
	float: left;
	margin: 0 10px 5px 0;
	padding: 2px;
}
 
.imgborder { border: 1px solid #000; }
  
.pdf_download {
	font-weight: bold;
}

.float-r { float: right;}
.float-l { float: left;}

.contactForm  {margin:15px 0;border:none; background:transparent; padding:10px;  	font: 10px/15px helvetica, sans-serif;
}
.contactForm fieldset { border: none; }
.contactForm legend { padding:0 10px; /*margin-left:20px; */color:#b4de73;}
.contactForm ul { margin:0;  list-style:none;}
.contactForm ul li {clear:both; /*border-top: 1px solid #BDBDBD; */padding: 3px 0;}
.contactForm ul label { display:block; float:left; width:260px; padding:3px 0;}
.contactForm .txtField  {display:block; float:left; padding:3px; width:260px; margin:5px 0 7px 0;font: 1em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;color:#666;border:2px solid #CCCCCC; outline:none;}
.contactForm .txtField:hover, .txtField:focus, .txtField:active { border-color:#787878; background:#FFF9E6;}
.contactForm em {font-size:0.9em; color:#666; font-style:normal;}
.contactForm .send { width:174px; height:32px; background:url('/img/send-button.gif') no-repeat; padding-bottom:5px; text-align:center; border:none; margin:15px 0 0px 0; border:none;color: #c2f671;font: .85em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif; font-weight:bold; margin-left:210px; color:#FFFFFF;   }

.contactForm .send:hover {cursor:pointer; color:#D8AE71;}
.contactForm.request fieldset {border:1px #5b8a10 solid; padding:5px;}
.contactForm fieldset.extra {margin-top:15px;}

.contactForm .file {display:block; float:left; padding:3px; width:260px; margin:5px 0 7px 0;font: 1em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;}
.contactForm .radio {display: inline; }

/*form errors*/
.error {border-top:#7dce01 1px solid; border-bottom:#7dce01 1px solid; background:#6bb000; padding:10px; margin-bottom:10px; text-align:center; color:#f1ffdb; }

/*captcha */
.captcha { float:left; margin-top:5px;}
.captcha img {border:#7dce01 2px solid; margint-top:0; float:left;}
.captcha input { margin:0 auto 12px 12px;font: 1em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;color:#666;border:2px solid #CCCCCC; outline:none;padding:3px; width:108px;}


#contactInfo {list-style:none; margin-left:0;}
legend {

	margin: 10px 0 10px;
	padding: 2px 4px;
	border-top: 1px solid #666;
	border-right: 1px solid #666;
	border-left: 1px solid #666;
	}