/*****************************************************************
      Tested in the following browsers for general compliance:  
	  
	  Firefox 3.0.15 PC 		Firefox 3.55 MAC 
	  Opera 9.63 PC				Opera 10.10 MAC
	  Safari 4.0.2 PC			Safari 4.0.4 MAC
	  Chrome 3.0.195.38 PC		Chrome 4.0.249.30 MAC
	  IE 7, IE 6, IE 5.5 PC
******************************************************************/

* {
    margin: 0;
}
html, body {
	height: 100%;
	background-image: url(../images/gray-line-builders-bkgnd2.jpg);
	background-repeat: repeat-x;
	background-color: #DDDDDF;   /* color of the main page background between the header and footer */
	background-position: center top;
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	margin: 0px;
}

p {
	font-family: "Times New Roman", Times, serif;
	font-size: 12pt;
	color: #353535;
	line-height: 145%;
	padding-bottom: 15px;
	text-align: left;
	vertical-align: top;
}

.twoColFixLtHdr #container {
	width: 950px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	text-align: left;  /* this overrides the text-align: center on the body element. */
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: -180px;  /* the negative number gives the space up from the bottom of the browser */ /* the auto margins (in conjunction with a width) center the page */
	margin-left: auto;
	vertical-align: top;
} 
.twoColFixLtHdr #header {
	height: 169px;
	width: 950px;
	z-index: 1;
} 
.twoColFixLtHdr #header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 15px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.twoColFixLtHdr #logobox {
	float: left; /* since this element is floated, a width must be given */
	height: 221px;
	width: 220px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	padding-left: 30px;
	margin-top: -86px; /* makes sure the logo lines up with the Logos that OVERLAP it in the #header (mastheads) region */
	margin-right: 0px;
	margin-bottom: 0px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	margin-left: 24px; /* makes sure the logo lines up with the Logos that OVERLAP it in the #header (mastheads) region */
	z-index: 999;
}
.twoColFixLtHdr #sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 160px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 60px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	padding-left: 30px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 120px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	margin-left: 40px;
	clear: left;
}
.twoColFixLtHdr #mainContent {
	margin-top: -40px;
	margin-right: 0px;
	margin-bottom: 30px;   /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	margin-left: 0px;   /* ensures Main Content doesn't run over Sidebar content (if present) */
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 120px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized ---- ALSO FIX FOR FLOWERNOTES AND FLOWERS IN TABBED CONTENT */
	padding-left: 0px;
	vertical-align: top;
	width: 650px;
	float: right;
} 
.twoColFixLtHdr #subNavigation {
	display: block;
	width: 611px;
	height: 142px;
	position: relative;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 30px;
	padding-left: 0px;	
} 
.twoColFixLtHdr #shadow {
	height: 20px;
	background-image: url(../images/z_ftr_shadtile.png);
	background-repeat: repeat-x;
	width: 100%;
	background-color: transparent;    /* "none" is deprecated in newer browsers and replaced with "transparent" */
	clear: both;
	float: none;
	margin-top: 30px; /* this gives the content a space between the footer */
} 
.twoColFixLtHdr #footer {
	clear: both;
	height: 160px;     /* this should be a positive number OR opposite of the negative number in #container */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: 140%;
	color: #AFB7CD;   /* color of any Footer text and-or links */
	background-color: #3f4e79;   /* background color of the Footer div */
	padding-top: 10px; /* gives space between the footer content (SSI) and top of the footer container */
	padding-right: 0px;
	padding-bottom: 30px;  /* <<<<<< This keeps a gap of gray from appearing below footer */
	padding-left: 320px; /* This makes the footer text appear centered under the main content column */
	margin-bottom: 0px; /* <<<<<< DO NOT USE: if a positive number, there will be light gray (bkgnd color) below the footer */
	float: none;
} 
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.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: 60px; /* this gives the content a space between the footer */
	font-size: 1px;
	line-height: 0px;
}
.footerTable {
	height: 180px;
	width: 630px;
	background-color: #3f4e79;   /* background color of the Footer div */
	color: #AFB7CD;   /* color of any Footer text and-or links */
	background-image: url(../images/footer_tile.gif);
	background-repeat: repeat-x;
}



/* ============================================================== */
/* Standard Links Below Here... */
/* ============================================================== */



a:link {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: none;
}

a:visited {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: none;
}

a:hover {
	color: #999;   /* color of any Footer text and-or links */
	text-decoration: underline;
}

a:active {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: underline;
	text-align: right;
}	


/* ============================================================== */
/* Main Page Styles Below Here... */
/* ============================================================== */



h1 {
	font-family: "Times New Roman", Times, serif;
	font-size: 28px;
	color: #036;
	line-height: 110%;
	padding-bottom: 15px;
	background-position: top;
	font-weight: normal;
}

h2 {
	font-family: "Times New Roman", Times, serif;
	font-size: 20px;
	color: #036;
	line-height: 110%;
	padding-bottom: 15px;
	font-weight: bold;
}

.Bullets {
	font-family: "Times New Roman", Times, serif;
	line-height: 110%;
}

h3 {
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	font-style: italic;
	line-height: 100%;
	color: #353535;
	margin-bottom: 0px;
	padding-bottom: 15px;
	font-weight: bold;
}




/* ============================================================== */
/* Footer Styles Below Here... */
/* ============================================================== */



.footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: 130%;
	color: #AFB7CD;   /* color of any Footer text and-or links */
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.footerSpacers {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: 110%;
	color: #AFB7CD;   /* color of any Footer text and-or links */
	padding-top: 0px;
	padding-right: 4px;
	padding-bottom: 0px;
	padding-left: 4px;
}
.footer a:link {
	color: #AFB7CD;   /* color of any Footer text and-or links */
	text-decoration: none;
}

.footer a:visited {
	color: #AFB7CD;   /* color of any Footer text and-or links */
	text-decoration: none;
}

.footer a:hover {
	color: #999;   /* color of any Footer text and-or links */
	text-decoration: underline;
}

.footer a:active {
	color: #999;   /* color of any Footer text and-or links */
	text-decoration: underline;
}	

.BodyText {
	font-family: "Times New Roman", Times, serif;
	font-size: 12pt;
	line-height: 145%;
	color: #333;
}
.BodyText-bold {
	font-family: "Times New Roman", Times, serif;
	font-size: 12pt;
	line-height: 145%;
	color: #036;
	font-weight: bold;
}
.BodyText-italic {
	font-family: "Times New Roman", Times, serif;
	font-size: 13pt;
	line-height: 145%;
	color: #353535;
	font-style: italic;
}
.BodyText-Subheads{
	font-family: "Times New Roman", Times, serif;
	font-size: 14pt;
	line-height: 145%;
	color: #333;
	text-transform: uppercase;
	padding-top: 25px;
	padding-bottom: 10px;
}


/*****************************************************************
      Main Div Container (ModernBricksMenu2 and Tabs) Styles
	  Tested in the following browsers:  
	  
	  Firefox 3.0.15 PC 		Firefox 3.55 MAC 
	  Opera 9.63 PC				Opera 10.10 MAC
	  Safari 4.0.2 PC			Safari 4.0.4 MAC
	  Chrome 3.0.195.38 PC		Chrome 4.0.249.30 MAC
	  IE 7, IE 6, IE 5.5 PC
******************************************************************/



.modernbricksmenu2 {
	vertical-align: top;
	float: left !important; /*Fix for IE6, IE7 and Opera: Ensures Tabs and Content divs stay "connected" with no dead space in between - Works without fix in Safari 4.04 */
	clear: left !important; /*Fix for Firefox: Ensures Tabs and Content divs stay "connected" with no dead space in between - Works without fix in Safari 4.04*/
	voice-family: "\"}\"";
	voice-family: inherit;
	background-color: transparent;
	z-index: 999;
}

.modernbricksmenu2 ul{
	margin:0;
	margin-left: 0px; /*Margin between first menu item and left browser edge (not necessary in IE6 and IE7, but must have for proper display and alignment in Firefox, Safari and Opera */
	padding: 0;
	list-style: none;
}

.modernbricksmenu2 li{ /*This controls the look of the Tab Text*/
	color: white;
	display: inline;
	margin: 0 2px 0 0;
	text-transform:uppercase;
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	letter-spacing: .05em; /*This controls the spacing in between letters of Tab titles*/
	float: left; /*Keeps buttons in a horizontal row... without it buttons stack on top of each other*/
}

.modernbricksmenu2 a{ /*This controls the appearance of LINKS on the tabs*/
	color: white;
	display: block;
	text-decoration: none;
	background-color: #999;
	margin-top: 0;
	margin-right: 3px; /*This controls the spacing in between Tabs*/
	margin-bottom: 0;
	margin-left: 0;
	padding-top: 5px;    /*This controls the spacing around text within the Tabs*/
	padding-right: 10px; /*This controls the spacing around text within the Tabs*/
	padding-bottom: 5px; /*This controls the spacing around text within the Tabs*/
	padding-left: 10px;  /*This controls the spacing around text within the Tabs*/
	border-top-width: 1px;   /*Allows slight offset of unselected versus selected Tabs via color to match background color*/
	border-top-style: solid; /*Allows slight offset of unselected versus selected Tabs via color to match background color*/
	border-top-color: #CCC;
}

.modernbricksmenu2 a:hover{
	background-color: #333; /*Color theme*/ 
	color: white;
}

.modernbricksmenu2 a.selected{ /*Currently selected tab*/
	background-color: #333; /*Color theme*/
	color: white; /*Color theme*/
	border-top-color: #666;
	border-right-color: #666;
	border-bottom-color: #666;
	border-left-color: #666;
}



/*****************************************************************
                    FlowerDivContainers and FlowerNotes
******************************************************************/



#flowerdivcontainer {
	border: 1px solid #999; /*Gives Container a Border*/
	width: 607px;
	background-color: transparent; /*Makes Container Transparent... can also be a color*/
	overflow: visible;  /*Shows content regardless of size (no scrollbars)*/
	visibility: visible; /*Shows content regardless of size (no scrollbars)*/
	vertical-align: top;
}

#flowernote {
	display:none;
	position:relative;
	width:503px;
	height:238px;
	background-color: transparent;
	color:white;
	clear: both;
	margin-bottom: 15px;
	padding-bottom: 15px;
}



/*****************************************************************
                    FlowerDivContainer CONTENT
******************************************************************/



.flowerContent {
	padding: 0px;
	margin: 20px;
}

.images {
	vertical-align: top;
	clear: left;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	padding-left: 20px;
	float: right;
}

.flowerContent a:link {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: none;
}

.flowerContent a:visited {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: none;
}

.flowerContent a:hover {
	color: #999;   /* color of any Footer text and-or links */
	text-decoration: underline;
}

.flowerContent a:active {
	color: #036;   /* color of any Footer text and-or links */
	text-decoration: underline;
}	
.twoColFixLtHdr #flowertabs {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;   /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	margin-left: 0px;   /* ensures Main Content doesn't run over Sidebar content (if present) */
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized ---- ALSO FIX FOR FLOWERNOTES AND FLOWERS IN TABBED CONTENT */
	padding-left: 0px;
	vertical-align: top;
}
.twoColFixLtHdr #flowerdivcontainer {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;   /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized */
	margin-left: 0px;   /* ensures Main Content doesn't run over Sidebar content (if present) */
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;  /* ensures #shadow and #footer do not run over top of content above them if browser window is minimized ---- ALSO FIX FOR FLOWERNOTES AND FLOWERS IN TABBED CONTENT */
	padding-left: 0px;
	vertical-align: top;
}


/*****************************************************************
          END END END FlowerDivContainers and FlowerNotes
******************************************************************/


.site-map-links {
	background-color: #DDDDDF;
	height: 800px;
	width: 607px;
	background-image: url(http://www.sunset-oaks.com/location/so_map.html);
	background-repeat: no-repeat;
}
.communityTitles {
	font-family: "Times New Roman", Times, serif;
	font-size: 18pt;
	font-weight: normal;
	text-transform: uppercase;
	color: #036;
	padding-left: 20px;
	padding-top: 20px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.pdf_button {
	clear: right;
	float: right;
	position: relative;
}
.LastOpportunity_Banners {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12pt;
	text-transform: uppercase;
	color: #CCC;
	background-color: #900;
	clear: left;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	border: 2px solid #333;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}


/*****************************************************************
              Tour Factory and Virtual Tour  Buttons
******************************************************************/


#TourFactoryButton {
	display: inline;
	float: left;
	height: 86px;
	width: 110px;
	padding-right: 20px;
	padding-bottom: 20px;
}
.TourFactory_Titles {
	font-family: "Times New Roman", Times, serif;
	font-size: 10pt;
	font-style: italic;
	font-weight: normal;
	color: #666;
	text-align: center;
	padding-bottom: 20px;
}



.Sidebar-Click {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 8.5pt;
	font-style: italic;
	line-height: 120%;
	color: #036;
	text-align: right;
	font-weight: bold;
}


.Sidebar-VirtualTour-Links_LOCATION {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11.5pt;
	font-style: normal;
	line-height: 120%;
	color: #574039;
	text-align: right;
	margin-top: 5px;
}
.Sidebar-VirtualTour-Links_LOCATION a:link {
	color: #574039;
	text-decoration: none;
}

.Sidebar-VirtualTour-Links_LOCATION a:visited {
	color: #574039;
	text-decoration: none;
}

.Sidebar-VirtualTour-Links_LOCATION a:hover {
	color: #036;
	text-decoration: underline;
}

.Sidebar-VirtualTour-Links_LOCATION a:active {
	color: #036;
	text-decoration: underline;
}	


.VirtualTour-LinkArea {
	text-align: right;
	margin-bottom: 7px;
}



/*****************************************************************
                    Location Map Navigation (Main DIV)
******************************************************************/



.MapLocationNav {
	display: inline;
	float: right;
	height: 70px;
	width: 141px;
	text-align: right;
	margin-right: 43px;
}



/*****************************************************************
                    Location Map Navigation (Number TITLES)
******************************************************************/



.MapLocationNav-TITLE a:link {
	color: #574039;
	text-decoration: none;
}

.MapLocationNav-TITLE a:visited {
	color: #574039;
	text-decoration: none;
}

.MapLocationNav-TITLE a:hover {
	color: #036;
	text-decoration: underline;
	font-weight: bold;
}

.MapLocationNav-TITLE a:active {
	color: #036;
	text-decoration: underline;
	font-weight: bold;
}	
.MapLocationNav-TITLE {
	font-family: "Times New Roman", Times, serif;
	font-size: 11pt;
	font-weight: normal;
	color: #574039;
	text-align: right;
}
.MapLocationNav-TITLE-ACTIVE {
	font-family: "Times New Roman", Times, serif;
	font-size: 11pt;
	color: #036;
	text-align: right;
	font-weight: bold;
}



/*****************************************************************
                    Location Map Navigation (Italic Descriptions)
******************************************************************/



.MapLocationNav-ITALIC {
	font-family: "Times New Roman", Times, serif;
	font-size: 9.5pt;
	font-style: italic;
	font-weight: normal;
	color: #574039;
	text-align: right;
	line-height: 110%;
}
.MapLocationNav-ITALIC a:link {
	color: #574039;
	text-decoration: none;
}

.MapLocationNav-ITALIC a:visited {
	color: #574039;
	text-decoration: none;
}

.MapLocationNav-ITALIC a:hover {
	color: #036;
	text-decoration: underline;
	font-weight: bold;
}

.MapLocationNav-ITALIC a:active {
	color: #036;
	text-decoration: underline;
	font-weight: bold;
}	
.MapLocationNav-ITALIC-ACTIVE {
	font-family: "Times New Roman", Times, serif;
	font-size: 9.5pt;
	font-style: italic;
	color: #036;
	text-align: right;
	line-height: 110%;
	font-weight: bold;
}	


#clear {
	display:block;
	height: -10px;
}