body 
{
background-color:#B3A78D;
background-image: url(../../res/bgside.jpg); background-position:top; background-repeat:repeat-x;
font-family: "times new roman", serif;
color:#404040;
margin:0px 0px 0px 0px;
font-size:0.9em;
text-align:center;
}

div.clear {clear:both;}

a img {border:0px;}
a, img, input { outline:none; }
img {border:0px;}

a {text-decoration:none; color:#404040;}
a:hover {text-decoration:underline;}

a.red {text-decoration:underline; color:#FE0202;}

p{margin-top:0px;}
span.bold {font-weight:bold;}

div.container
{
width:784px;
text-align:left;
margin-left:auto;
margin-right:auto;
}

div.right
{
float:right;
width:220px;
position:relative;
overflow:hidden;
height:560px;
background-position:0px -561px;
background-image: url(../../res/rside2.jpg); background-repeat:no-repeat;
}

div.r1, div.r2, div.r3, div.r4, div.r5, div.r6, div.r7, div.r8, div.r9, div.r10
{
width:220px;
cursor:pointer;
background-image: url(../../res/rside2.jpg); background-repeat:no-repeat;
}

a div.r1 {height:80px; background-position: 0 0;} a:hover div.r1 {background-position: 0 -561px;}
a div.r2 {height:20px; background-position: 0 -80px;} a:hover div.r2 {background-position: 0 -641px;}
a div.r3 {height:22px; background-position: 0 -101px;} a:hover div.r3 {background-position: 0 -662px;}
a div.r4 {height:23px; background-position: 0 -123px;} a:hover div.r4 {background-position: 0 -684px;}
a div.r5 {height:20px; background-position: 0 -146px;} a:hover div.r5 {background-position: 0 -707px;}
a div.r6 {height:23px; width:90px; float:left; background-position: 0 -166px;} a:hover div.r6 {background-position: 0 -727px;}
a div.r7 {height:23px; width:130px; float:right; background-position: -90px -166px;} a:hover div.r7 {background-position: -90px -727px;}
a div.r8 {height:22px; width:100px; float:left; background-position: 0 -188px;} a:hover div.r8 {background-position: 0 -749px;}
a div.r9 {height:22px; width:120px; float:right; background-position: -100px -188px;} a:hover div.r9 {background-position: -100px -749px;}
a div.r10 {height:80px; background-position: 0 -480px;} a:hover div.r10 {background-position: 0 -1041px;}
div.r11 {height:269px; width:220px;}

/*** MAIN MENU STYLING **/
#mainmenu { }
#mainmenu div { position:absolute; overflow:hidden; }
#mainmenu div a { background-image: url(../../res/rside2.jpg); background-repeat:no-repeat; width:100%; height:100%;}
#mainmenu div a:hover { background-image: none; }

#mainmenu .head_3finsurf { top:12px; left:0px; width:220px; height:69px; }
#mainmenu .head_3finsurf a { background-position:-0px -12px; }
#mainmenu .menu_3finsurf { top:82px; left:30px; width:80px; height:19px; }
#mainmenu .menu_3finsurf a { background-position:-30px -82px; }
#mainmenu .menu_surfersagainstsewage { top:102px; left:20px; background-position:-20px -102px; width:175px; height:21px; }
#mainmenu .menu_surfersagainstsewage a { background-position:-20px -102px; }
#mainmenu .menu_delivery { top:124px; left:32px; width:95px; height:21px; }
#mainmenu .menu_delivery a { background-position:-32px -124px; }
#mainmenu .menu_quality { top:145px; left:25px; width:150px; height:21px;}
#mainmenu .menu_quality a { background-position:-25px -145px;}
#mainmenu .menu_contact { top:166px; left:30px; width:60px; height:22px; }
#mainmenu .menu_contact a { background-position:-30px -166px; }
#mainmenu .menu_retail { top:166px; left:92px; width:60px; height:22px;}
#mainmenu .menu_retail a { background-position:-92px -166px; }
#mainmenu .menu_help { top:189px; left:55px; width:45px; height:23px; }
#mainmenu .menu_help a { background-position:-55px -189px; }
#mainmenu .menu_tsandcs { top:189px; left:101px; width:55px; height:23px; }
#mainmenu .menu_tsandcs a { background-position:-101px -189px; }
#mainmenu .menu_paymentblock { top:475px; left:0px; width:220px; height:72px; }
#mainmenu .menu_paymentblock a { background-position:-0px -475px; }
#mainmenu span {display:none;}
#mainmenu a {width:100%; height:100%; display:block; overflow:hidden;}

div.left
{
width:564px;
overflow:hidden;
float:left;
}

div.top_bg
{
width:564px;
background-image: url(../../res/ltop.jpg); background-position:left top; background-repeat:no-repeat;
}

div.bot_img
{
width:564px;
}

div.middle_bg
{
width:564px;
background-image: url(../../res/lmiddle.jpg); background-position:left top; background-repeat:repeat-y;
}

div.topmenu
{
padding: 17px 0px 0px 89px;
margin:0px 0px 0px 0px;
}
div.topmenu a { display:block; cursor:pointer; }
span.topmenu_ts a
{
margin-right:6px;
display: block;
float:left;
width:85px;
height:56px;
background-image: url(../../res/ts.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_ts a:hover,
span.topmenu_ts a.pagelink_current
{
background-image: url(../../res/ts_a.jpg); 
}

div.topmenu_ts_a
{
margin-right:6px;
display: block;
float:left;
width:85px;
height:56px;
background-image: url(../../res/ts_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_hd a
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/hd.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_hd a:hover,
span.topmenu_hd a.pagelink_current
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/hd_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

div.topmenu_hd_a
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/hd_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_cs a
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/cs.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_cs a:hover,
span.topmenu_cs a.pagelink_current
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/cs_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

div.topmenu_cs_a
{
margin-right:6px;
float:left;
width:85px;
height:56px;
background-image: url(../../res/cs_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_so a
{
float:left;
width:85px;
height:56px;
background-image: url(../../res/so.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_so a:hover,
span.topmenu_so a.pagelink_current
{
float:left;
width:85px;
height:56px;
background-image: url(../../res/so_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

div.topmenu_so_a
{
float:left;
width:85px;
height:56px;
background-image: url(../../res/so_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_hi a
{
margin-left:17px;
float:left;
width:88px;
height:56px;
background-image: url(../../res/hi.jpg); background-position:bottom; background-repeat:no-repeat;
}

span.topmenu_hi a:hover,
span.topmenu_hi a.pagelink_current

{
float:left;
width:88px;
height:56px;
background-image: url(../../res/hi_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

div.topmenu_hi_a
{
margin-left:17px;
float:left;
width:88px;
height:56px;
background-image: url(../../res/hi_a.jpg); background-position:bottom; background-repeat:no-repeat;
}

/****************************
 * INDEX PAGE
 ***************************/
div.index_img
{
margin: 0px 0px 0px 76px; width:488px;height:455px; 
}
div.index_img .index_right
{
	float:right; width:245px;
}
div.index_img .index_left
{
	float:left; width:243px; overflow:hidden;
}
div.index_img a
{
	display:block;
	overflow:hidden;
	padding-left:500px; /* hide Spans*/
}

div.index_tshirts a
{
	height:194px;
	width:243px;
	background-image:url(/res/index_tshirts.jpg); background-repeat:no-repeat; background-position:top left;
}
div.index_surfer
{
	height:178px;
	width:245px;
	background-image:url(/res/index_surfer.jpg); background-repeat:no-repeat; background-position:top left;
}
div.index_hoodies a
{
	height:194px;
	width:243px;
	background-image:url(/res/index_hoodies.jpg); background-repeat:no-repeat; background-position:top left;
}
div.index_delivery a
{
	height:178px;
	width:245px;
	background-image:url(/res/index_delivery.jpg); background-repeat:no-repeat; background-position:top left;
}
div.index_boardmasters
{
	clear:both;
	overflow:hidden;
	padding-left:500px;
	height:111px;
	width:488px;
	background-image:url(/res/index_boardmasters.jpg); background-repeat:no-repeat; background-position:top left;
}


/***************************
 * CONTENT STYLING
 ***************************/
 @import url(default.screen.css);

/*div.top_bg
{
min-height:500px;
}*/

div.bag
{
width:69px;
margin:65px 0px 0px 495px;
color:#ffffff;
}
div.bag a
{
	color:#ffffff;
	text-decoration:none;
	margin-bottom:14px;
	display:block;
}

div.prod_left
{
float:left;
width:280px;
padding:0px 0px 10px 84px;
color:#000000;
}

div.prod_right
{
float:right;
width:180px;
padding:10px 20px 10px 0px;
color:#000000;
}

div.category
{
padding:0px 0px 0px 89px;
}

div.content
{
	padding:0px 20px 20px 95px;
}

div.content img
{
float:left;
margin-right:5px;
}

div.content h1
{
font-size:1.2em;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}

div.cat1, div.cat2, div.cat3, div.cat4, div.cat5, div.cat6
{
width:226px;
height:189px;
float:left;
background-position:top; 
background-repeat:no-repeat;
}

a div.cat1 {background-image: url(../../res/products/1.jpg)} a:hover div.cat1 {background-image: url(../../res/products/1_h.jpg)}
a div.cat2 {background-image: url(../../res/products/2.jpg)} a:hover div.cat2 {background-image: url(../../res/products/2_h.jpg)}
a div.cat3 {background-image: url(../../res/products/3.jpg)} a:hover div.cat3 {background-image: url(../../res/products/3_h.jpg)}
a div.cat4 {background-image: url(../../res/products/4.jpg)} a:hover div.cat4 {background-image: url(../../res/products/4_h.jpg)}
a div.cat5 {background-image: url(../../res/products/5.jpg)} a:hover div.cat5 {background-image: url(../../res/products/5_h.jpg)}
a div.cat6 {background-image: url(../../res/products/6.jpg)} a:hover div.cat6 {background-image: url(../../res/products/6_h.jpg)}

div.prod1, div.prod2, div.prod3, div.prod4, div.prod5, div.prod6
{
width:260px;
height:290px;
background-position:top; 
background-repeat:no-repeat;
}

a div.prod1 {background-image: url(../../res/products/1b.jpg)} a:hover div.prod1 {background-image: url(../../res/products/1b_h.jpg)}
a div.prod2 {background-image: url(../../res/products/2b.jpg)} a:hover div.prod2 {background-image: url(../../res/products/2b_h.jpg)}
a div.prod3 {background-image: url(../../res/products/3b.jpg)} a:hover div.prod3 {background-image: url(../../res/products/3b_h.jpg)}
a div.prod4 {background-image: url(../../res/products/4b.jpg)} a:hover div.prod4 {background-image: url(../../res/products/4b_h.jpg)}
a div.prod5 {background-image: url(../../res/products/5b.jpg)} a:hover div.prod5 {background-image: url(../../res/products/5b_h.jpg)}
a div.prod6 {background-image: url(../../res/products/6b.jpg)} a:hover div.prod6 {background-image: url(../../res/products/6b_h.jpg)}

div.prod1f, div.prod2f, div.prod3f, div.prod4f, div.prod5f, div.prod6f
{
width:130px;
height:70px;
float:left;
background-position:top; 
background-repeat:no-repeat;
}

a div.prod1f {background-image: url(../../res/products/1bf.jpg)} a:hover div.prod1f {background-image: url(../../res/products/1bf_h.jpg)}
a div.prod2f {background-image: url(../../res/products/2bf.jpg)} a:hover div.prod2f {background-image: url(../../res/products/2bf_h.jpg)}
a div.prod3f {background-image: url(../../res/products/3bf.jpg)} a:hover div.prod3f {background-image: url(../../res/products/3bf_h.jpg)}
a div.prod4f {background-image: url(../../res/products/4bf.jpg)} a:hover div.prod4f {background-image: url(../../res/products/4bf_h.jpg)}
a div.prod5f {background-image: url(../../res/products/5bf.jpg)} a:hover div.prod5f {background-image: url(../../res/products/5bf_h.jpg)}
a div.prod6f {background-image: url(../../res/products/6bf.jpg)} a:hover div.prod6f {background-image: url(../../res/products/6bf_h.jpg)}

div.prod1b, div.prod2b, div.prod3b, div.prod4b, div.prod5b, div.prod6b
{
width:130px;
height:70px;
float:left;
background-position:top; 
background-repeat:no-repeat;
}

a div.prod1b {background-image: url(../../res/products/1bb.jpg)} a:hover div.prod1b {background-image: url(../../res/products/1bb_h.jpg)}
a div.prod2b {background-image: url(../../res/products/2bb.jpg)} a:hover div.prod2b {background-image: url(../../res/products/2bb_h.jpg)}
a div.prod3b {background-image: url(../../res/products/3bb.jpg)} a:hover div.prod3b {background-image: url(../../res/products/3bb_h.jpg)}
a div.prod4b {background-image: url(../../res/products/4bb.jpg)} a:hover div.prod4b {background-image: url(../../res/products/4bb_h.jpg)}
a div.prod5b {background-image: url(../../res/products/5bb.jpg)} a:hover div.prod5b {background-image: url(../../res/products/5bb_h.jpg)}
a div.prod6b {background-image: url(../../res/products/6bb.jpg)} a:hover div.prod6b {background-image: url(../../res/products/6bb_h.jpg)}

a div.addtobag
{
width:170px;
height:64px;
float:left;
background-position:top; background-repeat:no-repeat; background-image: url(../../res/addtobag.jpg)
}

a:hover div.addtobag
{
background-image: url(../../res/addtobag_h.jpg)
}

a div.checkout
{
width:170px;
height:60px;
float:left;
background-position:top; background-repeat:no-repeat; background-image: url(../../res/checkout.jpg)
}

a:hover div.checkout
{
background-image: url(../../res/checkout_h.jpg)
}

/* Product image wrapper - Must be fixed size so page doesnt jump when swapping imgs*/
#prod_image_container
{
	height:290px;
	width:260px; 
}
#prod_thumbs_container
{
	width:280px;
}
#prod_thumbs_container .prod_thumb
{
	float:left;
	width:140px;
	text-align:center;
}
#prod_thumbs_container .prod_thumb img
{
	cursor:pointer;
}
#prod_thumbs_container .prod_thumb .prod_thumb_caption
{
	text-align:center;
	color:#3D6171;
}
div.product_email
{
width:170px;
position:relative;
height:100px;
float:left;
background-position:top; background-repeat:no-repeat; background-image: url(../../res/email.jpg)
}
div.product_email input.formtext
{
	position:absolute; top:50px;left:5px; width:105px;
}
div.product_email .submitcontainer
{
	position:absolute; top:50px; height:22px; left:115px; width:50px; overflow:hidden;
}
div.product_email .submitcontainer input
{
	padding:30px; background-color:transparent; border:none; cursor:pointer;
}
div.product_email .fielderror
{
	position:absolute;
	color:#FE0202;
	top:78px; left:5px;
}

form.sendemail
{
padding-top:50px;
}

form.quantity
{
float:left;
padding:0px 20px 0px 60px;
}

input.quantity
{
width: 20px;
}

input.text
{
width: 113px;
}

input.text2
{
background-color:transparent;
border: 0px;
width:190px;
padding-right:7px;
}
/*
input.submit
{
cursor:pointer;
background-color:transparent;
border-width: 0px;
width: 47px;
height: 22px;
}*/

textarea.text3
{
background-color:transparent;
border: 0px;
}

div.coming
{
padding:0px 10px 20px 90px;
}

span.qty {padding-left:192px; font-weight:bold;}

span.price {padding-left:67px; font-weight:bold;}

div.bk2
{
float:left;
padding: 0px 0px 0px 200px;
font-weight:bold;
}

div.bk3
{
font-weight:bold;
color:#FE0202;
padding: 0px 0px 0px 270px;
}

span.bold2
{
font-weight:bold;
color:#3D6171;
}

span.bold2 a {text-decoration:none; color:#3D6171;}

span.red {color:#FE0202;}
span.floatleft {float:left;}

div.bk_error
{
	color:#FE0202;
}

div.bk4
{
float:left;
clear:left;
width:140px;
padding:6px 0px 0px 0px;
}

div.bk5
{
width: 205px;
height: 29px;
background-position:top left; background-repeat:no-repeat; background-image: url(../../res/input.gif);
padding:6px 0px 0px 9px;
float:left;
}
div.bk5_filled
{
width: 205px;
height: 29px;
color:#3D6171;
background-position:top left; background-repeat:no-repeat; background-image: none;
padding:6px 0px 0px 9px;
float:left;
}

div.bk6
{
width: 265px;
height: 91px;
background-position:top left; background-repeat:no-repeat; background-image: url(../../res/input2.gif);
padding:6px 0px 0px 9px;
}

div.bk8 {float:left; width:300px; padding:10px 0px 10px 0px;}

/****
 * TSHIRT PAGE
 */
 .tshirtlist_prod { float:left; }
 
/*****************
 * CONTACT FORM
 ****************/
div.contact_form .contact_field
{
	clear:left;
}
div.contact_form .contact_field_label
{
	float:left; width:110px;
}
div.contact_form .contact_field_input
{
	float:left; width:210px;
}
div.contact_form .contact_field_input input.formtext,
div.contact_form .contact_field_input textarea
{
	width:190px;
}
div.contact_form .contact_field_input textarea
{
	height:60px;
}

div.contact_form .contact_field_error
{
	float:left; width:110px; color:#FE0202;
}
 
div.footerpromotion img
{
	position: relative;
	left: 58px;
}
span.offer
{
  font-weight:bold;
    color:#990000;
    }
