/* BASIC ELEMENTS
------------------------------------------------------------------------------------- */
* { margin: 0; padding: 0; }
html { min-height: 100%; margin-bottom: 1px; }

body { text-align: center; font: 12px tahoma, arial, sans-serif; color: #000; }
table, th, td { font: 12px tahoma, arial, sans-serif; color: #000; }

a img, :link img, :visited img { border: none; }

a:link { color: #0072bc; text-decoration: underline; }
a:visited { color: #0072bc; text-decoration: underline; }
a:hover, a:active { color: #0072bc; text-decoration: none; }

#skip { display: none; }

#container { margin: 0 auto; width: 760px; text-align: left; }


/* NAVIGATION
------------------------------------------------------------------------------------- */
#nav { position: absolute; top: 0; left: 0; width: 760px; height: 43px; display: none; }
#nav li { float: left; position: relative; height: 43px; list-style: none; }
#nav li a { cursor: pointer; }
#nav li a, #nav li div { position: relative; display: block; height: 43px; text-decoration: none; color: #fff; font-size: 14px; }
#nav li strong { position: absolute; top: 0px; left: 0px; display: block; height: 43px; }
#nav li, #nav li a, #nav li strong, #nav li div { background-image: url(../images/nav.gif); }

#nav li.one, #nav li.one a, #nav li.one a strong { background-position: 0px 0px; width: 102px; }
#nav li.two, #nav li.two a, #nav li.two a strong { background-position: -102px 0px; width: 91px; }
#nav li.three, #nav li.three a, #nav li.three a strong { background-position: -193px 0px; width: 109px; }
#nav li.four, #nav li.four a, #nav li.four a strong { background-position: -302px 0px; width: 98px; }
#nav li.five, #nav li.five a, #nav li.five a strong { background-position: -400px 0px; width: 83px; }
#nav li.six, #nav li.six a, #nav li.six a strong { background-position: -483px 0px; width: 83px; }
#nav li.seven, #nav li.seven a, #nav li.seven a strong { background-position: -566px 0px; width: 105px; }
#nav li.eight, #nav li.eight a, #nav li.eight a strong { background-position: -671px 0px; width: 89px; }
 
/* HOVER STATE */
#nav li.one:hover a, #nav li.one a:hover, #nav li.one:hover a strong, #nav li.one a:hover strong { background-position: 0px -43px; width: 102px; }
#nav li.two:hover a, #nav li.two a:hover, #nav li.two:hover a strong, #nav li.two a:hover strong { background-position: -102px -43px; width: 91px; }
#nav li.three:hover a, #nav li.three a:hover, #nav li.three:hover a strong, #nav li.three a:hover strong { background-position: -193px -43px; width: 109px; }
#nav li.four:hover a, #nav li.four a:hover, #nav li.four:hover a strong, #nav li.four a:hover strong { background-position: -302px -43px; width: 98px; }
#nav li.five:hover a, #nav li.five a:hover, #nav li.five:hover a strong, #nav li.five a:hover strong { background-position: -400px -43px; width: 83px; }
#nav li.six:hover a, #nav li.six a:hover, #nav li.six:hover a strong, #nav li.six a:hover strong { background-position: -483px -43px; width: 83px; }
#nav li.seven:hover a, #nav li.seven a:hover, #nav li.seven:hover a strong, #nav li.seven a:hover strong { background-position: -566px -43px; width: 105px; }
#nav li.eight:hover a, #nav li.eight a:hover, #nav li.eight:hover a strong, #nav li.eight a:hover strong { background-position: -671px -43px; width: 89px; }

/* ON STATE */
#nav li.oneon, #nav li.oneon strong, #nav li.oneon div { background-position: 0px -86px; width: 102px; }
#nav li.twoon, #nav li.twoon strong, #nav li.twoon div { background-position: -102px -86px; width: 91px; }
#nav li.threeon, #nav li.threeon strong, #nav li.threeon div { background-position: -193px -86px; width: 109px; }
#nav li.fouron, #nav li.fouron strong, #nav li.fouron div { background-position: -302px -86px; width: 98px; }
#nav li.fiveon, #nav li.fiveon strong, #nav li.fiveon div { background-position: -400px -86px; width: 83px; }
#nav li.sixon, #nav li.sixon strong, #nav li.sixon div { background-position: -483px -86px; width: 83px; }
#nav li.sevenon, #nav li.sevenon strong, #nav li.sevenon div { background-position: -566px -86px; width: 105px; }
#nav li.eighton, #nav li.eighton strong, #nav li.eighton div { background-position: -671px -86px; width: 89px; }


/* CONTENT
------------------------------------------------------------------------------------- */
#h_header { margin: 20px 0 0; height: 355px; position: relative; z-index: 50; }
	.title { display:none; }
	.home_fish { background: url(../images/bg_home_fish.jpg) no-repeat 0% 0%; }
	.home_lizard { background: url(../images/bg_home_lizard.jpg) no-repeat 0% 0%; }

	.welcome { position: absolute; top: 132px; left: 140px; width: 195px; color: #fff; font-size: 13px; }

	#login_wrap { position: absolute; top: 123px; left: 570px; width: 180px; height: 222px; }
		#login_inner { position: relative; height: 220px; background: #99d3ff; border: 1px solid #d5eaf9; }
		* html #login_inner { height: 222px; he\ight: 220px; }
		#login_wrap > #login_inner { background: url(../images/bg_login.png) repeat; }
			.login_form { padding: 11px 8px 0; border-top: 5px solid #008fd4; }
				.login_form p { padding: 0 0 8px; }
				.login_form .retailer { font-size: 11px; color: #666; }
				.login_form input { padding: 1px; width: 150px; border: 1px solid #008fd4; }
				.login_form input.btn { padding: 0; width: 78px; border: none; }				
				.login_form label { font-weight: bold; font-size: 11px; color: #008fd4; text-transform: uppercase; }
	.errorMessage { color: #FF0000; }

			#btn_retailer {}
			.open_form { position: absolute; top: 192px; left: 0px; border: 1px solid #d5eaf9; border-width: 0 1px 1px; }
			.close_form { position: absolute; top: 192px; left: 1px; }

#header { height: 121px; position: relative; z-index: 50; }
	#mainlogo { position: absolute; top: 40px; left: 20px; }

#banner { padding: 15px 20px; background: #d6db42; }
	#banner h1 { color: #fff; font: bold 18px helvetica, arial, sans-serif; text-transform: uppercase; }

#content { padding: 24px 0 19px; }
	#content h2 { margin: 0 0 8px; color: #008fd4; font: bold 12px helvetica, arial, sans-serif; text-transform: uppercase; }
	#content h3 { margin: 0 0 8px; color: #b3b819; font: bold 12px helvetica, arial, sans-serif; text-transform: uppercase; }
	#content p { padding: 0 0 16px; line-height: 16px; }
	#content address { padding: 0 0 16px; font-style: normal; line-height: 16px; }
	#content .col1 address { padding: 0 0 16px; }

	.col1, .col2, .col3 { float: left; display: inline; width: 212px; }
	.col1 { margin: 0 0 0 20px; }
	.col2 { margin: 0 41px 0; }

	.form_wrap { padding: 0 0 0 41px; float: left; width: 487px; background: url(../images/border_dotted_vertical.gif) repeat-y 17px 0%; }
	* html .form_wrap { width: 528px; w\idth: 487px; }
		.form_wrap .col2 { margin-left: 0; }
		.contact_form {}
			#content .contact_form p { padding-bottom: 5px; }
			.contact_form input, .contact_form select { padding: 1px; width: 196px; border: 1px solid #008fd4; }
			.contact_form input.btn { width: 78px; border: none; }
			.contact_form .state { float: left; width: 106px; }
				.contact_form .state input { width: 92px; }
			.contact_form .zip { float: left;  }
				.contact_form .zip input { width: 63px; }
			.contact_form .comments { float: left; width: 436px; }
			.contact_form textarea { padding: 1px; width: 436px; border: 1px solid #008fd4; }

			.site_nav { width: 760px; height: 260px; }
			#content .site_nav li { float: left; position: relative; height: 130px; list-style: none; text-align: center; background: #fff; }
			.site_nav li a { position: relative; display: block; height: 130px; text-decoration: none; color: #000; font-size: 9px; cursor: pointer; }
			.site_nav li strong { position: absolute; top: 0px; left: 0px; display: block; height: 130px; }
			.site_nav li, .site_nav li div, .site_nav li a, .site_nav li strong { background-image: url(../images/site_nav.jpg); }
			.site_nav li div { height: 130px; }

			.site_nav li.null div, .site_nav li.null div strong { background-position: 0px 0px; width: 190px; } /* THIS JUST HOLDS THE TEXT, NO LINKS */
			.site_nav li.zilla, .site_nav li.zilla a, .site_nav li.zilla a strong { background-position: -190px 0px; width: 192px; }
			.site_nav li.aqueon, .site_nav li.aqueon a, .site_nav li.aqueon a strong { background-position: -382px 0px; width: 189px; }
			.site_nav li.oceanic, .site_nav li.oceanic a, .site_nav li.oceanic a strong { background-position: -571px 0px; width: 189px; }
			.site_nav li.kent, .site_nav li.kent a, .site_nav li.kent a strong { background-position: 0px -130px; width: 190px; }
			.site_nav li.esu, .site_nav li.esu a, .site_nav li.esu a strong { background-position: -190px -130px; width: 192px; }
			.site_nav li.glass, .site_nav li.glass a, .site_nav li.glass a strong { background-position: -382px -130px; width: 189px; }
			.site_nav li.coralife, .site_nav li.coralife a, .site_nav li.coralife a strong { background-position: -571px -130px; width: 189px; }

			/* HOVER STATE */
			.site_nav li.zilla a:hover, .site_nav li.zilla a:hover strong { background-position: -190px -260px; width: 192px; }
			.site_nav li.aqueon a:hover, .site_nav li.aqueon a:hover strong { background-position: -382px -260px; width: 189px; }
			.site_nav li.oceanic a:hover, .site_nav li.oceanic a:hover strong { background-position: -571px -260px; width: 189px; }
			.site_nav li.kent a:hover, .site_nav li.kent a:hover strong { background-position: 0px -390px; width: 190px; }
			.site_nav li.esu a:hover, .site_nav li.esu a:hover strong { background-position: -190px -390px; width: 192px; }
			.site_nav li.glass a:hover, .site_nav li.glass a:hover strong { background-position: -382px -390px; width: 189px; }
			.site_nav li.coralife a:hover, .site_nav li.coralife a:hover strong { background-position: -571px -390px; width: 189px; }


#footer { padding: 6px 0 22px; border-top: 10px solid #838c43; }
	#footer p { font-size: 11px; color: #858585; }
		#footer a { text-decoration: none; }
		#footer a:hover { text-decoration: underline; }


/* sIFR
------------------------------------------------------------------------------------- */
/* THESE ARE STANDARD sIFR STYLES... DO NOT MODIFY */
.sIFR-flash { margin: 0; visibility: visible !important;	}
.sIFR-replaced { visibility: visible !important; }
span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }

/* HIDE ADBLOCK OBJECT TAB: THE TEXT SHOULD SHOW UP JUST FINE, NOT POORLY WITH A TAB LAID OVER IT. */
.sIFR-flash + div[adblocktab=true] { display: none !important; }

/* THESE "DECOY" STYLES ARE USED TO HIDE THE BROWSER TEXT BEFORE IT IS REPLACED. */
.sIFR-hasFlash h1 { visibility: hidden; }
.sIFR-hasFlash h2 { visibility: hidden; }
.sIFR-hasFlash h3 { visibility: hidden; }


/* MISC. CLASSES & IDS
------------------------------------------------------------------------------------- */
.hide { display: none; }
.clear { clear: both; }
br.clear { line-height: 0px; height: 0; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* PLEASE LEAVE BOTH THESE LINES, FIX FOR IE7 */
.clearfix { display: inline-block; }
.clearfix { /*\*/display: block;/**/ }

.floatleft { float: left; }
.floatright { float: right; }

img.floatleft { position: relative; margin: 0 10px 5px 0; }
img.floatright { position: relative; margin: 0 0 5px 10px; }

.alignleft { text-align: left; }
.alignright { text-align: right; }
.aligncenter { text-align: center; }
