﻿@import url("divToggle.css");
@import url("rotator.css");

html {
  background: url(../images/sandPattern2.jpg) #3a3a3a repeat center top;
  text-align: left;
  margin: 0;
	padding: 0;}

body {
	margin: 0;
	padding: 0;
	text-align: left;}

.floatRight {
	float: right;}

.floatLeft {
	float: left;}

.payPalCartButton {
	width: 75px;
	height: 25px;
	border: 1px solid #915934;
	padding: 2px 2px 5px 23px;
	color: #915934;
	text-align: left;
	background: url(../images/PayPal/cartButton.gif) #ffffff no-repeat left;}

/* ---------------- */
/* Gallery Settings */
/* ---------------- */

#gallery {
	width: 100%;
	margin: 0 auto;}
	
	#gallery img {
		float: left;
		margin: 5px;
		width: 100px;
		height: 100px;
		border: 2px solid black;}
		
	#gallery img:hover {
		border: 2px solid white;}

/* -------- */
/* OVERLAYS */
/* -------- */

#sandOverlay {
	width: 505px;
	height: 470px;
	/* background: url(../images/sandOverlayLowRes.gif) no-repeat left bottom; */
	left: -100px;
	bottom: -100px;
	position: absolute;
	z-index: 1;}

#starfishOverlay {
	width: 285px;
	height: 205px;
	background: url(../images/starfishOverlay2.gif) no-repeat left bottom;
	left: -105px;
	top: 200px;
	position: absolute;
	z-index: 2;}

#waterOverlay {
	width: 740px;
	height: 178px;
	background: url(../images/waterOverlay.gif) no-repeat 200px top;
	top: -10px;
	right: 0px;
	position: absolute;
	z-index: 4;
	overflow: visible;}

/* ------------ */
/* LOGO OVERLAY */
/* ------------ */

#logoLayerContainer {
	position: absolute;
	z-index: 10;
	text-align: center;
	width: 100%;
	overflow: visible;}
	
	#logoStructureContainer {
		width: 800px;
		height: 212px;
		margin: 0 auto;
		text-align: right;
		overflow: visible;}
		
		#logoContainer {
			width: 309px;
			height: 212px;
			background: url(../images/headerLogo.gif) transparent no-repeat right bottom;
			margin: 25px 0 0 531px;
			cursor: hand;
			overflow: visible;}

/* -------------- */
/* PAGE STRUCTURE */
/* -------------- */

#pageLayerContainer {
	position: absolute;
	z-index: 3;
	text-align: center;
	width: 100%;
	overflow: visible;}

  #whiteBorder {
  	border: 1px solid white;
  	width: 782px;
  	margin: 10px auto;
  	overflow: visible;}
  	
  	#pageStructureContainer {
  		width: 774px;
  		margin: 0 auto;
  		border: 4px solid #972f15;
  		background: #ffffff;
  		overflow: visible;}
  		
  		#headerContainer {}
  			  		
  		#navigationContainer {
  			width: 774px;
  			height: 32px;
  			margin-top: -32px;
  			background: ;
  			text-align: left;
  			overflow: hidden}
  		
  		#bodyContainer {
  			border: 4px solid #972f15;
  			border-left: 0;
  			border-right: 0;}
  		
  			#bodyContainer table#twoColumns {
  				width: 774px;
  				text-align: left;}
  				
  				#bodyContainer table#twoColumns td.oneColumn {
  					line-height: 1em;
  					vertical-align: top;}
  				
  				#bodyContainer table#twoColumns td.left {
  					width: 490px;
  					line-height: 1em;
  					vertical-align: top;}
  					
  					#subNavigationContainer {
  						background: #627884;
  						margin: 2px 2px;}
  					
  					
            #bodyContainer #adspace {
              	border-bottom: 4px solid #972f15;
              	text-align: right;
              	margin: 0;
              	padding: 0;}
              
              #adspace p {
              	display: none;}
  
  					#bodyContentContainer {
  						padding: 10px;
  						overflow: hidden;}
  						
  						.dataTable {
  							border: 1px solid #972f15;
  							background: #f2f7ff;
  							margin-left: 2.5em;}
  						
  							.dataTable td {
  								line-height: 1em;
  								vertical-align: top;
  								padding-bottom: 0.5em;}
  							
  							.dataTable td.dataTableTitle {}
  							
  							.dataTable td.dataTableData {}
  						
  						.formTable {
  							margin-left: 2.5em;
  							border: 1px solid #972f15;
  							background: #f2f7ff;
  							width: 300px;}
  						
  							.formTable td {}
  							
  							.formTable td.formTableTitle {}
  								  							
  							.formTable td.formTableRadio {
  								padding: 0 10px;}
  							  								
  								.formTable td.formTableRadio input {
  									border: 0px;
  									background: #f2f7ff;}
  									
  							.formTable td.formTableInputs {
  								padding: 0 10px;}
  						
  						div.weatherRightBox {
  							width: 150px;
  							border: 1px solid #972f15;
  							background: white;
  							float: right;}
  						
  						div.bodyTextRightBox {
  							width: 220px;
  							border: 1px solid #972f15;
  							background: #ecac58;
  							padding: 0.5em;
  							margin: 1em;
  							float: right;}
  							
  							span#headerButton {
  								width: 234px;
  								border-bottom: 1px solid #972f15;
  								margin: -7px 7px auto -7px;
  								display: block;
  								cursor: pointer;}
  								
  								span.categoryFishing {
  									background: url(../images/headers/goFishing.jpg) transparent no-repeat left top;
  									height: 214px;}
  							
  							.bodyTextRightBox img {
    							border: 1px solid white;}
  					
    					div.horizontalPhotoSet {
    						background: transparent;
    						text-align: center;
    						margin: 0.5em auto;}
    						
    						div.horizontalPhotoSet img {
    							display: inline;
    							padding: 4px;
    							border: 1px solid #3a3a3a;}
  				
  				#bodyContainer table#twoColumns td.right {
  					width: 284px;
  					height: 475px;
  					border-left: 4px solid #972f15;
  					background: url(../images/sailboatGradient.jpg) #dbcab8 repeat-x bottom left;
  					line-height: 1em;
  					vertical-align: top;
  					text-align: center;
  					padding-top: 2px;}
  					
  					table#visitHomerIndex {
  						padding: 0;
  						margin: 0;}
  						
  						#visitHomerIndex td {
  							width: 33%;
  							border: 1px solid #60261c;
  							background: url(../images/visitHomerIndexTableBg.gif) transparent repeat-x left top;}
  							
  							#visitHomerIndex td img {}
  					
  					#bodyContainer table#twoColumns td.right div.button {
  						margin: -2px auto 0 auto;
  						text-align: left;
  						display: block;}
  						
  						#residentSpecials {
  							height: 105px;
  							background: url(../images/buttonResidentSpecials.gif) transparent no-repeat left top;
  							cursor: hand;
  							border: 2px solid white;
  							border-top: 0;}
  						
  						#visitorsGuide {
  							height: 105px;
  							background: url(../images/buttonVisitorsGuide.gif) transparent no-repeat left top;
  							cursor: hand;
  							border: 2px solid white;}
  						
  						#memberAccess {
  							height: 105px;
  							background: url(../images/buttonMemberAccess.gif) transparent no-repeat left top;
  							cursor: hand;
  							border: 2px solid white;}
  						
  						#findABusiness {
  							height: 105px;
  							background: url(../images/buttonFindABusiness.gif) transparent no-repeat left top;
  							cursor: hand;
  							border: 2px solid white;}
  						
  						#contactInfo {
  							border: 0px solid transparent;}
  					
  		#footerContainer {
  			background: url(../images/footerGradient.gif) white repeat-x center bottom;
  			text-align: left;}
  			
  			
 /*  alphabetize button styles */
 
.right {
	float:right;  background-color:#ededed;
}
		