/*
Theme Name: Yes We Work
Theme URI: http://yeswework.com/
Description: Yes We Work
Version: 1.0
Author: Yes We Work
Author URI: http://yeswework.com/
*/


/* YAHOO RESET */
html{color:#000;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}
/* YAHOO FONTS */
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

/* YES WE STYLE */
/* ------------------------------------------------- header stuff */
body {
	background-color:#201e1a;
}
em {
	font-style: italic;
}
strong {
	font-weight: bold;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 10px;
}
h1 {
	font-size:1.6em;
}
h2 {
	font-size:1.4em;
}
h3 {
	font-size:1.3em;
}
table {
	margin: 40px 0;
	width:100%;
	border:0;
}
table tr {
	border:0;
}
table tr td {
	padding:10px;
	border:1px solid #201E1A;
}
a,a:visited {
	text-decoration: none;
	color: #ff0055;
	outline: none;
}
a:hover,a:active {
	color: #00adef;
}
acronym {
	border-bottom: 1px dashed #999;
}

/* ------------------------------------------------- header stuff */

#homelink img{
	position: fixed;
	display:block;
	z-index:3;
	left:20px;
	top:20px;
	width:80px;
	height:70px;
}

h1#title {
	position: fixed;
	z-index:5;
	left:0;
	top:0;
	right:0;
	height:33px;
	padding:22px 100px 10px;
	background-color:#fff;
	background-image:url(img/yes_logo.gif);
	background-position:5px;
	background-repeat:no-repeat;
	color:#000;
}

/* ------------------------------------------------- navigation uls */
ul#mainnav {
	position:fixed;
	top:65px;
	height:15px;
	left:0;
	right:0;
	padding:8px 20px 8px 100px;
	background-color: #fff;	
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	z-index:3;
}
	ul#mainnav li {
		float:left;
		margin-right:25px;
		font-size:1.1em;
	}
	
ul#aboutnav {
	position: fixed;
	top:25px;
	right:0;
	margin-left:500px;
	z-index:6;
}
	ul#aboutnav li {
		float:left;
		margin-right:25px;
		font-size:1.1em;
	}
	
/* ------------------------------------------------- body */

.content {
	position:absolute;
	width:860px;
	border-top:0;
	margin-top:120px;
	padding:0px 0px 50px 100px;
	z-index:2;
	color:#ddd;
}
#homepage {
	width:100%;
	padding:0;
}
#homepage .post, #homeimage {
	text-align:center;
	margin: auto;
}
#homeimage {
	width:750px;
	height:600px;
}
.content#showreel {
	width: 100%;
	padding: 0px;
	text-align: center;
}
.content ul, .content ol, .content p {
	margin-bottom: 25px;
}
.content p {
	max-width: 750px;
}
.content h3 {
	border-bottom:1px dotted #666;
}
.content p, .content li {
	line-height: 150%;
}
.related {
	float:left;
}

/* ------------------------------------------------- body extra on showreel page */
.content.motion {
	margin-top:10px;
}

#showreel .related,
#showreel .process,
#showreel .profile {
	visibility:hidden;
	display:none;
}

/* ------------------------------------------------- single post styles */
div.wp-caption {
	margin-bottom: 40px;
}

div.wp-caption img{
	display:inline;
	padding:0 0 0 0;
	margin:0 0 0 0;
	border:1px solid #312e27;
}
div.wp-caption p.wp-caption-text{
	display: inline;
	border-left:1px solid #312e27;
	border-right:1px solid #312e27;
	border-bottom:1px solid #312e27;
	border-radius: 0 0 4px 4px;
	-moz-border-radius: 0 0 4px 4px;
	-webkit-border-radius: 0 0 4px 4px;
	padding: 5px 7px 3px;
	margin:0 0 0 0;
	position:relative;
	top: -1px;
	background-color: #312e27;
	font-size: 0.8em;
	letter-spacing:1px;
	text-transform:uppercase;
	color:#ccc2ad;
}


/* ----------------------------------------------- list used on web and print portfolio  */
ul.portfolio-small {
	margin-left:-10px;
	clear:both;
}
	ul.portfolio-small li {
		position:relative;
		float:left;
		width:250px;
		padding:10px 10px 8px 10px;
		margin:10px 10px 0 0;
		background-color:#1b1a17;
		height: 235px;
	}
		ul.portfolio-small li img {
			position: absolute;
			bottom: 10px;
		}
			ul.portfolio-small li .description h2 {
				border-bottom:1px dotted #666;
			}

	ul.portfolio-small li.feature {
		width:810px;
		height: 212px;
	}
		ul.portfolio-small li.feature .description {
			width:440px;
			float:left;
		}
		ul.portfolio-small li.feature .description h2 {
			font-size: 2em;
		}
		ul.portfolio-small li.feature img {
			width:350px;
			float:right;
			position: static;
		}
		ul.portfolio-small li.feature div.featuretitle {
			font-size: 1.2em;
			line-height: 100%;
			border-bottom: 1px dotted #666;
			padding-bottom: 8px;
			margin-bottom: 10px;
		}
		ul.portfolio-small li.feature p {
			margin-bottom: 0px;
		}

/* ----------------------------------------------- list used on corporate portfolio  */
ul.portfolio-large {
	margin-left:-10px;
	clear:both;
}
	ul.portfolio-large li {
		position:relative;
		float:left;
		width:750px;
		padding:10px 10px 8px 10px;
		margin:10px 10px 0 0;
		background-color:#1b1a17;
		min-height: 200px;
	}

		ul.portfolio-large li img {
			float: right;
		}
		ul.portfolio-large li p {
			color:#fff;
			margin-bottom: 10px;
		}
		ul.portfolio-large li .description {
			width: 230px;
			float: left;
		}
			ul.portfolio-large li .description h2 {
				border-bottom:1px dotted #666;
			}
	ul.portfolio-large li.feature .description {
		width: 750px;
		float: none;
	}
	ul.portfolio-large li.feature img {
		float: none;
	}
		ul.portfolio-large li.feature div.featuretitle {
			font-size: 1.2em;
			line-height: 100%;
			border-bottom: 1px dotted #666;
			padding-bottom: 8px;
			margin-bottom: 10px;
		}
		ul.portfolio-large li.feature p {
			margin-bottom: 0px;
		}
			
/* ------------------------------------------------- sidebar div  */

#sidebar {
	position:absolute;
	left:730px;
	top:100px;
	width:200px;
	z-index:3;
}
#sidebar h4 {
	color: #ff0055;
	padding: 10px;
}
#sidebar div{
	padding:10px;
	margin:0 0 10px;
	color: #797569;
	background-color:#1b1a17;
}
/* ------------------------------------------------- background div (last in code) - default images and colours */
	
#background {
	visibility:hidden;
	display:none;
}
#background img {
	height:100%;
	min-height:100%;
	width:100%;
	min-width:100%;
	position:fixed;
	top:0;
	left:0;
}

/* ------------------------------------------------- homepage styles */
#feature1 {
	position:absolute;
	bottom:50px;
	left:50px;
	z-index:1;
	background-color:#000000;
	border:1px solid #222;
	padding:10px;
}
#feature2 {
	position:absolute;
	bottom:200px;
	left:200px;
	z-index:1;
	background-color:#000000;
	border:1px solid #222;
	padding:10px;
}
#feature3 {
	position:absolute;
	bottom:100px;
	right:100px;
	z-index:1;
	background-color:#000000;
	border:1px solid #222;
	padding:10px;
}

/* ------------------------------------------------- classes that only change one thing */
.yellow {
	color:#FFCC00;
}
.orange {
	color:#FF9900;
}
.blue {
	color:#0099CC;
}
.green {
	color:#33CC66;
}
.pink {
	color:#FF0055;
}
.grey {
	color:#96997B;
}
.darkgrey {
	color:#706a5d;
} 
.paleyellow { 
	color: #f1e908; 
} 
.paleblue { 
	color: #30b9d3; 
} 
.palegreen { 
	color: #8ee037; 
}
/* ------------------------------------------------- box styles */
div.box {
	overflow: auto;
	margin-bottom: 20px;
}
div.box p, div.box ul {
	margin-bottom: 15px;
}
div.box ul li {
	list-style: outside square;
	margin-left: 20px;
	margin-bottom: 5px;
}
div.box a.onwardlink {
	color: #666;
	position: absolute;
	bottom: 10px;
	right: 10px;
	font-size: 0.85em;
}
div.box a.onwardlink:hover {
	color: #fff;
}
/* ------------------------------------------------- clients page styles */
#clients .content ul {
	font-size: 1.2em;
	overflow: auto;
}
#clients .content ul li {
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
}
/* ------------------------------------------------- contact page styles */
#contact {
}
/* ------------------------------------------------- admin */
#editpostlink {
	background-color: #fff;
	padding: 5px;
	position: fixed;
	bottom: 0px;
	right: 0px;
	-moz-border-radius-topleft: 3px;
}
/* ------------------------------------------------- new homepage */
#new-homepage {
	background-color: #ff0055;
	background-image: url(img/fade-overlay.png);
	background-repeat:repeat-x;
}
#new-homepage .content {
	color: #000;
	margin-top:98px;
}
#new-homepage #showoff {
	width: 100%;
	overflow: auto;
}
	#new-homepage #showoff #slider {
		float: left;
		width: 550px;
		margin-right: 20px;
		height: 460px;
		overflow: hidden;
		position: relative;
	}
		#new-homepage #showoff #slider .scrollContainer div.panel {
			height: 400px;
			width: 550px;
			padding-top: 20px;
			padding-bottom: 40px;
			background-repeat: no-repeat;
			background-position: 0 20px;
			position: relative;
		}
		#new-homepage #showoff #slider .scrollContainer div.panel .innerpanel {
			background-color: #201e1a;
			padding: 10px;
			position: absolute;
		}
			#new-homepage #showoff #slider .scrollContainer div.panel .innerpanel p {
				margin-bottom: 0px;
				color: #fff;
			}
			#new-homepage #showoff #slider .scrollContainer div.panel .innerpanel h3 {
				border-bottom:0;
				margin-bottom: 0;
				padding-bottom:0;
				color: #ff0055;
			}
	#new-homepage #showoff #slider #design {
		background-image: url('img/motion-web-print-branding-d.jpg');
	}
	#new-homepage #showoff #slider #intelligent {
		background-image: url('img/meticulous-design.jpg');
	}
		#new-homepage #showoff #slider #intelligent .innerpanel {
			right: 20px;
			top: 110px;
			width: 410px;
		}
		
	#new-homepage #showoff #slider #international {
		background-image: url('img/international-design.jpg');
	}
		#new-homepage #showoff #slider #international .innerpanel {
			left: 30px;
			top: 170px;
			width: 270px;
		}
		
	#new-homepage #showoff #slider #crossmedia {
		background-image: url('img/crossmedia-design.jpg');
	}
		#new-homepage #showoff #slider #crossmedia .innerpanel {
			left: 50px;
			top: 70px;
			width: 430px;
		}
	
	#new-homepage #showoff #slidernav {
		font-family: bebas;
		float: left;
		padding-top: 100px;
		width: 280px;
		margin-left:10px;
		font-size: 44px;
		color: #fff;
		text-transform: uppercase;
	}
		#new-homepage #showoff #slidernav a {
			height: 50px;
			display: block;
			overflow: hidden;
			text-indent: -5000px;
			background-repeat: no-repeat;
			background-position: 0 -50px;
		}
		#new-homepage #showoff #slidernav a:hover, #new-homepage #showoff #slidernav a.selected {
			background-position: 0 0;
		}
		#new-homepage #showoff #slidernav #intelligent_link {
			background-image:url('img/intelligent.png');
			width: 200px;
		}
		#new-homepage #showoff #slidernav #international_link {
			background-image:url('img/international.png');
			width: 251px;
		}
		#new-homepage #showoff #slidernav #crossmedia_link {
			background-image:url('img/crossmedia.png');
			width: 229px;
		}
		#new-homepage #showoff #slidernav #design_link {
			background-image:url('img/design.png');
			width: 121px;
		}

#new-homepage #details #recentwork {
	float: left;
	width: 510px;
	background-color: #fff;
	margin-right: 20px;
	padding: 20px;
}
	#new-homepage #details #recentwork h3 {
		margin-bottom:0;
		padding-bottom:0;
		border-bottom:0;
	}
	#new-homepage #details #recentwork li {
		padding-bottom:20px;
		border-bottom:1px dotted #d7d0c3;
		margin: 10px 0 30px;
		overflow:auto;
		clear:both;
	}
	#new-homepage #details #recentwork li img.thumbnail {
		float:left;
		width: 250px;
		margin:0 10px 0 0;
		border:1px solid #d7d0c3;
	}
	#new-homepage #details #recentwork li .description h2 {
		margin-bottom: 0px;
	}
	#new-homepage #details #recentwork li .description {
		float:right;
		width: 240px;
	}
	#new-homepage #details #recentwork li .description p {
		margin-bottom: 4px;
	}
	#new-homepage #details #recentwork li .description p.detail {
		font-size:0.85em;
		margin-bottom: 0px;
	}
#new-homepage #aboutus {
	width: 100%;
	overflow: auto;
	color: #d7d0c3;
}

#new-homepage #aboutus acronym {
	border-bottom: 1px dashed #706a5d;
}
	#new-homepage #aboutus h3, 
	#new-homepage #aboutus h4, 
	#new-homepage .innerpanel h4{
		margin-bottom:0;
		border-bottom:0;
	}
	#new-homepage #details #aboutus {
		float: left;
		width: 250px;
		background-color: #201e1a;
		padding: 20px;
	}
		#new-homepage #details #aboutus ul#skills {
			float:left;
			width: 120px;
		}
		#new-homepage #details #aboutus ul#skills a:link,
		#new-homepage #details #aboutus ul#skills a:visited,
		#new-homepage #details #aboutus ul#sectors a:link,
		#new-homepage #details #aboutus ul#sectors a:visited {
			color: #00adef;
		}
		#new-homepage #details #aboutus ul#skills a:hover,
		#new-homepage #details #aboutus ul#skills a:active,
		#new-homepage #details #aboutus ul#sectors a:hover,
		#new-homepage #details #aboutus ul#sectors a:active {
			color: #ff0055;
		}
		#new-homepage #details #aboutus ul#sectors {
			float:right;
			width: 120px;
		}
		#new-homepage #details #aboutus #worktypes li {
			display: inline;
			margin-right:14px;
			font-size:1.1em;
		}
		#new-homepage #details #aboutus #contactus {
			clear:both;
		}
		#new-homepage #details #aboutus #contactus p {
			font-size:0.85em;
		}
/* ------------------------------------------------- new homepage */
.contact-form {
	margin-bottom: 20px;
}
.contact-form input[type=text] {
	width: 300px;
	background-color: #333;
	border: 1px solid #999;
	font-size: 1.1em;
	padding: 5px;
	color: #fff;
	margin-right: 10px;

}
.contact-form textarea {
	width: 400px;
	height: 100px;
	background-color: #333;
	border: 1px solid #999;
	padding: 5px;
	font-size: 1.1em;
	color: #fff;
}
.contact-form p {
	margin-bottom: 10px;
}
.contact-form .contact-submit span {
	display: none;
}