@charset "UTF-8";

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
body {
	line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
	clear: both;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
blockquote {
	quotes: none;
}
blockquote:before, blockquote:after {
	content: '';
	content: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img {
	border: none;
}





.hiddenItems {
	display:none;
}







html, body {
	height: 100%;
	-webkit-font-smoothing: /*sub*/pixel-antialiased;
}
body {
	margin:0;
	padding:0; 
	color:#505050;
	font-family: /*'FontSiteSansRoman', */sans-serif; 
	text-align:center;
	font-size:62.5%;
	line-height:1;
	background:#000;
}
.images { 
	/*height: 300px;*/
	height: 380px;
	width: 960px; 
	margin: auto; 
	background:#000; 
	position:relative; 
	z-index:100;
}
body#home .images { 
	height: 380px;
}
#logo-overlay { 
	height: 300px;
	width: 960px; 
	margin: auto; 
	background: transparent url(../images/logo-mid.png) top left no-repeat;
	/*background: transparent url(../images/logo-big.png) top left no-repeat;*/
	position:absolute; 
	z-index:150; 
	/*top:195px;*/
	top:260px; 
	left:0;
}
body#home #logo-overlay { 
	background: transparent url(../images/logo-big.png) top left no-repeat;
	top:260px;
}
body#work #logo-overlay, body#blog #logo-overlay { 
	background: transparent url(../images/logo-sml.png) top left no-repeat;
	top:0;
	left:inherit;
	right:0;
	height:59px;
	width:245px;
}






#social { 
	height: 15px;
	width: 400px;
	display:block; 
	position:absolute; 
	z-index:150; 
	top:15px;
	right:17px;
	font-size:1em;
	text-transform:uppercase;
}
#social a {
	color:#eee;
	/*opacity:0.7;*/
	text-decoration:none;
	background:none;
	float:right;
	line-height:1;
	margin:4px 0 0 8px !important;
	text-shadow:none;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;  
	-o-transition: all 0.25s linear; 
	-ms-transition: all 0.25s linear;
	transition: all 0.25s linear;  
}
.sharing a {
	color:#505050;
	opacity:0.7;
	text-decoration:none;
	background:none;
	text-align:right !important;
	clear:both;
	position:relative;
	right:0;
	line-height:1;
	margin:2px 0 !important;
	-webkit-transition: opacity 0.25s linear;
	-moz-transition: opacity 0.25s linear;  
	-o-transition: opacity 0.25s linear; 
	-ms-transition: opacity 0.25s linear;
	transition: opacity 0.25s linear;  
}
#social a.addthis_button_google_plusone {
	margin:0 0 0 10px !important;
}
#social a span, .sharing a span {
	display:none;
}
#social a:hover {
	color:#fff;
	text-decoration:none;
	text-shadow:0px 0px 3px #666;

	/*opacity:1;*/
}
body#work #social a, 
body#work #social a:hover,
.sharing a:hover,
body#blog #social a, 
body#blog #social a:hover {
	color:#505050;
	text-decoration:none;
	opacity:1;
}
.at300b {
	float:right !important;
	padding:0 !important;
}




/* fix the ADDTHIS pop-over position! */
#at20mc {
	top:10px;
	left:52%;
	position:absolute !important;
}
#at16pt h4, #at16pt a {
	font-weight:normal;
}
body#work #at20mc {
	top:70px;
}
/* end fix */





/*/////////////////////////////////// GENERIC LINKS ///////////////////////////////////*/
a {
	color:#543090;
	text-decoration:none;
	outline:none;
}
a:hover {
	color:#000;
	text-decoration:none;
	outline:none;
}
a:active {
	color:#6c289c;
	text-decoration:none;
	outline:none;
}


#contentarea a {
	font-family: /*'FontSiteSansBold', */sans-serif;
	font-weight:bold;
}


a.more {
	background-image:url(../images/more-arrow.gif);
	background-repeat:no-repeat;
	background-position: right 0;
	padding-right:10px;
}
a.more:hover {
	background-position: right -30px;
}
a.more:active {
	background-position: right -60px;
}





a.ext, a.back {
	background-image:url(../images/back-arrow.gif);
	background-repeat:no-repeat;
	background-position: left 0;
	padding-left:10px;
}
a.ext {
	background-image:url(../images/more-arrow.gif);
}
a.ext:hover, a.back:hover {
	background-position: left -30px;
}
a.ext:active, a.back:active {
	background-position: left -60px;
}





#wrapper {
	margin:0 auto;
	width:960px;
	background:#dfdad4;
	/*-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);*/
	/*min-height:960px;*/
	position: relative;
	z-index:50;
	clear:both;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
body#work #wrapper, body#blog #wrapper {
	background:transparent;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	padding-top:59px
}
#workwrapper {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	width:960px;
/*	background:#dfdad4; */
	background:#fff;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	position: relative;
	z-index:50;
	clear:both;
	padding-top:20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#contentarea {
	width:800px;
	margin:30px auto 0;
	clear:both;
	position:relative; 
	z-index:200;
	padding-bottom:20px;
	/*border: 1px dotted pink;*/
	text-align:left;
}
body#home #contentarea {
	width:920px;
	margin-top:20px;
}
body#work #contentarea {
	width:900px;
	margin-top:25px;
}
body#blog #contentarea {
	margin-top:0;
}


/*

.workimages img {
	margin-right:20px;
}
.workimages img.last {
	margin-right:0;
}


*/


#blognav {
	margin:20px 0 0 0;
	padding-bottom:20px;
	position:relative;
	z-index:+1;
	border-bottom:1px solid #dfdad4;
}
#blognav a {
	padding:2px 5px;
	margin:0 5px;
	background:transparent;
	font-size:1.8em;
	line-height:1;
}
#blognav a.selected {
	background:#fc0af2;
	color:#fff;
}






#footer {
	padding:14px 20px;
	clear:both;
	width:920px;
	margin:0 auto;
	text-align:left;
	position: relative;
	z-index:49;
}
.slideshow img { 
	width:960px;
	height:380px;
	/*
	padding: 15px; 
	border: 1px solid #ccc; 
	background-color: #eee;
	*/
}
/*body#home .slideshow img { 
	height:380px;
}*/
img.pixRight {
	margin:0 0 10px 10px;
	float:right;
}
img.pixLeft {
	margin:0 10px 10px 0;
	float:left;
}
.colours { 
	position:fixed;
	top:0;
	left:0;
	z-index:0;
	width:100%;
	min-height:100%; 
	height:100%; 
	background:#000; 
}
.colours div { 
	position:fixed;
	min-width:100%;
	min-height:100% !important; 
	height:100% !important; 
	z-index:1;
	top:0;
	left:0;
	display:block;
}






/* menu */
#nav {
	position:absolute; 
	top:-1px; 
	left:20px; 
	z-index:200;
	text-align:left;
}
.tab {
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	padding:10px 26px 10px 10px; 
	border:1px solid #caa6d2; 
	color:#666;
	background:#e6e1dd url(../images/nav-arrow.gif) top right no-repeat; 
	text-decoration:none;
	font-family: 'FontSiteSansBold'; 
	font-size:1.8em;
	line-height:1; 
	cursor:pointer;}
.sub {
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	padding:10px 10px 20px 10px; 
	border:1px solid #caa6d2; 
	color:#666; 
	background:#f7f6f4 url(../images/nav-bg.gif) 20px 20px no-repeat;
	position:absolute;
	top:-1px;
	left:0; 
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	display:none; 
	width:170px;
	min-height:230px;
}
.sub ul {
	list-style:none;
	clear:both; 
	margin-left:55px;
	margin-top:10px;
}
.sub ul li {
	line-height:1.3em; 
	clear:both;
	width:100%;
	padding-bottom:1em;
}
.sub ul li a {
	font-size:1.8em;
	color:#666; 
	font-family: 'FontSiteSansBold'; 
	text-decoration:none; 
	display:block; 
	-webkit-transition: color 0.25s linear;
	-moz-transition: color 0.25s linear;  
	-o-transition: color 0.25s linear; 
	-ms-transition: color 0.25s linear;
	transition: color 0.25s linear; 
}
.sub ul li a:hover {
	color:#000; 
	text-decoration:none; 
}
.sub ul li.selected a, .sub ul li.selected ul li.selected a, .sub ul li.selected ul li.selected a:hover {
	color:#ccc; 
	cursor:default;
}
.sub ul li ul { 
	margin-left:10px;
	margin-bottom:0;
}
.sub ul li ul li a {
	font-size:1.4em; 
	color:#666; 
	font-family: sans-serif/*'FontSiteSansRoman'*/; 
	text-decoration:none; 
}
.sub ul li:last-of-type {
	padding-bottom:0;
}






.sub ul li.selected ul li a {
	color:#666;
}
.sub ul li.selected ul li a:hover {
	color:#000;
	cursor:pointer;
}






.gradbox {
	background: #dad6d2; /* Old browsers */
	background: -moz-linear-gradient(top, #dad6d2 0%, #f2f0ef 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dad6d2), color-stop(100%,#f2f0ef)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #dad6d2 0%,#f2f0ef 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #dad6d2 0%,#f2f0ef 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #dad6d2 0%,#f2f0ef 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dad6d2', endColorstr='#f2f0ef',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #dad6d2 0%,#f2f0ef 100%); /* W3C */
	
	-webkit-border-bottom: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding:10px; 
	border:1px solid #caa6d2; 
}






.promo {
	width:210px;
}
.promo img {
	margin-bottom:.8em;
}
.promo p {
	margin:0;
}




.entry {
	clear:both;
	position:relative;
	padding-top:26px;
	margin-top:-1px;
	margin-bottom:22px;
	border-top:5px solid #543090;
/*	border-top:1px dotted #505050; */
}




.textcol {
	margin:0 20px;
	float:left;
}
body#home .textcol {
	width:416px;

}




/* TWITTER */
#twitter {
	padding:5px;
	margin-bottom:20px;
}
#twitter h3 {
	line-height:1;
	margin: 0;
	float:right;
	font-size:1em;
	
}
#twitter h3 a {
	padding:.3em .5em;
	font-size:1.3em;
	-webkit-border-bottom:.3em;
	-moz-border-radius:.3em;
	border-radius: .3em;
	text-decoration:none;
	color:#000;
	display:block;
	line-height:1;
	margin-left:5px;
}
#twitter h3 a:hover {
	background:#caa6d2; 
}
#twitter p,
#twitter marquee, 
#twitter div {
	font-size:13px; 
	margin: 2px 0 0 0;
	padding: 0; 
	line-height:1.2em;
	color:#505050;
	width:751px;
}
#twitter p, {
	margin: 8px 0 0 0;
}

#twitter marquee a, 
#twitter div a {
	margin: 0 2em 0 0;
	color: #505050;
	/*font-size:1em;
*/	text-decoration: none;
	font-family: sans-serif /*'FontSiteSansRoman'*/ !important; 
	font-weight:normal;
}
#twitter marquee a:hover, 
#twitter div a:hover {
	color: #6c289c;
	text-decoration: none;
}
#twitter marquee a em, 
#twitter div a em {
	color: #999;
	font-size:75%;
}






/* typo */
h1 {	
	text-indent:-9999px;
}
h2 {
	/*font-family: 'FontSiteSansBold';*/
	font-size:2.5em;
	line-height:120%;
	margin-bottom:.8em;
}
h2.bighead {
	font-family: 'FontSiteSansBlack'; 
	font-weight:normal;
	text-transform:uppercase;
	color:#292929;
	font-size:5.1em;
	margin-top:-10px;
	margin-bottom:.15em;
	letter-spacing:-0.07em;
}
h3 {
	margin-bottom:.8em;
	font-size:2.1em;
	line-height:1.2em;
}
h4 {
	font-family: 'FontSiteSansBlack'; 
	font-weight:normal;
	margin-bottom:0.5em;
	font-size:1.7em;
	text-transform:uppercase;
	color:#292929;
	letter-spacing:-0.07em;
}
h5 {
	margin-bottom:.75em;
	font-size:1.7em;
	font-family: sans-serif /*'FontSiteSansBold'*/;
	font-weight:bold; 
}
h6 {}
p {
	font-size:1.25em;
	margin-bottom:1em;
	line-height:135%;
}
p:last-of-type, .promo p {
	margin:0;
}
td {}
li {}
li li {
	font-size:1em;
}


body#blog h2 {
	font-weight: bold;
	color: #543090;
}



/* people lists */
ul.clientlist {
	width:25%;
	float:left;
	font-size:1em;
	text-transform:uppercase;
	line-height:180%;
}





/* footer */
#footer p {
	font-size:.9em;
	margin:0;
	color:#fff !important;
	color:rgba(255,255,255,0.7);
	line-height:1;
	text-transform:uppercase;
	font-family:sans-serif;
}
#footer a {
	margin:0 8px;
	font-weight:bold;
	color:#fff;
	opacity:.7;
	text-decoration:none;
	-webkit-transition: opacity 0.25s linear;
	-moz-transition: opacity 0.25s linear;  
	-o-transition: opacity 0.25s linear; 
	-ms-transition: opacity 0.25s linear;
	transition: opacity 0.25s linear; 
}
#footer span.right a {
	margin:0 0 0 16px;
}
#footer a:first-of-type {
	margin:0 8px 0 16px;
}
#footer a:hover {
	color:#fff;
	opacity:1;
	text-decoration:none;
}






/* map */
#map_canvas {
	width:525px;
	height:235px;
	padding:0;
	overflow:hidden;
}





/* blog */
body#blog iframe, body#blog img, body#blog object, body#blog embed {
	margin-bottom:15px;
}
body#blog img.inline {
	float:left;
	margin:0 10px 0 0;
}




/* multi-columns */
.aside {
	width:145px;
	/*padding-top:50px;*/
	text-transform:uppercase;
	line-height:150%
}
.related {
	position:absolute;
	width: 145px;
	text-transform: uppercase;
	line-height: 150%;
	left:655px;
	bottom:0px;
}
.threecol {
	width:231px;
}
.twocol {
	width:390px;
}
.onecol {
	width:620px;
}
.sharing {
	width:120px;
	text-transform:uppercase;
	line-height:150%;
	float:right;
	text-align:right;
}
.overview {
	width:480px;
	float:left;
}






/* dewynters colours */
.purple {
	background:#19032b;
}
.green {
	background:#48753d;
}
.red {
	background:#981821;
}
.pink {
	background:#fc0af2;
}
.grey {
	background:#838383;
}
.black {
	background:#000;
}






/* general */
.center { 
	text-align:center;
}
.right { 
	float:right; 
}
.left { 
	float:left; 
}
.space {
	height:50px;
	clear:both;
	width:100%
}
.vspace {
	height:280px;
	clear:both;
	width:100%
}
.midcol {
	margin:0 20px
}
/*strong { 
	font-family: 'FontSiteSansBold'; 
	font-weight:normal !important;
}*/
.clearfix:after {
	content:".";
	clear:both;
	width:100%;
	display:block;
	height:0;
	font-size:0;
	text-indent:-9999em;
}







/* carousel */
.jCarouselLite  {
	width:890px;
	height:743px;
	display:block;
	overflow: hidden;
	background: #dfdad4;
	margin:0;
	clear:both;
	margin-left:5px;
	margin-bottom:5px;
	
	/* Needed for rendering without flicker */
	position: relative;
	z-index:10;
	visibility: hidden;
	left: -5000px;
}
.prev, .next {
	display: block;
	text-indent:-9999px;
	width: 14px;
	height: 195px;
	position:absolute;
	top:274px;
	left:-22px;
	z-index:11;
	border:none;
	margin:0;
	text-decoration: none;
	background-position: 0 0;
	background:transparent;
	opacity:.25;
	-webkit-transition: opacity 0.25s linear;
	-moz-transition: opacity 0.25s linear;  
	-o-transition: opacity 0.25s linear; 
	-ms-transition: opacity 0.25s linear;
	transition: opacity 0.25s linear; 
}
.next {
	left:908px;
	background-image:url(../images/carousel-next.png);
}
.prev {
	background-image:url(../images/carousel-prev.png);
}
.next:hover, .prev:hover {
	cursor: pointer;
	opacity:.75;
}
.next:active, .prev:active {
	cursor: pointer;
	opacity:1;
	outline:none;
}
#maskL {
	position:absolute;
/*	background: #dfdad4; */
	background: #fff;
	width:20px;
	height:743px;
	display:block;
	z-index:20;
	top:0;
	left:-5px;
}
#maskR {
	position:absolute;
	background: #fff;
	width:20px;
	height:743px;
	display:block;
	z-index:20;
	top:0;
	left:885px;
}
.jCarouselLite ul {
	list-style:none;
	margin:0;
	padding:0;
	height:743px;
	width:890px;
	display:block;
	background: #fff /*#dfdad4*/;
	overflow:hidden;
	position:relative;
}
.jCarouselLite ul li {
	width:890px !important;
	height: 743px;
	text-align:left;
	background:
	padding: 0;
	line-height:100%;
	margin:0 !important;
	padding:0 !important;
	font-size:1em;
	display:block;
	overflow:hidden;
	position:relative;
}
.jCarouselLite div {
	line-height:1;
	font-size:1em;
	text-align:center;
	color:#999;
	position:absolute;
	display:block;
	margin:0;
	text-transform:uppercase;
}
.jCarouselLite div img {
	margin: 0 0 4px 0;
	background:#000;
}
.sml {
	width: 220px;
	height: 130px;
}
.mid {
	width: 220px;
	height: 240px;
}
.big {
	width: 390px;
	height: 240px;
}
.portrait {
	width: 220px;
	height: 350px;
}
.pos1 {
	top: 20px;
	left: 10px;
}
.pos2 {
	top: 20px;
	left: 250px;
}
.pos3 {
	top: 20px;
	left: 490px;
}
.pos4 {
	top: 150px;
	left: 10px;
}
.pos5 {
	top: 260px;
	left: 250px;
}
.pos6 {
	top: 260px;
	left:660px;
}
.pos7 {
	top: 500px;
	left: 10px;
}
.pos8 {
	top: 500px;
	left: 420px;
}
.pos9 {
	top: 610px;
	left:660px;
}
.deathtrap {
	background: url(../images/work/thumb/deathtrap-th.jpg) top left no-repeat;
}
.virginatlantic {
	background: url(../images/work/thumb/theatre-guide-th.jpg) top left no-repeat;
}

body#blog strong {

	color: #505050;
}
/*//////////  EXPERTISE //////*/

body#expertise p.expertise {
	font-size: 1.5em;
}

.caps {
	text-transform: uppercase;
}
.bold {
	font-weight: bold;
}
body#home p.home {
	font-size: 1.4em;
}
