@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: #E2E2E2; 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: 2.1em /* 25px */; color: #3366CC; font-weight: bold; }
h2 { font-size: 1.83em /* 22px */; color: #5E6C8C; font-weight: normal;}
h3 { font-size: 1.2em /* 16px */; color: #484949; 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: #317AC7; text-decoration: none; }
a:hover, a:active { color: #317AC7; 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; width: 967px; text-align: left; color: #333; padding: 12px 0; }
#footer p.copyright { font-size: 1em; width: 640px; color: #333; padding-left: 18px; float: left; }
#footer .payment { float: right; width: 240px; }
#footer .payment img { float: right; padding: 6px 15px 0 0;}
#footer a, #footer a:visited { color: #317AC7; text-decoration: none; }
#footer a:hover, #footer a:active { color: #317AC7; text-decoration: underline; }

.breadcrumb { font-size:85%; padding-bottom: 10px; }
.breadcrumb a { outline: none; }
blockquote { margin: 8px 0; padding: 5px; background: #F9F9F9; border: 1px solid #ccc; width: 580px; }
blockquote p { padding: 12px 12px;  }
blockquote p span { display: block; text-align: right; 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: 960px; margin: 0 auto; }

#branding { background: #fff url(../design/bg_header.jpg) repeat-y 0 0; margin: 0 auto; padding-bottom: 6px; }
#branding h1 { width: 363px; height: 94px; float: left; display: inline; margin: 22px 0 0 29px; }
#branding h1 span { background: url(../images/logo.gif) no-repeat 0 0; }
#branding p { float: left; margin: 0;  }
#branding p.address  { font-size: 1.33em; padding: 43px 21px 0 55px; color: #333; width: 200px;}
#branding p.other { width: 200px; font-size: 1.33em; padding: 43px 0 0 0; }
#branding p.other .phone { font-weight: bold;  display: block; margin-bottom: 2px; }
#branding p.other .fax { display: block; font-weight: normal; margin-bottom: 2px;}

#nav {  background: url(../design/bg_nav-b.jpg) repeat bottom left; margin-bottom: 18px; }

#content { margin: 0 auto; padding-bottom: 12px; background: #fff; width:908px; border: 1px solid #ccc; position: relative; padding: 18px 18px; }
#content span.tl, #content span.tr, #content span.bl, #content span.br { overflow: hidden; position: absolute; background: url(../design/bg_content.gif) no-repeat 0 0; width: 14px; height: 14px; }
#content span.tl { top:-1px; left: -1px; background-position: 0 0; }
#content span.tr {  top:-1px; right: -1px; background-position: -14px 0;}
#content span.bl { bottom:-1px; left: -1px; background-position: 0 -14px;}
#content span.br { bottom:-1px; right: -1px; background-position: -14px -14px;}

#banner { margin-bottom: 33px; }
#banner div { float: left; width: 179px; display: inline; margin: 0 1px; }
#banner div.last { margin-right: -1px; }
#banner div img { border: 1px solid #ccc; margin: 0 1px; }
#banner div p {margin: 0; border: 1px solid #999; position: relative; background: url(../design/bg_banner.jpg) repeat-x 0 0; }
#banner div p a { display: table-cell; *display: block; font-weight: bold; font-family: Helvetica; font-size: 1.5em; color: #fff; padding:0 28px; *padding-top: 10px; position: relative; text-align: center; margin: 0 auto; vertical-align: middle; height: 56px; *height: 46px }
#banner div p.hover { background: #BB1515;}
#banner div p.hover a {  text-decoration: none;}

#callout{  position: relative; }

#callout ul {  }
#callout li { margin-bottom: 8px; }
#callout li.save-money h3 { font-family: Helvetica; font-size: 1.67em; color: #fff; text-transform: uppercase; border: 1px solid #999; }
#callout li.save-money h3 a { color: #fff;  background: url(../design/bg_banner.jpg) repeat-x 0 0;  display: block;  font-weight: bold; text-align: center; vertical-align: middle; height: 56px; line-height: 56px;}
#callout li.save-money p { width:171px;  font-size: 1.33em; font-weight: bold; border: 1px solid #ccc; border-top: 0; background: #fff url(../design/bg_callout.jpg) repeat-x 0 0; position: relative; padding: 60px 0 24px 83px; margin: 0; line-height: 22px; }
#callout li.save-money p span { height: 87px; background: url(../design/bg_dollar.png) no-repeat 0 0; position: absolute; color: #B83838; font-size: 40px; line-height: 44px; font-weight: bold; top: 6px; left: 12px; padding: 12px 0 0 52px; width: 180px; }

#callout li.service-online h3 { font-family: Helvetica; border: 1px solid #ccc; }
#callout li.service-online h3 a {color: #B83838;  background: url(../design/bg_callout2.jpg) repeat-x 0 0;  font-size: 1.33em; height: 56px; display: block; text-align: center; padding-top: 13px; text-transform: uppercase; font-weight: bold; line-height: 24px; }
#callout li.service-online p { border: 1px solid #ccc; border-top: 0;  background: #fff url(../design/bg_callout.jpg) repeat-x 0 0; font-size: 1.33em; font-weight: bold; padding: 16px 15px 25px 15px; text-align: center; line-height: 22px; margin-bottom: 0;  }

#callout li.save-money h3 a:hover { background: #A8CDFA; text-decoration: none; }
#callout li.service-online h3 a:hover { background: #fff; text-decoration: none; }

.left-column { float: left; width: 256px; padding: 0 0 0 0; }
.left-column a.btn-contact { margin: 0 auto; text-transform: uppercase; font-weight: bold; color: #fff; display: block; background: url(../design/btn_contact.jpg) no-repeat 0 0; width: 173px; height: 44px; font-size: 1.2em; text-align: center; vertical-align: middle; line-height: 44px; }
.left-column a.btn-contact:hover { background-position: 0 -44px; text-decoration: none; }

/* added for financing button */
.left-column a.btn-finance { margin: 5px auto 0 auto; text-transform: uppercase; font-weight: bold; color: #fff; display: block; background: url(../design/btn_contact.jpg) no-repeat 0 -44px; width: 173px; height: 36px; font-size: .917em; text-align: center; vertical-align: middle; line-height: 1.2;padding:8px 0 0 0; }
.left-column a.btn-finance:hover { background-position: 0 0; text-decoration: none; }

.left-column #brand-group{ margin: 18px 0 0 0; }
.left-column #brand-group img { margin-left: 22px; }

.right-column { float: left; width: 600px; padding: 5px 0 0 28px; }
.right-column li { font-size: 1.2em;  }
.right-column h1 { margin-bottom: 8px; }
body.home .right-column h2 { font-size: 1.5em; color: #333;	 }
body.home .right-column ul li { list-style: square inside; padding-left: 28px; }
body.home .right-column ul { margin-bottom: 22px; }

.right-column p { font-size: 1.2em; margin-bottom: 22px; }
.right-column ul { margin: 0; padding: 0; }
.right-column ul li { list-style: square; }

.service-area { margin: 30px 0 0 0; }
.service-area h3 {  font-size: 1.83em; color: #3366CC; font-weight: normal; margin-bottom: 6px; }
.service-area p { width: 320px; float: left; line-height: 24px; margin-bottom: 0;}
.service-area .map {  float: right; margin-top: -11px; display: inline; }
.service-area .map img { border: 1px solid #ccc; display: block; text-align: right; }
.service-area .map a { color: #ED1C24; text-transform: uppercase; font-size: 0.92em; text-align: right; float: right; }

#company-info { margin: 0 auto 0 auto;  width:944px; border: 1px solid #ccc; position: relative;  border-top: 0; background: #fff url(../design/bg_content2.jpg) repeat-x bottom left; padding-top: 56px;}
#company-info p { text-align: center; margin-bottom: 20px; }
#company-info p.tel  {color: #317AC7; font-family: Helvetica; font-size: 39px; font-weight: bold; text-transform: uppercase; } 
#company-info p.tel span { color: #ED1C24; font-weight: normal; }
#company-info p.org { font-size: 30px; }
#company-info p.desc {  color: #317AC7; font-size: 1.75em;} 

body.interior .right-column { padding-top: 32px; }
body.interior .right-column p { line-height: 20px; }
body.interior .right-column h3 { margin-bottom: 6px; }
body.interior .right-column h2 { margin-bottom: 6px; }
body.interior .right-column ol { margin-left: 0; margin-bottom: 28px; padding-left: 60px; }

body.interior .right-column ul { padding-left: 40px; }
body.interior #content { padding-bottom: 200px; }


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

