* { margin: 0; }
* a { text-decoration:none; }
* a:hover { text-decoration:underline; }
img { border:none; }
body { position:absolute; width:900px; left:50%; margin-left:-450px; height:100%; background:#fff; }

h1 { font:bold 24px Calibri, sans-serif; color:#000; text-align:right; margin:10px 30px 20px 0; }
h2 { font:bold 20px Calibri, serif; color:#0071a8; }
h3 { font:bold 16px Calibri, serif; color:#0071a8; margin-top:15px;  }
p, li, span { font:normal 12px Calibri, serif; color:#a09f9f; line-height:24px; }
p a, li a, span a { font:normal 12px Calibri, serif; color:#a09f9f; }
a, a:hover { font:normal 12px Calibri, serif; color:#0071a8; }

.masthead { position:relative; width:900px; height:150px; margin:30px 0 10px 0; }
.logo { position:relative; float:left; width:288px; height:150px; background:#f2f2f2 url(../images/bg_logo.jpg) no-repeat; }
#rotate { position:relative; float:left; width:596px; height:100px; background:#ffece8; margin:0 0 0 10px; }
.spotlight { position:relative; float:left; width:596px; height:100px; background:#ffece8; margin:0 0 0 10px; }
.navigation { position:relative; float:left; width:596px; height:40px; background:#b9a37e url(../images/bg_nav.gif) no-repeat; margin:10px 0 0 10px; }
.navigation ul { list-style:none; margin-top:10px; }
.navigation ul li { display:inline; color:#fff; }
.navigation ul li a { font:normal 14px Arial, sans-serif; color:#fff; }

.content { position:relative; width:900px; }
.side { position:relative; float:left; width:288px; height:500px; background:transparent; }
.side p { position:relative; float:right; width:180px; font:normal 15px Calibri, Arial, sans-serif; color:#5e5e5e; text-align:right; margin:8px 0px; margin-right:8px; line-height:20px; z-index:2; }
.sidebox { position:relative; top:-8px; width:288px; height:150px; background:#fdc860 url(../images/bg_side_top.gif) no-repeat; }
.sidebox p { float:none; position:relative; left:26px; top:20px; width:230px; font:italic 24px Calibri, Arial, sans-serif; color:#fff; text-align:left; z-index:5; }
.main { position:relative; float:left; width:596px; height:320px; background:#e4e4e4 url(../images/bg_main.gif) no-repeat; margin:0 0 0 10px; }
.main p { width:150px; font:normal 24px Arial, sans-serif; color:#6e5287; margin:32px 10px }
.submain { position:relative; float:left; width:596px; height:158px; background:#d6fbc6 url(../images/bg_sub.gif) no-repeat; margin:10px 0 0 10px; }
.submain h3 { font:bold 20px Arial, sans-serif; color:#7a7a7a; margin:10px; }
.submain p, .submain p  a { font:normal 16px Arial, sans-serif; color:#7a7a7a; margin:10px; line-height:24px; }
.submain p a { text-decoration:underline; }

.copy  { position:relative; float:left; width:596px; height:auto; margin:0 0 0 10px; background:url(../images/main_corner.png) no-repeat top left; }
.copy h2 { font:bold 20px Calibri, serif; color:#4a4a4a; margin-left:20px; }
.copy ul { list-style:none; }
.copy p { text-align:justify; }
.copy p, .copy li { font:normal 14px Arial, sans-serif; color:#7a7a7a; margin:15px 20px; line-height:20px; }
.bold { font-weight:bold !important; }
.bigEmphasis, ol { font-size:22px; font-weight:bold; font-style:italic; margin-left:-10px; padding:0 7px; }

.footer { position:relative; width:900px; border-top:1px solid #bfbfbf; margin-top:50px; }
.footer ul { list-style:none; }
.footer ul li { display:inline; font:normal 12px Calibri, arial, sans-serif; color:#a09f9f; text-align:center; }
.footer ul li 
.footer ul li.copyright { font:normal 10px Calibri, arial, sans-serif; color:#a09f9f; text-align:center; }

.clear { clear:both; }

.prodBanner { 
position:relative; 
float:left; width:596px; 
height:372px; 
margin:0 0 0 10px; 
background:url(../images/canisters.jpg) no-repeat top left; 
}

.prodTable { 
position:relative; 
float:left; 
width:596px; 
height:auto;
padding-top:20px; 
margin:0 0 0 10px; 
background:none; 
}

.prodTitle { 
font:bold 24px Calibri, sans-serif; 
color:#6f5288; 
text-align:left; 
margin:10px 30px 20px 0; 
}
/* ---------------------------------------------------------------------------------------------- */

/* JQUERY CODA SLIDER  */

.intro { position:relative; top:0px; left:0px; z-index:1; }
.wrapper h1 { position:relative; top:25px; left:20px; width:60%; font:italic normal 42px "Myriad Pro", Arial, sans-serif; color:#fff; line-height:40px; }
.wrapper p { position:relative; top:30px; left:20px; width:40%; font:normal 12px Arial, sans-serif; color:#fff; text-align:justify; line-height:18px; }
.wrapper p img { position:relative; top:0px; }
.wrapper p a { position:relative; font:bold 10px Arial, sans-serif; color:#78c2f1; text-decoration:underline; }
.wrapper p a:hover { text-decoration:none; }
.panel .wrapper  p span { font:italic bold 14px Arial, sans-serif; color:#fff; }

.stripViewer .panelContainer .panel ul { text-align: left; margin: 0 15px 0 30px; }

.wrapper2 h1 { position:relative; top:35px; left:20px; width:60%; font:italic normal 42px "Myriad Pro", Arial, sans-serif; color:#4d4d4d; line-height:40px; }
.wrapper2 p { position:relative; top:30px; left:38px; width:475px; font:normal 12px Arial, sans-serif; color:#4d4d4d; text-align:justify; line-height:18px; }
.wrapper2 p img { position:relative; top:0px; }
.wrapper2 p a { position:relative; font:bold 10px Arial, sans-serif; color:#78c2f1; text-decoration:underline; }
.wrapper2 p a:hover { text-decoration:none; }

.wrapper3 h1 { position:relative; top:15px; left:20px; width:60%; font:bold 20px Calibri, serif; color:#0071a8; line-height:10px; }

.wrapper3 p { position:relative; top:30px; left:38px; width:475px; font:normal 12px Arial, sans-serif; color:#4d4d4d; text-align:justify; line-height:18px; }
.wrapper3 img { position:relative; top:35px; left:30px;}
.wrapper3 p a { position:relative; font:bold 10px Arial, sans-serif; color:#78c2f1; text-decoration:underline; }
.wrapper3 p a:hover { text-decoration:none; }

.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */ margin: 0px 0; 	position: relative; width: 100%; }

#banner {  background:#fff url(../images/main_corner.png) no-repeat top left;  }

/* These 2 lines specify style applied while slider is loading */
#banner .csw {width: 100%; height:350px; background: #fff; overflow: scroll}
.csw .loading {margin: 200px 0 300px 0; text-align: center; }

#banner .stripViewer { /* This is the viewing window */ position: relative; overflow: hidden; 
	border:none; /* this is the border. should have the same value for the links */
	margin: auto; width: 596px; /* Also specified in  .stripViewer .panelContainer .panel  below */
	height: 1100px; clear: both; background:transparent; }

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
	position: relative; left: 0; top: 0; width: 100%; list-style-type: none;
	/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy  fools. */ }

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */ float:left; height: 100%; position: relative; z-index:10; width: 800px; /* Also specified in  .stripViewer  above */ }

.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
	padding: 0px; }

#banner .stripNav { /* This is the div to hold your nav (the UL generated at run time) */
	position:absolute; left:0px; top:0px; height:15px; width:300px; margin: auto; padding:0px; z-index:110; }


#banner .stripNav ul { /* The auto-generated set of links */ list-style: none; }
#banner .stripNav ul li { float: left; padding:0px; margin-right: 0px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */ }
#banner .stripNav a { /* The nav links */ font:normal 10px 'Century Gothic', Arial, Helvetica, sans-serif; text-align: center; line-height: 32px; background: #c6e3ff; color: #4d4d4d; text-decoration: none; display: inline; padding: 0px 0px; }

#banner .stripNav li.tab1 a { background:transparent; }
#banner .stripNav li.tab2 a { background:transparent; }
#banner .stripNav li.tab3 a { background:transparent; }
#banner .stripNav li.tab4 a { background:transparent; }
#banner .stripNav li.tab5 a { background:transparent; }
#banner .stripNav li.tab6 a { background:transparent; }
#banner .stripNav li.tab7 a { background:transparent; }
#banner .stripNav li.tab8 a { background:transparent; }
#banner .stripNav li.tab9 a { background:transparent; }

#banner .stripNav li a:hover { background-color:rgba(0, 0, 0, 0.25); }
#banner .stripNav li a.current { background-color:rgba(0, 0, 0, 0.45); color: #fff; }

#banner .stripNavL, #banner .stripNavR { /* The left and right arrows */ position: absolute; padding:0px 15px; top: 180px; text-indent: -9000em; z-index:100; }

#banner .stripNavL a, #banner .stripNavR a { display: block; height: 69px; width: 27px; }
#banner .stripNavL { left: 0; }
#banner .stripNavR { right: 0; }
#banner .stripNavL { background: url("../images/arrow-lft.png") no-repeat center; }
#banner .stripNavR { background: url("../images/arrow-rt.png") no-repeat center; }
#banner .stripNav { display: block; }