/* TABLE OF CONTENTS
------------------------------------------------------------------------------

1. Base tags
2. Containers
3. Graphics & photos
4. Buttons
5. Typography
6. Lists
7. Links
8. Inputs
9. Tables


/* 1. Base tags
------------------------------------------------------------------------------*/
html {
	height: 100%;
}
body {
	background-color: #FFFFFF;
	font: 11.9px tahoma, arial, sans-serif;
	color: #5b5b5b;
	line-height: 1.5;
	margin: 0;
	height: 100%;
	}

body#splashBackground {
	background-color: #f6f1e9;
	height: 100%;
   

}

img {
	border: 0;
	display: block;
	}

	
.clearfix:after {
	content:".";
	display:block;
	height:0px;
	clear:both;
	visibility:hidden;
}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */

form {
	margin: 0;
}


/* 2. Containers
------------------------------------------------------------------------------*/
#wrapper{
	height:100%;
	width:100%;
	display:table;
	vertical-align:middle;
}
#outer{
	display:table-cell;
	vertical-align:middle;
}
#inner{
	position:relative;
	
	
}
#frame {
	position:relative;
	width: 718px;
	height: 418px;
	margin: auto;
	background-color: #fff;
	padding: 8px;
	
}
#content{
	position:relative;
	width: 675px;
	height: 385px;
	margin: auto;
	background-color: #FFFFFF;
	padding: 20px;
	padding-bottom: 10px;
	border: 1px solid #e1e1e1;
}

#siteWrapper{
	width:100%;
	position:relative;
	top: 55px;
	
}


.siteContent{
	position:relative;
	width: 980px;
	margin: auto;
	background-color: #FFFFFF;
}

#homeContent, #contactContent, #galleryContent  {
	width: 660px;
	float: left;
}



#propContent {
	width: 350px;
	float: left;
}

#homeShowreel {
	width: 301px;
	height: 405px;
	float: right;
	position: relative;
	margin-right: -5px;
	margin-top: 17px;
	margin-bottom: 17px;
	
}

#contactShowreel {

	width: 268px;
	height: 361px;
	float: right;
	position: relative;
	margin-right: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
}

#propShowreel {
	width: 600px;
	height: 400px;
	float: right;
	position: relative;
	margin-right: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	
}

#footer {
	position: absolute;
	background-color: #f4f4f4;
	width: 980px;
	margin-top: 0px;
	padding-top: 0px;
}

#footer span {
	display:block;
	width: 980px;
	height: 20px;
	background-color: #fff;
	clear:both;
}


/* 3. Graphics & photos
------------------------------------------------------------------------------*/
div#content img#top {
	margin: auto;
	margin-bottom: 10px;
}

div#content img#bottom {
	margin: auto;
	margin-top: 20px;
}

img.photo {
	padding: 6px;
	border: 1px solid #e1e1e1;
	
}

.siteContent img#title {
	
	margin: auto;
	margin-right: 20px;
}

ul#nav li img {
	display: inline;
}

/* 4. Buttons
------------------------------------------------------------------------------*/



/* 5. Typography
------------------------------------------------------------------------------*/
div#content p {
	text-align: center;
	margin: 5px;
}

div#homeContent p, div#propContent p, div#contactContent p, div#galleryContent p {
	margin-left :12px;
}

div#propContent span, div#contactContent span {
	color: #000;
}



#footer p {
	
	margin: 12px;
	
}

#footer h2 {
	color: #000;
	font-size: 11.9px;
	font-weight: normal;
	margin: 12px;
	margin-bottom: -14px;
	
}

#footer p#left {
	color: #b3b3b3;
	font-size: 10px;
	float: left;
	
}

#footer p#right {
	color: #b3b3b3;
	font-size: 10px;
	float: right;
}

hr {
	color: #e5e5e5;
	height: 1px;
	border: 0px;
	background-color: #e5e5e5;
	width: 100%;

}
hr#splash {
	width: 240px;
}

hr#bottom {
	margin-bottom: 0px;
	padding-bottom: 0px;
}


.mainheadings {
	FONT-SIZE: 18px; 
	COLOR: #999999; 
	LINE-HEIGHT: 18px; 
	FONT-FAMILY: "Times New Roman", Times, serif; 
	font-weight: normal; 
	font-style: normal; 
	text-decoration: none; 
	padding: 0px 0px 0px 12px;
	}

.mainwhiteheadings {
	color: #f6f1e9;
	font-size: 11.9px;
	}


/* 6. Lists
------------------------------------------------------------------------------*/
ul#nav, ul#subnav {
	list-style-type: none;
	margin: 0px;
	margin-left: 12px;
	padding: 0px;
	
}
ul#subnav {

	margin-top: 5px;
	margin-left: 82px;
	
}
ul#nav li{
	display: inline;
	margin-right: 30px;

}
ul#subnav li{
	display: inline;
	margin-right: 13px;

}

ul li img {
	display: inline;
}

ul#nav li img#properties:hover, ul#nav li img#contact:hover, ul#nav li img#home:hover, ul#nav li img#gallery:hover, ul#nav li img#home:hover{
	background-position: 0 -21px;
}

ul#subnav li img#bequia:hover, ul#subnav li img#stonehouse:hover, ul#subnav li img#jacaranda:hover, ul#subnav li img#vogue:hover, ul#subnav li img#beautiful:hover, ul#subnav li img#island:hover  {
	background-position: 0 -15px;
}

ul#nav li img#properties{
	background: url('../images/nav_properties_off.gif') top left no-repeat;
}

ul#nav li img#properties_on{
	background: url('../images/nav_properties_on.gif') top left no-repeat;
}

ul#nav li img#contact{
	background: url('../images/nav_contact_off.gif') top left no-repeat;
}

ul#nav li img#contact_on{
	background: url('../images/nav_contact_on.gif') top left no-repeat;
}

ul#nav li img#gallery{
	background: url('../images/nav_gallery_off.gif') top left no-repeat;
}

ul#nav li img#gallery_on{
	background: url('../images/nav_gallery_on.gif') top left no-repeat;
}

ul#nav li img#home{
	background: url('../images/nav_home_off.gif') top left no-repeat;
}

ul#nav li img#home_on{
	background: url('../images/nav_home_on.gif') top left no-repeat;
}

ul#subnav li img#bequia {
	background: url('../images/nav_bequia_off.gif') top left no-repeat;
}

ul#subnav li img#stonehouse {
	background: url('../images/nav_stonehouse_off.gif') top left no-repeat;
}

ul#subnav li img#jacaranda {
	background: url('../images/nav_jacaranda_off.gif') top left no-repeat;
}

ul#subnav li img#vogue {
	background: url('../images/nav_vogue_off.gif') top left no-repeat;
}

ul#subnav li img#beautiful {
	background: url('../images/nav_beautiful_off.gif') top left no-repeat;
}

ul#subnav li img#island {
	background: url('../images/nav_island_off.gif') top left no-repeat;
}


/* 7. Links
------------------------------------------------------------------------------*/
a {
	color: #c1c1c1;
	text-decoration: none;
}
a:hover, div#propContent a:hover {
	color: #5b5b5b;
}

div#propContent a, div#contactContent a, div#galleryContent a  {
	color: #000;
}



/* 8. Inputs
------------------------------------------------------------------------------*/



/* 9. Tables
------------------------------------------------------------------------------*/
ul#subnav li img#glamhome {

	background: url('../images/nav_glamhome_off.gif') top left no-repeat;
}
#glamContent {

	width: 380px;
	float: left;
}
#propShowreel02 {

	width: 630px;
	height: 400px;
	float: right;
	position: relative;
	margin-right: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
}