/*

Theme Name: X Works
Description: A bespoke theme for X Works, created by goto11 design
Version: 3.0
Author: goto11
Author URI: http://www.goto11.co.uk

*/

@charset "utf-8";

/* /////////////// GENERAL ////////////// */
GENERAL {
	background-color: red;
	color: white;
}


* {
	margin: 0;
	padding: 0;	
} /* set all padding and margin defaults to zero */

html, body {
	height: 100%;
	}

body {
    font-size: 62.5%;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 1.8em; 
	background-color: black;
	color: white;
}


/* coda slider bits */


.coda-slider-wrapper {
	width: 1000px;
/* 	border: 1px solid red; */
	margin: 0 auto;
}
	
/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
.coda-slider-no-js .coda-slider {
	height: 200px;
	overflow: auto !important;
	padding: 0;
}
	
/* Change the width of the entire slider (without dynamic arrows) */
.coda-slider,
.coda-slider .panel {
	width: 1000px;
} 

.coda-slider-wrapper {
	clear: both;
	overflow: auto;
}
.coda-slider {
	overflow: hidden;
	position: relative;
}
.coda-slider .panel {
	display: block;
	float: left;
}

#main_content {
	width: 1000px;
	position: relative;
}


/* top slider extras */

#myslidebox {
}

#myslidebox_header {
	float: left;
	border-bottom: 1px dotted #555;
}
#myslidebox_header_left {
	float: left;
	height: 105px;
	width: 250px;
	padding-left: 40px;
	text-align: left;
	text-indent: -9999px;
	background: url(images/title_whoarewe.jpg) 40px 40px no-repeat;
}
#myslidebox_header_right {
	padding-top: 20px;
	float: right;
/* 	background-color: green; */
	width: 670px;
	padding-right: 40px;
}

#myslidebox_left,
#myslidebox_right {
	float: left;
	padding: 20px 0 0 40px;
	width: 460px;
}

.profile_header {
	width: 460px;
}

.profile_header_titles {
	float: left;
	width: 280px;
}
.profile_header_images {
	float: right;
	width: 180px;
	height: 60px;
}
.profile_content {
	float: left;
}

.entry-content {
	padding: 0;
	margin: 0;
}




#home_header {
	float: left;
	width: 1000px;
	height: 100px;
	background: #000 url('images/home_header.jpg') top center no-repeat;
}

#home_container {
	width: 1000px;
}

#home_tag {
	width: 150px;
	height: 87px;
	background-color: transparent;
	background: url(images/home_tag.png) top center no-repeat;
	position: absolute;
	top: 100px;
	left: 50px;
	z-index: 2;
}

ul#home_top {
	width: 1000px;
	height: 560px;
	float: left;
	list-style: none;
	padding: 0;
	margin: 0;
}

ul#home_top li {
	list-style-type: none;
	display: inline;
	width: 500px;
	float: left;
	text-align: left;
	text-indent: -9999px;
	padding: 0;
	margin: 0;
}
ul#home_top li a {
	display: block;
	width: 500px;
	height: 560px;
	padding: 0;
	margin: 0;
/* 	background: url(images/backgrounds/1.jpg) no-repeat; */
}

ul#home_top li#home_top_left a {
	background-position: top left;
}
ul#home_top li#home_top_right a {
	background-position: top right;
}

ul#home_lowtop {
	width: 1000px;
	height: 200px;
	float: left;
	list-style: none;
	padding: 0;
	margin: 0;
}

ul#home_lowtop li {
	list-style-type: none;
	display: inline;
	width: 1000px;
	float: left;
	text-align: left;
	text-indent: -9999px;
	padding: 0;
	margin: 0;
}
ul#home_lowtop li a {
	display: block;
	width: 1000px;
	height: 200px;
	padding: 0;
	margin: 0;
/* 	background: url(images/backgrounds/1.jpg) no-repeat; */
}


ul {
	list-style-type:none;
	margin-left:0px;
}

li {
	padding: 2px;
}

#left, #right {
	background: url(images/slide_page_bg.jpg) center top no-repeat;
	width: 900px;
}

#left {
	float: right;
    color: #FFF;
    padding: 80px 0 0 80px;  
}

#left_link, #right_link {
	position: absolute;
	width: 20px;
	height: 20px;
	background-color: #666;
}

#left_link {
	left: 0px;
	top: 0px;
}
#right_link {
	right: 0px;
	top: 0px;
}

#right {
	float: left;
    color: #FFF;
    padding: 80px 0 0 80px;   
}

#right_content, #left_content {
	float: left;
	background-color: black;
	width: 410px;
	padding: 60px 30px 60px 60px;
/* 	border: 1px solid #333; */
}
#right_gallery, #left_gallery {
	float: left;
	background-color: black;
	width: 250px;
	padding: 0px;
	margin: 0 30px 0 30px;
}

#right_gallery img, #left_gallery img {
	padding-bottom: 25px;
}

.department_header {
	float: left;
	width: 440px;
	margin-bottom: 20px;
}

.department_header_titles {
	float: left;
	width: 330px;
}
#department_left_back,
#department_right_back {
	float: right;
	width: 80px;
}


}
#department_left_back a, #department_right_back a {
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	height: 15px;
}
#department_left_back a {
	padding-right: 20px;
	background: url(images/codaslider_horiznav.jpg) right -15px no-repeat;
}
#department_left_back a:hover {
	background: url(images/codaslider_horiznav.jpg) right -45px no-repeat;
}
#department_right_back a {
	padding-left: 20px;
	background: url(images/codaslider_horiznav.jpg) left 0px no-repeat;
}
#department_right_back a:hover {
	background: url(images/codaslider_horiznav.jpg) left -30px no-repeat;
}

.department_content {
	float: left;
	width: 390px;
}



/* //////////////// TYPOGRAPHY //////////////////*/
TYPOGRAPHY {
	background-color: red;
	color: white;
}

.upper {
	text-transform: uppercase;
}
.upperbold {
	text-transform: uppercase;
	font-weight: bold;
}

p {
	margin-bottom: 1.25em;
	font-size: 1.1em;
}

h1, h2, h3, h4, h5 {
	font-weight: normal;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	margin-bottom: 0.5em;
	line-height: 1em;
}


h1 {
	font-size: 2.4em;
}

h2 {
	font-size: 1.8em;
}

h3 {
	font-size: 1.6em;
}

h4 {
	font-size: 1.4em;
}

h5 {
	font-size: 1.1em;
}


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

hr {
	float: left;
	display: block;
	clear: both;
	border: none;
    width: 1000px;
    height: 2px;
    margin: 5px 0px 5px 0px;
    background: url(images/strip.jpg) center top repeat-y;
}

hr.short {
    width: 690px;
	background: url(images/strip_short.jpg) center top repeat-y;
}

hr.dotted {
	float: left;
	display: block;
	clear: both;
	border-bottom: 1px dotted white;
    width: 99%;
    height: 1px;
    margin: 5px 0px 5px 0px;
    background-image: none;
}

hr.bottommargin {
    margin: 5px 0px 25px 0px;	
}


/* ////////////// ADDITIONAL TEXT FORMATTING ///////////// */

.upper {
	text-transform: uppercase;
}
.upperbold {
	text-transform: uppercase;
	font-weight: bold;
}

.megabold {
    font-family: Arial Black, Helvetica, Arial, sans-serif;
}


/* ///////////////// HEADER NAV /////////////// */
HEADER {
	background-color: red;
	color: white;
}


/* ////////////// SIDEBAR /////////////// */
SIDEBAR {
	background-color: red;
	color: white;
}

ul#sidebar {
	float: left;
	width: 208px;
	padding: 20px;
}

ul#sidebar li {
	list-style: none;
	float: left;
	width: 208px;
	padding-bottom: 40px;
}

ul#sidebar li ul li {
	padding-bottom: 0px;
}



ul.wp-tag-cloud {
	margin: 25px 0 50px 0;
}
ul.wp-tag-cloud li {
	text-transform: uppercase;
	line-height: 1em;
	padding-bottom: 0px;
}

ul#client_grid {
	margin: 25px 0 50px 0;
}
ul#client_grid li {
	float: left;
/* 	border: 1px solid white; */
	margin: 0 8px 8px 0;
	padding: 0;
	height: 40px;
	width: 40px;
}
ul#client_grid li img {
/* 	border: 1px solid blue; */
	margin: 0;
	padding: 0;
}	



/* /////////////////////// BODY //////////////////// */
MAIN STYLES {
	background-color: red;
	color: white;
}

ul, ol {
	list-style:none;
	}
	
	
.toc {
	float: left;
	width: 30px;
	height: 30px;
	text-align: left;
	text-indent: -9999px;
}

.toc a {
	display: block;
	width: 30px;
	height: 30px;
	background: url(images/slidebox_vertnav.png) 0px -30px no-repeat;
}
.toc a:hover {
	background: url(images/slidebox_vertnav.png) 0px -90px no-repeat;
}

.toctop a {
	display: block;
	width: 30px;
	height: 30px;
	background: url(images/slidebox_vertnav.png) 0px 0px no-repeat;
}
.toctop a:hover {
	background: url(images/slidebox_vertnav.png) 0px -60px no-repeat;
}

a.backlink {
	display: block;
	width: 100px;
	height: 25px;
	float: left;
	background: #000 url(images/title_backlink.jpg) 0px 0px no-repeat;
	text-indent: -9999px;
	text-align: left;
}
a.backlink:hover {
	background: #000 url(images/title_backlink.jpg) 0px -25px no-repeat;
}

#integrate_bar {
	width: 1000px;
	float: left;
	height: 32px;
	margin-top: 10px;
}

 #email_rss {
 	float: right;
 	padding: 0;
 	margin: 0;
 	width: 400px;
 	height: 32px;
 }
 .integrate_box {
 	float: right;
 	width: 32px;
 	height: 32px;
 	margin-left: 3px;
 }
	
.title {
	padding: 0;
	margin: 0;
	float: left;
	height: 25px;
	width: 200px;
	text-align: left;
	text-indent: -9999px;
	background-position: left top;
	background-repeat: no-repeat;
/* 	border: 1px solid red; */
}	
#title_projects {
	background-image: url(images/title_projects.jpg);
}
#title_blog {
	background-image: url(images/title_blog.jpg);
}
#title_top {
	background-image: url(images/title_top.jpg);
	padding-bottom: 25px;
}
#title_back {
	background-image: url(images/title_back.jpg);
}
#title_clients {
	background-image: url(images/title_clients.jpg);
}

.title a {
	display: block;
	height: 25px;
	width: 176px;
/* 	border: 1px solid white; */
}

#post_container {
	float: left;
	width: 750px;
	margin-top: 20px;
}

	.post {
		margin-bottom: 2.5em;
		float: left;
		width: 750px;
	}
		.post_banner {
			width: 250px;
			float: left;
		}
		.post_content {
			width: 400px;
			padding: 0 60px 0 40px;
			float: left;
		}

.project_post {
	width: 250px;
	float: left;
	padding-right: 35px;
}

/* /////////// contact page /////////// */

.contact {
	margin-bottom: 2.5em;
	float: left;
}
.contact_info {
	width: 230px;
	float: left;
	text-align: right;
	padding-right: 40px;
}
.contact_form {
	width: 230px;
	float: left;
}



/* ////////////////////// FOOTER /////////////////// */
FOOTER {
	background-color: red;
	color: white;
}



/* /////////////////////// IMAGES ////////////////// */
IMAGES {
	background-color: red;
	color: white;
}

img, a:hover img {
	border: none;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	margin: 0 0 5px 15px;
	display: inline;
	}

img.alignleft {
	margin: 0 15px 5px 0;
	display: inline;
	}
	
.alignright {
	float: right;
	}

.alignleft {
	float: left
	}

ngg-gallery-thumbnail-box,
div.ngg-gallery-thumbnail {
	margin: 0;
	padding: 0;
	border: none;
}

div.ngg-gallery-thumbnail img {
	display: inline;
	float: left;
	padding: 0;
	border: none;
	margin: 0;
}

div#post_gallery div.ngg-gallery-thumbnail img {
	display: inline;
	float: left;
	padding: 0;
	margin: 0 5px 5px 0;
	border: none;
	width: 195px;
	height: 130px;
}



/* overrides style for nextgen widget images  */
.ngg-widget img {
	border: none;
	margin: 0; 
	padding: 0; 
}

/* overrides style for shutterbox popup images  */
div#shDisplay img#shTopImg {
	border: 1px solid #222;
	padding: 0;
}

/* //////////////// FORMS ////////////////// */
FORMS {
	background-color: red;
	color: white;
}

#emailrss_title {
	float: left;
	width: 210px;
	height: 32px;
}

#emailrss_container {
	float: left;
}

input#emailrss_input {
	padding: 5px;
	width: 130px;
    font-family: Helvetica, Arial, sans-serif;
	font-size: 1.1em;
/* 	margin-top: 6px; */
	background-color: white;
	border: none;
	margin: 5px 0 0 5px;
	
}
button#emailrss {
	float: left;
	width: 30px;
}

.formbutton {
	padding: 0;
	margin: 0;
	border: none;
	background: none;
	cursor: pointer;
}

/* ////////////// WORPRESS WIDGETS ////////////// */
WIDGETS {
	background-color: red;
	color: white;
}

div.execphpwidget {
	padding: 0;
	margin: 0;
}



li#execphp-419658431 {
	padding: 0; /* removes widget padding for sidebar navigation */
}


/* /////////////// MISC ////////////////// */
MISC {
	background-color: red;
	color: white;
}

.break {
	clear:both;
	font-size:0px;
	height:0px;
	overflow:hidden;
}

/* to remove dotted borders in FireFox */

a
{
outline: none;
}

:focus
{
-moz-outline-style: none;
}


/* goto11 credit */

ul#goto11credit {
	list-style: none;
	float: left;
	clear: both;
	width: 90px;
	height: 50px;
	margin: 0;
}

ul#goto11credit li {
	text-align: left;
	text-indent: -9999px;
	float: left;
}

ul#goto11credit li a {
	display: block;
	width: 90px;
	height: 50px;
}

ul#goto11credit li a:hover {
	border: none;
}

ul#goto11credit li.goto11 a {
	background-image: url(images/goto11_credit.jpg);
	background-position: 0px 0px;
}

ul#goto11credit li.goto11 a:hover {
	background-position: 0px -50px;
}