body{padding:0px; margin:0; font-family:Verdana, Helvetica, sans-serif; font-weight:normal; color:#000; background: #FFF; font-size:12px;}
* {	margin: 0; padding: 0;}
a {outline: none;}
p {	margin-top: 8px; margin-bottom: 8px;}

a:link, a:visited, a:active{font-weight:normal; text-decoration:none; color:#075EAC;}
a:hover{font-weight:normal; text-decoration:underline; color:#075EAC;}


#content {
	position:relative;
	left:0px;
	top:0px;
	width:770px;
	/*border:1px solid #FFFFFF;*/
	text-align:left;
}

/* header */

#panel-header {
	position:relative;
	left:0px;
	top:0px;
	width:770px;
	height:110px;
	text-align:left;
	/*background: #A7988F;
	border:1px solid #000;*/
}

#content-main {
	position:relative;
	width:770px;
	text-align:left;
	/*background:#FFF;*/
}

.clear { clear: both; height:0px; padding:0px; margin:0px; font-size:0;}

img.logo-main{
	position:absolute;
	top:16px;
	left:20px;
}



/* homepage */
img.bgnd-hp{
	position:absolute;
	top:0;
	left:-111px;
}

img.fssd{
	position:absolute;
	top:120px;
	left:660px;
}


div.hp-img-text{
	position:absolute;
	top:426px;
	left:42px;
	width:724px;
	height:136px;
	overflow: auto;
	background: transparent url(../imgs/bgnd_tran_w.png) no-repeat top left;
}

div.line-orange{
	clear: both;
	height:4px;
	padding:0px;
	margin:10px 40px 10px 180px;
	background: transparent url(../imgs/c_orange.gif) repeat-x top left;
}

#hp-vid {
	position:relative;
	top:40px;
	width:760px;
	border:1px solid #FFF;
	background:#FFF;
}
#hp-vid div{
	text-align:center;
	margin: 16px auto;
}

div.close-vid{
	position:absolute;
	bottom:5px;
	right:5px;
	font-weight:bold;
	font-size:12px;
}
div.close-vid a {
	font-weight:bold;
}

div.watch-vid{
	position:absolute;
	top:250px;
	left:520px;
}
	
/* products */

div.prod-img{
	float:left;
	display:inline;
	margin:20px 20px 10px 15px;
	width:150px;
}
div.prod-txt{
	float:left;
	display:inline;
	margin:0 20px 10px 0;
	width:560px;
}

div.prod-txt a:link, div.prod-txt a:visited, div.prod-txt a:active{font-weight:bold; text-decoration:none; color:#ED1A2C; margin-right:20px;}
div.prod-txt a:hover{font-weight:bold; text-decoration:underline; color:#ED1A2C;}

div.prod-desc{
	font-size:15px;
}


/* original boards */
div.p-orig{
	background: transparent url(../imgs/bgnd_waves.jpg) no-repeat top left;
	background-position: 0px 40px;
	margin-bottom:20px;
}

div.p-orig img.cat-logo{
	position:absolute;
	top:14px;
	right:0;
}


div.p-orig div.prod-desc{
	float:right;
	text-align:left;
	width:320px;
	margin:100px 26px 0 0;
}

div.p-orig div.prodimg-1{
	float:left;
	display:inline;
	margin:0px 6px 20px 130px;
	float:left;
}
div.p-orig div.prodimg-2{
	float:left;
	display:inline;
	margin:0px 0;	
}


/* kids boards */
div.p-kids{
	background: transparent url(../imgs/bgnd_boy.jpg) no-repeat top left;
	background-position: 0px 40px;
	margin-bottom:20px;
}

div.p-kids img.cat-logo{
	position:absolute;
	top:14px;
	right:0;
}


div.p-kids div.prod-desc{
	float:left;
	text-align:left;
	width:400px;
	margin:40px 26px 0 220px;
}

div.p-kids div.prodimg-1{
	float:left;
	display:inline;
	margin:20px 24px 20px 200px;
	float:left;
}
div.p-kids div.prodimg-2{
	float:left;
	display:inline;
	margin:20px 0;	
}


/* fun boards */
div.p-fun{
	background: transparent url(../imgs/bgnd_girls.jpg) no-repeat top left;
	background-position: 0px 40px;
	margin-bottom:20px;
}

div.p-fun img.cat-logo{
	position:absolute;
	top:14px;
	right:0;
}


div.p-fun div.prod-desc{
	float:left;
	text-align:left;
	width:370px;
	margin:40px 26px 0 260px;
}

div.p-fun div.prodimg-1{
	float:left;
	display:inline;
	margin:20px 24px 20px 80px;
	float:left;
}
div.p-fun div.prodimg-2{
	float:left;
	display:inline;
	margin:20px 24px 0 0;	
}
div.p-fun div.prodimg-3{
	float:left;
	display:inline;
	margin:20px 0;	
}

/* g-sleds */

div.p-gsleds img.cat-logo{
	position:absolute;
	top:14px;
	right:50px;
}


div.p-gsleds div.prod-desc{
	float:left;
	text-align:left;
	width:720px;
	margin:40px 30px 20px 20px;
	font-size:14px;
}

div.p-gsleds img.prodimg-1{
	position:absolute;
	top:30px;
	right:0px;
}
div.p-gsleds img.prodimg-2{
	float:left;
	display:inline;
	margin:0;	
}

div.p-gsleds img.prodimg-3{
	position:absolute;
	top:300px;
	right:0px;
}

img.gsled-rcj{
	float:left;
	display:inline;
	margin:0 20px 20px 20px;
}

div.gsleds-quote{
	float:left;
	display:inline;
	width:460px;
	margin-top:30px;
}
div.gsleds-quote strong.red{
	color:#ED1A2C;
}


div.gsleds-fitting{
	position:absolute;
	top:560px;
	right:20px;
	font-size:14px;
}

/* slsa products */
div.p-slsa{
	background: transparent url(../imgs/bgnd_lookout.jpg) no-repeat top left;
	background-position: 0px 40px;
	margin-bottom:20px;
}

div.p-slsa img.cat-logo{
	position:absolute;
	top:14px;
	right:50px;
}


div.p-slsa div.prod-desc{
	float:right;
	text-align:left;
	width:240px;
	margin:60px 30px 0 0;
}

div.p-slsa div.prodimg-1{
	float:left;
	display:inline;
	margin:40px 24px 20px 50px;
}
div.p-slsa div.prodimg-2{
	float:left;
	display:inline;
	margin:40px 24px 0 0;	
}

/* accessories */

div.panel-accessories{
	width:680px;
	margin:10px 0 20px 80px;
	height:400px;
	overflow: auto;
}

div.access{
	float:left;
	display:inline;
	margin:0 12px 10px 0;
	width:244px;
	/*height:230px;
	text-align:center;*/
}
div.access img{
	border:0;
}
div.access strong{
	margin-left:30px;
}


/* spec table */

table.tbl-specs{
	text-align:left;
	font-size:12px;
	border-collapse:collapse;
	width:680px;
}
table.tbl-specs th{
	text-align:left;
	font-weight:bold;
	color:#FFF;
	padding:8px 0;
	background:#617ba0;
	border:2px solid #FFF;
	text-align:center;
}
table.tbl-specs td{
	font-weight:normal;
	border:2px solid #FFF;
	padding:6px;
	text-align:center;
}

table.tbl-specs th.cell-l{
	background: #617ba0 url(../imgs/tbl_cnr_l.gif) no-repeat top left;
}
table.tbl-specs th.cell-r{
	background: #617ba0 url(../imgs/tbl_cnr_r.gif) no-repeat top right;
}

table.tbl-specs td.cell-1{
	background-color:#c1cbd9;
}
table.tbl-specs td.cell-2{
	background-color:#e2e6ed;
}
table.tbl-specs td.cell-b{
	height:8px;
	font-size:8px;
	padding:0;
	margin:0;
	background-color:#8498b5;
}

span.tbl-txt-sm {font-size:11px;}

/* product images - will need to specify spacing according to each page layout */


div.prodimg-title{
	color:#FFF;
	font-weight:bold;
	margin-top:8px;
	padding:4px 0;
	background-color:#8498b5;
}
div.prodimg-title span {
	margin-left:10px;
}

/* stockist table */

table.tbl-stockists{
	text-align:left;
	font-size:12px;
	border-collapse:collapse;
	width:680px;
	margin-top:20px;
}
table.tbl-stockists th{
	text-align:left;
	font-weight:bold;
	color:#FFF;
	padding:8px 0;
	background:#617ba0;
	border:2px solid #FFF;
	text-align:center;
}
table.tbl-stockists td{
	font-weight:normal;
	border:2px solid #FFF;
	padding:6px;
	text-align:left;
}

table.tbl-stockists th.cell-l{
	background: #617ba0 url(../imgs/tbl_cnr_l.gif) no-repeat top left;
}
table.tbl-stockists th.cell-r{
	background: #617ba0 url(../imgs/tbl_cnr_r.gif) no-repeat top right;
}

table.tbl-stockists td.cell-1{
	background-color:#c1cbd9;
	width:160px;
}
table.tbl-stockists td.cell-2{
	background-color:#e2e6ed;
}
table.tbl-stockists td.cell-3{
	background-color:#c1cbd9;
	padding-left:30px;
	width:140px;
}
table.tbl-stockists td.cell-b{
	height:8px;
	font-size:8px;
	padding:0;
	margin:0;
	background-color:#8498b5;
}

table.tbl-stockists td a, table.tbl-stockists td a:hover, table.tbl-stockists td a:visited, table.tbl-stockists td a:active{
	color:#000;
	text-decoration:underline;
}
table.tbl-stockists td a:hover{
	color:#000;
	text-decoration:none;
}

/* clothing */

div.panel-clothing{
	width:680px;
	margin:10px 0 20px 80px;
	height:400px;
	overflow: auto;
}

div.garment{
	float:left;
	display:inline;
	margin:0 12px 10px 0;
	width:200px;
	height:230px;
}
div.garment img{
	border:0;
}
div.garment strong{
	margin-left:30px;
}

/* stockists */
div.panel-stockists{
	margin-bottom:40px;
}
div.panel-stockists div.stockist-txt{
	margin:0 80px 40px 200px;
}
img.map-aust{
	margin:0 0 20px 140px;
}


/* about */

div.about{
	margin:0 0 30px 120px;
	width:600px;
}

div.about ul{
	font-weight:normal;
	margin-left:20px;
}
div.about ul li{
	padding:2px;
}

div.about img{
	border:1px solid #F79138;
	margin:0 14px 4px 0;
}

ul.sub-section{
	font-weight:normal;
	padding:2px;
	margin:4px 0 4px 20px;
}
ul.sub-section li{
	padding:2px;
}

/* contact form */

div.contact{
	margin:15px 0 0 180px;
	width:520px;
}


form.form-contact{
	margin:40px 0 40px 0;
}
label{
	float: left;
	width: 150px;
	font-weight: bold;
}

input, textarea{
	width: 180px;
	margin-bottom: 5px;
}

textarea{
	width: 250px;
	height: 100px;
	font: normal 12px Verdana;
}

.boxes{
	width: 1em;
}


div.contact br{
	clear: left;
}
div.contact-confirm{
	margin:80px 0 100px;
	text-align:center;
}
/* contact form */
div.panel-sitemap{
	margin:15px 0 0 280px;
	width:520px;
}

div.panel-sitemap ul{
	font-weight:bold;
}
div.panel-sitemap ul.sub-section{
	font-weight:normal;
	padding:2px;
	margin:4px 0 4px 20px;
}
div.panel-sitemap ul.sub-section li{
	padding:2px;
}

ul.section a:link, ul.section a:visited, ul.section a:active{font-weight:bold; text-decoration:none; color:#330000;}
ul.section a:hover{font-weight:bold; text-decoration:underline; color:#330000;}

ul.sub-section a:link, ul.sub-section a:visited, ul.sub-section a:active{font-weight:normal; text-decoration:none; color:#330000;}
ul.sub-section a:hover{font-weight:normal; text-decoration:underline; color:#330000;}



/* navigation */
#divNav {
	float:left;
	display:inline;
	background: transparent url(../imgs/nav_bgnd.png) no-repeat top left;
	margin: 20px 0 0 156px;
	padding: 0;
	height: 84px;
	width: 610px;
	z-index:100;
}


#nav {
	position: relative;
	top: 12px;
	height: 74px;
	width: 610px;
	margin: 0;
	padding: 0;
	left:18px;
}

#nav li ul, #nav li ul {
	margin: 0;
	padding: 0;
}

#nav a {
	text-decoration: none;
}

#nav li { /*float the main list items*/
	margin: 0;
	float: left;
	display: block;
	padding: 0 6px 0 0;
	height:14px;
}

#nav li ul {
	display: none;
}

#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
	position: absolute;
	top: 26px;
	left: 0;
	padding: 5px 0 5px 60px;
	margin-left:0px;
	width: 592px;
	height:24px;
	background: transparent url(/imgs/nav_bgnd_o.gif) no-repeat top left;

}

#nav li.on ul {
	background: transparent url(/imgs/nav_bgnd_y.gif) no-repeat top left;
}

#nav li.on:hover ul, #nav li.over ul { /*for ie*/
	background: transparent url(/imgs/nav_bgnd_o.gif) no-repeat top left;
}

#nav li a {
	color: #224d6f;
	font-weight: bold;
	display: block;
	width: 88px;
	padding: 0;
}

#nav li.on a {
	color: #000;
}

#nav li.on ul a, #nav li.off ul a {
	border: 0;
	float: left; /*ie doesn't inherit the float*/
	width: auto;
	padding:0;
	margin:0;
	margin-right: 20px;
}

#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
	background: #F79239;/**/
}

#nav li.on ul {
	display: block;
}

#nav li.off:hover ul, #nav li.over ul {
	display: block;
	z-index: 6000;
}

#nav li.off a:hover, #nav li.on a:hover {
	color: #354458;
}

#nav li span {
	position: absolute;
	left: -9384px;
}

#liHome a, #liProducts a, #liClothing a, #liShops a, #liAbout a, #liContact a {
	display: block;
	position: relative;
	height: 26px;
	background: url(/imgs/nav_map.gif) no-repeat;
}

#liHome a {
	background-position: 0 0;
}

#liProducts a {
	background-position: -99px 0;
}

#liClothing a {
	background-position: -196px 0;
}


#liShops a {
	background-position: -294px 0;
}

#liAbout a {
	background-position: -392px 0;
}

#liContact a {
	background-position: -491px 0;
}

/*active area - for this demo - the code could be based on a body class, and probably work better.*/


#liHome.on a {
	background-position: 0 -30px;
}

#liProducts.on a {
	background-position: -99px -30px;
}

 #liClothing.on a {
 	background-position: -196px -30px;
 }


#liShops.on a {
	background-position: -294px -30px;
}

#liAbout.on a {
	background-position: -392px -30px;
}

#liContact.on a {
	background-position: -491px -30px;
}



/*hover states*/

#liHome a:hover, #liHome:hover a, #liHome.over a {
	background-position: 0 -60px;
}

#liProducts a:hover, #liProducts:hover a, #liProducts.over a {
	background-position: -99px -60px;
}

#liClothing a:hover, #liClothing:hover a, #liClothing.over a {
	background-position: -196px -60px;
}

#liShops a:hover, #liShops:hover a, #liShops.over a {
	background-position: -294px -60px;
}

#liAbout a:hover, #liAbout:hover a, #liAbout.over a {
	background-position: -392px -60px;
}

#liContact a:hover, #liContact:hover a, #liContact.over a {
	background-position: -491px -60px;
}


#liClothing ul li a:hover {
	background-position: 1000px 1000px;
}



/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	display: block;
	color: #fff;
	font-family: arial, verdana, sans-serif;
	font-size: 12px;
	padding:2px;
	margin:0 4px 0 0;
	height:16px;
	background: #F79239;
}

#nav li.on ul a {
	background: #FFD51D;
}

/* footer */

div.footer {position:relative; font-weight:normal; text-decoration:none; color:#330000; font-size:11px; line-height:16px; margin-top:40px; }
div.footer a:link, div.footer a:visited, div.footer a:active{font-weight:normal; text-decoration:none; color:#330000;}
div.footer a:hover{font-weight:normal; text-decoration:underline; color:#330000;}

/* text */
div.hp-main { font-weight:bold; text-decoration:none; color:#003366; font-size:14px; }


h1, h2 {display:inline}


/* Flash Image Replacement */
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility:visible !important;
	margin:0;
}

.sIFR-replaced {
	visibility:visible !important;
}

span.sIFR-alternate {
	position:absolute;
	left:0;
	top:0;
	width:0;
	height:0;
	display:block;
	overflow:hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */



h1 {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida", Arial, Helvetica, sans-serif, sans;
	font-weight: normal;
	font-size: 300%;
	line-height: 150%;
	margin-left:40px;
	color:#ED1A2c;
}

.sIFR-hasFlash h1 {
	visibility:hidden;
	font-size:60px;
	margin:0;
	padding:0;
	margin-left:40px;
	line-height:0;/**/
}

h2 {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida", Arial, Helvetica, sans-serif, sans;
	font-weight: normal;
	font-size: 200%;
	line-height: 100%;
	margin-left:40px;
	color:#000;
}

.sIFR-hasFlash h2 {
	visibility:hidden;
	font-size:46px;
	margin:0;
	padding:0;
	margin-left:40px;
	line-height:0;/**/

}