@import url('reset.css');

/* CSS LAYOUT
---------------------------------------------- */

div.container { position: relative; width: 981px; text-align: left; margin: 0 auto; background: url(../images/container.jpg) no-repeat 0 0; }


/* HEADER
---------------------------------------------- */

#header { position: relative; width: 100%; z-index: 9999; }
#header h1 a, #letter p { display: block; text-indent: -9999px; }

#header h1 a { background: url(../images/h1-a.jpg) no-repeat 0 0; width: 0px; height: 136px; margin: 0 auto; }

fieldset#letter { position: absolute; top: 53px; right: 0; width: 168px; }
#letter p { background: url(../images/letter-p.jpg) no-repeat 0 0; width: 168px; height: 36px; margin-bottom: 3px; }
#letter div.input { background: url(../images/letter-input.gif) no-repeat 0 0; width: 121px; height: 22px; }
#letter div.input input.text { position: relative; top: 2px; font-size: 11px; }
#letter input.submit { position: absolute; top: 39px; right: 0; background: url(../images/letter-input-submit.gif) no-repeat 0 0; width: 41px; height: 21px; }
div.message1 { position: absolute; bottom: -21px; right: 0; width: 25em; text-align: right; }
div#alert1 p { display: block; text-indent: 0; background: none; color: #FFF; width: auto; height: auto; font-size: 11px; }

ul#siteNav { position: relative; height: 53px; z-index: 2000; }
ul#siteNav li { position: absolute; top: 0; left: 0; height: 53px; }
ul#siteNav li a { position: absolute; top: 0; left: 0; height: 53px; background: url(../images/ul-sitenav.gif) no-repeat 0 0; display: block; text-indent: -9999px; }

ul#siteNav li.index { width: 187px; }
ul#siteNav li.index a { background-position: 0 0; width: 187px; }
ul#siteNav li.index a:hover, ul#siteNav li.index a.active { background-position: 0 100%; }

ul#siteNav li.product { width: 205px; left: 187px; }
ul#siteNav li.product a { background-position: -187px 0; width: 205px; }
ul#siteNav li.product a:hover, ul#siteNav li.product a.active { background-position: -187px 100%; }

ul#siteNav li.purchase { width: 204px; left: 392px; }
ul#siteNav li.purchase a { background-position: -392px 0; width: 204px; }
ul#siteNav li.purchase a:hover, ul#siteNav li.purchase a.active { background-position: -392px 100%; }

ul#siteNav li.support { width: 205px; left: 596px; }
ul#siteNav li.support a { background-position: -596px 0; width: 205px; }
ul#siteNav li.support a:hover, ul#siteNav li.support a.active { background-position: -596px 100%; }

ul#siteNav li.about { width: 180px; left: 801px; }
ul#siteNav li.about a { background-position: -801px 0; width: 180px; }
ul#siteNav li.about a:hover, ul#siteNav li.about a.active { background-position: -801px 100%; }

ul#siteNav ul.sf-menu { position: absolute; z-index: 2000; top: 54px; left: 0; }

ul#siteNav ul li { position: relative; text-align: center; display: block; height: auto; }
* html ul#siteNav ul li { position: relative; top: auto; left: auto; width: auto; }
ul#siteNav ul a { position: relative; top: auto; left: auto !important; text-indent: 0; height: auto; background: url(../images/ul-sitenav-li-li.png) repeat; border-bottom: #FFF solid 1px; padding: 16px 0; }
* html ul#siteNav ul a { background-color: #354946; background-image: none; }
ul#siteNav ul a:link, ul#siteNav ul a:visited, ul#siteNav ul a:hover, ul#siteNav ul a:active { color: #FFF; text-transform: uppercase; text-decoration: none; }
ul#siteNav ul.sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ }
ul#siteNav li:hover ul { display: block; z-index: 2000; }

/* CONTENT
---------------------------------------------- */

#content { position: relative; z-index: 10; background: #EDF0EC; margin-bottom: 23px; }
*:first-child+html #content { position: relative; }
* html #content { position: relative; }
#content div.ct { background: url(../images/ct.jpg) no-repeat 0 0; }
#content div.cb { background: url(../images/cb.gif) no-repeat bottom left; position: relative; top: 11px; padding: 15px; margin-bottom: 11px; min-height: 220px; }
* html #content { height: 1%; }
* html #content div.ct { height: 1%; }
* html #content div.cb { position: relative; top: 22px; min-height: 220px; height: auto !important; height: 220px; }

#content h1, #content h2, #content h3 {color: #00669e; font-weight: bold; margin-bottom: 8px;padding: 10px 0px 3px 0px; }

#content h1 {font-size: 25px}
#content h2 {font-size: 20px}
#content h3 {font-size: 15px}

#content p { padding: 0 0px; }
#content p, #content ol, #content ul { margin-bottom: 12px; }
#content ol, #content ul { padding: 0 0px; }
#content li { padding-top: 3px; padding-bottom: 3px;}
#content ol { list-style: decimal; list-style-position: inside; }
#content ul li { background: url(../images/arrow.png) no-repeat 0 4px; padding-left: 18px; }

#content img { border: #D1D3D0 solid 1px; }
.alignleft { float: left; }
.alignright { float: right; }
.aligncenter { margin: 0 auto; text-align: center; }

#content .alignleft { margin-right: 22px; }
#content .alignright { margin-left: 22px; }
#content div.wp-caption.alignright { margin: 0 33px 0 22px; }
#content div.wp-caption.alignleft { margin: 0 22px 0 33px; }
#content div.wp-caption.aligncenter { margin-bottom: 22px; }
#content div.wp-caption p { font-size: 11px; padding: 0; margin: 0 0 9px; }

#content div#testimonials { margin-top: 32px; }
#content blockquote.quote { margin: 0 33px 20px; padding-bottom: 20px; border-bottom: 1px solid #394543; }
#content blockquote.quote p { margin: 0 0 12px; padding: 0; }
#content blockquote.quote cite { color: #31504A; padding-left: 24px; }


/* MARQUEE
---------------------------------------------- */

#marquee { position: relative; width: 100%; height: 31px; }
#marquee h2 { position: absolute; top: 1px; left: 0; width: 140px; height: 29px; background: url(../images/marquee-h2.gif) no-repeat 0 0; display: block; text-indent: -9999px; }
#marquee div.mask { position: absolute; top: 1px !important; left: 140px !important; width: 843px; height: 31px !important; background: url(../images/marquee-ul.gif) no-repeat 0 0; overflow: hidden; }
#marquee marquee { position: relative; overflow: hidden; }
#marquee span { float: left; font-size: 11px; font-style: italic; height: 31px; line-height: 2.8; padding-left: 24px; }
#marquee div.date { float: left; color: #038D72; margin-right: 12px; }
#marquee a.stop { position: absolute; top: 0; right: 0; background: url(../images/marquee-a-stop.gif) no-repeat 0 7px; width: 33px; height: 31px; display: block; text-indent: -9999px; z-index: 50; }

/* HOME SUB
---------------------------------------------- */

#homeSub { background: url(../images/homesub.png) repeat-y 0 0; width: 983px; position: relative; left: -1px; margin-top: 78px; }
*:first-child+html #homeSub { z-index: 10; }
#homeSub ul { background: url(../images/homesub-ul.jpg) no-repeat bottom left; padding-bottom: 38px; }
*:first-child+html #homeSub ul { z-index: 10; }
#homeSub ul ol { margin: 0 13px; }
#homeSub li { width: 238px; float: left; margin-right: 10px; margin-top: -9px; }
* html #homeSub li { height: 1%; }
#homeSub li li { background: url(../images/homesub-li-li.gif) no-repeat 0 4px; margin: 0; float: none; width: auto; padding-left: 18px;margin-bottom: 12px; }
#homeSub p { padding: 0 12px; margin-bottom: 12px; }
* html #homeSub p { position: relative; z-index: 2000; }
#homeSub li#highRes p { padding: 0 12px; } 
#homeSub div.date, #homeSub q { margin: 0 13px; display: block; }
#homeSub div.date { color: #0A846C; margin-bottom: 6px; }
* html #homeSub div.date { position: relative; z-index: 2000; }
#homeSub q { border-bottom: #394543 solid 1px; padding-bottom: 8px; margin-bottom: 8px; }
#homeSub cite { display: block; margin-top: 6px;}
#homeSub cite span { color: #31504A;}
#homeSub q.last { border-bottom: none; }
#homeSub li#smallQuiet { margin-right: 11px; padding-bottom: 80px; }
#homeSub li#highRes { padding-bottom: 70px; }
#homeSub li.last { margin-right: 0; }

#homeSub p.viewSpecs { margin: 0; }
#homeSub p.viewSpecs a { background: url(../images/p-viewspecs-a.gif) no-repeat 0 0; width: 93px; height: 22px; display: block; text-indent: -9999px; }
#homeSub p.viewAll { margin: 0; padding: 0 0 0 123px; }
#homeSub p.viewAll a { background: url(../images/p-viewall-a.gif) no-repeat 0 0; width: 93px; height: 22px; display: block; text-indent: -9999px; }

#homeSub h3 { background: url(../images/homesub-h3.png) no-repeat 0 0; width: 238px; height: 80px; display: block; text-indent: -9999px; margin-top: -57px; margin-bottom: -9px; }
li#ecoFriendly h3 { background-position: 0 0; }
li#smallQuiet h3 { background-position: -248px 0; }
li#highRes h3 { background-position: -497px 0; }
li#testimonials h3 { background-position: -745px 0; }

/* EXTRA STYLES
---------------------------------------------- */

#extraStyle1, #extraStyle2, #extraStyle3, #extraStyle4 { position: absolute; z-index: 30; }
#extraStyle1 { bottom: -70px; left: 44px; background: url(../images/energy-star-fit-PC2.png) no-repeat 0 0; width: 150px; height: 222px; }
#extraStyle2 { bottom: -60px; left: 257px; background: url(../images/extrastyle2.png) no-repeat 0 0; width: 217px; height: 146px; }
#extraStyle3 { bottom: -40px; left: 515px; background: url(../images/hexapod.png) no-repeat 0 0; width: 200px; height: 145px; }
#extraStyle4 { bottom: -50px; left: 775px; background: url(../images/internals.png) no-repeat 0 0; width: 180px; height: 175px; }

/* FOOTER
---------------------------------------------- */

#footer { position: relative; width: 100%; height: 202px; background: url(../images/footer.png) no-repeat top center; margin-top: -38px; font-size: 11px; }
* html #footer { background: none; }
*:first-child+html #footer { background: none; }

#footer div.wrap { position: relative; z-index: 2000; top: 97px; margin: 0 auto; }
#footer div.wrap ul { margin-bottom: 12px; }

#footer li { border-right: #00120C solid 1px; display: inline; padding: 0 12px; }
#footer li.last { border-right: none; padding-right: 0; }
#footer a:link, #footer a:visited, #footer a:hover, #footer a:active { text-transform: uppercase; color: #FFF; text-decoration: none; }

#footer p a:link, #footer p a:visited, #footer p a:hover, #footer p a:active { text-transform: none; color: #000; text-decoration: underline; }
