/* --------------------------------------------------------------------------------
-																				-
-				Title: 			Hope Island Marina									-						-								-								-
-																				-
---------------------------------------------------------------------------------- */


/* ------------------------------------------------------------
		MAIN BODY OF WEBSITE
------------------------------------------------------------ */

		* {
			margin:0px;	padding:0px;
		}

/* ------------------------------------------------------------
		MAIN BODY OF WEBSITE
------------------------------------------------------------ */

		body {
			margin:0; padding:0; background-color: #112c58;
			color: #FFF; font-size: 11px; font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
			letter-spacing: .25pt; line-height: 16pt; font-weight: normal;
		}
		
/* ------------------------------------------------------------
		MAIN BODY OF WEBSITE
------------------------------------------------------------ */
		
		.Constraint
		{
			margin: 0 auto; width: 900px; border-left: solid 1px #2d6e8e; border-right: solid 1px #2d6e8e; border-bottom: solid 1px #2d6e8e;
		}
		
		#Foot .Constraint
		{
			border: none;
		}
		
		.Container#Head
		{
			height: 127px;
		}
		
		.Container#Body .Content
		{
			background-color: #003f81; 
		}

		.Container#Foot
		{
			padding-top: 10px; text-align:center; color: #2d6e8e;
		}
		
		.clear
		{
			clear: both;
		}
		
/* ------------------------------------------------------------
		GLOBAL HEADER
------------------------------------------------------------ */

		.header-logo
		{
			display:block;
		}	
		
		.splash
		{
			display:block;
		}		

		.nav
		{
			padding-left: 15px; background-color: #7aa3b7; height: 33px;
		}
		
		.main-content
		{
			background: url(../images/content-bg.jpg) no-repeat; padding: 50px 350px 0px 80px; height: 518px; position:relative;
		}
		
		#location.main-content
		{
			padding: 50px 420px 0px 80px;
		}
		
		#facilities.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#security.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#shopping.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#dining.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#other.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#links.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#boardwalk.main-content
		{
			padding: 50px 460px 0px 80px;
		}
		
		#berths-for-sale.main-content
		{
			background: url(../images/berths-bg.jpg) no-repeat;
		}
		
		#selling-your-berth.main-content
		{
			padding: 50px 410px 0px 80px;
		}
		
		#faq.main-content
		{
			background: url(../images/berths-bg.jpg) no-repeat;
		}
		
		.main-content p
		{
			line-height: 18px; margin: 10px 0; text-align:justify;
		}
		
		#security.main-content p,
		#shopping.main-content p,
		#links.main-content p,
		#dining.main-content p,
		#other.main-content p,
		#boardwalk.main-content p
		{
			padding-left: 10px;
		}
		
		#faq.main-content p
		{
			text-align:left; line-height: 15px;
		}
		
		.main-content a
		{
			color:#ffd800; text-decoration:none;
		}
		
		.main-content a:hover
		{
			color:#ffd800; text-decoration:underline;
		}
		
		.main-content ul
		{
			margin: 10px 0 10px 15px;
		}
		
		.main-content ul li
		{
			list-style-type: none;
			background: url(../images/bullet.jpg) no-repeat left;
			padding-left: 15px;
		}
		
		.sixpercent
		{
			position:absolute; top: 50px; left: 560px;
		}
		
		.location-map
		{
			position:absolute; top: 90px; left: 510px;
		}
		
		.download-pdf
		{
			position:absolute; top: 70px; left: 720px;
		}
		
		.click-dots
		{
			position:absolute; top: 70px; left: 490px; color:#ffd800;
		}
		
		.masterplan-text
		{
			position:absolute; top: 280px; left: 480px; color:#ffd800;
		}
		
		.facilities-map
		{
			position:absolute; top: 90px; left: 470px;
		}
		
		.more
		{
			position:absolute; bottom: 50px; left: 100px;
		}
		
		.faq-more
		{
			position:absolute; bottom: 55px; left: 595px;
		}
		
		.selling-your-berth
		{
			position:absolute; bottom: 150px; left: 80px;
		}
		
		.berths-image
		{
			position:absolute; top: 90px; left: 470px;
		}
		
		.faq-column-one
		{
			position:absolute; top: 74px; left: 80px; width: 225px;
		}
		
		.faq-column-two
		{
			position:absolute; top: 74px; left: 320px; width: 250px;
		}
		
		.faq-column-three
		{
			position:absolute; top: 74px; left: 600px; width: 225px;
		}
		
		.faq-column-four
		{
			position:absolute; top: 74px; left: 80px; width: 280px;
		}
		
		.faq-column-five
		{
			position:absolute; top: 74px; left: 400px; width: 250px;
		}
		
		.contact-column-one
		{
			position:absolute; top: 74px; left: 80px; width: 225px;
		}
		
		.contact-column-two
		{
			position:absolute; top: 74px; left: 320px; width: 250px;
		}
		
		.contact-column-three
		{
			position:absolute; top: 200px; left: 80px; width: 225px;
		}
		
		.contact-column-four
		{
			position:absolute; top: 200px; left: 320px; width: 225px;
		}
		
		.faq-link
		{
			position:absolute; top: 210px; left: 400px;
		}
		
		.content-images
		{
			margin: 10px 0 10px 0;
		}
		
		.content-images-facilities
		{
			margin: 10px 0 10px 10px;
		}
		
		.small-image
		{
			margin: 0 15px 0 0;
		}
		
		.small-image-facilities
		{
			margin: 0 15px 0 10px;
		}
		
		.heading h1
		{
			display:block;
			margin:0;
			overflow:hidden;
			padding:0;
			position:relative;
			text-indent:-999%;
		}
		
		.heading
		{
			padding-bottom: 8px;
		}
		
		#contact h1 
		{
			background:transparent url(../images/h1-contact-information.jpg) no-repeat scroll 0 0;
			width:219px;
			height:15px;
		}
		
		#berths h1 
		{
			background:transparent url(../images/h1-freehold-marina.jpg) no-repeat scroll 0 0;
			width:247px;
			height:16px;
		}
		
		#location h1 
		{
			background:transparent url(../images/h1-locations.jpg) no-repeat scroll 0 0;
			width:104px;
			height:16px;
		}
		
		#facilities h1 
		{
			background:transparent url(../images/h1-facilities.jpg) no-repeat scroll 0 0;
			width:91px;
			height:16px;
		}
		
		#security h1 
		{
			background:transparent url(../images/h1-security.jpg) no-repeat scroll 0 0;
			width:202px;
			height:29px;
		}
		
		#shopping h1 
		{
			background:transparent url(../images/h1-shopping.jpg) no-repeat scroll 0 0;
			width:332px;
			height:29px;
		}
		
		#dining h1 
		{
			background:transparent url(../images/h1-dining.jpg) no-repeat scroll 0 0;
			width:98px;
			height:29px;
		}
		
		#other h1 
		{
			background:transparent url(../images/h1-other.jpg) no-repeat scroll 0 0;
			width:94px;
			height:29px;
		}
		
		#links h1 
		{
			background:transparent url(../images/h1-links.jpg) no-repeat scroll 0 0;
			width:211px;
			height:29px;
		}
		
		#boardwalk h1 
		{
			background:transparent url(../images/h1-boardwalk.jpg) no-repeat scroll 0 0;
			width:264px;
			height:29px;
		}
		
		#berths-for-sale h1 
		{
			background:transparent url(../images/h1-berths-for-sale.jpg) no-repeat scroll 0 0;
			width:159px;
			height:16px;
		}
		
		#selling-your-berth h1 
		{
			background:transparent url(../images/h1-selling-your-berth.jpg) no-repeat scroll 0 0;
			width:192px;
			height:16px;
		}
		
		#faq h1 
		{
			background:transparent url(../images/h1-faq.jpg) no-repeat scroll 0 0;
			width:55px;
			height:16px;
		}
		
		#faq span 
		{
			color:#ffd800; font-weight:bold;
		}
		
		#facilities span 
		{
			text-transform:uppercase; padding-left: 15px;
		}
		
		
		/**
		 * Forms
		 */


		#main 
		{
			float: left; border: none; margin: 10px 0 25px 0;
		}
		
		#main legend
		{
			font-size: 16px; font-weight: bold; color: #96bc33;
		}
				
		#main h2 {
				margin: 0 0 20px 0; padding:0;
				font-size: 16px; color:#96bc33; font-weight: bold; border-bottom: solid 1px #e9e9e9;
		}

		#main span.error {
				color: #FF0000; display:block; margin-top: 2px;
		}
	
		#main p
		{
				font-size: 14px; color: #FF0000;
		}

		#main span.mandatory {
				font-size: 116.667%; color: #96bc33;
		}
		
		#main .help-icon {
				float: left; margin-left: 5px;
			}
		
		#main .button { 
				display: block; float:left;
				margin: 0 0 0 150px;	padding: 0; border: none; height: 25px; width: 58px;
		}
				
		#main label { 
				font-size: 12px; color: #FFFFFF; cursor: pointer;
				width: 250px; float: left; text-align: left; clear: both;
			}
			
		#main label a { 
				color: #96bc33;
			}
	
		#main input {
				float: left; 
				font-size: 12px;
				width: 211px;
				padding: 2px 2px 2px 5px;
				margin: 6px 0;
				border: none;
				color:#aaaaaa;
				background:url(../images/fieldset-bg.jpg) no-repeat;
			}


		#main input.over {
				float: left; 
				font-size: 12px;
				width: 211px;
				padding: 2px 2px 2px 5px;
				color:#aaaaaa;
				background:url(../images/fieldset-bg.jpg) no-repeat;
			}

		#main div.group {
		float:left;
		line-height:14px;
		padding: 4px 2px 2px 5px; margin: 0 0 5px 0px; 
		width:195px;
		color: #DBC800;
		}
			
		#main input.radio {
				float: none; clear:none; width: 13px; height: 13px;
				padding: 0px; margin: 0 5px 0px 0px; 
				color:#dbc800; border: none;
			}	

		#main select {
				float: left; 
				font-size: 14px;
				width: 195px;
				padding: 5px;
				margin-bottom: 5px;
				color:#aaaaaa;
				background-color: #FFFFFF;
				border: 1px solid #dadada;
		}	

		#main select.over {
				color:#424242;
				background-color: #FFFFFF;
				border: 1px solid #dadada;
			}

		#main textarea {
				float: left; 
				font-size: 12px;
				width: 211px;
				height: 233px;
				padding: 2px 2px 2px 5px;
				margin: 5px 0;
				border: none;
				color:#aaaaaa;
				background:url(../images/textarea-bg.jpg) no-repeat;
			}
		
	
		#main textarea.over {
				color:#424242;
				background-color: #FFFFFF;
				border: 1px solid #dadada;
			}


		#main input.tick {
				float: left; width: 16px; border: none; background-color: transparent;
		}	


		#main span.required {
				font-size: 11px; font-weight:bold;
				float: left; width: 100px; padding: 3px; margin: 0 0 2px 5px; color:#8cc63f;
		}
		
		#main .verify { 
				float:left; width: 47px; height: 21px; margin-top: 10px;
					
		}