/*----------*
	GLOBAL
 *----------*/
HTML
{
	/*
	Ensure the height of the HTML element is 100% of the browser window.
	This fix is needed for Mozilla browsers to ensure that the background image
	that is repeated along the bottom of the body actually repeats along the bottom
	of the browser window rather than just the bottom of the actual content.
	*/
	min-height: 100%;
 	height: auto;
}

BODY
{
	margin: 0px;
	padding: 0px;
	background: #857568 url('/images/shell/footer/grass_repeat.jpg') repeat-x bottom left;

	font-family: 'Trebuchet MS', Verdana, sans-serif;
	font-size: 0.7em;
	color: #8f8f8f;

	min-width: 986px;
}

BODY#tour	/* the 'Virtual Tour' page just has a black background */
{
	background: #000000;
}

/* Fix to specifically support min-width in Internet Explorer 6 and less */
* html BODY
{
	margin: 0px;
	width: expression((document.documentElement.offsetWidth < 988) ? "986px": "auto" );
	/* reason why the two widths are different: specifying the less than width to be the same as the hacked min-width causes a racing condition in IE at the moment when the size of the window hits the target width */
}

.clearfloat
{
	clear: both;
}


/*---------------------*
	TEXT AND HEADINGS
 *---------------------*/
P
{
	margin: 0px 0px 12px 0px;
	padding: 0px;
}

H1
{
	margin: 0 0 1.0em 0;
	padding: 0;
}

H2
{
	margin: 1 0 0.7em 0;
	padding: 0;
	font-size: 1.3em;
}

H3
{
	margin: 0 0 1.0em 0;
	padding: 0;
	font-size: 1.1em;
	font-weight: normal;
}

H4
{
	margin: 0 0 1.0em 0;
	padding: 0;
	font-size: 1.0em;
	font-weight: normal;
}


/*---------*
	LINKS
 *---------*/
a
{
	color: #7ab42c;
}

A.button_green
{
	display: block;
	background-color: #7ab42c;
	width: 10em;
	padding: 0.2em;
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}


/*-----------------*
	PAGE SECTIONS
 *-----------------*/
/* -- Header -- */
div#header
{
	height: 156px;
	background: url('/images/shell/header/repeat.jpg') repeat-x top left;
	white-space: nowrap;
	font-size: 0px;
}

#tour div#header
{
	height: 156px;
	background: url('/images/shell/header/repeat-tour.jpg') repeat-x top left;
	white-space: nowrap;
	font-size: 0px;
}

div#header div#nav_green
{
	width: 437px;
	float: left;
}

div#header div#nav_black
{
	width: 143px;
	float: left;
}

/* -- Footer -- */
div#footer	/* this is merely a placeholder so that space is available to reveal the tilable grass image repeating along the bottom of the page */
{
	height: 97px;
}

div#footer_links a
{
	color: #969696;
}

/* -- Content -- */
div#content
{
	min-height: 367px;
	height: auto !important;	/* ignored by IE6 */
	height: 367px;
}

#tour div#content	/* the 'Virtual Tour' page has a different height to encapsulate the flash within the content section */
{
	min-height: 340px;
	height: auto !important;	/* ignored by IE6 */
	height: 340px;
}

div#house-repeat
{
	background: #867669 url('/images/shell/house-repeat.jpg') repeat-x top left;
}

div#house-left
{
	background: url('/images/shell/house-left.jpg') no-repeat top left;
	min-height: 367px;
	height: auto !important;	/* ignored by IE6 */
	height: 367px;
}

div#house-right
{
	background: url('/images/shell/house-right.jpg') no-repeat top right;
	min-height: 367px;
	height: auto !important;	/* ignored by IE6 */
	height: 367px;
}

div#central
{
	margin-left: 235px;	/* <-- leave space for the left house image to show through */
	margin-right: 77px;	/* <-- leave space for the right house image to show through */
	padding: 50px 104px 50px 80px;
	background-color: #FFFFFF;
	width: 490px; /* 674px minus left and right padding */
	min-height: 240px;
	height: auto !important;	/* ignored by IE6 */
	height: 240px;
	position: relative;	/* <-- important so that the footer logos can be positioned absolutely in the bottom right */
}

div#central img#btm_blocks
{
	position: absolute;
	bottom: 10px;
	right: 59px;
}

div#central img#logo_gov
{
	position: absolute;
	bottom: 99px;
	right: 18px;
	border: 0px;
}

div#central img#logo_landcorp
{
	position: absolute;
	bottom: 46px;
	right: 18px;
	border: 0px;
}

div#central div#footer_links
{
	position: absolute;
	bottom: 15px;
	left: 80px;

	color: #969696;
}


/*--------------------------------*
    PAGES - HOUSES (inner pages)
 *--------------------------------*/
H1#title_house
{
	font-size: 2.2em;
	margin: 0.5em 0 0.2em 0;
	padding: 0;
}

H2#title_builder
{
	font-size: 1.45em;
	font-style: italic;
	margin: 0 0 0.5em 0;
}

H3#title_lot
{
	font-weight: normal;
	font-size: 1.1em;
}

IMG.house_thumbnail
{
	float: right;
	margin-left: 8px;
	margin-bottom: 5px;
}

DIV#houses_list
{
	position: relative;
	width: 100%;
}

DIV#module_tour
{
	position: absolute;
	bottom: 0px;
	right: 0px;
}

/* - Navigation - */
DIV#nav_houses
{
	border-bottom: solid 1px #ececec;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

DIV#nav_houses P
{
	text-align: center;
	margin: 0;
}

DIV#nav_houses A#nav_houses_active
{
	font-weight: bold;
}

/* - Characteristics of a house - */
TABLE.house_data
{

}

TABLE.house_data TR TD.title
{
	padding: 0.1em 0.5em 0.1em 1em;
	vertical-align: top;
}

TABLE.house_data TR TD.title-first
{
	font-weight: bold;
	padding-left: 0;
	white-space: nowrap;
	vertical-align: top;
}

TABLE.house_data TR TD.value
{
	padding: 0.1em 0.3em 0.1em 0em;
	vertical-align: top;
}

TABLE.house_data TR TD.button
{
	vertical-align: top;
	width: 100%;
}

TABLE.house_data TR TD.nowrap
{
	white-space: nowrap;
}

TABLE.house_data TR TD.value UL
{
	margin-top: 0.1em;
	margin-bottom: 0.5em;
}

TABLE.house_data TR TD H4
{
	padding: 0;
	margin: 0;
	font-weight: bold;
	font-size: 1.1em;
	display: inline;
}

TABLE.house_data TR TD H5
{
	padding: 0;
	margin: 0;
	font-weight: bold;
	font-size: 1em;
	display: inline;
}

TABLE.house_data TR TD H5
{
	margin-right: 0.5em;
}


/*-------------------*
    PAGES - CONTACT
 *-------------------*/
#contact div#page_copy
{
	float: left;
	width: 120px;
}

#contact div#form
{
	float: left;
	width: 325px;
	background-color: #e6e6e6;
	margin: 0px 0px 0px 15px;
}

#contact div#form h2
{
	margin-left: 20px;
	color: #a1a1a1;
}

#contact div#form P
{
	margin: 0px 15px 12px 15px;
}


/*----------------*
    PAGES - TOUR
 *----------------*/
#tour div#flash_background
{
	position: absolute;
	top: 115px;
	width: 100%;
	height: 480px;
	background: url('/images/shell/tour-repeat.jpg') repeat-x top left;
}

#tour div#flash_container
{
	position: relative;		/* this container is positioned inside the #flash_background container */
	left: 50%;
	margin-left: -493px;	/* ensures the div content is positioned centrally i.e. left 50% - half content width */
	width: 1026px;	/* 986 plus the combined width of the left and right drop shadows */
	height: 480px;
}

#tour div#flash_container img#left_shadow
{
	float: left;
}

* HTML #tour div#flash_container img#left_shadow
{
	display: none;
}

#tour div#flash_container img#right_shadow
{
	float: right;
}

* HTML #tour div#flash_container img#right_shadow
{
	display: none;
}

/*----------------*
    PAGES - NEWS
 *----------------*/
#news H2
{
	margin-bottom: 0;
}

#news H3
{
	margin-bottom: 0;
}

#news H4
{
	margin-top: 0;
	font-weight: normal;
}


/*---------*
    FORMS
 *---------*/
.asterisk
{
	font-weight: bold;
	font-size: 1.2em;
	color: #CC0000;
	margin-left: 3px;
	vertical-align: top;
}

FIELDSET
{
	font-family: Arial, Verdana, sans-serif;
	color: #454545;
	border: 0px;
}

LEGEND
{
	display: none;
}

FIELDSET .label
{
	float: left;
	width: 90px;
	padding: 0.5em 15px 0px 0px;
	margin-bottom: 3px;
	text-align: right;
	clear: left;
}

FIELDSET .field
{
	float: left;
	width: 190px;
	margin-bottom: 3px;
}

FIELDSET .field_with_text
{
	float: left;
	width: 190px;
	text-align: left;
	padding-top: 0.2em;
	margin-bottom: 3px;
}

FIELDSET .field_with_text span	/* vertical-align middle the text when next to a text field */
{
	padding-bottom: 0.3em;
	display: inline-block;
}


/*-----------------------------------------*
	MISC (MUST APPEAR LAST IN STYLESHEET)
 *-----------------------------------------*/
/* -- Float -- */
.fleft
{
	float: left;
}

.fright
{
	float: right;
}

