@charset "UTF-8";
/* CSS Document */

/* Sticky footer css */
html, body, #wrap {height: 100%;}
body > #wrap {height: auto; min-height: 100%;}
#main {padding-bottom: 150px;}  /* must be same height as the footer */
#footer {position: relative;	margin-top: -150px; /* negative value of footer height */	height: 150px;	clear:both;} 
.clearfix:after {content: ".";	display: block;	height: 0;	clear: both;	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/*capsule8 styles - Andy Kleeman */
body {font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
   font-size:62.5%; background:#000000; color:#FFFFFF; margin:0; padding:0;}
div, ul, li {position:relative;} 
a img {border:none;}
a {color:#df6220; text-decoration:none;}
a:hover {color:#ffffff;}
 

h1 {font-family: Arial, sans-serif; font-size:4.2em; margin-top:10px; font-weight:normal; letter-spacing:-2px;}
h2 {font-size:1.8em; line-height:1.3em;}

/*masthead text block & positioning*/
#masthead h3 {line-height:1.5em;}
#masthead.mio h3 {position: absolute; top:75px; left:350px;}
#masthead.gj h3 {position: absolute; top:75px; right:100px;}
#masthead.aon h3 {position: absolute; top:75px; left:350px; text-align:right;}
#masthead.cb h3 {position: absolute; top:75px; left:50px;}


h3 {font: normal 2.8em Arial, sans-serif;}
h3 span.block {color:#ffffff; background-color:#df6220; padding:8px;}
h3 span.small {font-size:.75em; line-height:2.1em; margin-left:-5px;}
h3 span.spacer {padding:0 5px 0 5px;}

h4 {font-family: Din, sans-serif; font-size:1.8em; color:#df6220; margin-top:0; font-weight:normal; text-shadow:1px 1px 1px #000000;}
p {font-size:1.5em; line-height:1.4em;}
li {list-style-type:none; font-size:1.4em;}

.white {color:#ffffff;}
.left {float:left; clear:none;}
.right {float:right; clear:none;}


#masthead {width:1000px;height:253px; margin:0 auto 0 auto; margin-top:-20px; background-repeat:no-repeat;}

/*masthead bg references */
#masthead.mio {background-image:url(../headerImages/coffee.jpg)}
#masthead.gj {background-image:url(../headerImages/bike.jpg)}
#masthead.aon {background-image:url(../headerImages/car.jpg)}
#masthead.cb {background-image:url(../headerImages/rugby.jpg)}


p#follow a {color:#ffffff; text-decoration:none; position:absolute; top:10px; right:0;}
p#follow a:hover {color:#df6220;}

#menu {margin:-25px auto 0 auto; width:1000px; z-index:999; height:25px;}
.case #menu {margin:20px auto;}
ul {margin:0; padding:0;}
#menu li {float:left; font-weight:bold; margin-right:18px; list-style-type:none; text-shadow:1px 1px 1px #000000;}
li a {text-decoration:none; color:#df6220;}
li a:hover {color:#ffffff;}
li img#logo {position:absolute; top:28px; left:0; font-size:2em;}
.case #menu li img#logo {top:-55px;}
/*Page on colour*/
.home li.home a, .personal li.personal a, .design li.design a, .onlinemag li.onlinemag a, .digitalprint li.digitalprint a, .dataAnal li.dataAnal a, .case li.case a, .contact li.contact a {color:#ffffff;}

#stripe {background:#df6220; height:38px;}

#main {width:1000px; margin:0 auto; position:relative;}
hr.break {margin:44px 0 33px 0; color:#333333; clear:both;}
.black {color:#000000;}

ul#subMenu {float:left; width:170px; position:relative; margin-top:15px;}
.case ul#subMenu {position:fixed;}
#subMenu li {margin-bottom:30px;}
#subMenu li a {font-weight:bold; color:#666666; letter-spacing:-1px;}
#subMenu li a:hover {color:#df6220;}
/*subMenu colours*/
.about #subMenu li.about a {color:#df6220;}
blockquote {font-size:1.6em; font-style:italic; margin-left:0; line-height:1.6em;}

#content {float:left; width:450px; margin:0 30px 50px 10px; clear:none;}
.case #content {width:780px; margin:0 0 0 180px;}

ul.content li {font-weight:bold; line-height:1.5em; margin-bottom:15px;}

#recent {width:280px; padding:10px; background:#3c3c3c; float:right; margin-bottom:50px;}
p.title, p.info, p.title a, p.info a {color:#e2e2e2; text-decoration:none; line-height:1em;}
p.title {font-weight:bold; font-size:1.8em; margin-bottom:0px;}
.contact p.title {line-height:1.4em;}
p.info {font-size:1.2em; margin-top:0px;}
p.next a {color:#E2E2E2; text-decoration:none; margin-bottom:0; float:right; font-weight:bold;}
p.next a:hover, p.title a:hover {color:#df6220;}

#footer {background-color:#121212;}
#footerContent {width:960px; margin:auto; padding-top:40px;}
address, #footerContent p {font-style:normal; font-weight:normal; font-size:1.4em;}
#footerContent p a {margin-right:10px;}

#banner {position:absolute; top:0; left:0; z-index:999999;}