/* __________________________________________________________________________________________________
Theme Name: Essential Works
Theme URI: http://essentialworks.co.uk
Description: Theme for the Essential Works website
Author: Michael Gray at Essential Works
___________________________________________________________________________________________________*/


/* BLANKET STYLES
___________________________________________________________________________________________________*/

* {
	margin:0;
	padding:0;
	}

strong {
	font-weight:bold;
	}

em {
	font-style:italic;
	}

img, fieldset {
	border:none;
	}

body {
	/* background:#F7F8F9 url(_images/bg_body.png) repeat; */
	background:#F7F7F7 url(_images/bg_body.png) repeat;
	color:#333;
	font:62.5% "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica Neue", Verdana, sans-serif;
	height:100%;
	}

html {
	height:100%;
	}

abbr, acronym {
	border:0;
	}

/* OFF SCREEN
___________________________________________________________________________________________________*/

.off_screen, .tools dt.off_screen {
	position:absolute;
	left:-999px;
	width:820px;
	}

/* MAIN TEXT STYLES
___________________________________________________________________________________________________*/

h1, h2, h3, h4, h5, h6, p, ul, ol, dl {
	font-size:1.2em;
	line-height:2em;
	}

h1, h2, h3 {
	color:#333;
	}
	
h4, h5, h6 {
	color:#000;
	}

h3 {
	font-size:2.7em;
	line-height:1.125em;
	}

p, ul, ol, dl {
	margin-bottom:1em;
	}

ul ul, ol ol, dl dl {
	font-size:100%;
	}

/* ERROR STYLES
___________________________________________________________________________________________________*/

.error {
	color:#ED1A37;
	}


/* LINK STYLES
___________________________________________________________________________________________________*/

a:link, a:visited {
	color:#ED1A37;
	text-decoration:none;
	}
	
a:hover {
	color:#ED1A37;
	text-decoration:underline;
	}
	
a:active {
	color:#ED1A37;
	text-decoration:none;
	}

a:focus {
	color:#ED1A37;
	text-decoration:none;
	}

/* FORMS
___________________________________________________________________________________________________*/

input, textarea {
	border:none;
	color:#333;
	font:100%/2em "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica Neue", Verdana, sans-serif;
	}

input {
	height:24px;
	padding:0 6px 0 2px;
	}

input:focus, input.focus, textarea:focus, textarea.focus {
	color:#000;
	}

textarea {
	overflow:auto;
	padding:2px 6px 6px 2px;
	}

div.content label {
	font-weight:bold;
	}

div.content input, div.content textarea {
	margin-bottom:1.2em;
	}

div.content input {
	background:url(_images/bg_input_content.png) no-repeat right top;
	width:260px;
	}
	
div.content textarea {
	background:url(_images/bg_textarea_content.png) no-repeat right top;
	height:232px;
	width:540px;
	}

/* LAYOUT DIVISIONS
___________________________________________________________________________________________________*/

#container {
	background:url(_images/bg_div_container.png) repeat-y 140px 0;
	margin:0 auto;
	min-height:100%;
	width:828px;
	}

#header {
	height:120px;
	}
	
#navigation {
	float:left;
	padding-top:3px;
	position:absolute;
	width:128px;
	z-index:4;
	}

#main {
	float:right;
	width:688px;
	}
	
#footer {
	clear:both;
	padding:24px 0 24px 140px;
	}

#main div.post {
	clear:both;
	}

#main div.content {
	float:right;
	margin-bottom:1.2em;
	width:548px;
	}

div.tools * {
	font-size:1em;
	line-height:1.8em;
	list-style:none;
	margin-bottom:0;
	}
	
div.tools {
	border-bottom:1px solid #999;
	margin-bottom:1.2em;
	width:128px;
	}
	
/* ADDITIONAL RULES FOR HEADER DIVISION
___________________________________________________________________________________________________*/

#header h1 a {
	background:url(_images/bg_h1_a.png) no-repeat 0 16px;
	display:block;
	height:114px;
	position:absolute;
	top:0;
	text-indent:-5000px;
	width:76px;
	z-index:3;
	}

/* ADDITIONAL RULES FOR NAVIGATION DIVISION
___________________________________________________________________________________________________*/

/* Additional rules for primary navigation */

#navigation ul {
	list-style:none;
	}

#navigation ul.primary {
	font-size:1.4em;
	line-height:1.71428571429em;
	list-style:none;
	}	

#navigation a {
	display:block;
	}

#navigation ul.primary a {	
	text-indent:-5000px;
	text-transform:uppercase;
	}
	
#home_primary {
	background:url(_images/bg_navigation_a_home.png) no-repeat left top;
	}
	
#work_primary {
	background:url(_images/bg_navigation_a_work.png) no-repeat left top;
	}

#clients_primary {
	background:url(_images/bg_navigation_a_clients.png) no-repeat left top;
	}

#agency_primary {
	background:url(_images/bg_navigation_a_agency.png) no-repeat left top;
	}
	
#blog_primary {
	background:url(_images/bg_navigation_a_blog.png) no-repeat left top;
	}
	
#contacts_primary {
	background:url(_images/bg_navigation_a_contacts.png) no-repeat left top;
	}

#home_primary.current, #home_primary:hover, #home_primary:active, #work_primary.current, #work_primary:hover, #work_primary:active, #clients_primary.current, #clients_primary:hover, #clients_primary:active, #agency_primary.current, #agency_primary:hover, #agency_primary:active, #blog_primary.current, #blog_primary:hover, #blog_primary:active, #contacts_primary.current, #contacts_primary:hover, #contacts_primary:active {
	background-position:left bottom;
	}

/* Additional rules for secondary and tertiary navigation */

#navigation h4 {
	color:#000;
	font-size:1.2em;
	line-height:2em;
	margin-bottom:0;
	}

#navigation h4.secondary, #navigation h4.tertiary {
	display:block;
	height:21px;
	margin-top:36px;
	text-indent:-5000px;
	}

#navigation ul.secondary li.current_page_item {
	display:none;
	}

#navigation ul.secondary a {
	display:block;
	}
	
#work_secondary {
	background:url(_images/bg_navigation_h4_work.png) no-repeat left top;
	}

#clients_secondary {
	background:url(_images/bg_navigation_h4_clients.png) no-repeat left top;
	}

#agency_secondary {
	background:url(_images/bg_navigation_h4_agency.png) no-repeat left top;
	}
	
#blog_secondary {
	background:url(_images/bg_navigation_h4_blog.png) no-repeat left top;
	}
	
#contacts_secondary {
	background:url(_images/bg_navigation_h4_contacts.png) no-repeat left top;
	}

#work_tertiary {
	background:url(_images/bg_navigation_h4_work_tertiary.png) no-repeat left top;
	}

/* Additional rules for search division */

#search form {
	position:absolute;
	left:632px;
	top:-104px;
	width:200px;
	z-index:1;
	}

#s {
	background:url(_images/bg_input_s.png) no-repeat right top;
	float:left;
	margin-right:12px;
	width:132px;
	}
	
#searchsubmit {
	background:url(_images/bg_input_searchsubmit.png) no-repeat left top;
	text-indent:-5000px;
	width:44px;
	}
	
#searchsubmit.hover, #searchsubmit:hover {
	background-position:bottom;
	}

/* ADDITIONAL RULES FOR MAIN DIVISION
___________________________________________________________________________________________________*/

#main .standfirst {
	color:#000;
	font-weight:normal;
	}

/* Additional text rules for post divisions */

#main .post .standfirst {
	font-weight:bold;
	}

/* Additional text rules for content divisions */

#main h3.title, #main p.title {
	/*position:relative;*/
	margin-left:140px;
	}

#main .post .content .standfirst {
	font-weight:normal;
	/*font-size:1.6em;
	line-height:1.5em*/
	}
	
#main .content h5, #main .content h6 {
	font-size:1em;
	line-height:2.3em;
	letter-spacing:0.375em;
	text-transform:uppercase;
	}

#main .content h6 {
	font-weight:normal;
	}

/* Additional text rules for tools divisions */

#main .post .tools .standfirst {
	font-weight:normal;
	}

/* Additional list rules for content divisions */

#main .content ul, #main .content ol {
	padding-left:0em;
	margin-left:1.2em;
	}

#main .content ul {
	list-style:square;
	}

#main .content ol.upper-alpha {
	list-style:upper-alpha;
	}

#main .content li {
	padding-left:0em;
	margin-left:1.8em;
	}

/* Main feature image */

#main #main_image {
	position:relative;
	right:12px;
	margin-bottom:3.6em;
	}

/* Additional image and caption rules for content divisions */

#main .content img {
	border:1px solid #E5E5E5;
	margin-bottom:1em;
	}

#main .content img.cutout {
	border:none;
	}

#main .content div.wp-caption img {
	margin-bottom:0;
	padding-top:0;
	}

#main .content .alignleft {
	float:left;
	margin-right:1.2em;
	}

#main .content .alignright {
	float:right;
	margin-left:1.2em;
	}

#main .content .alignnone {
	float:right;
	}

#main .content .aligncenter, #main .content div.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
	}

#main .content div.wp-caption {
	background-color:#e5e5e5;
	border-bottom:1px solid #999;
	margin-bottom:1em;
	}

#main .content p.wp-caption-text {
	font-size:1.0em;
	font-weight:bold;
	line-height:2.3em;
	margin-top:0.4em;
	padding:0 6px;
	}

/* Additional rules for testimonials */

#main .content blockquote.testimonial {
	background:url(_images/bg_blockquote.png) no-repeat left top;
	margin-top:2em;
	}

#main .content blockquote.testimonial p {
	background:url(_images/bg_blockquote_p.png) no-repeat right bottom;
	color:#000;
	margin-bottom:0;
	padding:0 3em;
	}

#main .content dl.testimonial {
	padding:0 3em;
	margin-bottom:2em;
	}

#main .content dl.attribution-303 {
	background:url(_images/bg_dl_attribution-303.png) no-repeat right bottom;
	}

#main .content dl.testimonial dt {
	color:#000;
	}

#main .content dl.testimonial dd {
	font-size:83.33333333335%;
	line-height:2.3em;
	letter-spacing:0.375em;
	text-transform:uppercase;
	}

/* Additional rules for image galleries in content divisions */

#main .content .ngg-gallery-thumbnail img {
	background-color:#FFF;
	border:1px solid #e5e5e5;
	display:block;
	margin:0 0 1.8em;
	padding:0px;
}

/* Additional rules for content divisions on contacts page */

#contact_submit {
	background:url(_images/bg_input_contactsubmit.png) no-repeat left top;
	text-indent:-5000px;
	width:128px;
	}
	
#login_submit {
	background:url(_images/bg_input_loginsubmit.png) no-repeat left top;
	text-indent:-5000px;
	width:128px;
	}	
	
#contact_submit.hover, #contact_submit:hover, #login_submit.hover, #login_submit:hover {
	background-position:bottom;
	}

/* Additional rules for client list */

#main .content ul#client_list {
	margin-left:0;
	}

#main .content ul#client_list li {
	display:inline;
	margin-left:0;
	margin-right:2.4em;
	}
	
#main .content ul#client_list li img {
	border:0;
	}
	
/* Additional rules for tools divisions */

div.tools a {
	border-top:1px solid #999;
	display:block;
	height:23px;
	line-height:23px;
	padding-left:6px;
	width:122px;
	}

div.tools a.icon {
	padding:0 6px 0 24px;
	width:98px;
	}
	
div.tools span.icon {
	padding:0 6px 0 18px;
	width:104px;
	}

div.tools a:hover, div.tools a:active {
	background-color:#d5d5d5;
	text-decoration:none;
	}

div.tools dd.author {
	font-weight:bold;
	line-height:0;
	}

div.tools dd.author_photo {
	position:relative;
	right:6px;
	}
	
div.tools dd.author_photo a {
	border:0;
	}

div.tools dd.date {
	border-top:1px solid #999;
	height:23px;
	line-height:23px;
	padding-left:6px;
	width:122px;
	}

/* Additional rules for tools divisions on pages */

div.tools dl.meta dt, div.tools dl.meta dd {
	padding-left:6px;
	padding-right:6px;
	width:116px;
	}

div.tools dl.meta dt {
	border-top:1px solid #999;
	color:#000;
	padding-top:2px;
	}
	
div.tools dl.meta dd {
	padding-bottom:3px;
	}

div.tools dl.meta dd.following {
	border-top:1px solid #999;
	}

#main.blog div.tools {
	padding-top:39px;
	}

/* Additional rules for Google map */

#map {
	height:540px;
	width:548px;
	}
	
#map p {
	line-height:1.8em;
	}
	

/* Additional rules for sitemap */

#main .content ul#ul_sitemap {
	font-weight:bold;
	list-style:none;
	margin-left:0;
	}

#main .content ul#ul_sitemap li {
	margin-top:1.2em;
	}

#main .content ul#ul_sitemap ul {
	font-weight:normal;
	margin-bottom:0;
	}

#main .content ul#ul_sitemap ul li {
	margin-top:0;
	}
	
/* ADDITIONAL RULES FOR FOOTER DIVISION
___________________________________________________________________________________________________*/

/* Additional rules for footer tools division */

#footer div.tools {
	padding-top:0;
	}

#footer p {
	font-size:1em;
	line-height:1.8em;
	padding-bottom:1.2em;
	}
	
#arrow_left {
	background:url(_images/bg_span_arrow_left.png) no-repeat left center;
	}
	
#arrow_right {
	background:url(_images/bg_span_arrow_right.png) no-repeat left center;
	}
	
/* Additional rules for copyright notice */
#copyright {
	left:6px;
	position:relative;
	width:116px;
	}
	
/* ADDITIONAL RULES FOR SHARING LINKS (Used in footer and post divisions)
___________________________________________________________________________________________________*/

ul.sharing_links li {
	left:0;
	}
	
.facebook {
	background:url(_images/bg_sharing_a_facebook.png) no-repeat left bottom;
	}
	
.facebook:hover, .facebook:active {
	background:url(_images/bg_sharing_a_facebook.png) no-repeat left top;
	}

.delicious {
	background:url(_images/bg_sharing_a_delicious.png) no-repeat left bottom;
	}
	
.delicious:hover, .delicious:active {
	background:url(_images/bg_sharing_a_delicious.png) no-repeat left top;
	}

.digg {
	background:url(_images/bg_sharing_a_digg.png) no-repeat left bottom;
	}
	
.digg:hover, .digg:active {
	background:url(_images/bg_sharing_a_digg.png) no-repeat left top;
	}

.stumbleupon {
	background:url(_images/bg_sharing_a_stumbleupon.png) no-repeat left bottom;
	}
	
.stumbleupon:hover, .stumbleupon:active {
	background:url(_images/bg_sharing_a_stumbleupon.png) no-repeat left top;
	}

.reddit {
	background:url(_images/bg_sharing_a_reddit.png) no-repeat left bottom;
	}
	
.reddit:hover, .reddit:active {
	background:url(_images/bg_sharing_a_reddit.png) no-repeat left top;
	}
	
.twitter {
	background:url(_images/bg_sharing_a_twitter.png) no-repeat left bottom;
	}
	
.twitter:hover, .twitter:active {
	background:url(_images/bg_sharing_a_twitter.png) no-repeat left top;
	}
	
.linkedin {
	background:url(_images/bg_sharing_a_linkedin.png) no-repeat left bottom;
	}
	
.linkedin:hover, .linkedin:active {
	background:url(_images/bg_sharing_a_linkedin.png) no-repeat left top;
	}
	
.pdf {
	background:url(_images/bg_pdf_a.png) no-repeat left bottom;
	}
	
.pdf:hover, .pdf:active {
	background:url(_images/bg_pdf_a.png) no-repeat left top;
	}
	
/* MODIFICATIONS & EXTRA RULES FOR THE HOMEPAGE
___________________________________________________________________________________________________*/

body.home {
	background:#000 url(_images/bg_body_home.png) repeat;
	color:#F7F7F7;
	}
	
body.home #container {
	background-color:#000;
	background-image:none;
	}

body.home div.tools {
	border-bottom:1px solid #474747;
	}

body.home #header h1 a {
	background-image:url(_images/bg_h1_a_home.png);
	}
	
body.home div.tools a {
	border-top:1px solid #474747;
	}

body.home div.tools a:hover, body.home div.tools a:active {
	background-color:#353535;
	}
	
body.home #home_primary {
	background:url(_images/bg_navigation_a_home_home.png) no-repeat left top;
	}
	
body.home #work_primary {
	background:url(_images/bg_navigation_a_work_home.png) no-repeat left top;
	}

body.home #clients_primary {
	background:url(_images/bg_navigation_a_clients_home.png) no-repeat left top;
	}

body.home #agency_primary {
	background:url(_images/bg_navigation_a_agency_home.png) no-repeat left top;
	}
	
body.home #blog_primary {
	background:url(_images/bg_navigation_a_blog_home.png) no-repeat left top;
	}
	
body.home #contacts_primary {
	background:url(_images/bg_navigation_a_contacts_home.png) no-repeat left top;
	}
	
body.home #home_primary.current, body.home #home_primary:hover, body.home #home_primary:active, body.home #work_primary.current, body.home #work_primary:hover, body.home #work_primary:active, body.home #clients_primary.current, body.home #clients_primary:hover, body.home #clients_primary:active, body.home #agency_primary.current, body.home #agency_primary:hover, body.home #agency_primary:active, body.home #blog_primary.current, body.home #blog_primary:hover, body.home #blog_primary:active, body.home #contacts_primary.current, body.home #contacts_primary:hover, body.home #contacts_primary:active {
	background-position:left bottom;
	}

body.home #s {
	background:url(_images/bg_input_s_home.png) no-repeat right top;
	}
	
body.home #searchsubmit {
	background:url(_images/bg_input_searchsubmit_home.png) no-repeat left top;
	}

body.home h4 {
	color:#ED1A37;
	}

body.home .facebook {
	background:url(_images/bg_sharing_a_facebook_home.png) no-repeat left bottom;
	}
	
body.home .facebook:hover, body.home .facebook:active {
	background:url(_images/bg_sharing_a_facebook_home.png) no-repeat left top;
	}

body.home .delicious {
	background:url(_images/bg_sharing_a_delicious_home.png) no-repeat left bottom;
	}
	
body.home .delicious:hover, body.home .delicious:active {
	background:url(_images/bg_sharing_a_delicious_home.png) no-repeat left top;
	}

body.home .digg {
	background:url(_images/bg_sharing_a_digg_home.png) no-repeat left bottom;
	}
	
body.home .digg:hover, body.home .digg:active {
	background:url(_images/bg_sharing_a_digg_home.png) no-repeat left top;
	}

body.home .stumbleupon {
	background:url(_images/bg_sharing_a_stumbleupon_home.png) no-repeat left bottom;
	}
	
body.home .stumbleupon:hover, body.home .stumbleupon:active {
	background:url(_images/bg_sharing_a_stumbleupon_home.png) no-repeat left top;
	}

body.home .reddit {
	background:url(_images/bg_sharing_a_reddit_home.png) no-repeat left bottom;
	}
	
body.home .reddit:hover, body.home .reddit:active {
	background:url(_images/bg_sharing_a_reddit_home.png) no-repeat left top;
	}
	
body.home .twitter {
	background:url(_images/bg_sharing_a_twitter_home.png) no-repeat left bottom;
	}
	
body.home .twitter:hover, body.home .twitter:active {
	background:url(_images/bg_sharing_a_twitter_home.png) no-repeat left top;
	}
	
body.home .linkedin {
	background:url(_images/bg_sharing_a_linkedin_home.png) no-repeat left bottom;
	}
	
body.home .linkedin:hover, body.home .linkedin:active {
	background:url(_images/bg_sharing_a_linkedin_home.png) no-repeat left top;
	}

/* Extra rules for the homepage */	

body.home ul.home_feature {
	list-style:none;
	}


body.home ul.home_feature li#home_feature_b {
	margin-right:12px;
	}

body.home ul.home_feature li a {
	display:block;
	float:left;
	}

body.home ul.home_feature a.maxi {
	font-size:1.5em;
	font-weight:bold;
	height:30px;
	line-height:1.6em;
	position:relative;
	right:12px;
	padding:390px 38px 0 24px;
	width:638px;
	}

body.home ul.home_feature li.mini {
	float:left;
	margin-top:18px;
	}

body.home ul.home_feature li a.mini {
	height:38px;
	padding:88px 38px 0px 12px;
	width:288px;
	}
	
/* Background images for image set A */

body.home #home_feature_1a {
	background:url(_images/_home/bg_home_feature_1a.png) no-repeat;
	}
	
body.home #home_feature_2a {
	background:url(_images/_home/bg_home_feature_2a.png) no-repeat;
	}
	
body.home #home_feature_3a {
	background:url(_images/_home/bg_home_feature_3a.png) no-repeat;
	}
	
/* Background images for image set B */

body.home #home_feature_1b {
	background:url(_images/_home/bg_home_feature_1b.png) no-repeat;
	}
	
body.home #home_feature_2b {
	background:url(_images/_home/bg_home_feature_2b.png) no-repeat;
	}
	
body.home #home_feature_3b {
	background:url(_images/_home/bg_home_feature_3b.png) no-repeat;
	}
	
/* Background images for image set C */

body.home #home_feature_1c {
	background:url(_images/_home/bg_home_feature_1c.png) no-repeat;
	}
	
body.home #home_feature_2c {
	background:url(_images/_home/bg_home_feature_2c.png) no-repeat;
	}
	
body.home #home_feature_3c {
	background:url(_images/_home/bg_home_feature_3c.png) no-repeat;
	}
	
/* Background images for image set D */

body.home #home_feature_1d {
	background:url(_images/_home/bg_home_feature_1d.png) no-repeat;
	}
	
body.home #home_feature_2d {
	background:url(_images/_home/bg_home_feature_2d.png) no-repeat;
	}
	
body.home #home_feature_3d {
	background:url(_images/_home/bg_home_feature_3d.png) no-repeat;
	}
	
/* Background images for image set E */

body.home #home_feature_1e {
	background:url(_images/_home/bg_home_feature_1e.png) no-repeat;
	}
	
body.home #home_feature_2e {
	background:url(_images/_home/bg_home_feature_2e.png) no-repeat;
	}
	
body.home #home_feature_3e {
	background:url(_images/_home/bg_home_feature_3e.png) no-repeat;
	}