@charset "UTF-8";
@import url(reset.css);
@import url(menu.css);
@import url(form.css);

/******************************************************************************************************

										Market Hardware Core CSS

/******************************************************************************************************/

/* typography */
body { font-size: 0.75em /* 12px */; background:#0987CA; color: #333; font-family: Arial, Verdana, sans-serif; line-height: 1.5em; margin: 0 auto; }

h1, h2, h3, h4, h5, h6 { /* Use to set global header styles. ie, bold, italic, color, margin, padding */ line-height: 1.2em; }
h1 { font-size: 2.33em /* 28px */; 	color: #666; font-weight: bold; }
h2 { font-size: 1.67em /* 20px */; 	color: #666; font-weight: bold}
h3 { font-size: 1.5em /* 18px */;color: #5F7A8D; font-weight: bold;}
h4, h5, h6 { font-size: 1.1em /* 13px */; }

p, ul, ol { margin-bottom: 1.1em; } /* DO NOT RESIZE */
li { margin-bottom: 0.5em; }

a, a:visited { color: #237389; text-decoration: none; }
a:hover, a:active { color: #DE7D00; text-decoration: underline; }

/* group (also known as clearfix) applies style to div's containing other floating elements - FLOAT CHILDREN LEFT AND CLEAR NONE */
.group:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.group { _zoom: 1; display: block; }

/* layout */
#branding { position:relative; }

#callout ul, #callout li { margin: 0; padding: 0; text-indent: 0; list-style-type: none; }

#footer { margin: 0 auto; text-align: left; background: #F2F2F2; padding: 22px 0 0px 0; margin-bottom: 40px; }
#footer .payment { float: left; color: #999; }
#footer .payment p { font-weight: bold; margin: 0 0 6px 0;}
#footer .payment img { display: block; }
#footer .brand-group {  float: left; padding-left: 30px; }
#footer p.copyright { font-size: 1em;  width: 500px; float: right; text-align: right; }
#footer p.copyright span { background: url(../design/bg_dot2.gif) no-repeat 0 center; margin-left: 6px; padding-left: 16px; }

#footer a, #footer a:visited { color: #0081C6; text-decoration: none; }
#footer a:hover, #footer a:active { color: #0081C6; text-decoration: underline; }

.breadcrumb { font-size:85%; padding-bottom: 10px; }
.breadcrumb a { outline: none; }
blockquote { margin: 28px 0; padding: 5px; background: #C4DDEB; border: 1px solid #7ABBDD;  }
blockquote p { padding: 12px 12px;  }
blockquote p span { display: block; text-align: left; font-style: italic; margin-top: 12px;}
.ir { display: block; overflow: hidden; position: relative; }
.ir span { display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.container { width: 944px; margin: 0 auto; }

#header { background: url(../design/bg_header.gif) repeat-x 0 0; position: relative; z-index: 3; }

#branding { background: transparent; width: 944px; margin: 0 auto; position: relative; padding-top: 40px; padding-bottom: 10px;z-index:2;}
#branding .tab {  position: absolute; top:0; right:0; float: left; background: url(../design/bg_tab-m.gif) repeat-x 0 0; height: 27px;  }
#branding .tab a { float: left; background: url(../design/bg_tab-l.gif) no-repeat 0 0; height: 27px; color: #fff; font-weight: bold; letter-spacing:3px; }
#branding .tab span { cursor: pointer; vertical-align: middle; height: 27px; line-height: 24px; float: left; background: url(../design/bg_tab-r.gif) no-repeat top right; padding: 0 47px 0 32px; }
#branding .tab.hover, #branding .tab.hover a { background-position: 0 -27px; }
#branding .tab.hover span { background-position: right -27px; }
#branding .tab a:hover { color: #27597C ; text-decoration: none; }

#branding h1 { width: 320px; height: 206px; float: right; }
#branding h1 span { background: url(../images/logo.gif) no-repeat 0 0; }

#branding img{ float: left; padding: 9px 0 0 0; }
#branding p { float: right; width:283px; padding: 6px 0 0 35px; text-align: center; margin-bottom: 0; }

#branding p .phone { padding-left: 40px; font-weight: bold; color: #333; font-size: 2.33em; background: url(../design/ico_tel.gif) no-repeat 0 10px; letter-spacing: 2px; }
#branding p .phone span { display: block; color: #666; font-size: 14px; text-align: right; letter-spacing: 6px; padding: 6px 0px 0 0;  }
#branding .serving { font-size: 18px; font-weight: bold;  }




#content { border-top: 4px solid #717275; background: #50B2E7 url(../design/bg_content.jpg) repeat-x 0 0; position: relative; z-index: 0; padding-bottom: 22px; }
.home .left-column, .left-column { float: left; width: 640px; display: inline; margin: 14px 0 0 0; }
.left-column { width: 611px; }

.home #leftcol-inner {
	width: 610px;
}	


#banner, #banner li { list-style: none; margin: 0; padding: 0; }
#banner{ margin-bottom: 46px; }
#banner li { float: left;  background: #2C6592; padding: 20px 0 0 0; width: 204px; margin-right: 1px; }
#banner li p { font-size: 1.5em; text-align: center; padding: 0px 38px 12px 38px; line-height: 22px; margin-bottom: 0px; }
#banner li p a { color: #fff; font-weight: bold; letter-spacing: 1px; }
#banner li p a:hover {  text-decoration: none; color: #FBAF5D;}


.home .left-column h1 { color: #fff; margin-bottom: 29px;}

.home .left-column p { font-size: 1.33em; font-weight: bold; letter-spacing: 1px; line-height: 25px; margin-bottom: 26px;}
.left-column p a { color: #fff; }

.right-column { float: right; width: 287px; padding: 17px 0 0 0; }

#callout li { background: url(../design/bg_callout-m.jpg) repeat-y 0 0; width: 287px; margin-bottom: 12px; }
#callout li div.inner {  background: url(../design/bg_callout-b.jpg) no-repeat bottom left; padding-bottom: 3px; }
#callout li h3 { background: url(../design/bg_callout-t.jpg) no-repeat 0 0; color: #fff; font-size: 1.5em; letter-spacing: 1px; font-weight: bold; text-align: center; padding: 6px 12px; font-family: "Arial Black"; line-height: 22px;}
#callout li h3 a { color: #fff; }
#callout li h3 a:hover { color: #FAAF5E; text-decoration: none; }
#callout li img { margin: 0 0 0 2px; }

#callout li h3.second { font-size: 32px; font-weight: normal; padding: 14px 0;  font-family: "Arial Narrow"}
#callout li h3.second span { font-size: 42px; font-weight: bold;text-transform: uppercase; font-family: "Arial Black"; }
#callout li div.inner div.btn { padding-top: 84px; position: relative; background: url(../design/bg_callout.jpg) no-repeat 0 0; width: 283px; height: 88px; margin: 0 0 0 2px; }
#callout li div.btn a { background: url(../design/btn_bule.png) no-repeat 0 0; display: block; width:256px;height: 33px; font-size: 1.2em; font-weight: bold; vertical-align: middle; line-height: 33px; padding-left: 18px; margin-left: 10px; margin-bottom: 8px;  text-transform: uppercase; color: #fff; }
#callout li div.btn a:hover { background-position: 0 -33px; text-decoration: none; }
#callout li.last { margin-bottom: 0; }

body.interior #content .container  { background: url(../design/bg_content2.gif) repeat-y 0 0; margin: 15px auto 0 auto;}
body.interior .right-column { padding-top: 2px; }
body.interior .left-column h1, body.interior .left-column h2{ color: #d67106; }
 body.interior .left-column h2  {  text-transform: none;}
 body.interior .left-column h3  { color: #5F7A8D; text-transform: none;}
body.interior .left-column p { font-weight: normal; letter-spacing: 0; }
body.interior .left-column .context { padding: 27px 40px 0 40px; font-size: 1.33em; line-height: 1.5em;}
body.interior .left-column h1 { margin-bottom: 12px; font-size: 1.75em;}
body.interior .left-column h2 { color: #666; margin-bottom: 5px; font-size: 1.25em; }
body.interior .left-column h3 { margin-bottom: 5px; font-size: 1.13em;}

body.interior .left-column p a { color: #237389; text-decoration: none; }
body.interior .left-column p a:hover { color: #DE7D00; text-decoration: underline; }


/* font-size guide
	10px->0.83em 11px->0.92em 12px->1em 13px->1.1em 14px->1.2em 15px->1.4 em 16px->1.33em 17px->1.42em 18px->1.5em 19px-> 20px->1.67em 21px->1.75em 22px->1.83em 23px->1.92em 24px->2em 28px->2.33em
 */
 
 
 .finishing table.roi {margin-bottom: 30px;  border: 1px solid #7ABBDD; width: 100%;}
 .finishing table.roi th, .finishing table.roi td {padding: 8px; font-size: 0.9em;}
 .finishing table.roi th {background: #C4DDEB;}
 .finishing table.roi .note {font-size: 0.9em; font-style: italic;}
 

div.more {background: #C4DDEB; border: 1px solid #7ABBDD; padding: 10px; margin-bottom: 15px;}



/* Identify Your Problem section */

	div.modal {
		width: 300px;
		height: 200px;
	}
	
	table.basement-problems {
		margin-bottom: 30px;
		font-size: 0.8em;
	}
	
	table.basement-problems td {
		padding-right: 10px;
		padding-bottom: 10px;
		text-align: center;
	}
	
	tr.basement-images td {
		padding-bottom: 3px;
	}
	
	
/* County Map Popup Styles 
#city-list {position: absolute; left: 10px; top: 10px;}
#popup { min-width: 300px; font-size: 1em;border-left:1px solid #79C671;border-right:1px solid #79C671;border-top:1px solid #79C671;}
#popup td {border-bottom:1px solid #79C671;}
.green { background: #fff; }
.orange { background: #f6dec4; }
table tr td.county { color: #fff; font-size: 1.2em; text-align: center;}

#counties {font-size:12px;border-bottom:2px solid #79C671;border-right:2px solid #79C671;width:560px;background:#fff;}
#counties .alt {background: #f6dec4;}
#counties td {width:120px;padding:3px 10px;border-top:1px solid #79C671;border-left:1px solid #79C671;}
 */

/* REDONE map popout counties */



 
.contact #zoom_content {width:300px;margin:0 auto;padding:0;margin:0;border-left:1px solid #333;border-top:1px solid #333;}
.contact #zoom_content table {margin:0;padding:0;}
.contact #zoom_content table tr {margin:0;padding:0;border:none;}
.contact #zoom_content table td {width:110px;padding:2px 20px;font-size:.9em;border-bottom:1px solid #333;border-right:1px solid #333;margin:0;}
.contact #zoom_content .county {background:#007fca;color:#fff;font-weight:900;text-align: center;width:90%;font-size: 1.3em;padding:3px;margin:0;}
.contact #zoom_content .alt td, .contact #zoom_content .green td{background:#f1e2be;margin:0;}

#zoom {z-index:1000;}