@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:#000; color: #484949; font-family: Arial, Verdana, sans-serif; line-height: 1.5em; margin: 0 auto; padding: 3px 0 60px 0; }
body.home { color: #ccc;}

h1, h2, h3, h4, h5, h6 { /* Use to set global header styles. ie, bold, italic, color, margin, padding */ }
h1 { font-size: 1.83em /* 20px */; color: #b4b4b0; font-weight: normal; }
h2 { font-size: 1.67em /* 18px */; color: #333;  font-weight: normal; margin-bottom:.5em; }
h3 { font-size: 1.33em /* 16px */; color: #666; 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: #406231; text-decoration: none; }
a:hover, a:active { color: #406231; 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 { font-size: 0.83em; width: 940px; color: #666; background: #73ae57; margin: 0 auto 0 auto; padding: 7px 0 9px 0;}
#footer p.copyright { line-height: 12px; text-align: center; padding: 0; margin: 0; }
#footer a, #footer a:visited { color: #666; text-decoration: none; }
#footer a:hover, #footer a:active { color: #666; text-decoration: underline; }
#footer .color2 { color: #fff;}


.breadcrumb { font-size:85%;padding-bottom: 10px; }
.breadcrumb a { outline: none; }
blockquote { margin: 42px 10px 42px 0; padding: 27px 12px 12px 16px; background: #dbdbda; border: 1px solid #ccc; }
blockquote p { padding-left: 10px; font-style: italic; color: #575a5d;}

.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: 0px auto 0 auto; }

#branding { z-index: 99; width: 940px; position: relative; padding: 11px 0 11px 0; background: #73ae57; margin-bottom: 5px;}
#branding h1 {float: left; padding: 0 0 0 101px; }
#branding p { margin: 3px 0 0 0; padding: 25px 0 0 43px; line-height: 100%; float: right; background: #406231; width: 591px; height: 111px; font-size: 1.7em; color: #fff; }
#branding p span { display: block; font-size: 0.83em; padding: 20px 0 0 2px;}
#branding p .service-area {font-size: .7em;padding:0;}
#branding p span a { font-size: 0.60em; color: #ccc; text-transform: uppercase; padding: 0 0 0 9px; }
#branding p span a:hover { color: #fff; }


#nav { width: 940px; margin: 0 0 5px 0; position: relative; background: #575757; height: 40px;}

#content { zoom: 1; position: relative; margin: 0 0 7px 0; background: url(../design/bg_content_sub.png) repeat-y;}
body.home #content { background: url(../design/bg_content.png) repeat-y;}
#content .inner {  }


.left-column { float: left; width: 287px; padding: 23px 0 0 23px; z-index: 1; }
.right-column { float: right; width: 625px; padding: 0; z-index: 2; position: relative;  }

#banner { position: relative; height: 354px; border-bottom: solid 5px #000; padding: 0; }
#banner ul { margin: 0 0 0 -40px; list-style: none; background: #000; height: 354px}
html* #banner ul { margin: 0 0 0 0;}
#banner li { position: relative; height: 354px; width: 310px; float: left; margin: 0 5px 0 0; list-style: none; float: left; padding: 0; }
#banner li.b1 { background: url(../design/bg_banner_1.jpg) }
#banner li.b2 { background: url(../design/bg_banner_2.jpg) }
#banner li.b3 { background: url(../design/bg_banner_3.jpg); margin: 0; }
#banner li a { display: block; width: 284px; height: 114px; position: absolute; bottom: 0px; left: 13px; color: #ccc; }
#banner li a:hover { background-position: 0 -114px; text-decoration: none; color: #333;}
#banner li.b1 a { background-image: url(../design/bg_banner_1_a.png); }
#banner li.b2 a { background-image: url(../design/bg_banner_2_a.png); }
#banner li.b3 a { background-image: url(../design/bg_banner_3_a.png); }
#banner li a span { display: block; padding: 40px 20px 0 55px; font-size: 12px; }

#callout{ width: 250px; margin-bottom: 25px; }
#callout li { zoom: 1; position: relative; text-transform: none; margin: 0 0 2px 0; border-top: solid 4px #6ca253; padding: 11px 12px 0 12px; height: 103px; }
#callout li.hover { background: #000; }

#callout li h3 { font-size: 1.67em; color: #fff; padding: 0 0 5px 0;}
#callout li h3 a { color: #fff; font-weight: normal; text-decoration: none; }

#callout li p { font-size: 1.33em;  color: #ccc; line-height: 150%; }
.left-column p { font-size: 1.2em; }
.left-column p.el { float: left; padding: 0 0 0 7px; position: absolute; bottom: -1px; left: 22px; }
.left-column p.el a { background: #626262; color: #fff; text-transform: uppercase; padding: 9px 19px 11px 16px; font-weight: bold; display: block; }
.left-column p.el a:hover { background: #73ae57; color: #000; text-transform: uppercase; padding: 9px 19px 11px 16px; font-weight: bold; text-decoration: none; }

.right-column .context h1 { text-transform: none; margin-bottom: 17px; font-size: 2.50em; color: #575757; }
.home .right-column .context h1 { text-transform: none; margin-bottom: 17px; font-size: 2.50em; color: #b4b4b0; }
body.interior .right-column .context h1 { margin-bottom: 15px; }
.right-column .context { padding: 37px 20px 30px 40px; }
body.interior .right-column .context { padding: 42px 20px 30px 28px; }
.right-column .context p { line-height: 18px; padding: 0 0 0 4px; margin-bottom: 1.5em}
.right-column .context ul { line-height: 18px; padding: 0 0 0 4px; margin-left:30px; margin-bottom: 1.5em}
body.interior .right-column .context p { line-height: 18px; padding: 0 15px 0 17px; margin-bottom: 1.5em}

.right-column ul li { list-style: square; }
.service-area h3 { color: #3E84BB; margin-bottom: 10px; font-size: 1.5em; font-weight: bold; text-transform: uppercase; }



body.interior .context li { font-size: 1em; }
body.interior .right-column ol {  margin: 0; margin-left: 48px; padding: 0; }
body.interior .right-column ol li { margin-bottom: 2px; }
body.interior .right-column ul { margin-top: 5px; }
body.interior .right-column ul li { padding-left: 0px; list-style: none; margin-bottom: 2px;}
body.interior .right-column h1 { margin-bottom: 12px; font-size: 2.00em; color: #666; }
body.interior .right-column h2 { margin-top: 32px; margin-bottom: 8px; }
body.interior .right-column h3 { margin-top: 32px; margin-bottom: 0; }

/* 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
 */