/* CSS Document */

/* First, zero out everything */

         body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
         table{border-collapse:collapse;border-spacing:0;}
         fieldset,img{border:0;}
         address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
         li{list-style:none;}
         caption,th{text-align:left;}
         h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
         q:before,q:after{content:'';}
         abbr,acronym {border:0;font-variant:normal;}
         /* to preserve line-height and selector appearance */
         sup {vertical-align:text-top;}
         sub {vertical-align:text-bottom;}
         input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit; color:#000;}
         /*to enable resizing for IE*/
         /*because legend doesn't inherit in IE */
         legend{color:#000;}
         del,ins{text-decoration:none;}
         select {margin:0px;padding:0px;}

/* Then style on a clean slate */

	div {
		border:none;
	}


	body {
			background-color:#e4c896;
			margin: 0px;
			padding:0px;
			text-align:center;
			font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
			font-size: 12px;
			background-image:url(images/background_sand.jpg);
			background-repeat:repeat;
			behavior:url("csshover.htc");  /* this is for IE 6 to do hover menus */
	}
	
   strong, em, b, i, h1, h2, h3 {
			font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
			font-weight: bold;
	}


/* wrapper - site is 1033 wide */

	#wrapper {
		width: 1033px;
		height: 700px;
		margin: 0px auto 0px auto;  /* this centers it horizontally */
		text-align: left;
}
	#col_one {
		float:left;
		width:198px;
		height:700px;
		margin:0;
		padding:0;
		background-image:url(images/surfboard.jpg);
		background-repeat:no-repeat;
		text-align:center;
		display:inline;
}		
	#rightwrapper {
		float:right;
		display:inline;
		width: 835px;
		height: 588px;
		padding:0;
		margin:0;
}
	#right_onecol {
	float:left;
	width: 521px;
	height:588px;
	display: inline;
	text-align:left;
}		
	#logo {
		float:left;
		width:521px;
		height:140px;
		margin:0;
		padding:0;
		display:inline;
		background-image:url(images/rowtwo_top.jpg);
		background-repeat:no-repeat;
}
	#flasharea {
		float:left;
		width: 521px;
		height:448px;
		margin:0;
		padding:0;
		display:inline;
		background-image:url(images/flash_area.jpg);
		background-repeat:no-repeat;
}	


	#right_twocol {
		display:inline;
		width:314px;
		height:588px;
}			
	#righttop{
		float:right;
		width:314px;
		height:140px;
		padding: 0;
		margin-top: 0;
		background-image:url(images/toptree.jpg);
		background-repeat:no-repeat;		
}
	#contenthome {
		float:right;
		width:314px;
		height:448px;
		padding:0;
		background-image:url(images/content_home.jpg);
		background-repeat:no-repeat;
}		
	#hometext {
		float:left;
		display:inline;
		width:220px;
		height:240px;
		margin-top:35px;
		margin-left:30px;
		padding:0;
		font-family:Arial, Helvetica, sans-serif;
		font-size:13px;
		color:#284e97;
		text-align:left;
		overflow-y: auto;
}

	#barcam {
		float:left;
		display:inline;
		width:185px;
		height:81px;
		padding:0;
		margin-left:64px;
		background-image:url(images/bar_cam.gif);
		background-repeat:no-repeat;
}		


		
	#rightbottom {
		float:left;
		width: 835px;
		height: 86px;
		position:relative;
		background-image:url(images/right_bottom.jpg);
		background-repeat:no-repeat;
}



	#bottomnav {
		float:left;
		width:350px;
		height:50px;
		position:relative;
		left:240px;
		top:20px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:11px;
		color:#6e4a3a;
		text-align:center;
		text-decoration:none;

}
	#bottomnav a {
		font-family:Arial, Helvetica, sans-serif;
		font-size:11px;
		color:#6e4a3a;
		text-align:center;
		text-decoration:none;
}		
	#bottomnav a:link {
		color:#6e4a3a;
		text-decoration:none;
}		
	#bottomnav a:active {
		color:#6e4a3a;
		text-decoration:none;
}	
	#bottomnav a:visited {
		color:#6e4a3a;
		text-decoration:none;
}			
	#bottomnav a:hover {
		color:#fe6421;
		text-align:center;
		text-decoration:none;
}


	#copyright {
		float:left;
		position:relative;
		top:20px;
		width: 835px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:10px;
		color:#6e4a3a;
		text-align:center;
		text-decoration:none;
}		
	#copyright a {
		font-family:Arial, Helvetica, sans-serif;
		font-size:10px;
		color:#6e4a3a;
		text-align:right;
		text-decoration:none;
}
	#copyright a:link {
		color:#6e4a3a;
		text-decoration:none;
}
	#copyright a:active {
		color:#6e4a3a;
		text-decoration:none;
}
	#copyright a:visited {
		color:#6e4a3a;
		text-decoration:none;
}
	#copyright a:hover {
		color:#fe6421;
		text-decoration:none;
}



	#menuwrapper {
		float:left;
		width: 140px;
		height: 230px;
		display: inline;
		margin-top: 360px;
		margin-left:50px;
		padding:0px;
		color: #fff;
		z-index: 7;
	}
	
	#menuwrapper ul li {
		margin: 0px;
		padding: 0px;
		float: left;
		position: relative;
		min-height: 1%;
		z-index: 7;
		text-align:center;
		width: 100%;
		text-align:center;
		text-transform: uppercase;
}

	#menuwrapper ul { /* all lists */
		padding: 0;
		margin: 0;
		list-style: none;
		font-size: 18px;
		min-height: 1%;
		margin-left: 30px;
		text-align:center;
}

	#menuwrapper ul li.activetab a {
		padding: 0;
		background-color:#00418b;
		color: #fff;
		text-decoration: none;
		margin: 0px;
		display: block;
		min-height: 1%;	
		margin-bottom: 12px;
}


	#menuwrapper ul li a {
		padding: 0;
		color: #fff;
		text-decoration: none;
		margin: 0px;
		display: block;
		min-height: 1%;
		text-align:center;
		margin-bottom: 12px;

}

	#menuwrapper ul li a:hover {
		padding: 0;
		color: #333;
		text-decoration: none;
		margin: 0px;
		display: block;
		min-height: 1%;
		margin-bottom: 12px;
}

	#menuwrapper li { /* all list items */
		float: left;
		position: relative;
		text-align:center;
		min-height: 1%;
		width: 100%;
}

	#menuwrapper li ul { /* second-level lists */
		display: none;
		position: relative;
		left: 0;
		margin-left: 0px;
		padding-left: 0px;
		width: 100px;
		text-align: left;
		min-height: 1%;
		z-index: 10;
		font-size:12px;
}

	#menuwrapper li:hover ul, li.over ul { /* lists nested under hovered list items */
		display: block;
		position: absolute;
		left: 0;
		margin-left: 0px;
		padding-left: 0px;
		width: 100px;
		text-align: left;
		min-height: 1%;
}

	#menuwrapper li ul li {
		text-align: left;
		width: 100px;
		padding: 0;
		margin: 0;
		min-height: 1%;
		border: 0px;
}

	#menuwrapper li ul li a {
		text-decoration: none;
		position:relative;
		display:block;
		float:left; 
		padding: 0;
		color: #fff;
		width: 120px;
		border-color:#cd6432;
		border-style:solid;
		border-width:1px;
		min-height: 1%;
}

	#menuwrapper li ul li a:hover {
		text-decoration: none;
		position:relative;
		display:block; 
		float:left;
		padding: 0;
		color: #333333;
		width: 120px;
		min-height: 1%;
	}
	
	
/*  Non-Scrolling Interior  */

.mainarea {
	float:left;
	width: 471px;
	height:393px;
	display:inline;
	background-image:url(images/mainarea.jpg);
	background-repeat:no-repeat;
	padding:45px 0px 10px 55px;
	color:#2a347a;
}	

.mainarea a:link{
	color:#2a347a;
}

.mainarea a:visited{
	color:#2a347a;
}

.mainarea a:hover{
	text-decoration:none;
}

.mainarea a:active{
	text-decoration:none;
}

	.mainarea h1 {
		color: #027137;
		font-size: 24px;
		text-transform: uppercase;
		font-weight:900;
		font-family:verdana,arial,helvetica,sans-serif;
		margin-bottom: 10px;
	}
	
	.mainarea h2 {
		color:#2a347a;
		font-size: 16px;
		font-weight:900;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	
	mainarea p {
		font-size: 11px;
	}

#sidecontent {
	float:right;
	width:314px;
	height:448px;
	padding:0;
	background-image:url(images/content_home.jpg);
	background-repeat:no-repeat;
}

/*  Menu Page  */
#photoarea {
	float:left;
	width: 521px;
	height:448px;
	margin:0px;
	padding:0px;
	display:inline;
}	

#menu_nav {
	float:left;
	width:217px;
	height:361px;
	display:inline;
	position:relative;
	left:20px;
	top:15px;
}


/*  Contact Page  */

#contacthead {
	width:212px;
	height:21px;
	background:url(images/ContactUs.gif) no-repeat;
	text-indent:-9999px;
	margin-bottom:10px;
}
	
.address_title {
	font-size:14px;
	text-transform:uppercase;
	margin-left:5px;
}

.address {
	font-size:12px;
	margin-left:5px;
}

.contact_h2{
	font-size:16px;
	font-weight:bold;
	margin:12px 0px 8px 5px;
}

.contact_bot{
	margin:0px 35px 5px 5px;
	font-size:11px;
}

.form_tabhandler{
	height:23px;
	width:188px;
	display:inline;
	text-align:center;
	color:#fff;
	font-weight:bold;
}

.form_tabhandler a:link{
	color:#fff;
	text-decoration:none;
	}
	
.form_tabhandler a:visited{
	color:#fff;
	text-decoration:none;
	}
	
.form_tabhandler a:hover{
	color:#2a347a;
	}

.form_tabhandler a:active{
	color:#2a347a;
	}

.feedbutton{
	height:20px;
	width:84px;
	background:url(images/form_feedbutton.gif) no-repeat;
	float:left;
	padding-top:3px;
	margin-top:35px;
	text-align:center;
}

.reservebutton{
	height:20px;
	width:104px;
	background:url(images/form_reservebutton.gif) no-repeat;
	float:left;
	padding-top:3px;
	margin-top:35px;
	text-align:center;
}

.form_feedback{
	width:251px;
	height:302px;
	background:url(images/form_feedbox.gif) no-repeat;
	padding:10px 5px 5px 10px;
	margin-top:58px;
	color:#2a347a;
	line-height:13px;
}

.form_reserve{
	width:251px;
	height:302px;
	background:url(images/form_reservebox.gif) no-repeat;
	padding:5px 5px 5px 7px;
	margin-top:58px;
	color:#2a347a;
	line-height:13px;
}

.submit_btn{
	margin-right:10px;
	}
	
p.response {
	width: 150px;
	height: auto;
	border: 1px solid #027137;
	background-color: #ffcc99;
	margin-top: 20px;
	padding: 20px;
}