@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: #fff; 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 */ }
h1 { font-size: 2em /* 24px */; color: #53682B; font-weight: bold;  }
h2 { font-size: 1.67em /* 20px */; color: #53682B; font-weight: normal;}
h3 { font-size: 1.33em /* 14px */; color: #777667; 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: #0C9437; text-decoration: none; }
a:hover, a:active { color: #FFD22B; 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; background: #626262 url(../design/bg_footer.jpg) repeat-x 0 0; color: #fff; padding: 18px 0; }
#footer p { font-size: 0.92em;   float: left; width: 600px; line-height: 22px; }
#footer .payment { float: right; }

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

.breadcrumb { font-size:85%; padding-bottom: 10px; }
.breadcrumb a { outline: none; }
blockquote { margin: 28px 0; padding: 5px; background: #F5F5EE; border: 1px solid #ccc;  }
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: 940px; margin: 0 auto; }

#branding { position: relative; background: #EEEEEE url(../design/bg_header.gif) repeat-x bottom left;  }
#branding h1 { float: left; width: 519px; height: 69px; float: left; display: inline; margin: 29px 0 9px 5px;}
#branding h1 a { text-indent: -999em; display: block; }
#branding h1 span { background: url(../images/logo.gif) no-repeat 0 0; }

#branding p { float: right; text-align: right; margin-bottom: 9px; }
#branding p a.btn-request { height: 32px; float: right; border: 1px solid #548544; border-top:0; background: url(../design/btn_request.jpg) repeat-x 0 0; vertical-align: middle; line-height: 32px; color: #fff; font-size: 1.33em; padding: 0 22px; }
#branding p a.btn-request:hover { background-position: 0 -32px; }
#branding p a.btn-request strong { background: url(../design/ico_arrow.png) no-repeat right center; padding-right: 12px; }
#branding p span { display: block; clear: both; }
#branding p .toll { font-weight: bold;  font-size: 1.5em; padding: 12px 0 8px 0; }
#branding p .phone { color: #362303; font-size: 1.33em; padding-bottom: 6px; }


#banner {  }
#banner div.list { float: left; width: 219px; overflow-x: hidden; min-height: 390px; _height: 390px; padding: 7px 7px; background:#575757; margin-right: 2px; }
#banner div.last { margin-right: 0; width: 220px; }
#banner div.list img { border: 1px solid #fff; }
#banner div.list h3 { font-size: 1.33em; font-weight: bold; color:#F5CF47; margin: 6px 0 0 0; }
#banner div.list p { color: #fff; margin-bottom: 0; line-height: 16px; }
#banner div.list ul, #banner div.list li { margin: 0; padding: 0; color: #fff;  }
#banner div.list li { list-style: inside; margin-left: 12px; line-height: 16px; }
#nav { background: #076324; }
/*#nav.hover { background: #668D4C; }*/


#content { padding-bottom: 12px; margin-top: 1px; position: relative; z-index: 0; }
.left-column { float: left; padding: 25px 0 0 0; width: 480px; position: relative;}
.right-column { float: right; width: 280px; display: inline;  margin: 10px 0 0 0; }

.left-column h1 { margin-bottom: 8px; }
.left-column p { font-size: 1.2em; margin-bottom: 22px; line-height: 18px;}

#callout { background: #fff; padding-bottom: 1px }
#callout li { border: 1px solid #678D4C; position: relative; background: #076324 url(../design/bg_callout.jpg) repeat-x 0 0; margin-bottom: 4px; width: 254px; padding: 14px 12px; }
#callout li.hover { background: #668D4C; }
#callout li h3 { font-size: 1.5em; margin-bottom: 4px; width: 240px;  background: url(../design/bg_head.png) no-repeat bottom left;  padding: 0 0 6px 4px; }
#callout li h3 a { display: block; color: #fff; text-decoration: none; font-weight: bold; background: url(../design/ico_arrow2.png) no-repeat right	center; }
#callout li p { color: #fff; font-size: 1.2em;  }

.left-column .brand-group { position: absolute; top: 52px; right: -134px; }




.service-area { background: #F9F8F0; border-top: 2px solid #E7E5CD; width: 400px; padding: 12px 50px 12px 20px;}
.service-area h2 { font-size: 1.33em; color: #362303; margin-bottom: 0px; }
.left-column .service-area p { font-size: 1em; line-height: 14px; margin-bottom: 12px;}
.left-column .service-area ul { float: left; }
.left-column .service-area ul, .left-column .service-area li { margin: 0; padding: 0; }
.left-column .service-area li { list-style-type:square;list-style-position: inside; margin-bottom: 6px; font-size: 0.92em; }
.left-column .service-area img {  border: 2px solid #E7E5CD; float: right; }

body.interior .left-column { padding: 32px 0 0 32px; width: 600px; }
body.interior .right-column { min-height: 680px; background: #076324 url(../design/bg_sidebar.jpg) repeat-x bottom left;}


body.interior .left-column ol { padding-left: 60px; margin-left: 0; margin-bottom: 30px; }
body.interior .left-column ul li { list-style-type:square; }
body.interior .left-column li { font-size: 1.2em; }
body.interior .left-column a {color: #0C9437;} 

.portfolio .img img{
	margin:0px 10px 10px 0;
} 
.portfolio .img {
	margin:10px auto;
}
/* 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
 */