@charset "UTF-8";
body  {
	font: 10px Arial, Helvetica, sans-serif;
	background: #83AED9 url(../images/bg_body.png) left top;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000000;
}

a { color: #004d84; }
a:link {}
a:visited{}
a:hover { color: #000033; }
a:active {}

a img {}

#wrapper { 
	width: 800px; 
	margin: 0 auto;
	padding: 0;
	background: url(../images/bg_container.png) repeat-y top center;
}
#container {
	font-size: 1.0em;
	width: 780px;
	text-align: left;
	padding: 0px 10px 10px 10px;
	background: url(../images/bg_flourish.jpg) no-repeat 380px top;
} 

#main {
	margin: 0;
	padding: 20px 30px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	width: 720px;
	background: url(../images/photo_sm_hoonanea-window.jpg) no-repeat 490px 5px;
	}

	.home #main { background-image: url(../images/photo_sm_deck-view.jpg); }
	.accommodations #main { background-image: url(../images/photo_sm_jacuzzi.jpg); }
	.reservations #main { background-image: url(../images/photo_sm_hoonanea-window.jpg); }
	.tour #main { background-image: url(../images/photo_sm_plumeria.jpg); }
	.upper #main { background-image: url(../images/photo_sm_upper-unit.jpg); }
	.lower #main { background-image: url(../images/photo_sm_lower-unit.jpg); }
	.comments #main { background-image: url(../images/photo_sm_pink-flower.jpg); }
	.activities #main { background-image: url(../images/photo_sm_pool.jpg); }


#content {
	float: left;
	padding-right: 30px;
	width: 430px;
	background: url(../images/img_dolphins.jpg) no-repeat 220px 0px;
	}
	
	.home #content { background-image: none; }

	#content h1.tagline {
		color: #666666;
		font: italic normal 1.8em/150% "Times New Roman", Times, serif;
		padding-left: 10px;
		width: 420px;
		}

	#content h2 {
		color: #004d84;
		font: italic normal 3.0em/150% "Times New Roman", Times, serif;
		margin: 0.5em 0;
		}
		
	#content h3 {
		color: #454545;
		font: italic normal 1.8em/150% "Times New Roman", Times, serif;
		}
		
		#content h3 a {
			color: #4591c7;
			padding-left: 24px;
			font-style: normal;
			background: url(../images/img_link-flourish.gif) no-repeat 3px center;
			}

	#content p {
		padding: 0 10px;
		text-align: justify;
		}

	#content p,
	#content ul {
		color: #505050;
		font-size: 1.2em;
		line-height: 1.6em;
		}
		
		#content li {
			padding: 0.25em 0;
			}

	#content div.photo { text-align: center; }

#header { 
	padding: 0;
	} 

	#header h1 {
		margin: 0;
		padding: 0;
		}

		#header h1 img { 
			border-width: 0px; 
			}

#sidebar {
	float: left;
	width: 260px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	/*padding: 15px 10px;*/
	margin-top: 80px;
	}
	
	#sidebar #address {
		text-align: center;
		color: #666666;
		font: 1.4em "Times New Roman", Times, serif;
		background: url(../images/bg_flourish-small.jpg) no-repeat right center;
		}

	#sidebar #extras {
		text-align: center;
		}
		
		#sidebar #extras .floorplan { 
			padding: 4px;
			border: 1px solid #cccccc;
			}

#navigation { 
	background: url(../images/img_nav-top.gif) no-repeat top center; 
	}

	#navigation ul { 
		width: 220px; 
		background: url(../images/img_nav-bottom.gif) no-repeat bottom center; 
		margin: 0px auto;
		padding: 25px 20px 15px;
		}

		#navigation ul li { 
			border-top: 1px solid #b0d3f9; 
			background-color: #d4e8fc; 
			list-style: none;
			text-align: center;
			padding: 6px 0;
			}

			/* this overrides the border separating the nav links */
			#navigation ul li#nav_home { border-top-width: 0px; }

	#navigation a { 
		font-family: Georgia, "Times New Roman", Times, serif;
		color: #4591c7;
		text-decoration: none;
		text-transform: uppercase; 
		font-size: 1.8em;
		}

		#navigation a:link {}
		#navigation a:visited {}
		#navigation a:hover { color: #004d84; text-transform: underline; }
		#navigation a:active { color: #000000; }
	
#nav_home a {}
#nav_accommodations a {}
#nav_tour a {}
#nav_reservations a {}
#nav_comments a {}
#nav_activities a {}
 
.home #nav_home a,
.accommodations #nav_accommodations a,
.tour #nav_tour a,
.reservations #nav_reservations a,
.comments #nav_comments a,
.activities #nav_activities a { color: #004d84; text-decoration: underline; } 
 
#footer {
	margin: 15px 0px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	padding: 5px;
	text-align: center;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	background-color: #E6E6E6;
	color: #666666;
	background-image: url(../images/bg_footer.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
	} 

	#footer p {
		margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
		padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
		font-size: 1.0em;
		line-height: 1.5em;
		}

#credit { text-align: center; }
	#credit p { color: #888888; margin: 0px; }
	#credit a { color: #666666; }

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

#googleMap { width: 410px; height: 270px; background-color: #eeeeee; border: 1px solid #cccccc; margin: 10px; }

/* -- Photo Gallery Styles -- */

#photobox { text-align: center; }
#photo_main { background: url(../images/loading.gif) no-repeat center center; }
#big_photo {
	padding: 9px;
	border: 1px solid #B0D3F9;
	margin: 5px auto 0 auto;
}
#photo_caption { font: 1.4em "Times New Roman", Times, serif; padding-bottom: 1.0em; color: #666666; }

#photo_thumbs {}
#photo_thumbs ul { text-align: center; list-style: none; padding: 0px; }
#photo_thumbs li { width: 33%; float: left; text-align: center; padding: 0.5em 0; }
#photo_thumbs a img { border: 1px solid #B0D3F9; padding: 3px; }

/* -- Contact Form styles -- */
form fieldset {
	border-top: 1px solid #999999;
	padding: 0;
	margin-bottom: 10px; 
	border-right: none;
	border-bottom: none;
	border-left: none;
	clear: none;
	}

	form fieldset ul {
		margin-left: 10px;
		margin-right: 10px;
		padding-left: 0px;
		border-top: 1px dotted #CCCCCC;
		}
		
		form fieldset input {
			width: 215px;
			border: 1px solid #888888;
			background-color: #eeeeee;
			}
		
		form fieldset ul.radio input {
			width: auto;
			}

	form fieldset ol {
		margin: 0;
		padding: 0;
		}

		form fieldset li {
			padding: 0;
			margin: 0;
			list-style: none;
			border-bottom: 1px dotted #CCCCCC;
			}

form legend {
	padding-left: 0px;
	margin-bottom: 0px;
	color: #4B4B4B;
	font-weight: bold;
	font-size: 1.4em;
	_margin: 0 -7px; /* IE Win */
	}

form label {
	display: inline-block;
	line-height: 1.8;
	vertical-align: top;
	width: 160px;
	}
	
	form ul.radio label {
		width: 130px;
		}
	
em.required {
	font-weight: bold;
	font-style: normal;
	color: #FF0000;
	}
	
/*\*//*/ form legend { display: inline-block; } /* IE Mac legend fix */

form textarea#comments {
	clear: both;
	margin: 10px;
	width: 400px;
	border: 1px solid #888888;
	background-color: #eeeeee;
	}

form button { margin-left: 10px; }

.form_error {
	border-top: 2px solid #CC0000;
	border-bottom: 2px solid #CC0000;
	background-color: #FFFFFF;
	padding: 5px;
	color: #CC0000;
	}

	#content .form_error p {
		color: #cc0000;
		}

	#content .form_error h3 {
		color: #CC0000;
		margin: 0;
		}