/*** =====  HAIRFREE - ESSENTIAL PLUS - by Jaze ===== ***/

/*=== RESET ===*/

html,body,div,span,applet,object,iframe,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,label,legend,p,blockquote,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}body{line-height:1;color:black;background:white;}:focus{outline:0;}table{border-collapse:collapse;border-spacing:0;}caption,th,td{text-align:left;font-weight:normal;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul{list-style:none;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}blockquote:before,blockquote:after,q:before,q:after{content:"";}blockquote,q{quotes:"" "";}abbr,acronym{border:0;}

/*=== GENERAL ===*/

body {
	background-image: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/white.gif');
	background-repeat: repeat;
	background-attachment: fixed;
	font-family: "Helvetica Neue", "Lucida Grande", Arial, Tahoma, sans-serif;
	font-size: 14px;
	color: #0b0b0b;
	overflow: hidden;
	height: 100%;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Helvetica Neue", "Lucida Grande", Arial, Tahoma, sans-serif;
}

h1 { font-size: 34px; letter-spacing: -0.2px; text-transform: uppercase; margin-bottom: 10px; }
h2 { font-size: 24px; margin-bottom: 10px; }
h3 { font-size: 18px; margin-bottom: 30px; }
h4 { font-size: 18px; margin-bottom: 5px; }
h5 { font-size: 14px; margin-bottom: 5px; }
h6 { font-size: 12px; margin-bottom: 5px; }

p { padding: 10px 0px 5px; line-height: 1.3em; }

.hide { display: none; }

.arrows { position: relative; float: right; display: block; margin-top: 50px; width: 90px; height: 39px; }

.arrows a {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/arrow.jpg') no-repeat;
	width: 45px;
	height: 39px;
	position: absolute;
}

.arrows .up { background-position: 0px 0px;	left: 0; }

.arrows .up:hover {	background-position: -90px 0px; }

.arrows .down { background-position: -45px 0px;	right: 0; }

.arrows .down:hover { background-position: -135px 0px; }

#spacer { width: 100%; height: 110px; display: block; }

/*=== HEADER ===*/

#layout_area_site { position: absolute; width: 100%; height: 100%; }

#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 80px;
	border-top: 6px solid #0B0B0B;
	z-index: 999;
}

#header h1 a {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/EssentialPlus-logo.jpg') top left no-repeat;
	width: 460px;
	height: 80px;
	display: block;
}

/*=== MASK ===*/

#mask_top {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/mask_top.png') bottom left repeat-x;
	width: 100%;
	height: 130px;
	display: block;
	position: fixed;
	z-index: 99;
}

#mask_bottom {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/mask_bottom.png') top left repeat-x;
	width: 100%;
	height: 80px;
	display: block;
	position: fixed;
	bottom: 0;
	z-index: 99;
}

.is_ie6 #mask_top, .is_ie6 #mask_bottom { display: none; } 

/*=== NAV ===*/

#nav, .is_ie7 #nav, .is_ie8 #nav {
	position: fixed;
	bottom: 0px;
	width: 900px;
	left: 50%;
	height: 30px;
	margin-left: -450px;
	padding-top: 15px;
	background: #0B0B0B;
	text-align: center;
	z-index: 999;
}

#nav a:link,#nav a:visited,#nav a:active {
	font-size: 16px;
	color: #FFFFFF;
	padding: 0px 40px;
	text-transform: uppercase;
	text-decoration: none;	
}

#nav a:hover { text-decoration: none; color: #41d514; }

.is_ie6 #nav { position: absolute; top: 0; right: 0; zoom: 1; padding-top: 10px; background: #0B0B0B; height: 30px; }


/*=== BODY ===*/
 
#body {
	width: 900px;
	margin: 0px auto;
	position: relative;
}

#intro, #product, #philosophy, #enquiries { position: relative; overflow: hidden; height: 1000px; }

.left { float: left; width: 350px; }

.right { margin: 0px 0px 0px 370px; }

/* Home */

.product {
	background: #0B0B0B url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/pack-icon.jpg') no-repeat ;
	color: #FFFFFF;
	padding: 10px;
	margin-bottom: 1px;
	height: 50px;
	display: block;
	text-decoration: none;
}

.product:hover { background-color: #41d514; cursor: pointer; } 	
	
.one, .three { background-position: right top;  }
.two { background-position: right -70px;  }

.one:hover, .three:hover { background-position: right -140px;  }
.two:hover { background-position: right -210px;  }

.product span { display: block; }
.product .title { font-size: 18px; margin-bottom: 5px; }
.product .description { font-size: 14px; }

/* Product */

#product .left { width: 200px; margin-top: 20px; }
#product .right { margin-left: 200px; margin-top: 40px; }

#product h5 { font-weight: bold; margin: 20px 0px 10px; }

#product .jump {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/pack-icon-small.jpg') no-repeat;
	color: #000000;
	position: absolute;
	width: 200px;
	right: 0px;
	font-size: 14px;
	text-transform: uppercase;
	height: 29px;
	display: block;
	padding: 5px 0px 5px 30px;
	text-decoration: none;
}

#product .next {
	margin-top: 40px;
}

#product .back {
	margin-top: -60px;
} 

#product .product1 { background-position: left 0px; }
#product .product2 { background-position: left -38px; }

/* Philosophy */

#philosophy .right { margin-top: 50px; }

/* Enquiries */

#enquiries .left { width: 500px; }
#enquiries .right { margin-left: 530px; }
#enquiries h3 { margin-bottom: 0px; }
#form-enquiries { padding: 10px 0px; } 
#enquiries label { float: left; width: 120px; margin: 5px 0px; }
#enquiries input, #enquiries textarea { width: 350px; border: 1px solid #0B0B0B; padding: 3px; height: 25px; margin: 0px 0px 8px 0px; }
#enquiries textarea { height: 80px; }

#enquiries input:hover, #enquiries input:focus, #enquiries textarea:hover, #enquiries textarea:focus { border-color: #41d514; }

#enquiries .bttn-send { display: block; border: none; color: #FFFFFF; width: 100px; margin: 15px 0px 0px 120px; height: 40px;  }

.not_ie #enquiries .arrows { display: none; }
.is_ie7 #enquiries .arrows { display: none; }
.is_ie6 #enquiries .arrows { display: block; }


/* Copyright */

.copyright { margin: 200px 0px 0px 0px; padding-top: 10px; border-top: 1px solid #CCCCCC; color: #999999; font-size: 11px; position: relative; }

.jaze {
	background: url('/Resources/HairfreePlus/Sites/EssentialPlus/Layout/logo_jaze.jpg') right top no-repeat;
	padding: 5px 65px 20px 0px;
	color: #999999;
	text-decoration: none;
	position: absolute;
	right: 0px;
	top: 5px;
}

.is_ie6 .copyright { zoom: 1; }