/*
STYLE SHEET

Table of contents :)
		
			1. Layout Divs 
			2. Generic Classes
			3. Right Navigation
			4. Right Side Adverts
			5. Top Navigation
			6. Text h1, h2, h3 p tags etc
 			7. Footer Divs

/********************************************************
* LAYOUT DIVS
********************************************************/

* {
	padding:0;
	margin:0;
}

body {
	margin:0;
	padding:0;
	background-color:#F7F5F5;
	background-image:url(../images/bodyBkg.gif);
	background-repeat:repeat-x;
}

#outerWrapper{
	margin: 0px auto;
	padding:0;
	border:0;
	width: 966px;
	height:auto;
	background-color: transparent;
	position:relative;
}

#leftShadow {
	width:108px;
	height:700px;
	background-image:url(../images/leftShadow.jpg);
	background-repeat:no-repeat;
	float:left;
	padding:0;
	margin:0;
}

#wrapper {
	margin: 0px auto;
	padding:0;
	border:0;
	width: 750px;
	height:auto;
	float:left;
	background-color:#F6F1DB;
}

* html #wrapper {
	background-color:#FFF;
}

#topNavigation {
	width:750px;
	height:25px;
	background-image:url(../images/topNavigation1.jpg);
	background-repeat:repeat;
	background-color:transparent;
	padding:0;
}

#header {
	background-image:url(../images/header.jpg);
	background-repeat:no-repeat;
	width:750px;
	height:141px;
	padding:0;
	margin:0;
}

* html #header {
	margin-top:-2px;
}

#contentWrapper {
	width:750px;
	height:auto;
	float:left;
	padding:0;
	margin:0;
}

#leftWrapper {
	height:auto;
	float:left;
	padding:0;
	margin:0;
}

#contentRepeat {
	background-image:url(../images/contentRepeat.gif);
	background-repeat:repeat-y;
	clear:both;
	width:489px;
	padding:0;
	margin:0;
}

#mainContent {
	width:446px;
	padding:0;
	margin:0;
	float:left;
}

#imageTop {
	background-image:url(../images/imageTop.gif);
	background-repeat:no-repeat;
	width:489px;
	height:18px;
	padding:0;
	margin:0;
}

* html #imageTop {
	background-color:#FFFFFF;
	margin-bottom:-1px;
}

#imageLeft {
	background-image:url(../images/leftImage.gif);
	background-repeat:no-repeat;
	width:17px;
	height:266px;
	float:left;
	padding:0;
	margin:0;
}

#imageRight {
	background-image:url(../images/rightImage.gif);
	height:266px;
	width:26px;
	float:right;
	padding:0;
	margin:0;
}

#imageBottom {
	background-image:url(../images/bottomImage.gif);
	width:489px;
	height:28px;
	clear:both;
	padding:0;
	margin:0;
}

#specialOffer {
	width:480px;
	padding:0px;
	margin:0px;
	background-color:#000000;
	clear:both;
	float:left;
}

#onlineStore {
	width:305px;
	height:25px;
	background-color:#ff6600;
	margin:0;
}

#leftSpecial {
	float:left;
	width:174px;
	height:200px;
	background-color:#000;
	padding-left:1px;
}

.IMG {
	display:block;
	width:167px;
	height:142px;
	background-image:url(../images/specialOffer_image.jpg);
	background-repeat:no-repeat;
	margin-bottom:10px;
}

.OFFER {
	padding-top:15px;
	padding-left:19px;
}

#rightSpecial {
	float:right;
	width:305px;
	background-color:#000;
}

#rightWrapper {
	width:262px;
	height:auto;
	float:left;
	padding:0;
	margin:0;
	background-color: transparent;
}

#rightNavigation {
	width:262px;
	height:auto;
	background-image:url(../images/rightNavigationBackground.gif);
	background-repeat:repeat-y;
	padding:0;
	margin:0;
}

#rightNavigationImg {
	width:262px;
	height:8px;
	float:left;
	background-image:url(../images/buttons/rightNavigationBottomImg.gif);
	background-repeat:no-repeat;
	padding:0;
	margin:0;
}

#rightAdvert1 {
	width:261px;
	margin:0;
}

* html #rightAdvert1 {
	margin-top:-12px;
}

#rightAdvert2 {
	width:261px;
	padding-top:0px;
	margin:0;
}

#contentWrapper {
	width:800px;
	padding:0;
	margin:0;
	margin-bottom:10px;
}

#leftContent {
	width:219px;
	height:auto;
	float:left;
	background-color:#FFF;
}

#rightContent {
	width:550px;
	height:328px;
	float:left;
	padding:0;
	margin:0;
	background-color:#FFF;
}

#rightShadow {
	width:107px;
	height:700px;
	background-image:url(../images/rightShadow.jpg);
	background-repeat:no-repeat;
	float:right;
	padding:0;
	margin:0;
}
* html #rightShadow {
	position:absolute;
	right:0;
	top:0;
}

/********************************************************
* GENERIC CLASSES
********************************************************/

.textDisplay {
	display:none;
}

.mainLogo {
	width:193px;
	height:73px;
	margin-left:15px;
	margin-top:15px;
	margin-bottom:0px;	
}

.surfWear {
	margin-left:10px;
	margin-top:2px;
	float:left;
}

.specialOfferText {
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	margin-left:4px;
	margin-right:4px;
	margin-top:4px;
	margin-bottom:4px;
	padding-bottom:60px;
}

/*Special Offer Section - Link Icon */
.storeNow {
	margin-left:120px;
	margin-top:2px;
	float:left;
}

p.rightAdvertText, p.rightAdvertText2 {
	margin:0;
	padding-left:15px;
}

.clearText {
	display:none;
}

/*Header Top - Text, Address and Tel etc */
.headerImageAddress {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	color:#000;
	float:right;
	margin-left:170px;
	margin-right:30px;
	margin-top:125px;
}

/********************************************************
* RIGHT NAVIGATION STYLING
********************************************************/

#rightNavigation ul {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.7em;
	padding: 0px 0 0 0;
	margin:0;
}

#rightNavigation li {
	padding: 0px 0 0 0px;
	height:28px;
	width:262px;
	list-style:none;
}

#rightNavigation #homeButton {
	width:262px;
	height:30px;
	display:block;
	background-color:#FFFFFF;
	margin-bottom:2px;
}

#rightNavigation #homeButton a {
	height:32px;
	width:262px;
	display:block;
	background-image:url(../images/buttons/home_button_off.gif);
	background-position:top left;
}

#rightNavigation #homeButton a:hover {
	background-image:url(../images/buttons/home_button_on.gif);
}

.mainNavigationClass a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background-image:url(../images/buttons/arrow_normal.gif);
	background-color:#000;
	background-position:left;
	background-repeat:no-repeat;
	width:262px;
	height:20px;
	display:block;
	padding-left:45px;
	padding-top:6px;
	margin-bottom:2px;
}

* html .mainNavigationClass a {
	width:217px;
}

.mainNavigationClass a:hover {
	background-color:#6699CC;
	background-image:url(../images/buttons/arrow_normal_over.gif);
}

/********************************************************
* RIGHT SIDE ADVERTS - BELOW NAVGATION IMG AND TEXT CSS
********************************************************/

#rightAdvertText2 {
	width:261px;
	height:25px;
	background-color:#6699CC;
	margin:0;
}

#rightAdvertText {
	width:261px;
	height:25px;
	background-color:#ff6600;
	margin:0;
}

.rightAdvertText {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.7em;
	color:#FFFFFF;
	padding-top:6px;
	float:left;
}

.rightAdvertText2 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.7em;
	color:#FFF;
	padding-top:6px;
	float:left;
}

/********************************************************
* TOP NAVIGATION STYLING
********************************************************/

#topNavigation ul {
	float:right;
	list-style-type: none;
	margin: 0px;
	padding: 0px 0px 0px;
	display: block;
	height:27px;
}

#topNavigation li {
	display: inline;
	float:left;
}

#menutop1 a {
	display: block;
	float:left;
	height: 24px;
	width: 85px;
	background-repeat: no-repeat;
	background-image:url(../images/images/home_top.gif);
}

#menutop2 a {
	display: block;
	float:left;
	height: 24px;
	width: 90px;
	background-repeat: no-repeat;
	background-image:url(../images/images/snowboarding_top.gif);
}

#menutop3 a {
	display: block;
	float:left;
	height: 24px;
	width: 56px;
	background-repeat: no-repeat;
	background-image:url(../images/images/surfing_top.gif);
}

#menutop4 a {
	display: block;
	float:left;
	height: 23px;
	width: 90px;
	margin-top:1px;
	background-repeat: no-repeat;
	background-image:url(../images/images/skaeboarding_top.gif);
}

#menutop5 a {
	display: block;
	float:left;
	height: 23px;
	width: 49px;
	margin-top:1px;
	background-repeat: no-repeat;
	background-image:url(../images/images/kites_top.gif);
}

/********************************************************
* TEXT STYLING H1,H2, H3 etc p tags
********************************************************/

h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#FFF;
	margin:0;
	padding:0;

}

.h1_OrangeTab {
	background-image:url(../images/buttons/h1_image.gif);
	display:block;
	width:159px;
	height:29px;
	padding-top:18px;
	padding-left:13px;
	margin-bottom:10px;
}

h2 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#FFF;
	margin:0;
	padding:0;
}

.h2_OrangeTab {
	background-image:url(../images/buttons/h1_orange_black.gif);
	display:block;
	width:159px;
	height:27px;
	padding-top:18px;
	padding-left:13px;
	margin-bottom:10px;
	margin-top:9px;
}


h3 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#FFF;
	margin:0;
	padding:0;

}

.h3_Tagline {
	background-image:url(../images/getOnboardText.gif);
	background-repeat:no-repeat;
	display:block;
	width:289px;
	height:51px;
	padding-top:18px;
	padding-left:13px;
	margin-bottom:2px;
}

p {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.7em;
	padding-top:0px;
	margin-left:15px;
	margin-right:15px;
	padding-bottom:10px;
	color:#333;
}

p a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#333;
}

p a:hover {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#000;
}

#mainContent ul {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.7em;
	padding-top:0px;
	margin-left:15px;
	margin-right:15px;
	padding-bottom:10px;
	color:#333;
}


/********************************************************
* FOOTER DIVS
********************************************************/

#footer1 {
	width:750px;
	height:35px;
	background-color:#000000;
	clear:both;
	color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	margin-bottom:5px;
}

.footerRight {
	font-size:0.7em;
	font:Arial, Helvetica, sans-serif;
	text-align:right;
	float:right;
	margin-right:10px;
	margin-left:10px;
	margin-top:8px;
}

.footerLeft {
	float:left;
	font-size:0.7em;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	margin-left:10px;
	margin-top:8px;
}

#footer1 a {	
	margin-left:5px;
	color:#FFF;
	text-decoration:underline;
}

#footer1 a:hover {	
	margin-left:5px;
	color:#FFF;
	text-decoration:none;
}

#footer2 {
	width:750px;
	height:35px;
	background-color:#F7F5F5;
	text-align:center;
	clear:both;
	color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
}

#footer2 a {	
	margin-left:5px;
	color:#000;
	text-decoration:underline;
}

#footer2 a:hover {	
	margin-left:5px;
	color:#FF6600;
	text-decoration:none;
}

.footerNav {
	font-size:0.7em;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	margin-left:10px;
	margin-top:8px;
}

.caboodleLogo {
	margin: 0px auto;
	padding-top:15px;
	border:none;
}

/********************************************************
* END OF STYLE :)
********************************************************/
