/* CSS Document */



html {
    height: 100%;
	}


body {
	background: #f2e1ab;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	height: 100%;
	margin: 0;
	padding: 0;
	text-align: left;
	}



a:link {
	color: #d58241;
	text-decoration: none;
	}

a:visited {
	color: #d58241;
	text-decoration: none;
	}
	
a:hover {
	color: #9d2518;
	}
	
a:active {
	color: #9d2518;
	text-decoration: none;
	}
	
p a:hover {
	border-bottom: 1px dotted #9d2518;
	color: #9d2518;
	}	

img {
	border: 0;
	display: block;
	padding: 0;
	text-decoration: none;
	}

.hide {
	display: none;
}

.inline {
	display: inline;
	}
	
.clear {
	clear: both;
	}






/*----------------------------------- wrapper & masthead ---------------------------------------*/

#wrapper {
	background: url(../images/global/background.jpg) top center no-repeat #f2e1ab;
	border: none;
	height: auto;
	margin: 0px auto 0px auto;
	padding: 0;
	width: 1234px;
	}


/* following allows container to wrap around floats */
#wrapper:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden; 
	}
	 
	  
	
#container {
	border-left: solid 2px #002f30;
	border-right: solid 2px #002f30;
	height: auto;
	margin: 0 auto 0 auto;
	padding: 0;
	width: 950px;
	}

#topbanner {
	background-color: #002f2f;
	clear: both;
	height: 170px;
	margin: 0 auto 0 auto;
	padding: 4px 4px 4px 4px;
	width: 1018px;
	}
	
#topbanner img {
	display: inline;
	}

/*----------------------------------- MAIN-NAV ---------------------------------------*/

#navigation {
	clear: both;
	height: auto;
	margin: 0 142px 0 142px;
	padding: 0;
	width: 950px;
	}

#navigation ul {
	float: right;
	margin: 0;
	padding: 0;
	}
	
#navigation ul li {
	font-weight: bold;
	letter-spacing: 0.02em;
	list-style: none;
	margin: 0;
	position: relative;
	text-align: left; 
	text-transform: uppercase;
	}
	
#navigation li {
	display: inline;
	float: left;
	margin: 0px;
	padding: 0px;
	}

#navigation li a:link, #navigation li a:visited, #navigation li a:active {
	background-color: #005473;
	border: none;
	color: #fefefe;
	display: block;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.125em; /* 16x1.125=18 */
	margin: 0;
	padding: 27px 14px 5px 14px;
	text-decoration: none;
	}

#navigation li a:hover { 
	background-color: #1498a7;
	border: none;
	color: #ffd273;
	display: block;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.125em; /* 16x1.125=18 */
	text-decoration: none;
	margin: 0;
	padding: 27px 14px 5px 14px;
	}
	
	
	/* F3 state for main nav */
	#navigation li.on {
		border: none;
		color: #ffd273;
		display: block;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 1.125em; /* 16x1.125=18 */
		margin: 0;
		padding: 27px 14px 5px 14px;
		text-decoration: none;
		}

#phone {
	color: #ffd273;
	float: left;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.25em; /* 16x1.25=20 */
	letter-spacing: 0.08em;
	margin: 0;
	padding: 7px 0px 0px 10px;
	text-transform: uppercase;
	}
	
	#phone a:link, #phone a:visited, #phone a:active {
		color: #fefefe;
		font-size: 0.75em; /* 16x0.75=12 */
		letter-spacing: 0.05em;
		}
	
	#phone a:hover { 
		border: none;
		color: #ffd273;
		font-size: 0.75em; /* 16x0.75=12 */
		letter-spacing: 0.05em;
		text-decoration: none;
		}


/*----------------------------------- CONTENT ---------------------------------------*/

#content-wrapper {
	background: url(../images/global/content_bg.jpg) top center repeat-y;
	height: auto;
	margin: 0;
	padding: 0 0 20px 0;
	position: relative;
	width: 950px;
	}
		
	
#content {
	background: url(../images/global/secondary_top.gif) top center no-repeat #f5f3e5;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	height: auto;
	line-height: 1.6;
	margin: 0 auto;
	width: 870px;
	padding: 12px 0 0 0;
	}

	#content p {
		padding-left: 53px;
		}
	
	
img#content-bottom {
	height: 20px;
	margin: 0;
	width: 870px;
	}

/*--------------------------- HOME ---------------------------------*/

#topbanner-home {
	background-color: #002f2f;
	clear: both;
	height: 220px;
	margin: 0 auto 0 auto;
	padding: 4px 4px 4px 4px;
	width: 1017px;
	}
	
	*+html #topbanner-home {
		padding: 4px 0px 4px 0px;
		width: 1024px;
		}
	
#topbanner-home img {
	display: inline;
	}
	
	*+html #topbanner-home img {
		display: inline;
		margin: 0 4px 0 4px;
		}
	

	
#home-content {
	background: url(../images/global/content_bg.jpg) top center repeat-y;
	height: auto;
	padding: 20px 0 0 0;
	width: 950px;
	}
	
#home-leftcol {
	float: left;
	height: auto;
	margin: 0px 22px 20px 0px;
	width: 460px;
	}
	
#home-booking {
	background: url(../images/home/headers/logo-tagline.jpg) top left no-repeat #6AD4F8;
	margin: 0 0 10px 0;
	min-height: 146px;
	padding: 255px 0 0 0;
	width: 460px;
	}
	
	
	
#home-surfstay {
	background: url(../images/home/headers/surf-and-stay.gif) top left no-repeat #00c6de;
	height: auto;
	margin: 0 0 10px 0;
	padding: 75px 0 0 0;
	width: 460px;
	}
	
#home-shop {
	background: url(../images/home/headers/surf-shop.gif) top left no-repeat #00a6e4;
	height: auto;
	margin: 0;
	padding: 70px 0 0 0;
	width: 460px;
	}
	
	#home-booking p, #home-surfstay p, #home-shop p {
		color: #ffffff;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 18px;
		font-weight: normal;
		line-height: 1.4;
		margin-top: 0;
		padding: 0 20px 0 42px;
		}
	


#home-middlecol {
	background-color: #3e95b6;
	float: left;
	margin: 0;
	padding: 0;
	width: 231px;
	}

	#home-middlecol ul {
		margin: 12px 0 12px 0;
		padding-left: 20px;
		padding-right: 20px; 
		}
		
		*+html #home-middlecol ul {
			padding-left: 25px;
			}
		
		
		
	#home-middlecol ul li {
		background: url(../images/home/separator.gif) bottom center no-repeat #3e95b6;
		color: #f6fff5;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		font-weight: bold;
		line-height: 1.8;
		list-style: none;
		padding-bottom: 28px;
		padding-top: 25px;
		position: relative;	
		}
		
		*+html #home-middlecol ul li {
			background: url(../images/home/separator.gif) bottom left no-repeat #3e95b6;
			}
		
		#home-middlecol ul li#homelist-top {
			padding-top: 0px;
			}
			
		#home-middlecol ul li#homelist-bottom {
			background: none;
			padding-bottom: 0px;
			}

	#home-middlecol a:link, #home-middlecol a:visited, #home-middlecol a:active {
		color: #ffda74;
		text-decoration: none;
		}
		
	#home-middlecol a:hover {
		border-bottom: 2px dotted #191275;
		color: #191275;
		}

#home-middletop {
	background: url(../images/home/corners/middle-top.gif) top center no-repeat #3e95b6;
	height: 13px;
	}
	
#home-middlebottom {
	background: url(../images/home/corners/middle-bottom.gif) bottom center no-repeat #3e95b6;
	height: 13px;
	}

#home-rightcol {
	background: url(../images/home/corners/right-top.gif) top left no-repeat #f5f3e5;
	float: right;
	height: auto;
	margin: 0;
	padding: 20px 0px 0px 0px;
	width: 212px;
	}

#home-rightcol p {
	margin: 0px 15px 5px 15px;
	}
	
	#home-rightcol a:hover, #home-rightcol a:active {
		border-bottom: none;
		text-decoration: none;
		}

	
#home-rightbottom {
	background: url(../images/home/corners/right-bottom.gif) bottom left no-repeat #f5f3e5;
	height: 13px;
	margin-top: 5px;	
	}
	
/* --------------------- TWEETS ---------------------*/
		
#tweets {
	clear: both;
	height: auto;
	margin: 0px 10px 0 15px;
	padding: 0;
	text-align: left;
	}
	
ul#twitter_update_list {
	height: auto;
	margin: 0;
	padding: 0;
	}
	
	ul#twitter_update_list li {
		list-style: none;
		color: #563d18;
		line-height: 1.4;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		margin: 0;
		padding: 0;
		text-align: left;
		}
		
		ul#twitter_update_list li a:link, ul#twitter_update_list li a:visited  {
		text-decoration: none;
		color: #cd671c;
		}
		
		ul#twitter_update_list li a:hover {
		color: #9D2518;
		}
		
/* --------------------- SEARCH ---------------------*/
	
#search_box {
	background: url(../images/home/search-field.gif) no-repeat;
	height: 28px;
	margin: 0 0 0 15px;
	width: 170px;
	}
	
#search_box #s {
	color: #888888;
	float: left;
	padding: 0;
	margin: 6px 0 0 6px;
	border: 0;
	width: 125px;
	background: none;
	}

#search_box #go {
	float: right;
	margin: 0;
	}


/*--------------------------- SECONDARY PAGES ---------------------------------*/
		
.photo-column {
	float: right;
	height: auto;
	margin: 10px 0px 20px 20px;
	padding: 0;
	width: 325px;
	}
	
#discount-box {	
	background-color: #f2e1ab;
	margin: 0;
	padding: 20px;
	}
	
#form-discount-box {	
	background-color: #f2e1ab;
	margin: 0 0 0 45px;
	padding: 20px;
	}

	
#right-column {
	float: right;
	height: auto;
	margin: 20px 35px 40px 55px;
	padding: 0;
	width: 330px;
	}
	
	#right-column p {
		margin-top: 0;
		padding-left: 0;
		padding-right: 0;
		}
	
/* Rates Table */

table#rates {
    border-collapse: collapse; 
	margin-left: 53px;
	}

/* end rates */



/*--------------------------- ABOUT ---------------------------------*/

#about {
	background: url(../images/about/about-us-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}

/*--------------------------- LESSONS ---------------------------------*/

#lessons {
	background: url(../images/lessons/lessons-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}


/*--------------------------- STAND UP PADDLE ---------------------------------*/

#standup {
	background: url(../images/standup/standup-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}
	

/*--------------------------- SURF SAFARI ---------------------------------*/

#surfsafari {
	background: url(../images/surfsafari/surfsafari-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}
	
	
/*--------------------------- SURF AND STAY ---------------------------------*/

#surfstay {
	background: url(../images/surf-stay/surfstay-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}
	
#gallery {
	margin: 0 0 0 40px;
	}

#gallery img {
	margin: 0 8px 20px 8px;
	display: inline;
	}
	
#gallery a:link img, #gallery a:visited img {
	border: 5px solid transparent !important;
	border: 5px solid #f5f3e5;
	}	
	
#gallery a:hover img, #gallery a:active img {
	border: 5px solid #ffd375 !important;
	}
	
/*--------------------------- CONTACT  ---------------------------------*/

#contact {
	background: url(../images/contact/contact-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 48px 45px 0 0;
	}


/*--------------------------- KIDS  ---------------------------------*/

#kids {
	background: url(../images/kids/kids-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 50px 45px 0 0;
	}
	
#kidsbutton {	
	float: right;
	margin: -30px 20px 0px 0px;
	padding: 0px;
	}
	
	
/*--------------------------- JAPANESE ---------------------------------*/

#japanese {
	background: url(../images/japanese/japanese-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 50px 45px 0 0;
	}
	

/*--------------------------- VIDEO  ---------------------------------*/

#video {
	background: url(../images/video/video-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 108px 45px 0 0;
	}
	
	
/*--------------------------- SHOP ---------------------------------*/

#shop {
	background: url(../images/shop/shop-header.gif) top left no-repeat #f5f3e5;
	margin: 10px 0 0 0;
	padding: 50px 45px 0 0;
	}
	
#shop-gallery {
	margin: 0 0 0 40px;
	}

#shop-gallery img {
	margin: 0 8px 20px 8px;
	display: inline;
	}
	
#shop-gallery a:link img, #shop-gallery a:visited img {
	border: 5px solid transparent !important;
	border: 5px solid #f5f3e5;
	}	
	
#shop-gallery a:hover img, #shop-gallery a:active img {
	border: 5px solid #ffd375 !important;
	}
	

  
/*--------------------------------------------- 
       F O R M S 
----------------------------------------------*/
.form-booking {
	padding-left: 53px;
	}
	
#surfstay #booking-list {
	list-style-type: none;
	margin-top: 0px;
	}
#surfstay #booking-list li {
	margin: 5px 0 10px -40px;
	}
	
#lessons #booking-list {
	list-style-type: none;
	margin-top: 0px;
	}
		
#lessons #booking-list li {
	margin: 5px 0 10px 0px;
	}

.form-contact {
	width: 350px;
	background-color: #ECEADD;
	border: 1px solid #C6D4DA; 
	padding: 15px; 
	margin: 10px 0px 25px 53px;
	-moz-border-radius-bottomleft:3px;
	-moz-border-radius-bottomright:3px;
	-moz-border-radius-topleft:3px;
	-moz-border-radius-topright:3px;
	}

div.row-contact {
  clear: left;
  padding-top: 11px;
  }

div.row-contact span.label-contact {
  float: left;
  width: 104px;
  font-size: 12px;
  text-align: left;
  margin-right: 5px;
  padding-left: 10px;
  }

div.row-contact span.formw-contact {
  float: right;
  width: 200px;
  text-align: left;
  } 

div.checkboxes {
	float: left;
	width: 320px;
	margin: 15px 0 0 10px;
	font-size: 12px;
	}

div.checkboxes-wide {
	float: left;
	width: 340px;
	margin: 15px 0 0 30px;
	font-size: 12px;
	text-align: left;
	}
	
.infobox {
	border: #005574 5px solid;
	background: #F5F3E5;
	margin: 2px;
	padding: 5px 10px 5px 10px;
	}
	
.lesson-checkboxes {
	margin: 0 0 0 15px;
	}


/*------------------------------------------- IMAGES -----------------------------------------------*/

.image-right {
	display: inline;
	margin: 0 0 20px 20px;
	padding: 0;
	}
	
.image-right2 {
	display: inline;
	margin: 20px 0 20px 20px;
	padding: 0;
	}
	
	
/*------------------------------------------- CAPTIONS -----------------------------------------------*/

.captions-right {
	color: #005473;
	float: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	line-height: 1.5;
	margin: 0 0 20px 20px;
	padding: 0;
	}
	


/*----------------------------------- GOOGLE CUSTOM SEARCH ---------------------------------------*/

#cse-search-results {
	margin: 0 0 0 53px;
	}
	
/*----------------------------------- FONT SYTLES ---------------------------------------*/


.bodytext {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.8;
	}
	
	
.body-big {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1.6;
	}
	
.body-big-caps {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	text-transform: uppercase;
	}
	
.body-small {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 1.5;
	}


.blog-title {
	color: #1498a7;
	font-family: Verdana, Tahoma, Helvetica, sans-serif;
	font-size: 17px;
	line-height: 1.4;
	}
	
.blog-date {
	color: #1498a7;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 1.2;
	}

.blog-text {
	color: #555555;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	}

	
.subnav {	
	border: none;
	color: #0094f0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	line-height: 1.2;
	}
	
.teal-large {
	color: #1498a7;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 1.5;
	}
	
	
.page-header {
	color: #0094f0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 32px;
	font-weight: bold;
	line-height: 1.5;
	}


.header {
	color: #0094f0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 21px;
	font-weight: bold;
	line-height: 1.2;
	}
	
.subheader {
	color: #0094f0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.5;
	}
	
.posted {
	color: #005473;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	line-height: 1.5;
	padding: 0;
	}

.teal-bold-caps {
	color: #1498a7;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	}

.teal {
	color: #1498a7;
	}

.blue {
	color: #0094f0;
	}
	
.caption-text {
	color: #005473;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	}	
	
.red {
	color: #FF0000;
	}

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

#footer {
	background: url(../images/global/footer_top.gif) top center no-repeat #1498a7;
	border-bottom: 2px solid #002f2f;
	clear: both;
	color: #ffffff;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 12px;
	horizontal-align: center;
	letter-spacing: 0.05em;
	margin: 0 auto 0 auto;
	padding: 30px 20px 20px 20px;
	text-align: center;
	vertical-align: top;
	width: 910px;
	}
	
#footer h1 {
	color: #f5f3e5;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 32px;
	font-weight: normal;
	letter-spacing: 0.02em;
	line-height: 1.1;
	margin: 0 auto;
	}
	
	*+html #footer h1 {
		line-height: 1.2;
		}
	
#footer h2 {
	color: #f5f3e5;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: normal;
	letter-spacing: 0.02em;
	line-height: 1.2;
	margin-top: 0;
	}

#footer a:link {
	color: #f5d078;
	text-decoration: none;
	}
	
#footer a:visited {
	color: #f5d078;
	text-decoration: none;
	}
	
#footer a:hover {
	border-bottom: 2px dotted #002f2f;
	color: #002f2f;
	}
	
#footer a:active {
	color: #002f2f;
	text-decoration: none;
	}