@charset "utf-8";
/* CSS Document */


<style>
#otterbox {	
	margin-right: auto;
	margin-left: auto;
	width: 1030px;
	height: auto;
	overflow:hidden;
}
#shadow {
	background-image: url(../images/Shadow.png);
	background-repeat: repeat-y;
	margin-right: auto;
	margin-left: auto;
	width: 990px;
	height: auto;
}
h1, h2, h3, h4, h5, h6, p {
	color:#000000;
	
}
a:link {
	color: #000;
	text-decoration: underline;
	 outline: none;/* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #000;
	text-decoration: underline;
	outline: none;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	color: #fff;
	text-decoration: none;
	outline: none;
}
#bottomShadow {
	background-image: url(../images/ShadowBottom.png);
	height: 30px;
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	background-repeat: no-repeat;
}
/* ~~ this fixed width container surrounds the other divs ~~ */
.container {
	width: 950px; /* the auto value on the sides, coupled with the width, centers the layout */
	margin-right: auto;
	margin-left: auto;
	height: auto;
}
.OverlapBottom {
	position:relative;
	top: 344px;
	left: -20px;
	z-index: 4;	
	}
.textoverlapbottom {
	position:relative;
	top: -97px;
	z-index: 4;
	color:#ABA441;
	padding-top: 10px;
	padding-right: 50px;
	padding-bottom: 10px;
	padding-left: 50px;
	margin-right: 50px;
	margin-left: 50px;
	height: auto;
	/*height: auto;Change height to accomodate varying text lengths below MLS reports*/
	}
.footer {
	position:relative;
	height:80px;
	top: 0px;
	z-index: 4;
	font-size:20px;
	}
.footer a:link {
	color: #cdc77b;
	text-decoration: underline;
	 outline: none;/* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
.footer a:visited {
	color: #cdc77b;
	text-decoration: underline;
	outline: none;
}
.footer a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	color: #fff;
	text-decoration: none;
	outline: none;
}												

.textoverlapbottom h1 {
	color: #fff;	
	font-size:32px;
}

.body #otterbox #shadow .textoverlapbottom p {
	color: #fff;
	font-size:22px;
}
.header {
	top:0;
	left:0;
	width:950px;
	height:130px;
	background-image: url(../images/Logo.jpg);
	background-repeat: no-repeat;
	background-color: #7A7154;
	}	
.content {/*Please notice that the positioning of the objects is finally working.  They are placed inside the content box and are relative but the content box has no designation*/
	width: 950px;
	height: 880px;
	background-color:#797155;
	
/*	overflow:hidden;This actuall prevents the scroll past the bottom of the page but it also hides the tabs for some reason*/
	}
#element {
	width: 950px;
	height: 300px;
	background-color:#797155;
	margin-right: auto;
	margin-left: auto;

	}
.table {	
	top:0px;
	left:0px;
	z-index:1;	
	}	
/*Slider Styles*/
#s3slider {
	width:950px;
	height:300px;
	position:relative;
	overflow:hidden;
	color: #000;
}
#s3sliderContent {
	width:950px;
	height:300px;
	position:absolute;
	top:0;	 
	margin: 0;
	padding: 0;
	/*overflow:hidden;*/
	/*display:none;Doesn't keep the page from scrolling past the bottom and also hides movie*/
}
.s3sliderImage {
	float:left;
	position:relative;
	/*overflow:hidden;*/
	/*display:none;*/
}
.clear {
	clear:both;		
	}

/*overlay styles*/

.top {
		top:0;
		left:0;
		width:924px;
		height:60px;			
	}
.right {
		right:0;
		bottom:0;
		width:200px !important;
		height:290px;/*because we have 10 pixels of padding*/			
	}		
.bottom {
		bottom:0;
		left:0;
		width:924px;
		height:60px;	
	}	
.left {
		top:0;
		left:0;
		width:200px !important;/*The important tag is necessary because the .s3sliderImage span is overriding the 200 px width.*/
		height:290px;		
	}				
.body {
	color: #000;
	background-image: url(../images/background.jpg);
	background-repeat: repeat-x;
	margin:0px;
	background-color: #7A7154;
	/*	overflow:hidden;Using overflow hidden on the body prevents any scrolling*/
}
a img { 
	border: none;
	outline: none;
}/* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */ 


/*********************************************Custom Builder Tab and Custom Florida Home Plan Tab************************************************************/
.custombuildertab {
	position:relative;
	top: -490px;
	left: -61px;
	z-index: 35;	
	}
.customfloridaplanstab {
	position:relative;
	top: -1060px;
	left: -61px;
	z-index: 34;	
	}
#weatherandmapbuttons{/*This is not on the imgRotator2 pages*/
	position:relative;
	top:0px;
	left:800px;
	z-index:220;
	outline: none;
}
/*******Div4*****************Div4****************Comnmunity Features Tab****************Div4************************************/
.BoxaroundDiv4 {/*The box around the divs is because of positioning.  Without the box, every time you click on a toggle the tabs would move up and down the page*/
	height: 500px;
	width: 950px;	
}
.communityfeatures {
	position:relative;
	top:-1643px;
	left:-40px;
	z-index: 20;
	outline: none;
	
	}
#mydiv4 {
	position:relative;
	top:-1912px;
	left:-5px;
	z-index:21;
	background-image:url(../images/communityfeaturesbackground.png);
	font-size:14px;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 15px;
	padding-left: 25px;
	background-repeat: no-repeat;	
	}
.redxfeatures {
	position:relative;
	top: 10px;
	left: 10px;
	z-index: 52;
	}	

/*******Div5*****************Community Selections****************Div5*****************Div5****************Div5************************************/	
.BoxaroundDiv5 {
	height: 500px;
	width: 950px;	
} 
.subdivisioninformation {
	position:relative;
	top: -2143px;
	left: 950px;
	z-index: 30;
	}
#mydiv5 {
	position:relative;
	top:-2412px;
	left:531px;
	z-index:31;
	background-image:url(../images/abouttabverbiagee.png);
	/*background-color: #FC3;*/
	font-size:14px;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
	background-repeat: no-repeat;	
}
.redxcommunities {
	position:relative;
	top: 10px;
	left: 10px;
	z-index: 30;
	}


/*******Div7*****************Div7****************Wheather and Google Buttons****************Div7************************************/
/*!!!!!!When working with layers make a box for the layers to go into.  It probably only needs to be 1 pixel in height and set the property to overflow: none; This way you can call up as many layers as you wish without worrying about it messing things up on the page.  If this isn't done the page gets to be real long and messed up.*/	
.BoxaroundDiv7 {
	height: 500px;
	width: 1000px;	
}	
#mydiv7 {
	position:relative;
	top:-2663px;
	left:0px;
	z-index:20;
/*	background-color:#F63;*/
	background-image:url(../images/BrightenMyDay.png);
	/*Without this  background ping, as the mouse is hovered over the s3slider, the pictures stop changing.  This image is only 1 pixel wide and is repeated along the x-axis so there is virtually no size to the image but it prevents the pictures from stopping.  Pretty sick!!! */
	/*background-color: #FC3;*/
	font-size:14px;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	padding-top: 0px;
	/*padding-right: 15px;*//*!!Very Important!! You can't place the width and height in the CSS it must be in the div tag in the HTML code or the div won't open all the way*/
	/*padding-bottom: 15px;
	padding-left: 15px;  Also if you put the padding here it changes the size of the specified div below.  To get the wording the stay off the edges you have to place style="padding-right:10px" as an example in the paragraph tag of the see notes in Div 6 in the HTML code*/
	background-repeat: repeat-x;
	outline:none;
	}

/*.rightredx { float:right;}							 
body,td,th {
	color: #000;
}*/
.topborderiframe {
	position:relative;
	top: -2590px;
	left: 85px;
	z-index: 20;
	}
.bottomborderiframe {
	position:relative;
	top: -1914px;
	left: 85px;
	z-index: 20;
	}
.leftborderiframe {
	position:relative;
	top: -2626px;
	left: 73px;
	z-index: 20;
	}
.body #otterbox #shadow .footer #footerfontcolor {
	color: #CDC77B;
}
.rightborderiframe {
	position:relative;
	top: -3338px;
	left: 865px;
	z-index: 20;
	}					
.textoverlapbottom p a {
	color: #fff;
	font-size:22px;
}
.body #otterbox #shadow .container .content .table table tr td #Headercolor {
	color: #FFF;
	font-size:32px;
}
</style>