/*-----------------------------------------------------------------------------
HBI Screen Stylesheet

version:   1.0
date:      18/07/07
author:    Nick de Jardine
email:     nick at neogine dot com

website:   neogine.com

version history: [location of file]
-----------------------------------------------------------------------------*/


/* Remove margin, padding and border from everything
-----------------------------------------------------------------------------*/

* 
	{
	margin: 0;
	padding: 0;
	
	border: 0;
}

/* Styles for layout
-----------------------------------------------------------------------------*/

.clear
	{
	clear: both;
	font-size: 0.1em;
	line-height: 0.1em;
}


p.clear
	{
	clear: both;
	font-size: 0.1em;
	line-height: 0.1em;
}


.right
	{
	float: right;
}



.left
	{
	float: left;
}

/* Set up the document
-----------------------------------------------------------------------------*/

body
	{
	font: 62.5%/1.5 Verdana, helvetica, sans-serif;
	background-color: #474026;
	color: #000000;	
	text-align: center;
}

#mainWrapper
	{ 
	width: 835px; /* Set page width here - you can also use percentage */
	text-align:left;  
	margin-left:auto; 
	margin-right:auto; 
	background-color: #474026;
}


/* Image treatment
-----------------------------------------------------------------------------*/

a.indexImage img {
filter:alpha(opacity=70); 
-moz-opacity: 0.7; 
opacity: 0.7;
zoom: 1;
}

a.indexImage:hover img {
filter:alpha(opacity=100);   
-moz-opacity: 1.0;   
opacity: 1.0;
zoom: 1;
}

a.galleryImage img {
filter:alpha(opacity=70); 
-moz-opacity: 0.7; 
opacity: 0.7;
zoom: 1;
}

a.galleryImage:hover img {
filter:alpha(opacity=100);   
-moz-opacity: 1.0;   
opacity: 1.0;
zoom: 1;
}

.hayleyImage
	{
	float: right;
	margin: 0 2em 2em 0;
	clear: both;
}



/* Typography
-----------------------------------------------------------------------------*/

h1
	{
	font-size: 2.2em; /* Equivalent to 22pt */
}
	
h2
	{
	font-size: 2.0em; /* Equivalent to 20pt */
}
	
h3
	{
	font-size: 1.8em; /* Equivalent to 18pt */
}
	
h4
	{
	font-size: 1.6em; /* Equivalent to 18pt */
}
	
h5
	{
	font-size: 1.4em; /* Equivalent to 14pt */
}
	
p, q, cite
	{
	font-size: 1.0em; /* Equivalent to 10pt */
	color: #4c4c4c;
	}

ul, ol, dl
	{
	list-style: none;
	font-size: 1.2em; /* Equivalent to 12pt */
}

li, dd, dt
	{
	font-size: 1.2em; /* Equivalent to 12pt */	
}

/* Header
-----------------------------------------------------------------------------*/
#header
	{
	margin-top: 60px;
	padding:0;
	width: 835px;
	height: 47px;
	margin-bottom: 25px;

}

#logoSecondary
	{
	padding:0;
	margin:5px 0 0 0;
	position: relative;
	width: 281px;
	height: 31px;
	text-align: right;
	float: right;
}


/* Navigation
-----------------------------------------------------------------------------*/
body#index #mainWrapper #navContainer
	{
	width: 835px;
	margin: 0;
	padding:0;
	
}

body#secondary #mainWrapper #navContainer
	{
	width: 835px;
	margin-top: 60px;
	padding:0;
	
}


#mainNavContainer
	{
	margin: 0;
	padding: 0;
	width: 450px;
	height: 50px;
	float: left;
}


ul#mainNav
{
	position: relative;
	margin:0;
	padding:0;
	width: 450px;
	height: 55px;
}

ul#mainNav li  
	{
	display: block;
	text-indent: -9999px;
	
}

ul#mainNav li a
	{
	text-decoration: none;
	color: #fff;
	
}

ul#mainNav li a#process{ /* process */
	position: absolute;
	left: 0px;
	top: 5px;
	width: 53px;
	height: 50px;
	background:   url("../images/menuProcess.gif") 0 0 no-repeat;
	outline: none;
}
ul#mainNav li a#process:hover{
	background:   url("../images/menuProcess.gif") -52px 0 no-repeat;
}

ul#mainNav li a#processSelected{ /* process */
	position: absolute;
	left: 0;
	top: 5px;
	width: 53px;
	height: 50px;
	background:   url("../images/menuProcessSelected.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#philosophy{ /* philosophy */
	position: absolute;
	left: 73px;
	top: 5px;
	width: 72px;
	height: 50px;
	background:   url("../images/menuPhilosophy.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#philosophy:hover{
	background:   url("../images/menuPhilosophy.gif") -71px 0 no-repeat;
}

ul#mainNav li a#philosophySelected{ /* philosophy */
	position: absolute;
	left: 73px;
	top: 5px;
	width: 72px;
	height: 50px;
	background:   url("../images/menuPhilosophySelected.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#gallery{ /* gallery */
	position: absolute;
	left: 164px;
	top: 5px;
	width: 51px;
	height: 50px;
	background:   url("../images/menuGallery.gif") 0 0 no-repeat;
	outline: none;
}
ul#mainNav li a#gallery:hover{
	background:   url("../images/menuGallery.gif") -52px 0 no-repeat;
}

ul#mainNav li a#gallerySelected{ /* gallery */
	position: absolute;
	left: 164px;
	top: 5px;
	width: 51px;
	height: 50px;
	background:   url("../images/menuGallerySelected.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#published{ /* published */
	position: absolute;
	left: 239px;
	top: 5px;
	width: 65px;
	height: 50px;
	background:   url("../images/menuPublished.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#published:hover{
	background:   url("../images/menuPublished.gif") -64px 0 no-repeat;
}

ul#mainNav li a#publishedSelected{ /* published */
	position: absolute;
	left: 239px;
	top: 5px;
	width: 65px;
	height: 50px;
	background:   url("../images/menuPublishedSelected.gif") 0 0 no-repeat;
	outline: none;
}

ul#mainNav li a#contact{ /* contact */
	position: absolute;
	left: 331px;
	top: 5px;
	width: 52px;
	height: 50px;
	background:   url("../images/menuContact.gif") 0 0 no-repeat;
	outline: none;
}
ul#mainNav li a#contact:hover{
	background:   url("../images/menuContact.gif") -52px 0 no-repeat;
}

ul#mainNav li a#contactSelected{ /* contact */
	position: absolute;
	left: 331px;
	top: 5px;
	width: 52px;
	height: 50px;
	background:   url("../images/menuContactSelected.gif") 0 0 no-repeat;
	outline: none;
}

/* Search
-----------------------------------------------------------------------------*/
#searchBox
	{
	margin: 0;
	padding: 0;
	float: right;
	width: 365px;
	height: 50px;
	text-align: right;
	position: relative;
}

form#submitEmail
	{
	margin: 0;
	padding:0;
	width: 365px;
	height: 50px;
	text-align: right;

}

form#submitEmail p
	{
	display: block;	
}

form#submitEmail p label
	{
	position: absolute;
	top:0;
	left:161px;
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	color: #a8a28a;
	overflow: hidden;
}

form#submitEmail p input#FormValue_EmailAddress
	{
	position: absolute;
	top:20px;
	left:20px;
	margin: 0;
	padding: 0;
	width: 156px;
	height: 25px;

}
form#submitEmail p input#FormValue_CustomField9
	{
	position: absolute;
	top:20px;
	left:180px;
	margin: 0;
	padding: 0;
	width: 156px;
	height: 25px;

}
form#submitEmail p input#FormButton_Subscribe
	{
	position: absolute;
	top:20px;
	left:340px;
	margin: 0;
	padding: 0;
	width: 25px;
	height: 25px;
	background: url("../images/buttonSubmit.gif") 0 0 no-repeat;
	text-indent: -9999px;

}



form#unsubscribe p label
	{
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	color: #a8a28a;
	}

form#unsubscribe p input#FormValue_EmailAddress
	{
	margin: 0;
	padding: 0;
	width: 176px;
	height: 25px;
	border:1px solid #cc0033;
}

form#unsubscribe p input#FormButton_Unsubscribe
	{
	margin: 0;
	padding: 0;
	width: 85px;
	height: 25px;
	background: url("../images/buttonSubmitEmail.gif") 0 0 no-repeat;
	text-indent: -9999px;

}




/* Footer
-----------------------------------------------------------------------------*/
#footer
	{
	position: relative;
	margin: 0;
	padding: 0;
	width: 835px;
	height: 200px;
	text-align: left;
}

#footer ul
	{
	position: absolute;
	top: 380px;
	left:0;
	margin: 0;
	padding: 0;

}

#footer ul li
	{
	display: inline;
	color: #a8a28a;
	font-size: 0.8em;
	line-height: 2.0em;
}

#footer ul li a
	{
	color: #a8a28a;
	text-decoration: none;
}

#footer ul li a:hover
	{
	color: #a8a28a;
	text-decoration: underline;
}


body#secondary #mainWrapper #footer ul
	{
	position: absolute;
	top: 40px;
	left:0;
	margin: 0;
	padding: 0;

}

#footerFlash
	{
	position: relative;
	margin: 0;
	padding: 0;
	width: 835px;
	height: 200px;
	text-align: left;
}


#footerFlash ul li
	{
	display: inline;
	color: #a8a28a;
	font-size: 0.8em;
	line-height: 2.0em;
}

#footerFlash ul li a
	{
	color: #a8a28a;
	text-decoration: none;
}

#footerFlash ul li a:hover
	{
	color: #a8a28a;
	text-decoration: underline;
}


body#secondary #mainWrapper #footerFlash ul
	{
	position: absolute;
	top: 40px;
	left:0;
	margin: 0;
	padding: 0;

}


#footerGallery
	{
	position: relative;
	margin: 0;
	padding: 0;
	width: 835px;
	height: 200px;
	text-align: left;
}

#footerGallery ul
	{
	position: absolute;
	top: 40px;
	left:0;
	margin: 0;
	padding: 0;

}

#footerGallery ul li
	{
	display: inline;
	color: #a8a28a;
	font-size: 0.8em;
	line-height: 2.0em;
}

#footerGallery ul li a
	{
	color: #a8a28a;
	text-decoration: none;
}

#footerGallery ul li a:hover
	{
	color: #a8a28a;
	text-decoration: underline;
}





/* headings
-----------------------------------------------------------------------------*/

.mainHeading
	{
	margin:0 0 10px 0;
	padding:0;
}


/* Content
-----------------------------------------------------------------------------*/

#contentWrapper
	{
    position: relative;
	margin: 0;
	margin-top:0;
	padding: 0;
	width: 835px;
	text-align: left;
}

body#secondary #mainWrapper #contentWrapper
	{
	position: relative;
	margin: 0;
	margin-top:0;
	padding: 0 0 40px 0;
	width: 835px;
	height: 400px;
	overflow: hidden;
	text-align: left;
	background: #fff;
}

body#secondary #mainWrapper #contentWrapperFlash
	{
    position: relative;
	margin: 0;
	margin-top:0;
	padding: 0 0 40px 0;
	width: 835px;
	height: 500px;
	overflow: hidden;
	text-align: left;
	background: #fff;
}


#contentWrapper #image1
	{
	position: absolute;
	left:0;
	top:0;
	margin: 0;
	padding:0;
	width: 205px;
	height: 295px;
	display: block;
	z-index:10;
}

#contentWrapper #rightText a
	{
	color:#cc0033;
	text-decoration: none;
}

#contentWrapper #rightText a:hover
	{
	color:#cc0033;
	text-decoration: underline;
}


#contentWrapper #image2
	{
	position: absolute;
	left:210px;
	top:0;
	margin: 0;
	padding:0;
	width: 205px;
	height: 295px;
	display: block;
	z-index:10;	
}

#contentWrapper #image3
	{
	position: absolute;
	left:630px;
	top:0;
	margin: 0;
	padding:0;
	height: 295px;
	width: 205px;
	display: block;
	z-index:10;
}

#contentWrapper #text1
	{
	position: absolute;
	left:420px;
	top:0;
	margin: 0;
	padding:0;
	height: 295px;
	width: 205px;
	display: block;
	overflow: hidden;
	background: #cc0033;
}


#contentWrapper #text1 p
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	text-align: left;
	padding: 0.8em;
	line-height: 1.7em;
}

#contentWrapper #text1 h1
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	padding: 0.8em 0.8em 0 0.8em;
}


#contentWrapper #text2
	{
	position: absolute;
	left:420px;
	top:0;
	margin: 0;
	padding:0;
	height: 295px;
	width: 205px;
	display: block;
	overflow: hidden;
	background: #cc0033;
}


#contentWrapper #text2 p
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	text-align: left;
	padding: 0.8em;
	line-height: 1.7em;
}

#contentWrapper #text2 h1
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	padding: 0.8em 0.8em 0 0.8em;
}


#contentWrapper #text3
	{
	position: absolute;
	left:420px;
	top:0;
	margin: 0;
	padding:0;
	height: 295px;
	width: 205px;
	display: block;
	overflow: hidden;
	background: #cc0033;
}


#contentWrapper #text3 p
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	text-align: left;
	padding: 0.8em;
	line-height: 1.7em;
}



#contentWrapper #text3 h1
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	padding: 0.8em 0.8em 0 0.8em;
}

#contentWrapper #text-home
	{
	position: absolute;
	left:420px;
	top:0;
	margin: 0;
	padding:0;
	height: 295px;
	width: 205px;
	display: block;
	overflow: hidden;
	background: #cc0033;
}


#contentWrapper #text-home p
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	text-align: left;
	padding: 0.8em;
	line-height: 1.7em;
}

#contentWrapper #text-home h1
	{
	margin: 0;
	padding:0;
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	padding: 0.8em 0.8em 0 0.8em;
}


#contentWrapperFlash #galleryHeading
	{
	width: 500px;
	height: 31px;
	padding:0;
	margin-left: 113px;
	margin-top: 40px;
}

#contentWrapper #lettheBeauty
	{
	position: absolute;
	left:0;
	top:320px;
	margin: 0;
	padding:0;
	color: #fff;
	text-align: left;

}


div#leftImage
	{
	padding: 40px 0 0 0;
	margin:0;
	float: left;
}


div#terms
	{
	padding: 40px 0 0 40px;
	margin:0;
	width: 765px;
}

div#rightText
	{
	margin:0;
	padding: 35px 40px 0 0;
	float: right;
	width: 480px;

}

div#rightText p
	{
	margin-bottom: 20px;


}

div#flashcontent
	{
	margin: 0 auto 0 auto;
	padding: 0;
	width: 835px;
	height: 418px;
	text-align: center;
}

div#flashcontent p.noFlash
	{
	padding-top: 40px;
	margin:0;
	font-size: 1.6em;
}

div#flashcontent p.noFlash a
	{
	color: #000;
}

body#secondary #mainWrapper #contentWrapperGallery
	{
    position: relative;
	margin: 0;
	padding: 0 0 40px 0;
	width: 835px;
	height: 400px;
	text-align: left;
	background-color: #fff;
}

body#secondary #mainWrapper #contentWrapperGallery h1
	{
	margin: 0;
	padding:0;
	color: #474026;
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	padding: 0;
}

body#secondary #mainWrapper #contentWrapperGallery #introText
	{
    position: absolute;
	top:0;
	left:0;
	margin: 0 0 0 0;
	padding: 40px 0 0 40px;
	width: 795px;
	text-align: left;
	background-color: #fff;
}

body#secondary #mainWrapper #contentWrapperGallery #kitchens
	{
	position: absolute;
	left:40px;
	top:70px;
	margin: 0;
	padding:0;
	width: 205px;
	height: 295px;
	display: block;
	overflow: visible;
}

body#secondary #mainWrapper #contentWrapperGallery #bathrooms
	{
	position: absolute;
	left:255px;
	top:70px;
	margin: 0;
	padding:0;
	width: 205px;
	height: 295px;
	display: block;
	overflow: visible;
}

body#secondary #mainWrapper #contentWrapperGallery #awards
	{
	position: absolute;
	left:470px;
	top:70px;
	margin: 0;
	padding: 0;
	width: 205px;
	height: 295px;
	display: block;
	overflow: visible;
}

body#secondary #mainWrapper #contentWrapperFlash #galleryButtons
	{
	width: 400px;
	height: 35px;
	margin: 0 0 0 115px;
	margin-bottom:0;
	padding: 0;

}

body#secondary #mainWrapper #contentWrapperFlash #galleryButtons ul
	{
	border: none;
	margin:0;
	padding:0;
	list-style: none;
	}

body#secondary #mainWrapper #contentWrapperFlash #galleryButtons ul li
	{
	border:none;
	margin:0;
	padding:0;
	display: inline;
	}


body#secondary #mainWrapper #contentWrapperFlash #galleryButtons ul li a
	{
	display: -moz-inline-stack;
	border: 1px solid #474026;
	width: 125px;
	height: 20px;
	text-decoration: none;
	font-size: 0.7em;
	font-weight: bold;
	color: #474026;
	padding: 4px 5px 3px 0.7em;	
	margin:0 10px 0 0;
}

body#secondary #mainWrapper #contentWrapperFlash #galleryButtons ul li a:hover
	{
	background-color: #cc0033;
	color: #fff;
}


/* Forms
-----------------------------------------------------------------------------*/



input.text
	{
	padding: 3px;
	border: 1px solid #999999;	
}


/* Tables 
-----------------------------------------------------------------------------*/



table
 	
	{ 
  	border-spacing: 0;
	border-collapse: collapse;
}

td 
	
	{
  	text-align: left;
	font-weight: normal;
}