* {
	margin:0;
	padding:0;
}

body {
	background:#232323;
	color:#d3d3d3;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:16px;
	text-align:center;
}

.clr {
	clear:both;
}

.accessibility-aid {
	position:absolute;
	visibility:hidden;
}



h1, h2, h3, ul, ol, dl, p, address {
	margin-bottom:16px;
}

h1,
h2.major,
h3.colonel, /* one rank higher than the major! */
p.feature,
p.feature-alternate,
ul.sub-navigation a span {
	color:#fff;
	font-size:20px;
	font-weight:bold;
	letter-spacing:-0.02em;
	line-height:21px;
}

h2,
h3.major {
	color:#fcec00;
	font-size:14px;
	letter-spacing:-0.02em;
}

h2.major,
h2 a,
h3.major a {
	color:#fcec00;
}

h2 a:hover,
h2 a:focus,
h3.major a:hover,
h3.major a:focus {
	color:#fff;
}

h3 {
	font-size:14px;
	letter-spacing:-0.02em;
}

h3.minor {
	margin:0;
	color:#fff;
	font-size:12px;
	font-weight:bold;
}

h3.colonel {
	color:#fcec00;
}

p.feature {
	color:#fcec00;
}

div.column:first-child > h1:first-child,
div.column:first-child > h2.major:first-child,
div.column:first-child > h3.colonel:first-child,
div.column:first-child > p.feature:first-child,
div.column:first-child > ul.sub-navigation:first-child {
	margin-top:-23px;
	padding-top:19px;
	border-top:4px solid #fff;
}

address {
	font-style:normal;
}

ul {
	margin-bottom:16px;
}

ul li {
	margin-left:20px;
}

ul.unstyled li {
	margin-left:0;
	list-style:none;
}

ul.spaced {
	margin-bottom:8px;
}

ul.spaced li {
	margin-bottom:8px;
}

dl dt {
	clear:both;
	float:left;
	margin-right:4px;
}

dl.terms dt {
	float:none;
	font-weight:bold;
}

dl.terms dd {
	padding-bottom:16px;
}

a {
	color:#fff;
}

a:hover,
a:focus {
	outline:0;
	color:#fcec00;
}

a img {
	border:0;
}

dt.major,
dd.major,
a.major {
	font-size:14px;
	font-weight:bold;
	letter-spacing:-0.02em;
}

dt.major {
	float:none;
	display:block;
}

dt.colonel,
dd.colonel {
	float:none;
	display:block;
	color:#fff;
	font-size:20px;
	font-weight:bold;
	letter-spacing:-0.02em;
	line-height:21px;
}

dt.major,
dt.colonel {
	margin-bottom:4px;
	color:#fcec00;
}

dd.colonel {
	margin-bottom:16px;
}

dd.colonel a {
	font-weight:normal;
}

dd.colonel a span {
	font-size:20px;
	font-weight:bold;
}



form {
	margin-left:-10px;
}

.column-double form {
	width:492px;
}

form label {
	float:left;
	margin:0 0 8px 10px;
	width:236px;
}

form label span {
	display:block;
	color:#fcec00;
	font-size:14px;
	font-weight:bold;
}

form input {
	padding:4px;
	width:228px;
	border:0;
	background:#fff;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
}

form select {
	width:236px;
}

form button {
	float:right;
	border:0;
	background:transparent;
	color:#fcec00;
	font-family:Arial, Helvetica, sans-serif;
	font-size:20px;
	font-weight:bold;
	line-height:21px;
	letter-spacing:-0.02em;
	cursor:pointer;
}



#header {
	position:relative;
	overflow:hidden;
	margin-bottom:48px;
	height:500px;
	background:#fcec00 url(/images/header.png) 0 100% repeat-x;
	font-weight:bold;
}

#header.narrow {
	height:75px;
	background-position:0 10px;
}

#logo {
	overflow:hidden;
	position:absolute;
	z-index:1000;
	top:25px;
	left:50%;
	margin-left:-487px;
	display:block;
	width:154px;
	height:23px;
	background:url(/images/creative-spark.png) 0 0 no-repeat;
	text-indent:-9999px;
}

#contact-details {
	position:absolute;
	z-index:1000;
	top:28px;
	right:50%;
	margin-right:-487px;
	color:#231f20;
	font-size:17px;
	text-align:right;
	letter-spacing:-0.03em;
}

#contact-details a {
	display:block;
	color:#231f20;
	font-size:12px;
}

#contact-details a:hover {
	color:#231f20;
}

#navigation {
	position:relative;
	z-index:999;
	overflow:visible;
	margin:75px auto 0;
	padding:0 0 0 240px;
	width:728px;
	height:20px;
	border-top:1px solid #231f20;
}

#navigation li {
	position:relative;
	top:-75px;
	float:left;
	margin:0 4px 0 0;
	list-style:none;
}

#navigation li a {
	padding:4px 6px;
	height:75px;
	color:#231f20;
	font-size:15px;
	line-height:75px;
	letter-spacing:-0.03em;
	text-decoration:none;
}

#navigation li.selected a,
#navigation li a:hover,
#navigation li a:focus {
	background:#231f20;
	color:#fff;
}



#header .click-me {
	position:absolute;
	width:68px;
	height:60px;
	background:url(/images/headers/hotspots/click-me.png) 0 0 no-repeat;
}

#header .oi {
	position:absolute;
	width:65px;
	height:51px;
	background:url(/images/headers/hotspots/oi.png) 0 0 no-repeat;
}

#header .here {
	position:absolute;
	width:75px;
	height:51px;
	background:url(/images/headers/hotspots/here.png) 0 0 no-repeat;
}

#header-home {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:500px;
	background:url(/images/headers/shadow.png) 50% 221px repeat-x;
}

#header-home .block {
	position:relative;
	width:100%;
	height:500px;
}

#header-welcome {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:50%;
	top:0;
	margin-left:-575px;
	width:1387px;
	height:500px;
	background:url(/images/headers/home/background.png) 0 0 no-repeat;
}

#header-welcome.moved      { background-image:url(/images/headers/home/background-moved.png); }
#header-welcome.valentines { background-image:url(/images/headers/home/background-valentines.png); }
#header-welcome.xmas       { background-image:url(/images/headers/home/background-xmas.png); }

#header-welcome .forever-manchester {
	position:absolute;
	top:123px;
	left:75px;
	overflow:hidden;
	width:92px;
	height:92px;
	background:url(/images/headers/home/forever-manchester.png) 0 0 no-repeat;
	text-indent:-9999px;
}

#header-welcome .moved {
	position:absolute;
	top:123px;
	left:96px;
	overflow:hidden;
	width:127px;
	height:106px;
	text-indent:-9999px;
}

#header-welcome .hello {
	position:absolute;
	top:95px;
	left:460px;
	overflow:hidden;
	width:80px;
	height:40px;
	text-indent:-9999px;
}

#header-welcome .branding-digital {
	position:absolute;
	top:110px;
	left:750px;
	overflow:hidden;
	width:250px;
	height:200px;
	text-indent:-9999px;
}

#header-welcome-world-cup {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-welcome-world-cup div {
	position:absolute;
	left:50%;
	top:54px;
	margin-left:-674px;
	width:1166px;
	height:429px;
	background:url(/images/headers/home-world-cup/background.jpg) 0 0 no-repeat;
}

#header-welcome-world-cup .branding-digital {
	position:absolute;
	top:154px;
	left:988px;
	overflow:hidden;
	width:179px;
	height:132px;
	text-indent:-9999px;
}

#header-about {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-about div {
	position:absolute;
	left:50%;
	top:102px;
	margin-left:-470px;
	width:940px;
	height:350px;
	background:url(/images/headers/about/background.png) 0 0 no-repeat;
}

#header-about div .clients {
	position:absolute;
	left:250px;
	top:0px;
	overflow:hidden;
	width:170px;
	height:105px;
	text-indent:-9999px;
}

#header-about div .awards {
	height:190px;
	left:0;
	overflow:hidden;
	position:absolute;
	text-indent:-9999px;
	top:160px;
	width:300px;
}

#header-about div .process {
	position:absolute;
	left:520px;
	top:235px;
	overflow:hidden;
	width:190px;
	height:65px;
	text-indent:-9999px;
}

#header-about div .press {
	position:absolute;
	left:680px;
	top:80px;
	overflow:hidden;
	width:105px;
	height:60px;
	text-indent:-9999px;
}

#header-about div .meet-the-team {
	height:125px;
	left:810px;
	overflow:hidden;
	position:absolute;
	text-indent:-9999px;
	top:180px;
	width:110px;
}

#header-services {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:456px;
	background:url(/images/headers/services/shadow.png) 50% 216px repeat-x;
}

#header-services div {
	position:absolute;
	left:50%;
	top:0;
	margin-left:-463px;
	width:922px;
	height:461px;
	background:url(/images/headers/services/background.png) 0 0 no-repeat;
}

#header-services div .print  {
	height:70px;
	left:75px;
	overflow:hidden;
	position:absolute;
	text-indent:-9999px;
	top:370px;
	width:185px;
}

#header-services div .web  {
	height:110px;
	left:405px;
	overflow:hidden;
	position:absolute;
	text-indent:-9999px;
	top:270px;
	width:125px;
}

#header-services div .branding  {
	height:105px;
	left:615px;
	overflow:hidden;
	position:absolute;
	text-indent:-9999px;
	top:250px;
	width:310px;
}

#header-work1 {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-work1 div {
	position:absolute;
	left:50%;
	bottom:-79px;
	margin-left:-480px;
	width:960px;
	height:385px;
	background:url(/images/headers/work/background.png) 0 0 no-repeat;
}

#header-work1 .image1 {
	position:absolute;
	left:312px;
	top:14px;
	width:341px;
	height:257px;
}



#header-work2,
#header-news {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-work2 div,
#header-news div {
	position:absolute;
	left:50%;
	bottom:-81px;
	margin-left:-950px;
	width:1858px;
	height:394px;
	background:url(/images/headers/work2/background.png) 0 0 no-repeat;
}

#header-work2 .image1,
#header-news .image1 {
	position:absolute;
	left:640px;
	top:35px;
	width:676px;
	height:313px;
}

#header-news div .oilink  {
	position:absolute;
	top:5px;
	left:580px;
	overflow:hidden;
	width:55px;
	height:100px;
	text-indent:-9999px;
}

#header-work3 {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-work3 div {
	position:absolute;
	left:50%;
	bottom:-69px;
	margin-left:-950px;
	width:1884px;
	height:408px;
	background:url(/images/headers/work3/background.png) 0 0 no-repeat;
}

#header-work3 .image1 {
	position:absolute;
	left:312px;
	top:14px;
	width:341px;
	height:257px;
}



#header-work4 {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:402px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-work4 div {
	position:absolute;
	left:50%;
	bottom:-69px;
	margin-left:-950px;
	width:1883px;
	height:406px;
	background:url(/images/headers/work4/background.png) 0 0 no-repeat;
}

#header-work4 .image1 {
	position:absolute;
	left:656px;
	top:73px;
	width:599px;
	height:279px;
}



#header-play {
	position:absolute;
	z-index:1;
	left:50%;
	bottom:0;
	margin-left:-690px;
	width:1188px;
	height:399px;
	background:url(/images/headers/play/background.png) 0 0 no-repeat;
}

#header-play .image1 {
	position:absolute;
	left:330px;
	top:31px;
	width:159px;
	height:142px;
}

#header-play .image2 {
	position:absolute;
	left:651px;
	top:184px;
	width:142px;
	height:116px;
}

#header-play .clicker1 {
	left:434px;
	top:10px;
	overflow:hidden;
	text-indent:-9999px;
}

#header-play .clicker2 {
	left:577px;
	top:231px;
	overflow:hidden;
	text-indent:-9999px;
}

#header-play .clicker3 {
	left:875px;
	top:171px;
	overflow:hidden;
	text-indent:-9999px;
}

#header-play .playlistlink  {
	position:absolute;
	top:150px;
	left:945px;
	overflow:hidden;
	width:180px;
	height:200px;
	text-indent:-9999px;
}


#header-contact {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:393px;
	background:url(/images/headers/shadow.png) 0 100% repeat-x;
}

#header-contact div {
	position:absolute;
	left:50%;
	top:0;
	margin-left:-358px;
	width:960px;
	height:472px;
	background:url(/images/headers/contact/background.png) 0 0 no-repeat;
}

#header-contact div .map  {
	position:absolute;
	top:170px;
	left:405px;
	overflow:hidden;
	width:310px;
	height:265px;
	text-indent:-9999px;
}

#header-web-design-manchester {
	position:absolute;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:100%;
	height:485px;
	background:url(/images/headers/web-design-manchester/background.png) 50% 100% repeat-x;
}

#header-web-design-manchester div {
	position:absolute;
	left:50%;
	bottom:0;
	margin-left:-950px;
	width:1884px;
	height:422px;
	background:url(/images/headers/web-design-manchester/background.jpg) 0 0 no-repeat;
}

#header-web-design-manchester .image1 {
	position:absolute;
	left:620px;
	top:55px;
	width:682px;
	height:334px;
}



#page {
	margin:0 auto;
	width:974px;
	text-align:left;
}



.section {
	clear:both;
	position:relative;
	left:-10px;
	margin:16px -10px 0 0;
	padding-top:1px;
	width:984px;
	background:url(/images/line.png) 10px 0 no-repeat;
}

.section a.view-work {
	position:relative;
	top:-16px;
	color:#fff;
}

.section a.view-work:hover {
	color:#fcec00;
}

.section a.view-work span {
	font-size:20px;
	letter-spacing:-0.02em;
	line-height:21px;
	font-weight:bold;
}

.section .section {
	clear:none;
	float:left;
	left:0;
	margin-top:0;
	width:246px;
	background:transparent;
}

.section .section-double {
	width:492px;
}

.section .section-triple {
	width:738px;
}

.section .section .section {
	clear:both;
	float:none;
	overflow:visible;
	width:100%;
	border-top:1px solid #fff;
}

.column {
	position:relative;
	overflow:visible;
	z-index:2;
	float:left;
	margin-left:10px;
	padding-top:23px;
	width:236px;
	background:#232323;
}

.column-double {
	z-index:1;
	width:482px;
}

.column-triple {
	z-index:1;
	width:728px;
}

ul.sub-navigation li {
	clear:both;
	margin:0 0 8px;
	list-style:none;
}

ul.sub-navigation li h1 {
	display:inline;
	margin:0;
	font-size:12px;
	font-weight:normal;
	line-height:16px;
}

ul.sub-navigation li h1 a,
ul.sub-navigation li.selected a,
ul.sub-navigation li a:hover,
ul.sub-navigation li a:focus,
ul.sub-navigation li h1 a span,
ul.sub-navigation li.selected a span,
ul.sub-navigation li a:hover span,
ul.sub-navigation li a:focus span {
	color:#fcec00;
}



.project-grid {
	position:relative;
	left:-10px;
	margin:0 -10px 6px 0;
	width:738px;
}

.project-grid li {
	float:left;
	margin:0 0 10px 10px;
	background:#000;
	list-style:none;
}

.project-grid li a {
	position:relative;
	overflow:hidden;
	display:block;
	width:236px;
	height:140px;
	text-decoration:none;
}

.project-grid li a img {
	position:absolute;
	z-index:1;
	left:0;
	top:0;
	opacity:0.3;
}

.project-grid li a:hover img,
.project-grid li a:focus img {
	opacity:1;
}

.project-grid li a em {
	position:absolute;
	z-index:2;
	top:0;
	right:0;
	overflow:hidden;
	display:block;
	width:57px;
	height:57px;
	background:url(/images/work/new.png) 0 0 no-repeat;
	text-indent:-9999px;
}

.project-grid li a span {
	position:absolute;
	z-index:2;
	bottom:-500px;
	display:block;
	padding:10px;
	width:236px;
	background:#000;
	color:#fff;
	opacity:0.8;
}

.project-grid li a:hover span,
.project-grid li a:focus span {
	bottom:0;
}

.project-grid li a span strong {
	display:block;
	color:#fcec00;
}



#portfolio-navigation {
	height:16px;
	color:#fcec00;
	font-size:14px;
	font-weight:bold;
	text-align:right;
}

#portfolio-navigation-back {
	float:left;
}



ul.portfolio li {
	position:relative;
	margin:0 0 16px 0;
	padding-bottom:20px;
	list-style:none;
}

ul.portfolio li img,
ul.portfolio li object {
	display:block;
}

ul.portfolio li span {
	position:absolute;
	bottom:0;
}

ul.portfolio li span em {
	color:#fcec00;
	font-style:normal;
	font-weight:bold;
}


ul.expander li {
	overflow:hidden;
	position:relative;
	margin:0 0 1px;
	width:728px;
	background:url(/images/expanders/background.png) 0 0 repeat-y;
	color:#232323;
	font-size:21px;
	line-height:24px;
	list-style:none;
}

ul.expander li a,
ul.expander li div {
	overflow:hidden;
	position:relative;
	display:block;
	padding:20px 20px 20px 338px;
	height:210px;
	background:url(/images/expanders/background.png) -728px 0 repeat-y;
	color:#232323;
	text-decoration:none;
}

ul.click-expander li a,
ul.click-expander li div {
	padding-bottom:0;
	height:auto;
}

ul.expander li h2,
ul.expander li p {
	display:inline;
	color:#232323;
}

ul.expander li h2 {
	font-size:21px;
	font-weight:bold;
	line-height:24px;
}

ul.expander li .body {
	position:absolute;
	bottom:4px;
	right:20px;
	display:block;
	overflow:visible;
	padding:0;
	width:370px;
	height:auto;
	background:transparent;
	font-size:12px;
	line-height:16px;
}

ul.click-expander li .body {
	position:relative;
	bottom:0;
	right:0;
	margin:0;
	padding:20px 20px 4px 0;
}

ul.expander li .body p {
	display:block;
	color:#4f4f4f;
	font-size:12px;
	line-height:16px;
}

ul.expander li .body li {
	overflow:visible;
	margin:0 0 0 16px;
	width:auto;
	background:transparent;
	font-size:12px;
	line-height:16px;
	list-style:disc outside;
}

ul.expander li .body a {
	display:inline;
	padding:0;
	height:auto;
	background:transparent;
	text-decoration:underline;
}



ul.client-list {
	position:relative;
	left:8px;
	margin-right:-8px;
	width:729px;
}

ul.client-list li {
	float:left;
	margin:0 0 5px 5px;
	width:175px;
	list-style:none;
}

ul.client-list li a {
	position:relative;
	display:block;
	overflow:hidden;
	width:175px;
	height:120px;
	background:#000 url(/images/clients/logos.png) 0 0 no-repeat;
	text-indent:-9999px;
}

ul.client-list li li {
	float:none;
	margin:0 5px 0 15px;
	width:auto;
	text-indent:-10px;
}


ul.playlist {
	padding-left:246px;
	min-height:236px;
	background:url(/images/play/playlist.png) 0 0 no-repeat;
}

ul.playlist li {
	border-top:1px solid #fcec00;
	line-height:23px;
	list-style:none;
}

ul.playlist li:first-child {
	border-top:0;
}

ul.playlist li a {
	text-decoration:none;
}

ul.playlist li a:hover *,
ul.playlist li a:focus * {
	color:#fcec00;
}

ul.playlist li strong {
	padding-right:12px;
	color:#fcec00;
	font-weight:bold;
}

ul.playlist li em {
	padding-right:12px;
	color:#fff;
	font-style:normal;
	font-weight:bold;
}



#graphic-heading-work {
	overflow:hidden;
	margin:0 0 32px 28px;
	width:171px;
	height:216px;
	background:url(/images/company-profile/work.png) 0 0 no-repeat;
	text-indent:-9999px;
}

#graphic-heading-play {
	overflow:hidden;
	margin:-30px 0 16px 54px;
	width:137px;
	height:256px;
	background:url(/images/company-profile/play.png) 0 0 no-repeat;
	text-indent:-9999px;
}



#accreditations {
	overflow:hidden;
	height:55px;
	background:url(/images/company-profile/accreditations.png) 0 23px no-repeat;
}

#accreditations li {
	margin-left:-9999px;
}

#contactBox form label { margin:8px 0 2px 8px;color:#FCEC00;font-size:14px;padding:6px 0 0 0; }
#contactBox form input, #contactBox form textarea { border:1px solid #000;clear:left;display:block;width:222px;margin:0 0 0 8px;background:#FFF url(/images/contact/inputbg.png) top left repeat-x;padding:4px;font:normal 12px Arial, Helvetica, sans-serif; }
#contactBox form textarea { width:455px;height:129px; }
#contactBox form input.submit { background:transparent;float:right;font-size:20px;font-weight:bold;text-align:right;color:#FCEC00;border:0;padding:15px 0 15px 15px;cursor:pointer;  }
#contactBox fieldset { border:0;padding-top:0;display:block;margin-left:0; }
#contactBox fieldset.column-double { margin-left:10px;width:470px;}
#contactBoxForm { margin-left:0;padding-top:0;margin-top:-10px; }
#contactBox .success { font-weight:bold;color:#c6dbb7;padding-bottom:16px; }
#contactBox .error { color:#dbb7b7;padding-bottom:16px; }
#contactBox p small { float:right;color:#FCEC00;display:block; }

#footer {
	clear:both;
	margin:16px 0 32px 246px;
	padding-top:9px;
	border-top:1px solid #515151;
	color:#515151;
	text-align:right;
}

#footer a {
	color:#515151;
}

#footer a:hover {
	color:#fcec00;
}

#footer ul {
	float:left;
	padding-top:5px;
}

#footer ul li {
	float:left;
	margin:0 8px 0 0;
	list-style:none;
}

#footer ul li a {
	overflow:hidden;
	position:relative;
	display:block;
	height:20px;
	background:url(/images/footer-links.png) 0 0 no-repeat;
	text-align:left;
	text-indent:-9999px;
}

#footer ul li.twitter a {
	width:74px;
	background-position:0 0;
}

#footer ul li.twitter a:hover,
#footer ul li.twitter a:focus {
	background-position:0 -20px;
}

#footer ul li.facebook a {
	width:92px;
	background-position:0 -40px;
}

#footer ul li.facebook a:hover,
#footer ul li.facebook a:focus {
	background-position:0 -60px;
}

#footer ul li.behance a {
	width:136px;
	background-position:0 -80px;
}

#footer ul li.behance a:hover,
#footer ul li.behance a:focus {
	background-position:0 -100px;
}