
/*** GENERAL STYLES ***/

body {background: #a3c2e0; text-align: center; margin: 0; padding: 0;}
body, th, td, select, input, textarea {font-family: "trebuchet ms", trebuchet arial, helvetica, sans-serif;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {line-height: 19px; font-size: 13px; color: #000;}
form, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

img, table, fieldset {border: 0;}
ul, ul li {list-style: none; margin: 0; padding: 0;}
p {margin: 0 0 1.5em 0;}
a {color: #369; text-decoration: none;}
a:hover {color: #f60; text-decoration: underline;}
a.arrowlink {padding-right: 12px; background: url(../images/bullet-blue.gif) right 8px no-repeat; font-weight: bold; white-space: nowrap;}
a.arrowlink:hover {background-image: url(../images/bullet-orange.gif);}
a.orangearrowlink {padding-right: 12px; background: url(../images/bullet-orange.gif) right 5px no-repeat; font-weight: bold; white-space: nowrap; color: #f60;}
a.viewalllink {color: #f60; font-size: 11px; border-left: 1px solid #ccc; margin-left: 5px; padding-left: 10px; text-transform: uppercase;}

.hide {display: none;}
.alert {color: #c00;}
.small {font-size: 12px; line-height: 16px;}
.fileinfo {font-size: 10px;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 25px 15px 0;}
.imgright {float: right; margin: 0 0 15px 25px;}
.textcenter {text-align: center;}
.textright {text-align: right;}

.spacer {float: none; clear: both; height: 1px; overflow: hidden;}
.hr {float: none; clear: both; height: 1px; overflow: hidden; background: #ccc; margin: 1.5em -5px;}
.clear {float: none; clear: both;}

.half {width: 50%;}
.third {width: 33%;}
.twothird {width: 60%;}
.quarter {width: 25%;}
.threequarter {width: 70%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** TOP STYLES ***/

#outer {position: relative; width: 982px; padding: 0 4px; background: #fff url(../images/outer.gif); margin: 0 auto; text-align: left;}

#top {position: relative; height: 86px;}
#logo {position: absolute; left: 15px; top: 15px; width: 260px; height: 60px; font-size: 30px; font-family: "arial narrow", arial, sans-serif; font-style: italic; line-height: 1em; text-decoration: none; overflow: hidden;}
#logo .ir {background: url(../images/logo.gif) no-repeat;}
#printlogo {display: none;}

#eyebrow {position: absolute; right: 7px; top: 15px; overflow: hidden; line-height: 1.15em; font-size: 11px;}
#eyebrow li {position: relative; left: 1px; float: left; border-right: 1px solid #ccc; padding: 0 10px;}

#subbrow {position: absolute; right: 7px; bottom: 20px; overflow: hidden; line-height: 1.15em; font-weight: bold;}
#subbrow li {position: relative; left: 1px; float: left; border-right: 1px solid #ccc; padding: 0 10px;}
#subbrow a#emaillink {padding-left: 23px; background: url(../images/emaillink.gif) left center no-repeat;}


/*** NAV BAR STYLES ***/

#navbar {line-height: 34px; height: 34px; background: #6fa0ce url(../images/nav.gif); font-weight: bold;}
#nav li {float: left; border-right: 1px solid #2e5c91;}
#nav a {display: block; white-space: nowrap; width: 10px; padding: 0 11px; color: #fff; text-decoration: none;}
	html>body #nav a {width: auto;}
#nav li.on, #nav a:hover {background: #466791 url(../images/nav.gif) 0 -34px;}

#partsearchform {float: right; color: #fff; padding: 5px 15px 0 0;}
	html>body #partsearchform {padding-top: 0;}
#partsearchform input {border: 1px solid #2e5c91; margin-left: 5px;}
#partsearchtext {width: 90px; font-size: 11px;}
#partsearchbutton {background: #e1b400; font-weight: bold; color: #fff; cursor: pointer; cursor: hand; vertical-align: middle;}

#diags {height: 40px; line-height: 42px; overflow: hidden; padding: 0 10px; background: #ececec url(../images/diags.gif) repeat-x; color: #666; font-weight: bold; font-size: 12px; margin-bottom: 10px;}
	body.home #diags {margin-bottom: 2px;}
#diags p {margin: 0;}
#diags .floatright {font-style: italic;}


/*** STRUCTURAL STYLES ***/

#main {background: url(../images/main.gif) repeat-y;}
	body.search #main {background: #fff;}
#left {float: left; width: 760px;}
	body.search #left {float: none; width: auto;}
#content {float: right; width: 480px; padding: 0 35px 20px 0;}
	body.search #content {float: none; width: auto; padding: 0 35px;}
#leftnav {float: left; width: 180px; padding: 0 15px 20px; font-size: 12px;}
#right {float: right; width: 180px; padding: 10px 20px 20px; background: #f5f5f5; font-size: 12px;}


/*** CONTENT STYLES ***/

#main h1 {font-size: 19px; font-weight: normal; line-height: 1.3em; margin: .5em 0 .8em 0;}
#main h2 {font-size: 15px; line-height: 1.3em; margin: 1em 0 .8em 0;}
#left ul {margin: 1.5em .5em;}
#leftnav ul {margin: .5em 3px;}
#left ul li {padding-left: 13px; background: url(../images/bullet-blue.gif) 0 7px no-repeat; margin-bottom: 5px;}
#left ul li p {margin-bottom: 1em;}
#leftnav ul li {margin: 0 -5px 1px; padding: 0 18px; background-position: 5px 9px; line-height: 16px;}
#leftnav ul li.on {background-color: #f5f5f5;}
#leftnav ul li a {display: block; padding: 3px 0; width: 148px;}
#right ul li {margin-bottom: 1px;}

#content a.orangearrowlink {background-position: right 8px;}

.productgrid {float: left; width: 140px; font-size: 12px; line-height: 16px; text-align: center; padding: 0 10px 15px;}
.productgrid img {border: 1px solid #ccc; width: 67px; height: 67px;}
.productgrid a {text-decoration: none;}
.productgrid a:hover div {text-decoration: underline;}
#producthero {border: 1px solid #ccc; width: 176px; height: 139px;}

#content table {border-collapse: collapse; border: 1px solid #ccc; margin: 1.5em 0;}
#content td {padding: 5px 10px; border-bottom: 1px solid #ccc;}
#content tr.alt td {background: #eee;}
.searchtable td {border: 1px solid #ccc;}
.searchtable thead td {background: #eee; font-weight: bold;}

#contactform {width: 425px; margin: 1.5em 0;}
#contactform div {clear: both; padding-top: 4px;}
#contactform label {float: left; width: 95px; text-align: right; line-height: 25px; padding-right: 17px;}
#contactform .required label {background: url(../images/required.gif) right 7px no-repeat;}
#contactform input, #contactform textarea {float: right; width: 300px;}
#contactform textarea {height: 100px;}
#contactform .checkbox input {width: auto;}
#contactform .w100 input {width: 100px;}
#contactform .w200 input {width: 200px;}
#contactform #submitbutton {width: auto; background: #6fa0ce; color: #fff; font-weight: bold; text-transform: uppercase; border: 0; margin: 2px; cursor: pointer; cursor: hand;}
#contactform #submitbutton:hover {background: #f60;}

.caption {font-size: 11px; text-align: center; padding-top: 5px;}


/*** RIGHT BAR STYLES ***/

h2.pdfhead {padding-left: 22px; background: url(../images/pdf.gif) 0 0 no-repeat;}
#right .hr {margin: 1.5em -5px;}
#right .orangearrowlink, #leftnav .orangearrowlink {text-transform: uppercase; font-size: 10px;}

#right ul li {line-height: 14px; margin-bottom: 7px;}

.module {margin: -7px; background: #fff url(../images/module.gif); line-height: 16px;}
.moduletop {background: url(../images/moduletop.gif) left top no-repeat;}
.modulebottom {background: url(../images/modulebottom.gif) left bottom no-repeat;}
.module a {display: block; color: #000; text-decoration: none; padding: 15px;}
.moduleimg {float: right; margin: 0 0 0 7px; width: 50px; height: 50px;}
.modulehead {display: block; font-weight: bold; text-transform: uppercase;}
.modulemore {color: #f60; padding-right: 12px; background: url(../images/bullet-orange.gif) right 5px no-repeat; font-weight: bold; text-transform: uppercase; font-size: 10px;}
.module a:hover .modulemore {text-decoration: underline;}


/*** FOOTER STYLES ***/

#distributorfor {position: relative; margin: 10px 11px 0; border-top: 1px solid #ccc; height: 61px; text-align: center; line-height: 61px; font-size: 17px; color: #666; font-weight: normal; font-style: italic;}
#distributorfor .ir {background: url(../images/distributorfor.jpg);}

#footer {margin: 0 -4px; padding: 0 15px 15px; background: url(../images/footer.gif) left bottom no-repeat; font-family: arial, sans-serif; zoom: 1;}
#footer h2, #footer p {margin: 0; padding: 15px 8px 10px;}
#footer h2 {float: right; color: #6fa0ce; font-style: italic;}
#footer p {font-size: 11px; border-top: 1px solid #ccc; color: #369; line-height: 15px;}


/*** HOME STYLES ***/

#homephotos {position: relative; height: 192px; border-bottom: 15px solid #fff; overflow: hidden; background: #fff;}
#homephotos div {position: absolute; left: 0; top: 0; opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100);}

#homeads {background: url(../images/homeads.gif) left bottom no-repeat; margin: 1.5em -5px; width: 490px; line-height: 18px;}
#homeadstop {background: url(../images/homeadstop.gif) left top no-repeat;}
#homeads div.floatleft, #homeads div.floatright {width: 210px; background: #f5f5f5; margin: 10px 0; padding: 0 15px;}
#homeads h3 {margin-bottom: 5px;}
#homeads p {margin: 1em 0 0 0;}
#homeads img {margin: 0; border: 1px solid #ccc;}
#homeads .arrowlink {color: #f60; background-image: url(../images/bullet-orange.gif);}

body.home #content h1 {font-size: 23px;}

