/*** GENERAL STYLES ***/

body {background: #fff center top repeat-y; text-align: center; margin: 0; padding: 0;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {font-family: arial, helvetica, sans-serif; font-size: 12px; color: #444;}
body, th, td, h1, h2, h3, h4, h5, h6 {line-height: 18px;}
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: #000;}
a:hover {color: #000;}
.backlink {position: absolute; right: 30px; top: 45px;}

.hide {display: none;}
.alert {color: #c00;}
.small {font-size: 11px;}
.large {font-size: 13px;}
.nowrap {white-space: nowrap;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 30px 20px 0;}
.imgright {float: right; margin: 0 0 20px 30px;}
div.imgborder {border: 1px solid #ccc; padding: 5px;}
div.imgborder img {display: block;}
img.imgborder {border: 1px solid #ccc;}
.textleft {text-align: left;}
.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: 2em 0;}
.clear {float: none; clear: both;}

.percent10 {width: 10%;}
.percent15 {width: 15%;}
.percent20 {width: 20%;}
.percent25, .quarter {width: 25%;}
.percent30 {width: 30%;}
.percent33, .third {width: 33%;}
.percent35 {width: 35%;}
.percent40 {width: 40%;}
.percent45 {width: 45%;}
.percent50, .half {width: 50%;}
.percent55 {width: 55%;}
.percent60 {width: 60%;}
.percent65 {width: 65%;}
.percent66, .twothird {width: 65%;}
.percent70 {width: 70%;}
.percent75, .threequarter {width: 75%;}
.percent80 {width: 80%;}
.percent85 {width: 85%;}
.percent90 {width: 90%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** STRUCTURAL STYLES ***/

#outer {position: relative; width: 950px; margin: 0 auto; text-align: left; background: #fff; min-height: 550px; height: 550px; padding-bottom: 30px; z-index: 1;}
#flashnav {height: 75px; z-index: 1; margin-bottom: 10px;}

#paper {background: url(../images/paper.gif);}
#papertop, #paperbottom {height: 22px; margin: 0 -9px;}
#papertop {background: url(../images/papertop.gif);}
#paperbottom {background: url(../images/paperbottom.gif);}

#main {min-height: 320px; overflow: hidden; zoom: 1;}
#leftcol {float: left; width: 200px;}
#rightcol {position: relative; float: right; width: 600px;}


/*** LEFT COLUMN STYLES ***/

#sectionname {height: 35px; line-height: 35px; font-size: 12px; color: #fff; padding: 0 15px; text-transform: uppercase; margin-bottom: 10px;}
#leftnavtop, #leftnavbottom {display: none;}
#leftnav {border-style: solid; border-width: 2px 0 0 0;}
#leftnav li {border-style: solid; border-width: 0 0 2px 0;}
#leftnav a {display: block; width: 170px; padding: 6px 15px; line-height: 16px; text-decoration: none; font-weight: bold;}
#leftnav ul {padding-bottom: 8px; display: none;}
#leftnav li.on ul {display: block;}
#leftnav ul li {border: 0;}
#leftnav ul a {width: 140px; padding: 4px 30px; color: #444; font-weight: normal;}
#leftnav a:hover, #leftnav li.on a {color: #fff;}
#leftnav li.on ul.thirdnav li a {background: #fff; color: #000;}
#leftnav li.on ul.thirdnav a:hover, #leftnav li.on ul.thirdnav li.on a {background: #eee; color: #000 !important;}
#leftbuttons {display: none;}


/*** RIGHT COLUMN STYLES ***/

#pagetitle {height: 35px; line-height: 35px; font-size: 19px; color: #fff; padding: 0 30px; text-transform: uppercase; font-weight: normal; margin-right: 20px; background-image: url(../images/pagetitle.png);}
#content {padding: 30px 20px 30px 30px;}
#content h2 {font-size: 16px;}
#content h3 {font-size: 13px;}
#content h2, #content h3, #content h4, #content h5, #content h6 {margin: 1.5em 0 .5em;}
#content ul {margin: 0 0 1.5em 0;}
#content ul li {padding: 0 30px; background: url(../images/bullet.gif) 20px 8px no-repeat; margin-bottom: 8px;}

#mapdiv {clear: both; float: right; width: 300px; text-align: center; font-size: 11px;}
#map {width: 300px; height: 250px; margin: 0 0 10px 0; overflow: hidden;}
#mapform {position: relative; border: solid #ccc; border-width: 1px 0; margin: 1em 0 0; padding: 1em 3px; width: 260px; z-index: 1;}
#mapformdiv {clear: left; margin-bottom: 2em;}
#mapformdiv #mapform label {width: 60px; text-align: left; padding-right: 10px; font-weight: bold;}
#mapcity {width: 100px;}
#mapbtn {margin-left: 70px;}
#maplegend {width: 260px; font-size: 11px; line-height: 28px; margin-bottom: 2.5em; overflow: hidden; border-bottom: 1px solid #ccc; padding: 0 3px 1em;}
#maplegend img {vertical-align: middle;}
#maptable {width: 100%;}
#maptable thead th, #maptable thead td {line-height: 14px; font-size: 12px;}

.partnerdiv {float: left; margin: 0 20px 20px 0; border: 1px solid #ddd; padding: 10px;}

#content ul#whatshappening {margin-right: -17px; width: 612px;}
#content ul#whatshappening li {float: left; width: 187px; margin: 0 12px 10px 0; background: none; padding: 0;}
#whatshappening a {display: block; color: #000; text-decoration: none;}
#whatshappening img {display: block; width: 185px; height: 95px; border: 1px solid #ddd; margin-bottom: 4px;}
#content ul#whatshappening li.spacer {float: none; width: 100%; margin: 0;}

p.coupon {padding: 15px; border: 5px dashed #ccc;}
p.coupon a {display: block;}
body.coupon #flashnav, body.coupon #papertop, body.coupon #paperbottom, body.coupon #pagetitle, body.coupon #leftcol, body.coupon #footer {display: none;}
body.coupon #outer, body.coupon #waves, body.coupon #paper, body.coupon #main, body.coupon #rightcol, body.coupon #content {width: auto; padding: 0; float: none; background: none !important;}
body.coupon div.textcenter {line-height: 555px;}
body.coupon div.textcenter img {vertical-align: middle;}

#ourdistributors {overflow: hidden;}
#ourdistributors img {float: left; margin: 0 20px 10px 0; height: 50px;}

.newspaging {border: solid #ccc; border-width: 1px 0; margin: 2em 0; font-size: 11px; text-align: center; padding: 5px;}
.newspaging a {text-decoration: none;}
.newspaging strong {font-size: 13px;}


/*** TABLE STYLES ***/

table {border-collapse: collapse;}
td, th {padding: 5px 10px; border: 1px solid #ddd; text-align: left;}
tr.alt td, tr.alt th {background: #f3f3f3;}
thead td, thead th {font-weight: bold; text-transform: uppercase; color: #fff;}


/*** FORM STYLES ***/

#contactform {margin: 2em 0;}
form div {clear: left; padding-top: 3px;}
form label {position: relative; float: left; width: 100px; padding-right: 20px; text-align: right;}
form .note {display: block; padding-left: 200px; margin-bottom: 5px; font-size: 11px;}
form .req {position: absolute; right: 4px; top: 0; color: #c00; font-size: 30px; line-height: 30px;}
form .text input, form textarea {width: 350px;}
form textarea {height: 100px;}
form .checkbox input {vertical-align: middle; width: auto !important;}
form .button input {margin: 5px 0 0 120px;}
form .button input:hover {cursor: pointer;}

#loginform {float: right; border: 1px solid #ccc; padding: 15px; margin: 0 0 20px 30px;}
#loginform h3 {background: #ccc; margin: -15px -15px 15px; color: #fff; line-height: 25px; padding: 0 10px; font-size: 15px;}
#loginform label {width: 70px; padding-right: 10px;}
#loginform .text input {width: 150px;}
#loginform .button input {margin-left: 80px;}


/*** THIRD NAV STYLES ***/

#thirdnav {overflow: hidden;}
#thirdnav li {float: left; line-height: 30px;}
#thirdnav li a {display: block; color: #fff; text-decoration: none; padding: 0 10px;}
#thirdnav li.on a, #thirdnav li a:hover {background: #000;}


/*** FOOTER STYLES ***/

#footer {clear: both; padding: 0 10px; color: #666; font-size: 11px; text-align: center;}


/*** EMAIL THIS PAGE STYLES ***/

#fade {position: absolute; left: 0; top: 0; width: 100%; height: 800px; background: #000; filter: alpha(opacity=70); -moz-opacity: .7; opacity: .7; z-index: 20;}
	html>body #fade {height: 200%;}
#emailthispage {position: absolute; left: 0; top: 0; width: 100%; padding-top: 80px; z-index: 30;}
#emailthispage form {margin: 0 auto; border: 10px solid #fff; background: #fff; text-align: left; width: 400px; padding-bottom: 20px;}
#emailthispage h4 {background: #D42E12; color: #fff; padding: 0 10px; line-height: 26px; font-size: 14px; margin-bottom: 20px;}
#emailthispage h4 a {color: #fff; font-size: 12px; font-weight: normal;}
#emailthispage form .text input {width: 250px;}


/*** COLOR SCHEME STYLES ***/

#bkg2, #bkg3, #outer {min-height: 550px; height: 550px;}
	html>body #bkg2, html>body #bkg3, html>body #outer {height: auto;}
	#bkg2 {background: fixed repeat-x;}
	#bkg3 {background: fixed center top no-repeat;}

body.red {background-color: #ec3314; background-image: url(../images/bkg1-red.gif);}
body.red #bkg2 {background-image: url(../images/bkg2-red.gif);}
body.red #bkg3 {background-image: url(../images/bkg3-red.gif);}

body.orange {background-color: #ff7200; background-image: url(../images/bkg1-orange.gif);}
body.orange #bkg2 {background-image: url(../images/bkg2-orange.gif);}
body.orange #bkg3 {background-image: url(../images/bkg3-orange.gif);}

body.green {background-color: #007a5e; background-image: url(../images/bkg1-green.gif);}
body.green #bkg2 {background-image: url(../images/bkg2-green.gif);}
body.green #bkg3 {background-image: url(../images/bkg3-green.gif);}

body.blue {background-color: #053ea3; background-image: url(../images/bkg1-blue.gif);}
body.blue #bkg2 {background-image: url(../images/bkg2-blue.gif);}
body.blue #bkg3 {background-image: url(../images/bkg3-blue.gif);}

body.black {background-color: #4a4a4a; background-image: url(../images/bkg1-purple.gif);}
body.black #bkg2 {background-image: url(../images/bkg2-purple.gif);}
body.black #bkg3 {background-image: url(../images/bkg3-purple.gif);}

body.white {background-color: #fff; background-image: url(../images/bkg1-white.gif);}

#waves {background: 0 84px no-repeat; padding: 0 75px; zoom: 1;}

body.red #waves {background-image: url(../images/waves-red.jpg);}
body.orange #waves {background-image: url(../images/waves-orange.jpg);}
body.green #waves {background-image: url(../images/waves-green.jpg);}
body.blue #waves {background-image: url(../images/waves-blue.jpg);}
body.black #waves {background-image: url(../images/waves-purple.jpg);}

body.red a, body.red #pagetitle, body.red #content h1, body.red h2, body.red h3, #whatshappening a:hover {color: #D42E12;}
body.orange a, body.orange h2, body.orange h3 {color: #F56600;}
body.green a, body.green h2, body.green h3 {color: #007A5E;}
body.blue a, body.blue h2, body.blue h3 {color: #003082;}
body.black a, body.black h2, body.black h3 {color: #222222;}

/*body.red #pagetitle, */body.red #sectionname, body.red #leftnav a:hover, body.red #leftnav li.on a, body.red #thirdnav, body.red thead td, body.red thead th, body.red #loginform h3, body.red #mainnav {background-color: #D42E12;}
body.orange #pagetitle, body.orange #sectionname, body.orange #leftnav a:hover, body.orange #leftnav li.on a, body.orange #thirdnav, body.orange thead td, body.orange thead th, body.orange #loginform h3, body.orange #mainnav {background-color: #F56600;}
body.green #pagetitle, body.green #sectionname, body.green #leftnav a:hover, body.green #leftnav li.on a, body.green #thirdnav, body.green thead td, body.green thead th, body.green #loginform h3, body.green #mainnav {background-color: #007A5E;}
body.blue #pagetitle, body.blue #sectionname, body.blue #leftnav a:hover, body.blue #leftnav li.on a, body.blue #thirdnav, body.blue thead td, body.blue thead th, body.blue #loginform h3, body.red #blue {background-color: #003082;}
body.black #pagetitle, body.black #sectionname, body.black #leftnav a:hover, body.black #leftnav li.on a, body.black #thirdnav, body.black thead td, body.black thead th, body.black #loginform h3, body.black #mainnav {background-color: #222222;}

body.red #leftnav, body.red #leftnav li, body.red #loginform {border-color: #D42E12;}
body.orange #leftnav, body.orange #leftnav li, body.orange #loginform {border-color: #F56600;}
body.green #leftnav, body.green #leftnav li, body.green #loginform {border-color: #007A5E;}
body.blue #leftnav, body.blue #leftnav li, body.blue #loginform {border-color: #003082;}
body.black #leftnav, body.black #leftnav li, body.black #loginform {border-color: #222222;}

body.white #mainnav, body.red #mainnav {background-image: url(../images/nav-red.jpg);}
body.orange #mainnav {background-image: url(../images/nav-orange.jpg);}
body.green #mainnav {background-image: url(../images/nav-green.jpg);}
body.blue #mainnav {background-image: url(../images/nav-blue.jpg);}
body.black #mainnav {background-image: url(../images/nav-black.jpg);}


/*** CONSUMER SECTION STYLES ***/

body.red #waves {background: none; padding: 0;}
body.red #papertop, body.red #paperbottom, body.red #sectionname {display: none;}
body.red #paper, body.red #main {background: none;}
body.red #main {padding: 0 100px;}
body.red #consumersflash {margin-bottom: 15px;}
body.red #rightcol {width: 585px;}
body.red #content {padding: 0 0 40px;}

body.red #pagetitle, body.red #content h1, body.red #content h2.theheadline {font-family: "arial narrow", "arial", helvetica, sans-serif; font-weight: bold; background: none; font-size: 30px !important; line-height: 30px !important; text-transform: uppercase; border-bottom: 2px solid #000; margin: 0 0 15px 0; padding: 10px 0 5px !important; height: auto !important;}
body.red #content h1.small {font-size: 16px !important; line-height: 16px !important;}

body.red #leftcol {width: 150px;}
body.red #leftnavtop, body.red #leftnavbottom {display: block; height: 11px; overflow: hidden; background: url(../images/red-leftnav-top.gif);}
body.red #leftnavbottom {background: url(../images/red-leftnav-bottom.gif);}

body.red #leftnav {border: 0; background: url(../images/red-leftnav.gif) right top repeat-y; padding-right: 15px;}
body.red #leftnav li {border-width: 2px 0 0 0;}
body.red #leftnav li#leftnavfirst {border-top: 0;}
body.red #leftnav a {display: block; width: 125px; padding: 6px 5px; line-height: 16px; text-decoration: none; font-weight: bold; color: #000;}
body.red #leftnav a:hover, body.red #leftnav li.on a {color: #fff;}

body.red #leftnav ul {padding: 8px 0; display: none;}
body.red #leftnav li.on ul {display: block;}
body.red #leftnav ul li {border: 0;}
body.red #leftnav ul a {width: 120px; padding: 4px 5px 4px 10px; color: #444; font-weight: normal;}

body.red #leftbuttons {display: block; margin-top: 10px;}
body.red #leftbuttons a, body.red #leftbuttons img {display: block;}

body.red .backlink {right: 0; top: 20px;}


/*** TEST STYLES ***/

.alldata .alert {background: #ff0;}
.alldata th, .alldata td {padding: 3px 8px; font-size: 11px; width: 170px;}
.alldata th {font-weight: normal; text-align: right; width: 90px; background: #f2f2f2;}
.alldata .divider th, .alldata .divider td {border-top: 4px solid #666;}


/*** HOME FLASH REPLACEMENT STYLES ***/

#mainnav {position: relative; height: 75px; padding-left: 225px;}
#mainnav li {float: left;}
#mainnav a {display: block; line-height: 19px; font-size: 10px; color: #fff; text-decoration: none; height: 19px; line-height: 300px; overflow: hidden;}
#mainnav1 a, #mainnav2 a, #mainnav3 a {position: absolute; left: 1px; top: 10px; width: 60px; height: 55px;}
#mainnav2 a {left: 61px;}
#mainnav3 a {left: 121px;}
#mainnav4 a {position: absolute; right: 10px; top: 20px; width: 165px; height: 35px;}
#mainnavred {width: 75px;}
#mainnavorange {width: 76px;}
#mainnavgreen {width: 141px;}
#mainnavblue {width: 152px;}
#mainnavblack {width: 77px;}

#homenav {position: relative; width: 280px; height: 225px; padding: 9px 231px 9px 439px; background: url(../images/homenav.jpg); border: solid #fff; border-width: 74px 0 50px;}
#homenav a {display: block; width: 280px; height: 45px; line-height: 300px; overflow: hidden;}
#homecontent {padding: 0 175px 0 45px;}
#homecontent h1#homeheadline {font-family: "arial narrow", "arial", helvetica, sans-serif; font-weight: bold; font-size: 30px; line-height: 30px; text-transform: uppercase; margin: 0 0 25px 0; color: #f04137;}
#homeheadline strong {color: #024d87;}