@charset "UTF-8";
/* CSS Document */
/***************************  

Coolum Surfing School

***************************/

/**Colours 
blue: #2BB8FF
orange: #FF744F
grey: #666666

**/

* {
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, th {
	font-size: 1em;
	font-weight: normal;
	font-style: normal;
}
fieldset, img { border: none; }
table { border-collapse: collapse; }
a, a:link { color: #2BB8FF; }
a:link, a:active, a:visited { text-decoration:none; }
a:hover { color: #FF744F; }
a:active { outline: none; }
a:focus { -moz-outline-style: none; }
ul { list-style: none; }
/********** LAYOUT **********/

html, body {

}
body {
	color: #666;
	font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
	font-size: 12px;
	background: url(/images/site/background.jpg) #be9362 repeat-x fixed;
	text-align: center;
}
body.home { }
.clear { clear: both; }
.right { float:right; }
.left { float:left; }
p {
	padding: 5px 0;
	line-height: 1.8em;
}
h1 {
	font: bold 22px Arial, Helvetica, sans-serif;
	color: #2BB8FF;
	padding-bottom: 10px;
}
h2 {
	font: 20px Arial, Helvetica, sans-serif;
	color: #2BB8FF;
	padding-bottom: 8px;
}
h3 {
	font: 16px Arial, Helvetica, sans-serif;
	color: #2BB8FF;
	padding-bottom: 4px;
}
h4 {
	font: 14px Arial, Helvetica, sans-serif;
	color: #666;
	padding-bottom: 2px;
}
h1 a { color:#2BB8FF; }
h1 a:hover { color:#FF744F; }
h2 a { color: #2BB8FF; }
h2 a:hover { color:#FF744F; }
h3 a { color: #2BB8FF; }
h3 a:hover { color:#FF744F; }
h4 a { color: #2BB8FF; }
h4 a:hover { color:#FF744F; }
hr {
	border: 1px dashed #2BB8FF;
	height: 1px;
	background-color: #fff;
	margin: 20px 0;
}
.hide {
	display: none;
	visibility: hidden;
}
.blue { color: #2BB8FF; }
.orange { color: orange: #FF744F;
}
/********** Background **********/
#holder {
	position:absolute;
	width:200%;
	height:200%;
	top:-50%;
	left:-50%;
}
#holder[id] { display:table; }
#holder div {
	position:absolute;
	left:0;
	top:50%;
}
#holder[id] div {
	display:table-cell;
	vertical-align:middle;
	position:static;
}
#holder img {
	position:relative;
	top:-50%;
	margin:0 auto;
	display:block;
	-ms-interpolation-mode:bicubic;
	width:100%;
}
*:first-child+html #holder div { position:absolute; }
#body {
	
}
/********** CONTAINER **********/

body.home #wrapper {
	width: 818px;
	text-align: left;
}
body .container {
	width: 920px;
	margin: 0 auto;
	text-align: left;
}
.column-1 {
	background: url(/images/site/internal-sidecol.png) top left no-repeat;
	float:left;
	width: 194px;
}
.column-2 {
	background-color: #FFF;
	float: left;
	width: 718px;
	padding: 0 0 20px 0;
}

/********** HEADER **********/

#header {
	background: url(/images/site/internal-header.png) left bottom no-repeat;
	width: 920px;
	height: 198px;
	position: relative;}

#logo { 
	/*background: url(/images/site/surfschool.png) left top no-repeat;*/
	background: url(/images/site/logo.png) left top no-repeat;
	float: left;
	margin: 6px 0 0 0;
	}
	
#logo a {
	padding: 140px 0 0 0;
	height:0px;
	width: 230px;
	overflow:hidden;
	display:block;
}

/********** NAVIGATION **********/
.nav {
	line-height: normal;
	height:314px;
	padding:87px 15px 0 28px;
}
.nav ul {
	padding: 0;
	margin:0;
	list-style: none;
}
.nav ul li { text-transform: uppercase; }
.nav ul li a {
	display: block;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 4px 10px;
	color: #2BB8FF;
	font-size: 13px;
}
.nav ul li a:hover { color: #007fbd; }
.nav ul li.last a { border: none; }
.nav ul li.selected a { color: #007fbd; }
.nav ul li ul { padding: 7px 0; }
.nav ul li ul li a {
	text-transform:capitalize;
	padding: 0 0 0 15px;
	border: none;
	color: #666;
	font-size: 12px;
	font-weight: normal;
}
.nav ul li.selected ul li a { color: #666; }
.nav ul li ul li a:hover { color: #2BB8FF; }
.nav ul li ul li.selected a {
	color: #2BB8FF;
	padding: 0 0 0 28px;
	background: url(/images/site/nav-selected.jpg) 15px 4px no-repeat;
}
.online-shop-btn {
	width: 194px;
	height: 195px;
	position: relative;
}
.online-shop-btn a {
	background: url(/images/site/onlineshop-buynewboards.png) top left no-repeat;
	width: 256px;
	height: 0px;
	padding: 195px 0 0 0;
	overflow: hidden;
	display: block;
	position: absolute;
	z-index:10;
	top: 0px;
}
.online-shop-btn a:hover { background: url(/images/site/onlineshop-hover.png) top left no-repeat; }
/********** CONTENT **********/

/* slideshow */
#ssp {
	width:718px;
	height:202px;
	overflow:hidden;
}
#gallery {
	width:100%;
	height:100%;
	text-align:center;
	background: url(/images/gallery/default/1.jpg) top left no-repeat;
}
#gallery p {
	color:#333;
	font:12px/19px helvetica, arial;
	margin:0;
	padding:90px 0 0 0;
}
/* end slideshow */
	

body.about .default { padding: 20px 40px; }
body.about .content {
	padding: 80px 40px 20px;
}

body.Testimonials .content {
	background: #fff url(/images/site/page-headers/testimonials.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.Lessons .content {
	background: #fff url(/images/site/page-headers/lessons.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.Learn-to-surf .content {
	background: #fff url(/images/site/page-headers/learn.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.Surf .content {
	background: #fff url(/images/site/page-headers/blog.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}
body.Links .content {
	background: #fff url(/images/site/page-headers/links.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}
body.Contact .content {
	background: #fff url(/images/site/page-headers/contactus.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}
body.Media .content {
	background: #fff url(/images/site/page-headers/medi.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.Media .content .right-sidecol {
	display: none;
	visibility:hidden;
}

body.Downloads .content {
	background: #fff url(/images/site/page-headers/downloads.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.shop .content {
	background: #fff url(/images/site/page-headers/online-shop.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body.shop-photos .content {
	background: #fff url(/images/site/page-headers/shop-photos.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}

body .content {
	background: #fff url(../images/site/page-headers/default.jpg) left top no-repeat;
	padding: 40px 40px 20px;
}

body.Hire .content {
	background: #fff url(../images/site/page-headers/hireaboard.jpg) left top no-repeat;
	padding: 80px 40px 20px;
}


.content {
	width: 638px;
	padding: 20px 40px 20px;
	min-height: 320px;
	position:relative;
	line-height: 20px;
}

.left-sidecol {
	float: left;
	width: 450px;
}

.right-sidecol {
	background: url(/images/site/internal-news.png) top left no-repeat;
	float:right;
	height:483px;
	padding:25px 25px 0 40px;
	width:205px;
	margin:-67px -125px 0 0;
	position:relative;
	line-height: normal;
}

.right-sidecol .news { line-height: normal;}

.right-sidecol .news a {
	display: block;
	height: 90px;
	width: 150px;
}


body.about .block {
	border-top: 1px dashed #2BB8FF;
	padding: 15px 0;
	width: 450px;
	display:inline-block;
}

.block {
	border-top: 1px dashed #2BB8FF;
	padding: 15px 0;
	width: 450px;
	display:inline-block;
	
}

.block .thumb {
	padding:0 20px 20px 0;
	float:left;
	display:block;
	width:99px;
}
.block .thumb img {
	border: 7px solid #e9f8ff;
	height:85px;
	width:85px;
}


.thumb {
	padding:0 20px 20px 0;
	float:left;
	display:block;

}
.thumb img {
	border: 7px solid #e9f8ff;
}


body.about .block .thumb a:hover { border-color: #d5f2ff; }
body.about .block h2 a { color: #2BB8FF; }
.block h2 a:hover { color: #FF744F; }

.read-more a, .readmore a {
	float: right;
	text-transform: uppercase;
	color: #2BB8FF;
	background: url(/images/site/readmore.gif) right 7px no-repeat;
	padding: 0 15px 0 0;
	display: block;
}
.read-more a:hover, .readmore a:hover {
	color:#FF744F;
	background-position: right -15px;
}

body.about .block ul li { list-style: url(/images/site/list-bullet.gif) inside; }



.book-now a {
	background: url(/images/site/bookalessonnow.gif) left top no-repeat;
	width: 180px; height: 60px;
	display: block;
	margin: 20px 0 0 0;
}

.book-now a:hover {
	background-position: 0px -64px;
}

.book-a-lesson {
	padding: 16px 0 0 46px;
}

a.button {
	background: url(/images/site/button-trans.png) top left no-repeat;
	display: block;
	height:27px;
	padding:9px 0 0 25px;
	width:110px;
	color: #FFF;
	margin: 24px 0 0 10px;
	text-transform:uppercase;
}

a.button:hover {
	background-position: 0px -37px;
}


.btm-cta {
	width: 638px;
	margin: 0 40px;
	padding: 20px 0;
	border-top: 1px solid #ccc;
}
.btm-cta li {
	float: left;
	width: 400px;
	text-align: center;
}

.btm-cta li.btm-contact { text-align: left; }

.our-truck {
	float: left;
	margin: 2px 10px 0 0;
}



a.subscribe  {
	background: url(/images/site/internal-subscribe.jpg) top left no-repeat;
	height: 0px;
	width: 150px;
	padding: 38px 0 0 0;
	display: block;
	overflow: hidden;
	margin: 29px 0 0 10px;
}
a.subscribe:hover { background-position: 0px -41px; }


.col01 .news a.news-header {
	margin: 0;
}

.google-map {
	border: 1px solid #2BB8FF;
	width: 450px;
	margin: 10px 0;
}



/********** FOOTER **********/
#footer { 
	width: 904px;
	margin: 0 auto;
	text-align: left;
	}

.footer-left {
	float:left;
	padding:18px 0 0 39px;
	width:125px;
}

.footer-right {
	background: url(/images/site/footer.png) left top no-repeat;
	width: 680px;
	float: right;
	height: 150px;
	padding: 30px 20px;
}

.footer-right ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 170px;
	float: left;
	margin: 0 0 5px 0;
}

.footer-right ul.experience {
	width: 190px;}

.footer-right ul.about {
	width: 150px;}

.footer-right ul.online-shop {
	width: 165px;}

.footer-right ul.coolumsurfing {}
	
.footer-right ul li {
	height:  20px;
}

.footer-right ul li a {
	color: #666;
	font-weight: normal;
	padding: 2px 0;
	display: block;
}
.footer-right ul li a:hover {
	color: #09F;
}

.footer-right ul li h5 {
	text-transform: uppercase;
	font-weight: bold;
}
	
.copyright {
	float:left;
	width: 400px;
	color: #2BB8FF;
	margin: 10px 0 0 0;
}

.addthis {
	margin: 10px 0 0 15px;
	width: 152px
}

.addthis-shop {
	margin: 10px 0;
	width: 160px;
	
}


/************** Contact Us Form ***********/

table.webform, table.reporting { width: auto; }


table.webform td {
	line-height:24px;
	padding:2px;
}

.mandatory {
	font-weight: bold;
	color: #2BB8FF;
}


.form label, .webform label, form label {
	font-size:12px;
	position:absolute;
	margin: 0;
}

.cat_dropdown_smaller {
	margin:2px 0 2px 190px;
	width:150px;
}

input.cat_textbox, textarea.cat_listbox, select.cat_dropdown, select.cat_listbox  {
	margin:2px 0 2px 190px;
	width:190px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border:1px solid #2BB8FF;
	padding:4px 2px;
}
.form input, .webform input, input.cat_textbox, textarea.cat_listbox, select.cat_dropdown, select.cat_listbox {
	font: 13px Arial, Helvetica, sans-serif;
	color: #666;
}

select option {
	padding:2px 0 0 6px;
}

.captchaimg {
	margin:3px 0 0 190px;
}

input.checkbox {
	margin: 4px 4px 0 0;
	width: auto;
}

input.dropdown {
	width: 160px;
	margin: 3px 0;
}

input#CaptchaV2 {
	
	padding:2px;
	width:160px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border:1px solid #2BB8FF;
	margin:0 0 0 190px;
	
}

.form .item input.cat_button, .webform .item input.cat_button { margin: 5px 0 0 190px; }

.form .item, .webform .item { padding: 0;}

input.cat_button, .form .item input.cat_button {
	background:url("/images/site/button.jpg") no-repeat scroll left top transparent;
	border:medium none;
	color:#FFFFFF;
	cursor:pointer;
	display:block;
	font-size:15px;
	font-weight:bold;
	height:36px;
	overflow:hidden;
	padding:2px 0 5px;
	width:133px;
}

input.cat_button:hover, .form .item input.cat_button:hover {
	background-position: 0 -38px;
}


div.form div.item input, div.webform div.item input {
	margin:2px 0 2px 190px;
	width:160px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border:1px solid #2BB8FF;
	padding:2px;
}


input.newsletter-button {
	width: 90px;
	background: #2BB8FF;
	font-weight: bold;
	color: #FFF;
	cursor: pointer;
	height:22px;
	border:none;
}

a.form-button {
	cursor: pointer;
	display: block;
	margin: 10px 0 0 190px;
}


input.text1, select.text1, .text1  {
	margin: 2px 0 0 190px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border:1px solid #2BB8FF;
	padding: 2px;
}

.rating {
	margin: 0 0 0 190px;
}

.fine {
	font-size: 10px;
}

table.media-gallery img {
	border:1px solid #2BB8FF;
	margin:0 45px 5px 0;
	padding:3px;
	_width: 150px;
}

table.media-gallery ul {
	margin: 0 0 15px 0;
}

table.media-gallery ul li {
	list-style: url(/images/site/list-bullet.gif) inside;
}


.date {
	font-size: 10px;
	font-weight: bold;
}

/*** ONLINE SHOP LAYOUT **/

table.catalogueTable td img {
	width: 140px;
}

table.catalogueTable td {
	width: 165px;
	display: block;
	float: left;
	border: 1px dashed  #2BB8FF;
	text-align: center;
	margin: 0 20px 20px;
	padding:6px 0 0;
}

table.catalogueTable td:hover {
	border-color: #FF744F;
}

table.catalogueTable td:hover h4 a {
	background-color:#FF744F;
}


table.catalogueTable td a {
	height:144px;
	display: block;
}

table.catalogueTable td h4 {
	padding: 0;
}

table.catalogueTable td h4 a {
	background-color: #2BB8FF;
	font-size: 14px;
	display: block;
	color: #FFF;
	height:17px;
	padding:4px;
	width:157px;
}

table.productSmall {
	margin: 10px 0 30px;
}


table.productSmall td {
	width: 165px;
	display: block;
	float: left;
	border: 1px dashed  #2BB8FF;
	text-align: center;
	margin: 0 20px 30px;
	padding: 0;
	height:228px;
	position: relative;
}

table.productSmall td:hover {
	border: 1px dashed #FF744F;
}

table.productSmall td:hover h4 a {
	background-color: #FF744F;
}

table.productSmall td h4 {
	padding-bottom: 0;
}

table.productSmall td h4 a {
	background-color: #2BB8FF;
	font-size: 13px;
	display: block;
	color: #FFF;
	padding:4px;
	width:157px;
}

body.shop-photos table.productSmall .release-date {
	background-color:#2BB8FF;
	color:#FFFFFF;
	display:block;
	font-size:12px;
	font-weight:bold;
	height:14px;
	line-height:15px;
	padding:0 2px 2px;
	width:161px;	
}

body.shop table.productSmall .release-date { display: none; }


table.productSmall td img {
	width: 140px;
}

table.productSmall td ul {
	
}

table.productSmall td ul li {
	bottom:26px;
	left:43px;
	margin:8px 0;
	position:absolute;
}

table.productSmall td .quantity {
	bottom:5px;
	float:left;
	padding:4px 0 0;
	position:absolute;
	width:80px;
}

table.productSmall td .quantity input.productTextInput {
	width: 20px;
}
	
table.productSmall td .add {
	bottom:2px;
	float:right;
	position:absolute;
	right:1px;
	width:80px;
}

table.productSmall td .add input.productSubmitInput {
	background-color:#2BB8FF;
	border:medium none;
	color:#FFFFFF;
	display:block;
	font-size:14px;
	font-weight:bold;
	height:26px;
	margin:0 2px 2px 1px;
	width:76px;
	cursor: pointer;
}

table.productSmall td .add input.productSubmitInput:hover {
	background-color: #FF744F;}

table.productSmall .small-image {
	height: 134px;
	overflow: hidden;	
}

table.productSmall .small-image img {
	margin: 5px 0 0 0;
}

table.productLarge {
	margin: 10px 0 30px;
	border: 1px dashed #c4f0ff;
}

table.productLarge td img { 
	float:left;
	width: 200px;
	margin:0 20px 0 0;
}

table.productLarge td h2 {
	font-size: 18px;
}

table.productLarge td ul li {
	float: left;
}

body.shop table.productLarge .product-image span.watermark {
	display: none;	
}

body.shop-photos table.productLarge td img  {
	width: 300px;
}

body.shop-photos table.productLarge .product-image {
	position: relative;
	width: 300px;
	display: block;
	margin: 0 25px 0 0;
}

body.shop-photos table.productLarge .product-image span.watermark {
	display: block;
	background: url(../images/onlineshop/photos/watermark.png) top left repeat;
	position: relative;
	top: 0px; left: 0px;
	width: auto;
}

.product-price {
	color:#2BB8FF;
	float:left;
	font-size:18px;
	margin: 8px 0 0 15px;
}

table.productLarge td .product-quantity {
	float: left;
	margin:10px 0 0;
}

table.productLarge td .product-quantity input.productTextInput {
	width: 20px;
}

table.productLarge td .add {
	
}

table.productLarge td .add input {
	background:transparent url(/images/site/button-trans.png) no-repeat scroll left top;
	border:medium none;
	color:#FFFFFF;
	cursor:pointer;
	display:block;
	font-size:11px;
	font-weight:bold;
	height:36px;
	margin:10px 0 0;
	padding:0 0 6px 9px;
	text-transform:uppercase;
	width:133px;
}

table.productLarge td .add input:hover {
	background-position: 0px -37px;
}
							
table.productLarge td .size {
	margin: 20px 0 0 0;	
	display: block;
}

.size .catProdAttributeTitle {
	float: left;
	width: 38px;
	}
table.productLarge td .size .catProdAttributeItem {
	float: left;
}

table.productLarge td .size .catProdAttributeItem select {
	padding:1px;
	width:70px;
}





table.shoppingcart {
	width: 100%;
	border:1px solid #EDEDED;
}

table.shoppingcart tr.product {
	background-color:#ededed;

}

table.shoppingcart th {
	padding: 10px;
	font-weight: bold;
}

table.shoppingcart td {
	padding: 10px;
}



.shop-stage1 {
	background: url(/images/site/shop-stage1.jpg) top left no-repeat;
	width: 638px;
	height: 26px;
	display: block;
	margin:0 0 20px;
}

.shop-stage2 {
	background: url(/images/site/shop-stage2.jpg) top left no-repeat;
	width: 638px;
	height: 26px;
	display: block;
	margin:0 0 20px;
}

.shop-stage2 a {
	display: block;
	float: left;
	width: 200px;
	height: 23px;
}

.shop-stage3 {
	background: url(/images/site/shop-stage3.jpg) top left no-repeat;
	width: 638px;
	height: 26px;
	display: block;
	margin:0 0 20px;
	text-align: center;
}


ul.css-policy li {
	border-top:1px solid #EDEDED;
	margin:5px 0;
	padding:5px 20px;
}


table.hire-price {
	border: 1px #CCC solid;
	margin: 0px 0 20px 0;
}

table.hire-price td {
	padding:4px 0 4px 10px;
}

/* SOCIAL MEDIA */

#header .social-holder {
	height:50px;
	left:504px;
	position:absolute;
	top:13px;
	width:420px;
}

.social-holder img {
	float:left;
	margin: 0 20px 0 0;
}

a.facebook {
	background: url(../images/site/facebook-twitter.png) 0px 0px no-repeat;
	width: 132px; height: 39px;
	display:block;
	margin: 0 0 0 5px;
	float:left;
}

a:hover.facebook { background-position: 0px -41px; }

a.twitter {
	background: url(../images/site/facebook-twitter.png) -136px 0px no-repeat;
	width: 124px; height: 41px;
	display:block;
	margin: 0 0 0 5px;
	float:left;
}

a:hover.twitter {
	background-position: -136px -41px;
}

/* Photo Gallery */

table.photogalleryTable {
	margin-bottom: 40px;
}

td.photogalleryItem a { 
	display:block;
	height:120px;
	padding:5px;
}

table.photogalleryTable td { padding: 0; }

td.photogalleryItem {
	border:1px dashed #2BB8FF;
	display:block;
	float:left;
	margin:0 20px 20px 0;
	padding:6px 0 0;
	text-align:center;
	width:130px
}

td.photogalleryItem p {
	background-color:#2BB8FF;
	color:#FFFFFF;
	display:block;
	font-size:11px;
	height:19px;
	padding:0 0 0;
	width:130px;
	text-shadow: 0 0 2px #06F;
}

.shop #lightbox img {
}

/* CALCULATOR */

.orange { color: #F60; }
input.imageamount {	border: 1px solid #CCC; color: #CCC;}

.purchase-pics h2 {
	background:none repeat scroll 0 0 #2BB8FF;
	color:#FFFFFF;
	font:20px Arial,Helvetica,sans-serif;
	padding:9px 9px 6px;
	text-align:left;
	margin: 14px 0;
	text-shadow: 0 0 4px #09F
	}

.fine { font-size: 11px; }

.grey { color: #999; }

.fine.grey { font-weight: normal }

.addition-comments {
	margin: 145px 0 0;
	position:absolute;
	right:42px;
}

.addition-comments label { position: static; }

.addition-comments textarea.cat_listbox {
	height:200px;
	margin:0;
	width:220px;
}

input.imageamount, input.qty {
	margin: 2px 0 2px 230px;
	width: 120px;
}

.image-no pre {
	font-family: helvetica, arial;
	font-size: 12px;
	line-height: 15px;
}


table.addup {
	font: normal 12px Arial, Helvetica, sans-serif;

}

table.addup th {
	border-bottom: 1px solid #CCC;
	padding: 10px 0;
	color: #999;
}

td.post, td#postage {
	border-bottom: 1px solid #ccc;
	font-size: 12px;
	padding: 8px 2px;
}

table.webform td.details {
	padding: 5px 2px;
	border-bottom: 1px solid #ccc;
}

table.webform td.gt, table.webform td#grandTotal {
	font-size: 14px;
	padding: 10px 2px;
}

td.mini-grey {
	font-size: 12px;
	color: #CCC;
}


.side-panel {
	padding: 100px 0 0 0;
}

.blog .right-sidecol .news a {
	width: auto;
	height: auto;
}

.BlogRecentPost li, .BlogTagList li, .BlogPostArchive li {
	margin: 0 0 5px;
}
/**Colours 
blue: #2BB8FF
orange: #FF744F
grey: #666666

**/