@charset "utf-8";

/* -- generic styles ------------------------*/

div,h1,h2,h3,h4,h5,h6,p,address,ul,ol,li {

	margin: 0px;

	padding: 0px;
	
	font-family: Arial,Helvetica,sans-serif; 
	
	font-size: 14px;
	

}

body  {

	font: 100% Verdana, Arial, Helvetica, sans-serif;

	background: #bbb;

	margin: 0px;

	padding: 0px;

	text-align: left;
	
	font-size: 14px;
	

}

.list {
	
	margin-left: 15px;
	padding-bottom: 20px;
	font-size: 12px;

}


.style1 {color: #FFFFFF}
body,td,th {
	color: #000000;
}
.style2 {font-family: Geneva, Arial, Helvetica, sans-serif}
.style3 {font-size: 11px}
.style4 {color: #000000}
.style5 {color: #0066CC}
body {
	margin-top: 0px;
}

#logo{ display:block; background:url(../Gutterboy_Logo.png) no-repeat; width:201px; height:90px; align:center; text-indent:-5000px;}

#headerImage{ display:block; background:url(../images/home_gutterboy1.png) no-repeat; width: 138px; height:90px; align:right; text-indent:-5000px;}

#wrapper {

	width: 850px;

	text-align: left;

	background-color: #3399ff;

	position: relative;

	top: auto;

	/*margin-top: 20px;*/

	margin-right: auto;

	margin-bottom: 0;

	margin-left: auto;

	

} 

#header #contact {

	padding-top: 0px;

	padding-right: 0px;

	padding-bottom: 0px;

	padding-left: 0px;

}

#wrapper a:link{
	color:#000000;
	text-decoration:underline;
}

#wrapper a:visited {

	text-decoration: none;

	color: #000066;

}

#wrapper a:hover {

	color: #000000;
	text-decoration: underline;

	/*border-bottom: 1px dashed #566440;*/

}

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

#header {

	padding: 0;

	height: 110px;

	position: relative;

	background-color: #3399FF;

	background-repeat: no-repeat;

	display: block;

	margin-top: 0px;

	margin-right: 0;

	margin-bottom: 0;

	margin-left: 0;

}

#header #FBText a {
	font-size:11px;
	color:#3333CC;
	
}

#header #contactButton {

	background: url(../_images/contact_icon.gif);

	position: absolute;

	height: 29px;

	width: 86px;

	left: 650px;

	top: 0px;

}

#header #contactButton a {

	text-indent: -1000em;

	display: block;

}



#header #mainNav {
	position: relative;
	/*left: 0px;
	width: 100%;*/
	padding-bottom: 20px;	
	height: 50px;

}

.subnav{
float:right;
padding-bottom:0px;
height:200px;
}

#header img {

	padding-left: 2px;

}



/*#header #mainNav ul {

	list-style: none;

	margin: 0;

	padding: 0;

	float: left;

	width: 100%;

}

#header #mainNav li {

	float: left;

	margin: 0;

	padding:0;

	display: block;

}

#header #mainNav li a:link, #header #mainNav li a:visited {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 1em;

	color: #fff;

	text-decoration: none;

	padding: 0 15px 0 30px;

	margin-right: 10px;

	display: block;

	line-height: 25px;

	background: url(../_images/nav_rollover.jpg) no-repeat left bottom;

}



#header #mainNav li a:hover {

	color: #f8b449;

	background: url(../_images/nav_rollover.jpg) no-repeat left top;

	border: none;

}

#header #mainNav ul li a.current {

	margin-top: -5px;

	height: 30px;

	background: url(../_images/current.jpg) no-repeat;

	color: #AAB3B2;

	line-height: 25px;

}

#header #mainNav ul li a.current:hover {

	color: #AAB3B2;

	cursor: default;

}

*/	

#header #banner {

	position: absolute;

	bottom: 0;

	left: 0;

}



#header h1 {

	/*text-indent: -3000em;*/
	font-size:21px;
	font-weight: bold;
	margin: 0;

}

#header h2 {

	/*text-indent: -3000em;*/
	font-size:18px;
	font-weight: bold;
	margin: 0;

}

#header h3 {

	/*text-indent: -3000em;*/
	font-size:21px;
	font-weight: bold;
	margin: 0;

}

#header h4 {

	/*text-indent: -3000em;*/
	font-size:21px;
	font-weight: bold;
	margin: 0;

}
/* --------- MAIN CONTENT STYLES -------------*/

#areas #mainContent {

	margin: 0;

	
	width: 850px;

	float: left;

	background-color: #3399ff;

	min-height: 500px;

	padding-top: 40px;

	padding-right: 0px;

	padding-bottom: 0px;

	padding-left: 0px;
	
	font-family: Arial,Helvetica,sans-serif; 

} 


#mainContent {

	margin: 0;

	width: 550px;

	float: left;

	background-color: #3399ff;

	min-height: 500px;

	padding-top: 40px;

	padding-right: 0px;

	padding-bottom: 0px;

	padding-left: 0px;
	
	font-family: Arial,Helvetica,sans-serif; 

} 



#mainContent p {

	font-size: 14px;

	/*line-height: 1em;*/

	color: #000;

	margin-bottom: 0.2em;

	margin-left: 20px;

}

#mainContent span.subhead {

	font-size: 1.2em;

	font-weight: bold;

	color: #666;

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

}

#mainContent h1, #mainContent h4 {

	/*font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;*/

	font-size: 18px;

	font-weight: bold;

	color: #0055A5;

	margin: .6em 0 .3em 0;

	padding-left: 0px;

}

#areas #mainContent h2 {


	font-size: 16px;

	font-weight: bold;

	color: #0055A5;

	margin: 0 0 0 0;

	padding-left: 5px;

}

#mainContent h2 {

	font-size: 18px;

	font-weight: bold;

	color: #0055A5;

	padding-left: 0px;
	
	padding-top: 0px;
	
	padding-bottom: 0px;

}

#areas #mainContent h3 {

	font-size: 15px;

	font-weight: bold;

	color: #0055A5;

	padding-left: 10px;
	
	padding-top: 0px;
	
	padding-bottom: 0px;
	
	margin-left: 0;

}

#mainContent h2.special {

	margin-bottom: 1em;

}

#mainContent h3 {

	font-size: 13px;

	font-weight: bold;

	color: #0055A5;

	padding-left: 140px;
	
	padding-top: 0px;
	
	padding-bottom: 10px;
	
	margin-left: 0;

}

#mainContent ul {

	margin-left: 20px;

	font-size: 14px;

	margin-bottom: 0.4em;

}


#mainContent li {

	margin-left: 5px;
	font-size: 14px;

}

#mainContent p.video {

	text-align: center;

}





#mainContent img.special {

	display: block;

	float: left;

	margin-right: 10px;

}

#mainContent #journalEntry h1 {

	background: url(../_images/journal_icon.gif) no-repeat;

	line-height: 40px;

	margin-left: 15px;

	padding-left: 45px;

	color: #BBA979;

	font-size: 1.4em;

	margin-bottom: 1em;

	margin-top: 1.4em;

}

#mainContent #journalEntry h2 {

	font-size: 1em;

	font-weight: bold;

	color: #777;

	padding-bottom: 5px;

	border-bottom: 1px solid #aaa;

	margin-bottom: 0.5em;

}

#mainContent #journalEntry p {

	font-family: Arial, Helvetica, sans-serif;

	font-size: .85em;

	text-align: left;

	line-height: 1.6em;

}

#mainContent #photoGroup {

	position: relative;

}



#mainContent #photoSet img {

	display: block;

	margin-left: 20px;

}

#mainContent #photoSet p.caption {

	font-size: 0.9em;

	font-style: italic;

	text-align: right;

	margin-right: .8em;

}

#mainContent #photoSet #caption1, #mainContent #photoSet #caption2, #mainContent #photoSet #caption3, #mainContent #photoSet #caption4 {

	position: absolute;

	top: 355px; /*!important*/

	/*top: 365px; */

	right: 0;

	visibility: hidden;

	width: 400px;

}

#mainContent #photoSet #caption1 {

	visibility: visible;

}



/* - GEAR SUBNAV -*/

#mainContent ul#gearSubNav {

	width: 340px;

	float: left;

	margin: 10px 0 10px;

	list-style: none;

	padding-left: 60px;

}



#mainContent ul#gearSubNav li {

	float: left;

	margin: 0;

	padding: 0;

}



#mainContent ul#gearSubNav a {

		width: 70px;

		height: 20px;

		font-family: "Orator Std", Orator, Arial, Helvetica, sans-serif;

		font-size: .9em;

		text-align: center;

		padding-top: 100px;

		margin-right: 20px;

		border: none;

		display: block;	

}

#mainContent ul#gearSubNav a.last {

		margin-right: 0;

		

}

/*- GEAR SUBNAV ICONS -*/

#mainContent ul#gearSubNav a.holder {

	background: url(../_images/board_icon_up.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.swimwear {

	background: url(../_images/swim_icon_up.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.wetsuits {

	background: url(../_images/wetsuit_icon_up.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.etc {

	background: url(../_images/sandals_icon_up.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.holder:hover {

	background: url(../_images/board_icon_over.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.swimwear:hover {

	background: url(../_images/swim_icon_over.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.wetsuits:hover {

	background: url(../_images/wetsuit_icon_over.jpg) no-repeat center top;

}

#mainContent ul#gearSubNav a.etc:hover {

	background: url(../_images/sandals_icon_over.jpg) no-repeat center top;

}

/* -GEAR SUBNAV CURRENT STYLES -*/

#mainContent ul#gearSubNav li.current a.holder {

	background: url(../_images/board_icon_over.jpg) no-repeat center top;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.swimwear {

	background: url(../_images/swim_icon_over.jpg) no-repeat center top;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.wetsuits {

	background: url(../_images/wetsuit_icon_over.jpg) no-repeat center top;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.etc {

	background: url(../_images/sandals_icon_over.jpg) no-repeat center top;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.holder:hover {

	cursor: default;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.swimwear:hover {

	cursor: default;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.wetsuits:hover {

	cursor: default;

	color: #666;

}

#mainContent ul#gearSubNav li.current a.etc:hover {

	cursor: default;

	color: #666;

}



#mainContent #gearItem {

	float: left;

	width: 35%;

	margin: 30px 0;

}

#mainContent #gearItem img {

	display: block;

	margin: 0 auto 10px auto;

}

#mainContent #gearItem p {

	text-align: right;

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 0.8em;

	margin-bottom: .6em;

}

#mainContent #gearItem p a {

	font-size: 1.2em;

}







#mainContent #gearDesc {

	float: right;

	width: 65%;

	margin: 30px 0;

}

#mainContent #gearDesc h1 {

	font-size: 1.4em;

	color: #426F26;

	font-style: italic;

	line-height: .7;

}



#mainContent #gearDesc h3 {

	font-size: 1.2em;

	color: #C47500;

	border-bottom: 1px solid #354F42;

	padding-bottom: 0.2em;

}

#mainContent #gearDesc p {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 0.8em;

	line-height: 1.4;

	margin-bottom: .8em;

}

#mainContent #gearDesc span.price {

	font-weight: bold;

	color: #365043;

	text-align: right;

	display: block;

	font-size: 1.2em;

}

/* -LIFESTYLE SUBNAV STYLES -*/

#mainContent ul#lifestyleSubNav {

	margin: 0;

	padding: 0;

	list-style: none;

	float: left;

	margin-bottom: 20px;

	width: 450px;

}

#mainContent ul#lifestyleSubNav li {

	margin: 0;

	padding: 0;

	float: left;

}

#mainContent ul#lifestyleSubNav a {

		color: #666;

		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

		font-size: 1em;

		padding: 0 20px;

		border-bottom: none;

		border-right: 1px solid #666;

}

#mainContent ul#lifestyleSubNav a.last {

	border: none;

}

#mainContent ul#lifestyleSubNav a.current {

	color: #B36B00;

}

#mainContent ul#lifestyleSubNav a.current:hover {

	color: #B36B00;

	cursor: default;

}

#mainContent ul#lifestyleSubNav a:hover {

		color: #B36B00;

}

#mainContent form {

	margin-left: 20px;

}

#mainContent #frmRegister fieldset {

	margin-bottom: 20px;

	background: #B9C5C5;

	border-right: 1px solid #729E91;

	border-bottom: 1px solid #729E91;

	border-top-style: none;

	border-left-style: none;

	padding: 20px 0;

}

#mainContent #frmRegister legend {

	background: #B9C5C5;

	margin-top: -5px;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 0.8em;

	padding: 5px 10px;

	text-transform: uppercase;

	letter-spacing: 0.1em;

}

#mainContent #frmRegister input.text {

	width: 200px;

}

#mainContent #frmRegister input.text:focus , #mainContent #frmRegister textarea:focus{

	background: #EDDAB1;

	border: 1px solid #9D6124;

}





#mainContent #frmRegister p {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 0.8em;

	color: #444;

}

/* ---------- SINGLE COLUMN LAYOUT ---------*/

#mainContentSingle {

	margin: 0;

	padding: 0;

	clear: both;

} 

#mainContentSingle h1 {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 1.6em;

	font-weight: bold;

	color: #1B9D95;

	margin: .6em 0 .4em 0;

	padding-left: 20px;

}

#mainContentSingle p {

	font-size: 0.9em;

	line-height: 1.4em;

	color: #000;

	margin-bottom: 1.4em;

	margin-left: 20px;

}

#mainContentSingle span.subhead {

	font-size: 1.2em;

	font-weight: bold;

	color: #666;

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

}



#mainContentSingle h2 {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 1.2em;

	color: #3C3809;

	margin-bottom: 0.4em;

	margin-left: 20px;

}

#mainContentSingle h3 {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 1em;

	color: #324E40;

	margin-bottom: 0.4em;

	margin-left: 20px;

}

table#boardCompare {

	margin-right: auto;

	margin-left: auto;

	border: 1px solid #8C5306;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 0.9em;

	border-collapse: collapse;

	margin-bottom: 30px;

}

table#boardCompare caption {

	font-size: 1.2em;

	font-weight: bold;

	color: #1B9D95;

	padding-bottom: 10px;

	margin: 0 auto;

}

table#boardCompare thead {

	background: url(../_images/header_background.jpg) no-repeat right top;

	height: 30px;

}

table#boardCompare th {

	color: #fff;

	font-size: 1em;

	font-weight: normal;

	text-align: left;

	padding-left: 10px;

	line-height: 30px;

}

#boardLength,

#boardThick,

#boardSkill {

	background: #F5D3A5;

}

#boardWidth,

#boardWave {

	background: #BDD5DD;

}

table#boardCompare td {

	line-height: 20px;

	border-right: 1px solid #8C5306;

	border-bottom: 1px solid #8C5306;

	border-left: 1px solid #8C5306;

	padding-left: 10px;

}

table#boardCompare tr:hover {

	color: #fff;

	background: #41637b;

}

table#boardCompare thead tr:hover {

	background: transparent;

}

#boardName {

	background: #41637b;

}


/* ----------- SIDEBAR STYLES ------------------*/

#sidebar {

	float: left;

	width: 280px;

	border-left-width: 1px;

	border-left-style: none;

	border-left-color: #3399ff;

	background-color: #3399ff;

	clear: both;

	padding-top: 40px;

	padding-right: 0px;

	padding-bottom: 5px;

	padding-left: 5px;

}

#sidebar p {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 12px;

	line-height: 1.2em;

	color: #666;

	padding: 0 10px;

	margin-bottom: 1.4em;

}

#sidebar h2 {

	/*font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;*/

	font-size: 18px;

	font-weight: bold;

	color: #0055A5;

	margin: .6em 0 .4em 0;

	padding-left: 5px;
}

#sidebar h3 {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 1em;

	color: #1B9D95;

	text-align: left;

	margin-bottom: 0.4em;

	padding: 0 10px;

}

#sidebar h3.gear {

	font-family: "Orator Std", Arial, Helvetica, sans-serif;

	font-size: 1.4em;

	color: #425251;

	text-align: center;

	border-bottom: 1px solid #425251;

	margin: 0 10px 20px 10px;

}

#sidebar h4.gear {

	color: #455552;

	text-align: center;

	font-size: 1.4em;

}

#sidebar p.gear {

	font-family: "Orator Std", Arial, Helvetica, sans-serif;

	font-size: .9em;

	color: #000;

	text-align: center;

	padding-bottom: 30px;

	background: url(../_images/bamboo_boarder.jpg) no-repeat center bottom;

}

#sidebar p.caption {

	font-style: italic;

	text-align: center;

}





#sidebar img {

	
	
	display: block;

	margin-top: 0;

	/*margin-right: auto;*/

	margin-bottom: 1em;

	/*margin-left: auto;*/

	padding-right: 0px;
	

}

#sidebar a img , #sidebar a.gear:hover, #sidebar a.gallery:hover{

	border: none;

}

#sidebar a img.gallery {

	padding: 5px 5px 10px 5px;

	border: 1px solid #aaa;

}

#sidebar ol {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #000000;
	margin-left: 30px;

}

#sidebar ol li {
	margin-bottom: 0.6em;
	margin-left: 0px;
	font-size: 12px;

}







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

#footer {

	padding: 0 5px 0 5px;

	background:#bbb;

	clear: both;

} 

#footer h1 {
		
	margin: 0;

	padding: 10px 0;

	color: #fff;

	font-size: 0.9em;

	text-align: center;
	

}

#footer h2 {
		
	margin: 0;

	padding: 10px 0;

	color: #fff;

	font-size: 0.9em;

	text-align: center;
	

}

#footer p {

	margin: 0;

	padding: 10px 0;

	color: #fff;

	font-size: 0.9em;

	text-align: center;

}

#footer a:link, #footer a:visited {

	color: #fff;

}

#share-buttons {
width: 120px;
padding: 4px;
background-color: #42a7e2;
-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
-khtml-border-radius: 10px;  
border-radius: 10px; 
-o-border-radius: 10px;
}
										
#share-buttons img		
{ 	
width: 35px !important;
padding: 4px;
border:  0;
box-shadow: none !important;
display: inline;
vertical-align: middle;
}

#share-buttons, #share-buttons a		
{
font-family: Indie Flower;
font-size: 	20px;
color: 		#ffffff!important;
font-weight: bold;
}

#sidebar p.videoCaption{

	font-size: 0.8em;

	font-weight: bold;

	color: #333;

	text-align: center;

	margin: -15px 0 0 0;

}



.fltrt {

	float: right;

	margin-left: 10px;

}

.fltlft {

	float: left;

	margin-right: 10px;

}

.clearfloat { 

	clear:both;

    height:0;

    font-size: 1px;

    line-height: 0px;

}

.clearLeft {

	clear: left;

}

.clearRight {

	clear: right;

}

#mainContent .videoCaption style4 {

	padding-left: 10px;

}
