/*  
Site: surfbreak.org.nz
Version: 1.0
Author: Cory
Author URI: http://www.trunkmedia.co.nz

--** UPDATE INFO **--

Revision number: 1.0
Last updated: 15 Jan 2009
Last update made by: Cory

--** CONTENTS **--

-- 01: GENERAL
-- 02: HEADER
-- 03: CONTENT
-- 04: FOOTER

NOTE: Reset and Utils styles are contained in default.css

*/

/* -- 01:GENERAL ----------------------------------------------------------------------*/

BODY, LABEL, A, TD, TR, SPAN, P, CAPTION, H1, H2, H3, H4, H5, H6, FIELDSET, TBODY, TEXTAREA, INPUT, SELECT, LEGEND { font-family: Arial, Verdana, sans-serif; }

BODY{font-size: 0.70em;background-color:#ffffff;color:#333333;}

A, A:link, A:visited{color:#f26725;text-decoration: underline;}/*border-bottom:dotted 1px #2088b2;*/
A:hover, A:active{color: #333333;text-decoration: none}/*border-bottom:dotted 1px #8cc63f;;*/

A.arrow{background:Transparent url('images/greyarrow.gif') no-repeat 0px 5px;padding:0px 0px 0px 10px;}
A.blue, A.blue:visited{color:#63cdf6;}
A.blue:hover{color:#333333;}

H1, H2.main
{
    width:100%;
    font-family:Trebuchet MS, Arial, Verdana, Sans-Serif;
	font-size:1.6em;
	font-weight:normal;
	background:Transparent url('images/h1Back.gif') repeat-x bottom;
	padding-bottom:5px;
	color:#63cdf6;
	margin-bottom:20px;
	text-transform:none;
}

H2
{
    float:left;
    width:100%;
    height:23px;
    font-family:Trebuchet MS, Arial, Verdana, Sans-Serif;
	font-size:1.2em;
	font-weight:bold;
	text-transform:uppercase;
	background-image:url('images/h2Back.gif');
	overflow:hidden;
	color:#ffffff;
	background-position:bottom right;
    
}
H2.left{background-position:bottom left;}
H2 A, H2 A:link, H2 A:visited{text-decoration:none;color:#ffffff;}
H2 A, H2 SPAN{padding:3px 0px 0px 20px;display:block;} 

H3
{
    float:left;
    width:100%;
    font-size:1.1em;
    margin-bottom:10px;
    
}
H3 A, H3 A:link, H3 A:visited{text-decoration:underline;color:#333333;}
H3 A:hover{text-decoration:none;}
H3.bars
{
    background:Transparent url('images/h1Back.gif') repeat-x bottom;
    padding-bottom:5px;
    
}
H3.greyback
{
    font-size:1.0em;
    color:#ffffff;
    font-weight:bold;
    background:Transparent url('images/h3Back.gif') repeat-x bottom; 
    padding:4px 0px 5px 0px; 
}
H3.greyback SPAN, H3.greyback A{padding:0px 0px 0px 10px;}
H3.greyback A, H3.greyback A:link, H3.greyback A:visited{text-decoration:none;color:#ffffff;display:block;}

H4
{
    float:left;
    width:100%;
    font-size:1.1em;
    margin-bottom:10px;
    background:Transparent url('images/dots.gif') repeat-x bottom; 
    padding-bottom:3px; 
}
H5
{
    font-size:1.0em;
    margin:0;
}

.w270{width:270px;}
.w290{width:290px;}
.w242{width:242px;}
.w250{width:250px;}
.w260{width:260px;}
.w310{width:310px;}
.w320{width:320px;}
.w535{width:535px;}
.w625{width:625px;}
.w620{width:620px;}
.w940{width:940px;}

div#mainContain
{
    background:Transparent url('images/mainBack.gif') no-repeat;
    width:1000px;
    margin:5px auto 0px auto;
}

div.contentBox
{
    float:left;
    width:100%;
    background:#ffffff url('images/contentback.gif') repeat-x bottom;
}
div.contentBox div.content{padding:10px 20px 0px 20px;}
div.contentBox div.wavebot
{
    margin-top:10px;
    float:left;
    width:100%;
    height:25px;
    background:Transparent url('images/wavebot.gif') no-repeat bottom right;
}

div.dots{
    float:left;
    width:100%;
    background:Transparent url('images/dots.gif') repeat-x;
}

/*--image borders--*/
div.image, div.imageright, div.imagefull{background-color:#ffffff;padding:5px;border:solid 1px #e5e5e5;margin-top:10px;}
div.image{float:left;}
div.imageright{float:right;margin-left:5px;}
div.imagefull{float:left;position:relative;left:100px;}

p.caption, p.captionfull{font-size:0.9em;font-style:italic;color:#999999;float:right; padding:0 6px 0 0px;}
p.captionfull{position:relative;left:100px;}

/*--subnav--*/
div.subnav-contain{float:left;width:250px;}
ul#subnav{width:230px;list-style-type:none;float:left;margin-right:20px;margin-top:10px;}
ul#subnav LI{width:230px;float:left;background:Transparent url('images/dots.gif') repeat-x bottom;}
ul#subnav LI A
{
    background:Transparent url("images/bluelistarrow.gif") no-repeat 10px 10px;
    display:block;
    color:#333333;
    padding:10px 0px 15px 35px;
    text-decoration:none;
}
ul#subnav LI A:HOVER
{
    background:Transparent url("images/greylistarrow.gif") no-repeat 10px 10px;
    background-color:#ecf6fb;
}
ul#subnav LI.selected A
{
    background:Transparent url("images/greylistarrow.gif") no-repeat 10px 10px;
    background-color:#ecf6fb;
    text-decoration:none;
}
ul#subnav LI A SPAN{color:#cccccc;margin-left:5px;}

/*--content areas--*/
div#centreContent
{
    float:left;
    width:630px;
    padding-top:10px;
    padding-left:0px;
    background:Transparent url("/images/navsplit.gif") no-repeat left top;
}

ul.photos
{
    list-style-type:none;
    float:left;
    width:160px;
    margin-bottom:20px;
}
ul.photos LI{float:left;margin-right:5px;margin-bottom:5px;}
ul.photos LI.last{margin-right:0px;}
ul.photos LI.one{clear:left;}
ul.photos LI A{float:left;background-color:#ffffff;padding:4px;border:solid 1px #e5e5e5;}

P.summary{font-weight:bold;}

ul.two-col{float:left;list-style-type:none;}
ul.two-col LI{
    float:left;
    width:310px;
    margin-right:10px;
    padding-bottom:10px;
    border-bottom:solid 1px #e5e5e5;
}
ul.two-col LI.last{margin-right:0px;}

ul.three-col{float:left;list-style-type:none;}
ul.three-col LI{
    float:left;
    width:200px;
    margin-right:15px;
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom:solid 1px #e5e5e5;
}
ul.three-col LI.last{margin-right:0px;}
ul.three-col LI.one{clear:left;}

/* -- 02:HEADER ----------------------------------------------------------------------*/
div#header
{
    width:960px;
    height:200px;/*255px*/
    margin-left:20px;
    background-repeat:no-repeat;
}

div#header div#logo{
    width:348px;
    height:116px;
    position:relative;
    top:65px;/*120px*/
    left:20px;
}
div#header div#wave
{
    width:74px;
    height:51px;
    position:relative;
    top:35px;/*90px*/
    left:886px;
}

/*--navigation--*/
div#nav{
    width:960px;
    height:45px;
    margin-left:20px;
    background:Transparent url('images/navBack.gif') no-repeat;
}

div#nav ul {
	padding-top:15px;
	list-style:none;
	font-family:Trebuchet MS, Arial, Verdana, Sans-Serif;
	font-size:1.2em;
	width:700px;
	margin-left:auto;
	margin-right:auto;
}
div#nav li {display:inline;margin:0;padding:0;}
div#nav a {
	float:left;
	padding:0 0 0 6px;
	text-decoration:none;
	color:#ffffff;
	font-weight:bold;
	cursor:pointer;
	text-transform:uppercase;
}
div#nav a span {float:left;display:block;padding:6px 12px 6px 6px;}
div#nav .selected a,
div#nav .selected a span{color:#666666;}
div#nav .selected a {background:Transparent url("images/navItemBack.gif") no-repeat left top;}
div#nav .selected a span {background:#666666 url("images/navItemBack.gif") no-repeat right top;}

/* -- 03:CONTENT ----------------------------------------------------------------------*/
div#contentLand
{
    float:left;
    width:940px;
    position:relative;
    left:20px;
    padding:20px 10px 0px 10px;
}

/*--home--*/
p.mission
{
    float:left;
    width:370px;
    font-family:Trebuchet MS, Arial, Verdana, Sans-Serif;
	font-size:1.3em;
	font-style:italic;
	font-weight:bold;
	line-height:1.4em;
}

ul.about-links{margin-top:130px;width:200px;float:left;list-style-type:none;}
ul.about-links LI{width:200px;float:left;margin-bottom:10px;}
ul.about-links LI A{float:right;}

ul.latest-news{width:270px;float:left;list-style-type:none;}
ul.latest-news LI{
    width:245px;
    float:left;
    margin-bottom:10px;
    background:Transparent url("images/bluelistarrow.gif") no-repeat left top;
    padding-left:25px;
}
ul.latest-news LI SPAN{font-weight:bold;}

div#joinusgreen{float:left;width:189px;height:189px;position:relative;margin-top:-260px;left:390px;}
div#joinusred{float:left;width:107px;height:102px;position:relative;margin-top:-500px;left:0px;}

ul.home-photos
{
    list-style-type:none;
    float:left;
    width:270px;
    margin-bottom:20px;
}
ul.home-photos LI{float:left;margin-right:5px;margin-bottom:5px;}
ul.home-photos LI.last{margin-right:0px;}
ul.home-photos LI.one{clear:left;}
ul.home-photos LI A{float:left;background-color:#ffffff;padding:4px;border:solid 1px #e5e5e5;}

/*--news--*/
ul#latest-articles{
    width:630px;
    list-style-type:none;
    float:left;
}
ul#latest-articles LI{
    float:left;
    padding-bottom:10px;
    margin-bottom:20px;
    background:Transparent url('images/dots.gif') repeat-x bottom;
}
ul#latest-articles LI div.listcontent
{
    float:left;
    margin-top:5px;
}
ul#latest-articles LI div.listcontent a.heading
{
    color:#4b4b4b;
    float:left;
    font-weight:bold;
}
ul#latest-articles LI div.listcontent a.heading:hover{color:#333333;}
ul#latest-articles LI div.listcontent span.date
{
    float:right;
    background:Transparent url("images/dateicon.gif") no-repeat left top;
    padding-left:20px;
    padding-bottom:2px;
    color:#999999;
}

ul#recent-articles
{
    float:left;
    width:630px;
    list-style-type:none;
}
ul#recent-articles LI
{
    float:left;
    width:295px;
    margin-right:10px;
    margin-bottom:2px;
    background:Transparent url('images/greyarrow.gif') no-repeat left 5px;
    padding:0px 0px 0px 10px;
}
ul#recent-articles LI SPAN{font-weight:bold;}
ul#recent-articles LI A{color:#4b4b4b;}
ul#recent-articles LI A:hover{color:#333333;}

/*--article--*/
div#article-col{
    float:left;
    width:430px;
    padding-right:20px;
    background:Transparent url("images/navsplit.gif") no-repeat right top;
}
/*div#article-col A{color:#63cdf6;}div#article-col A:hover{color:#333333;}*/
div#article-col span.date
{
    float:right;
    background:Transparent url("images/dateicon.gif") no-repeat left top;
    padding-left:20px;
    padding-bottom:2px;
    color:#999999;
}
div#article-col div.postedby{float:right;color:#999999;}

div#docs-col{margin-left:20px;float:left;width:160px;}
ul.documents{float:left;width:160px; list-style-type:none;margin-bottom:20px;}
ul.documents LI
{
    width:135px;
    float:left;
    background:Transparent url("images/pdf_icon.gif") no-repeat left top;
    padding-left:25px; 
    padding-bottom:2px;   
    margin-bottom:10px;
}
ul.documents LI A, ul.documents LI A:visited, ul.documents LI A:hover{color:#333333;}

/*--people--*/
ul.people
{
    list-style-type:none;
    float:left;
}
ul.people LI{float:left;margin-bottom:10px;margin-right:10px;opacity:0.6;filter: alpha(opacity = 60);}
ul.people LI.selected{opacity:1.0;filter: alpha(opacity = 100);}
ul.people LI A{float:left;background-color:#ffffff;padding:4px;border:solid 1px #e5e5e5;}
ul.people LI.selected A{border:solid 1px #63cdf6;}

/*--campaign--*/
ul#old-campaigns
{
    float:left;
    width:250px;
    list-style-type:none;
    margin-bottom:20px;
}
ul#old-campaigns LI
{
    float:left;
    width:240px;
    margin-bottom:10px;
    background:Transparent url('images/greyarrow.gif') no-repeat left 5px;
    padding:0px 0px 0px 10px;
}
ul#old-campaigns LI SPAN{font-weight:bold;}
ul#old-campaigns LI A{color:#333333;}
ul#old-campaigns LI A:hover{color:#63cdf6;}

ul#related-news
{
    float:left;
    width:150px;
    list-style-type:none;
    margin-bottom:20px;
}
ul#related-news LI
{
    float:left;
    width:150px;
    margin-bottom:10px;
    background:Transparent url('images/greyarrow.gif') no-repeat left 5px;
    padding:0px 0px 0px 10px;
}
ul#related-news LI SPAN{font-weight:bold;}
ul#related-news LI A{color:#63cdf6;}
ul#related-news LI A:hover{color:#333333;}

/*--gallery--*/
ul.latest-images{float:left;list-style-type:none;width:630px;margin-bottom:10px;}
ul.latest-images LI{float:left;width:188px;background-color:#ffffff;padding:5px;border:solid 1px #e5e5e5;margin-right:15px;margin-bottom:10px;}
ul.latest-images LI.last{margin-right:0px;}

ul.recent-images{float:left;list-style-type:none;width:630px;margin-bottom:10px;}
ul.recent-images LI{float:left;margin-bottom:10px;margin-right:3px;display:inline;}
ul.recent-images LI A{float:left;background-color:#ffffff;padding:4px;border:solid 1px #e5e5e5;}
ul.recent-images LI.last{margin-right:0px;}
ul.recent-images LI.one{clear:left;}

/*--contact us--*/
div#contact-details
{
    float:left;
    width:430px;
    padding-top:10px;
    margin-right:20px;
}
div#contact-details UL
{
    float:left;
    width:430px;
    list-style-type:none;
}
div#contact-details UL LI
{
    float:left;
    width:430px;
    margin-bottom:10px;
}

div#enquiry-form
{
    float:left;
    width:430px;
    padding-top:10px;
    padding-left:20px;
    background:Transparent url("images/navsplit.gif") no-repeat left top;
}

div#enquiry-form FIELDSET{width:430px;float:left;border:none;}
div#enquiry-form LABEL{font-weight:bold;float:left;width:210px;}
div#enquiry-form INPUT, div#enquiry-form TEXTAREA{float:left;width:210px;}
div#enquiry-form TEXTAREA{height:100px;}
div#enquiry-form INPUT.image{width:auto;position:relative;left:360px;margin-top:5px;}

/*--links--*/
ul#links{
    width:900px;
    list-style-type:none;
    float:left;
}
ul#links LI
{
    width:440px;
    float:left;
    padding-bottom:10px;
    margin-bottom:20px;
    background:Transparent url('images/dots.gif') repeat-x bottom;
    margin-right:20px;
}
ul#links LI.last{margin-right:0px;}
ul#links LI div.listcontent
{
    float:left;
    width:255px;
    margin-top:5px;
}
ul#links LI div.listcontent a.heading
{
    color:#4b4b4b;
    float:left;
    font-weight:bold;
}
ul#links LI div.listcontent a.heading:hover{color:#333333;}
ul#links LI div.listcontent span.date
{
    float:right;
    background:Transparent url("images/dateicon.gif") no-repeat left top;
    padding-left:20px;
    padding-bottom:2px;
    color:#999999;
}

/* -- 04:FOOTER ----------------------------------------------------------------------*/
div#footer
{
    float:left;
    width:1000px;
    height:55px;
    background:Transparent url('images/footerBack.gif') no-repeat;
}

div#footer UL{list-style-type:none;float:left;position:relative;left:30px;margin-top:18px;}
div#footer UL LI{display:inline;float:left;margin-right:20px;}
div#footer UL LI A{color:#ffffff;text-decoration:none;}

div#footer div#copy{float:right;color:#ffffff;margin-top:18px;position:relative;right:30px;}

div#footer div#trunk{font-size:0.8em;color:#999999;float:left;width:1000px;text-align:center;margin-top:8px;}
div#footer div#trunk A{color:#999999;}

#facebook{position:absolute;outline:0;z-index:99;margin-left:885px;margin-top:13px;}
#fullContent .clear{padding:0px; margin:0px;}
ul#links LI div.listcontent p
{
    color:#333;
float:left;
}