/*------------------------------------------------------------------

project:	Essex Industries
date created:	26 May 2009
author:	Paul Crawford

-------------------------------------------------------------------*/

@import url("baseforms.css");
@import url("thickbox.css");
@import url("sifr.css");


/*-------------------------------*/
/* Reset
/*-------------------------------*/
*, html, body, ul, ol, li, p,
h1, h2, h3, h4, h5, h6,
form, fieldset, a {
	margin: 0;
	padding: 0;
	border: 0;
}

* {	line-height: 1.6em; }


/*-------------------------------------------    
    Basic Selectors
-------------------------------------------*/
body {
	font-size: 62.5%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: #000000 url('../images/core/bg2.gif') top center repeat-x;
	color: #cccccc;
}

body#home{
	background: #000000 url('../images/core/bg.gif') top center repeat-x;
}


a { color: #e3333d; text-decoration: none; }
a:hover, a:focus { color: #ff0000; text-decoration: underline; }
span.mailto { color: #e3333d; }  
a.mailto { color: #e3333d; text-decoration: none;  }  
a.mailto:hover { color: #ff0000; text-decoration: underline; }  

h1 { font-size: 3em; color: #ffffff; }
h2 { font-size: 1.6em; color: #e3333d; font-weight: normal; }
h3 { font-size: 1.4em; color: #464a4c; font-weight: normal; }
h4 { font-size: 1.2em; color: #ababab; }
h5 { font-size: 1em; color: #ffffff; }
p { margin-bottom: 1.35em; }
h2, h3, h4, h5 { margin-bottom: 0.5em; }

.l-image { float: left; margin: 0 10px 10px 0;}
.clear { display: block; clear: both;}

ul { list-style-type: disc; margin-left: 30px; }

hr {
	border: 0;
	border-bottom: 1px solid #d9d9d9;
	height: 1%;
	margin: 15px 0;
	^margin: 0 0 10px 0; /* IE 7 */
}


/*-------------------------------*/
/* Container
/*-------------------------------*/
#bg-container {
	width: 100%; height: auto;
	background: url('../images/core/bg_container2.jpg') top center no-repeat;
	margin: 0 auto;
}

#home #bg-container {
	background: url('../images/core/bg_container.jpg') top center no-repeat;
}

#container {
	width: 920px; height: auto;
	margin: 0 auto;
}

#container:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}


/*-------------------------------*/
/* Header
/*-------------------------------*/
#header-container {	height: 501px; }

#header { height: 127px; }

#header h1 {
	width: 429px; height: 43px; 
	background: url('../images/core/logo_essex.jpg') no-repeat;
	text-indent: -9999px;
	margin: 38px 31px 0 11px;
	_margin: 38px 20px 0 11px; /* IE 6 fix */
	float: left;
}


/*-------------------------------*/
/* Top nav
/*-------------------------------*/
div#top-nav {
	width: 297px;
	height: 34px;
	padding-left: 623px;
}

div#top-nav ul { 	
	list-style-type: none;
	margin: 0;
}

div#top-nav ul li {
	display: block;
	float: left;
}

div#top-nav ul li a {
	float: left;
	overflow: hidden;
	text-indent: -9999px;
	height: 34px;
}

div#top-nav ul li a.home {
	width: 97px;
	background: url('../images/nav/nav_home.gif') 0 0 no-repeat;
}

div#top-nav ul li a.careers {
	width: 104px;
	background: url('../images/nav/nav_careers.gif') 0 0 no-repeat;
}

div#top-nav ul li a.contact {
	width: 96px;
	background: url('../images/nav/nav_contact.gif') 0 0 no-repeat;
}


/* -- Rollover -- */
div#top-nav ul li a:hover.home,
div#top-nav ul li a:hover.careers,
div#top-nav ul li a:hover.contact {
	background-position: 0 -34px !important;
}

/* -- Active -- */
div#top-nav li a:hover.home, 
body#home div#top-nav li a.home,
body#careers div#top-nav li a.careers,
body#contact div#top-nav li a.contact {
	background-position: 0 -34px !important;
}


/*-------------------------------*/
/* Nav
/*-------------------------------*/
div#nav {
	width: 449px;
	height: 127px;
	float: left;
}

div#nav ul { 	
	list-style-type: none;
	margin: 0;
}

div#nav ul li {
	display: block;
	float: left;
}

div#nav ul li a {
	float: left;
	overflow: hidden;
	text-indent: -9999px;
	height: 127px;
}

div#nav ul li a.profile {
	width: 123px;
	background: url('../images/nav/nav_profile.jpg') 0 0 no-repeat;
}

div#nav ul li a.projects {
	width: 125px;
	background: url('../images/nav/nav_projects.jpg') 0 0 no-repeat;
}

div#nav ul li a.testimonials {
	width: 191px;
	background: url('../images/nav/nav_testimonials.jpg') 0 0 no-repeat;
}


/* -- Rollover -- */
div#nav ul li a:hover.profile,
div#nav ul li a:hover.projects,
div#nav ul li a:hover.testimonials {
	background-position: 0 -127px !important;
}

/* -- Active -- */
div#nav li a:hover.profile, 
body#profile div#nav li a.profile,
body#projects div#nav li a.projects,
body#testimonials div#nav li a.testimonials {
	background-position: 0 -127px !important;
}


/*-------------------------------*/
/* Banner
/*-------------------------------*/
#banner {
  width: 920px; height: 230px;
}

#home #banner { 
	width: 920px; height: 340px;
	background: url('../images/core/bg_banner.jpg') 0 0 no-repeat;
}

#banner #flash-image {
	width: 899px; height: 230px;
	margin-left: 11px; 
	display: block; 
}

#home #banner #flash-image {
	width: 899px; height: 340px;
	margin-left: 11px; 
	display: block; 
}

body#home #banner #flash-image { background: url('../images/core/banner_home.jpg') 0 0 no-repeat;  }
body#profile #banner #flash-image { background: url('../images/core/banner_profile.jpg') 0 0 no-repeat;  }
body#projects #banner #flash-image { background: url('../images/core/banner_projects.jpg') 0 0 no-repeat;  }
body#testimonials #banner #flash-image { background: url('../images/core/banner_testimonials.jpg') 0 0 no-repeat;  }
body#careers #banner #flash-image { background: url('../images/core/banner_careers.jpg') 0 0 no-repeat;  }
body#contact #banner #flash-image { background: url('../images/core/banner_home.jpg') 0 0 no-repeat;  }
body#thankyou #banner #flash-image { background: url('../images/core/banner_home.jpg') 0 0 no-repeat;  }


/*-------------------------------*/
/* Content
/*-------------------------------*/
#content-container {
	width: 901px; height: auto;
	padding: 36px 9px 30px 10px;
}

#content {
	width: 672px;
	float: left;
	font-size: 1.2em;
}

body#thankyou #content { height: 350px; }

#content-wide {
	width: 901px;
	font-size: 1.2em;
}

#right-bar {
	width: 189px;
	float: left;
	margin-left: 40px;
	font-size: 1.1em;
}

/* --- cta --- */
#cta-applicant { margin-bottom: 2.7em; }

#cta-applicant a {
	width: 189px; height: 99px;
	background: url('../images/core/button_applicant.gif') 0 0 no-repeat;
	text-indent: -9999px;
	display: block;
	overflow: hidden;
}

#cta-applicant a:hover { background-position: 0 -99px !important; }

#cta-projects a {
	width: 189px; height: 99px;
	background: url('../images/core/button_projects.jpg') 0 0 no-repeat;
	text-indent: -9999px;
	display: block;
	overflow: hidden;
	margin-bottom: 2.7em;
}

#cta-projects a:hover { background-position: 0 -99px !important; }

/* --- quote --- */
#quote { 
	height: 123px;
}

#quote p { margin: 0; }

span.left-box { 
	background: url('../images/core/icon_left.gif') 0 0 no-repeat; 
	width: 20px; height: 20px; 
	display: block; 
	float: left;
	margin-top: -7px;
	padding-right: 3px; 
}

span.right-box { 
	background: url('../images/core/icon_right.gif') 0 0 no-repeat; 
	width: 20px; height: 20px; 
	display: block; 
	float: right; 
	margin-top: -10px; 
}

/* --- contact details --- */
#contact-details ul {
	list-style-type: none;
	margin: 0;
	border-top: 1px solid #464a4c;
}

#contact-details ul li {
	border-bottom: 1px solid #464a4c;
	padding: 2px 0 2px 4.3em;
}

#contact-details ul li.phone {
	background: url('../images/core/icon_phone.gif') 25px 4px no-repeat;
}

#contact-details ul li.fax {
	background: url('../images/core/icon_fax.gif') 25px 4px no-repeat;
}

#contact-details ul li.email {
	background: url('../images/core/icon_email.gif') 25px 4px no-repeat;
}


/*-------------------------------*/
/* Projects
/*-------------------------------*/
#projects-section {}

#projects-section ul {
	list-style-type: none;
	margin: 0;
}

#projects-section ul li { padding: 0 15px; }

#projects-section ul li h2 {
	padding: 10px 15px 10px 5px;
}

#projects-section ul li h2:hover { color: #fff; }

/* --- gallery --- */
div.gallery { 
	width: 800px; 
	float: left;
	padding: 0 15px;
}

div.gallery ul.gallery-list {
	list-style-type: none;
}

div.gallery ul li {
	display: inline;
	padding: 0 1.5em 1.5em 0;
	float: left;
}

div.gallery ul li a img {
	border: 5px solid #ababab;
}

div.gallery ul li a:hover img {
	border: 5px solid #e3333d;
}


/*-------------------------------*/
/* Contact
/*-------------------------------*/
#map {
	width: 320px;	height: 300px;
	float: right;
}

#width { height: 340px; }

#enquiry { 
	border-top: 1px dotted #464a4c;
	padding-top: 1.5em;
}


/*-------------------------------*/
/* Footer
/*-------------------------------*/
#footer-container {
	background: url('../images/core/bg_footer.jpg') top center repeat-x;
	height: 80px;
}

#footer {
 width: 901px;
 margin: 0 auto;
 padding: 20px 10px 0 9px;
}

/* --- affiliate logo --- */
#affiliate {
 width: 317px;
 float: left;
}

#affiliate ul {
	list-style-type: none;
	margin: 0;
}

#affiliate ul li {
	float: left;
	margin-right: 20px;
}

/* --- links --- */
#footer-links {
	width: 450px;
	float: left;
	color: #6f6e6e;
	font-size: 1.1em;
	margin-right: 60px;
	_	margin-right: 40px; /* IE 6 fix */
}

#footer-links a { color: #6f6e6e; text-decoration: none; padding: 0 10px; }
#footer-links a.none { padding: 0 10px 0 0; }
#footer-links a:hover { color: #e3333d; text-decoration: underline; }

/* --- wflogo --- */
#wflogo {
	width: 67px; height: 21px;
	float: left;
	margin-top: 9px;
}

