/* >Brand Colours
---------------------------------------------------------------------------------------- */

@pr: #F7931E;
@events: #EA008B;
@pa: #850078;
@digital: #C0E20E;


/* >Structure
---------------------------------------------------------------------------------------- */

* {
	margin: 0;
}
body {
	background: #efefef;
	min-width: 990px;
}
#outer {
	min-width: 990px;
	max-width: 1110px;
	margin: 0 auto;
}
#wrapper {
	margin: 0 15px;
	background: #fff;
	box-shadow: 3px 3px 5px #ccc;
	-webkit-box-shadow: 3px 3px 5px #ccc;
	-moz-box-shadow: 3px 3px 5px #ccc;
}
#content {
	padding: 100px 0 50px 0;
	min-height: 650px;
	overflow: auto;
}
#main {
	width: 70%;
	float: right;
	margin-right: 2%;
}
#secondary {
	width: 25%;
	float: left;
}


/* >Header
---------------------------------------------------------------------------------------- */

#banner {
	overflow: hidden;
	background: #850078;
}
#banner div {
	width: 33%;
	height: 9px;
	float: left;
}
#banner div.pr {
	background: #F7931E;
}
#banner div.events {
	width: 34%;
	background: #EA008B;
}
#banner div.pa {
	background: #850078;
}


/* >Footer
---------------------------------------------------------------------------------------- */

#footer {
	width: 93%;
	margin: 0 auto 40px auto;
	padding: 50px 0;
	color: #bbb;
	text-align: right;
	-webkit-transition: color .2s linear;
}
#footerInner {
	background: url("/images/logo-grey.gif") no-repeat 100% 50%;
	padding-right: 50px;
}
#footer:hover {
	color: #888;
}
#footer:hover a:link, #footer:hover a:visited {
	color: #666;
}
#footer a:link, #footer a:visited {
	color: #999;
}
#footer a:hover, #footer a:active {
	color: #555;
}
#footer #attribution {
	font-size: 13px;
	margin-top: 5px;
}


/* >Inline
---------------------------------------------------------------------------------------- */

#main p, #main li, #main dl {
	font-size: 17px;	
}
#main p {
	line-height: 1.6em;
	margin-bottom: 18px;
}
#main p strong {
	color: #222;
	font-size: 105%;
}
#main p.jumpTo {
	color: #777;
	font-size: 90%;
}
h1 {
	font-size: 53px;
	font-weight: normal;
	margin-bottom: 30px;
	background: url("/images/logo-plain.png") no-repeat 0 20%;
	padding: 5px 0 35px 300px;
	color: #F7931E;
}
h2 {
	color: #333;
	font-size: 20px;
}
table {
	width: 100%;
}
table img {
	border: 0;
}
a {
	-webkit-transition: color .2s linear;
}
#main a {
	font-weight: bold;
}
#main a:link, #main a:visited {
	color: #F7931E;
}
#content #main p a:hover, #content #main p a:active {
	color: #000;
}
#main a.pr:link, #main a.pr:visited {
	color: #F7931E;
}
#main a.events:link, #main a.events:visited {
	color: #EA008B;
}
#main a.pa:link, #main a.pa:visited {
	color: #850078;
}
p.jumper a {
	text-decoration: none;
	font-weight: bold;
	font-size: 110%;
	padding: 3px 8px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #fff !important;
}
p.jumper a:hover {
	opacity: .8;
	filter: alpha(opacity=80);
}
p.jumper a.pr {
	background-color: #F7931E;
}
p.jumper a.events {
	background-color: #EA008B;
}
p.jumper a.pa {
	background-color: #850078;
}
p.jumper a.digital {
	background-color: #B0D00D;
}


p#pagination {
	margin-top: 50px;
	text-align: left;
}
p#pagination a:link, p#pagination a:visited {
	background: #eee;
	color: #777;
	padding: 8px 20px;
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}
p#pagination a:hover, p#pagination a:active {
	background: #ddd;
	color: #444;
}


/* >Type
---------------------------------------------------------------------------------------- */

body {
	color: #555;
	font-family: "arial", sans-serif;
	-webkit-text-stroke: 1px transparent;
}
@media only screen and (max-device-width:480px) {
	body {
		-webkit-text-stroke:0 black;
	}
}
h1, .personDetails h2, .caseStudyHeader  {
	font-family: "helvetica", arial, sans-serif;
}
.personDetails blockquote, #errorPage .explain {
	font-family: Palatino, Georgia, Times New Roman, sans-serif;
}


/* >Navigation
---------------------------------------------------------------------------------------- */

#logo {
	width: 64px;
	height: 70px;
	margin: 0 0 60px 15px;
}
#logo a {
	width: 100%;
	height: 100%;
	display: block;
	background: url("/images/logo.png") no-repeat 100% 50%;
	text-indent: -9999px;
}
#home #logo a {
	background: url("/images/logo.png") no-repeat 0 50%;
}
#home #logo a:hover {
	cursor: default;
}
#logo a:hover {
	width: 64px;
	height: 70px;
	display: block;
	background: url("/images/logo.png") no-repeat 100% 50%;
}
#navigation {
	margin-left: 20px;
}
#navigation a:focus {
	outline: 0;
}
#navigation li {
	color: #ddd;
	margin-bottom: 17px;
}
#navigation li:hover {
	color: #F7931E;
}
#navigation li a {
	font-size: 27px;
	text-decoration: none;
	display: block;
	padding: 4px 0; /* Bigger link targets */
}
#navigation li a:link, #navigation li a:visited {
	color: #999;
}
#navigation li a:hover {
	color: #555 !important;
}
#navigation li a:active {
	color: #F7931E !important;
}
#navigation ol li ul {
	padding-left: 0;
	margin-top: 6px;
}
#navigation ol li ul li {
	margin-bottom: 0;
	padding: 0;
	margin-left: 17px;
}
#navigation ol li ul li a {
	font-size: 16px;
	padding: 3px 0;
}


/* Selected */

#home #homeNav,
#services #servicesNav,
#why #whyNav,
#clients #clientsNav,
#people #peopleNav,
#fresh #freshNav,
#contact #contactNav {
	color: #F7931E;
}
#home #homeNav a:link, #home #homeNav a:visited,
#services #servicesNav a:link, #services #servicesNav a:visited,
#why #whyNav a:link, #why #whyNav a:visited,
#clients #clientsNav a:link, #clients #clientsNav a:visited,
#people #peopleNav a:link, #people #peopleNav a:visited,
#fresh #freshNav a:link, #fresh #freshNav a:visited,
#contact #contactNav a:link, #contact #contactNav a:visited {
	color: #222;
}
#services #servicesNav a:hover,
#why #whyNav a:hover,
#clients #clientsNav a:hover,
#people #peopleNav a:hover,
#fresh #freshNav a:hover,
#contact #contactNav a:hover {
	color: #222 !important;
}

/* Sub-pages selected states */

.pr#services #navigation li#prNav,
.events#services #navigation li#eventsNav,
.pa#services #navigation li#paNav,
.digitial#services #navigation lidigitalNav,
.case_studies#clients #navigation li#caseStudiesNav,
.join_us#people #navigation li#joinUsNav {
	color: #F7931E;
}
.pr#services #navigation li#prNav a,
.events#services #navigation li#eventsNav a,
.pa#services #navigation li#paNav a,
.digital#services #navigation li#digitalNav a,
.case_studies#clients #navigation li#caseStudiesNav a,
.join_us#people #navigation li#joinUsNav a {
	font-weight: bold;
	color: #F7931E !important;
}
.events#services #navigation li#eventsNav a {
	color: #EA008B;
}
.pa#services #navigation li#paNav a {
	color: #850078;
}


/* >Short Pages
---------------------------------------------------------------------------------------- */

#main p {
	width: 70%;
}
#clients #main p,
#people #main p {
	width: 95%;
}
#clients #content, #people #content {
	background: #fff;
}
.join_us#people #content {
	background: url("/images/new-guy.png") no-repeat 100% 100%;
}
.join_us#people #main p {
	width: 60%;
}



/* >Home
---------------------------------------------------------------------------------------- */

#home h1 {
	background: url("/images/logo-pr.png") no-repeat 310px 50%;
	padding: 5px 280px 28px 0;
	color: #999;
}
#home h1 strong {
	visibility: hidden;
	position: absolute;
}
#freshLatest {
	background: url("/images/grey-fade.png") no-repeat 0 0;
	padding-top: 5px;
	margin-bottom: 20px;
}
#main #freshLatest p,
#main #latestElsewhere p {
	margin-bottom: 5px;
	font-size: 13px;
	line-height: 1.4em;
	width: 80%;
}
#main #latestElsewhere p {
	font-size: 16px;
}
p.latestPressRelease a:last-child{
	font-size: 11px;
}
#freshLatest a:link, #freshLatest a:visited {
	text-decoration: none;
	border-bottom: 1px solid #e0e0e0;
}
#latestElsewhere a:link, #latestElsewhere a:visited {
	text-decoration: none;
}
#latestElsewhere a.section:link, #latestElsewhere a.section:visited {
	text-decoration: underline;
}

#freshLatest p a.section:link, #freshLatest p a.section:visited,
#main #latestElsewhere p a.section:link, #main #latestElsewhere p a.section:visited {
	color: #333;
	font-weight: bold;
}
#freshLatest p a:link, #freshLatest p a:visited,
#latestElsewhere p a:link, #latestElsewhere p a:visited {
	font-weight: normal;
	color: #333;
}
#main #freshLatest p a.section:hover, #main #freshLatest p a:hover,
#main #latestElsewhere p a.section:hover, #main #latestElsewhere p a:hover {
	color: #F7931E;
}
#freshLatestInner {
	background: url("/images/grey-fade.png") no-repeat 0 100%;
	padding-bottom: 5px;
}
#freshBanner {
	background: url("/images/fresh.png") no-repeat 0 50%;
	padding: 15px 0 15px 34px;
}
#home #navigation {
	padding-bottom: 120px;
	background: url("/images/cipr-finalist.jpg") 20px 100% no-repeat;
}


/* >Services
---------------------------------------------------------------------------------------- */

#services .jumpTo {
	margin-top: 50px;
}
.pr#services h1 {
	color: #F7931E;
}
.events#services h1 {
	color: #EA008B;
}
.pa#services h1 {
	color: #850078;
}
.digital#services h1 {
	color: #B0D00D;
	background: url("/images/logo-juice.png") no-repeat 0 20%;
	text-indent: -9999px;
	height: 105px;
	padding: 0;
}
.digital #main a:link, .digital #main a:visited {
	color: #B0D00D;
}


/* >Clients
---------------------------------------------------------------------------------------- */

table#clientList td {
	padding: 20px 0;
	text-align: center;
}
table#clientList td a {
	display: block;
}
table#clientList td a:hover {
	filter: alpha(opacity=60);
	opacity: .6;
}
.caseStudyHeader {
	overflow: auto;
	margin-bottom: 0;
	padding: 25px 10px 18px 10px;
	border-bottom: 7px solid #F5F5F5;
	border-top: 7px solid #F5F5F5;
}
.caseStudyHeader img {
	float: left;
	margin-right: 30px;
}
.caseStudyHeader h2 {
	font-size: 30px;
	color: #000;
}
.caseStudyHeader h3 {
	font-size: 20px;
	font-weight: normal;
}
.case_studies #main h4 {
	color: #222;
	font-size: 22px;
	margin-bottom: 10px;
	margin-top: 55px;
}
.case_studies #main ul {
	list-style-type: square;
	line-height: 1.4em;
	margin-bottom: 30px;
}
.case_studies #main li {
	margin-bottom: 10px;
	width: 80%;
}



/* >People
---------------------------------------------------------------------------------------- */

table#teamList td {
	padding: 12px 0;
}
table#teamList td a:hover,
table#keyTeamList td a:hover {
	opacity: .6;
}
.teamMember {
	background: url("/images/team-member-bg.png") no-repeat;
	height: 140px;
	width: 120px;
	position: relative;
}
.teamMember .teamMemberPhoto {
	position: absolute;
	top: 6px;
	left: 8px;
	display: block;
	width: 100px;
	height: 100px;
}
.teamMember em,
.keyTeamMember em a {
	font-weight: bold;
	font-style: normal;
	position: absolute;
	top: 115px;
	left: 5px;
	display: block;
	width: 110px;
	text-align: center;
}
.keyTeamMember em a {
	width: 150px;
	top: 170px;
	left: 5px;
}
#main .teamMember em a,
#main .keyTeamMember em a {
	color: #000;
	text-decoration: none;
	display: block;
}
.keyTeamMember {
	background: url("/images/key-team-member-bg.png") no-repeat;
	height: 210px;
	width: 165px;
	position: relative;
}
.keyTeamMember .teamMemberPhoto {
	position: absolute;
	top: 12px;
	left: 5px;
	display: block;
	width: 150px;
	height: 150px;
}
#keyPeople {
	padding-top: 90px;
	margin-top: 50px;
	border: 1px solid #fff;
	background: url("/images/tangerine-border-small.png") 10% 0 no-repeat;
}

/* Inline People Listing */

#wrapper {
	position: relative;
}
#main {
	padding-bottom: 56px;
}
#currentTeamMember {
	background: url("/images/transparency.png") repeat-x;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 56px;
}
#currentTeamMember p {
	padding: 15px 25px;
	text-align: right;
	font-size: 25px;
}
#currentTeamMember a {
	font-weight: bold;
}
#currentTeamMember p a:link, #currentTeamMember p a:visited {
	color: #555;
}
#currentTeamMember p a:hover, #currentTeamMember p a:active {
	color: #000;
}


/* >Fresh
---------------------------------------------------------------------------------------- */

#latestElsewhere {
	margin-bottom: 30px;
}
#main #latestElsewhere p {
	width: 95%;
	line-height: 1.5em;
}
#hotHotHot {
	overflow: hidden;
}
#newsPosts {
	float: left;
	width: 58%;
	margin-right: 7%;
}
#main #newsPosts p {
	width: 100%;
	font-size: 15px;
}
#main #newsPosts li, #main #newsPosts dl {
	font-size: 15px;
}
#main #newsPosts ul {
	margin: 20px 0;
}
#main #newsPosts li {
	margin-bottom: 4px;
}
#main #newsPosts h1 {
	background: none;
	text-indent: 0;
	padding: 0;
	color: #222;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 10px;
}
#main #newsPosts h2 {
	margin-bottom: 5px;
}
#main #newsPosts h3 {
	margin-bottom: 5px;
}
#main #newsPosts h4 {
	margin-bottom: 5px;
}
#main #newsPosts h5 {
	margin-bottom: 5px;
	text-transform: uppercase;
}
.newsPost {
	margin-bottom: 50px;
	background: url("/images/tangerine-border-xsmall.png") no-repeat 10% 100%;
	padding-bottom: 70px;
}
.newsPost:last-child {
	background: transparent;
	padding-bottom: 0;
	margin-bottom: 0;
}
.newsPostHeading {
	position: relative;
	margin-bottom: 15px;
	min-height: 40px;
}
.newsPostHeading h2 {
	width: 80%;
	line-height: 1.2em;
	font-size: 22px;
}
.newsPostHeading h2 a {
	text-decoration: none;
}
#main .newsPostHeading h2 a:hover, #main .newsPostHeading h2 a:active {
	color: #EA008B;
}
.newsPostHeading h3 {
	width: 50px;
	position: absolute;
	top: 4px;
	right: 0;
	background: #F8F8F8;
	color: #aaa;
	text-align: center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 6px 0;
	line-height: 1em;
	font-size: 14px;
}
.newsPostHeading h3 strong {
	text-transform: uppercase;
	font-size: 12px;
	display: block;
}
#collatedTweets {
	float: left;
	width: 33%;
}
#collatedTweets img {
	width: 65px;
	height: 65px;
	position: absolute;
	top: 10px;
	left: 0;
}
#collatedTweets .tweet {
	position: relative;
	min-height: 75px;
	padding: 10px 0 10px 75px;
	margin-bottom: 10px;
	border-bottom: 4px solid #f9f9f9;
}
#collatedTweets .tweet blockquote p {
	font-size: 13px;
	line-height: 1.4em;
	color: #888;
	width: 100%;	
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
}
#collatedTweets a:link, #collatedTweets a:visited {
	color: #EA008B;
}
#collatedTweets a:hover, #collatedTweets a:active {
	color: #000;
}
#main p#moreTeam {
	text-align: center;
	font-size: 13px;
	line-height: 1.2em;
	width: 100%;
	color: #aaa;
	margin-top: 20px;
}
#fresh #pagination {
	text-align: center;
}
.news_post h2 {
	font-size: 28px;
	margin-bottom: 20px;
	color: #222;
}
.news_post #main p {
	width: 80%;
	font-size: 15px;
}



/* >Modal Windows
---------------------------------------------------------------------------------------- */

.individual {
	overflow: auto;
	background: url("/images/tangerine-border.gif") no-repeat 50% 100%;
	padding-bottom: 12px;
}
p#return {
	position: fixed;
	top: 8%;
	right: 8%;
}
p#return a:link, p#return a:visited {
	background: #eee;
	color: #777;
	padding: 8px 20px;
	font-size: 24px;
	font-weight: bold;
	text-decoration: none;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}
p#return a:hover, p#return a:active {
	background: #ddd;
	color: #444;
}

/* Individual People */

.individual .personImage {
	float: left;
	margin-left: 25px;
}
.individual .personDetails {
	width: 450px;
	float: right;
	margin: 80px 20px 0 0;
}
.personDetails h2 {
	font-size: 55px;
	letter-spacing: -2px;
	line-height: .8em;
	color: #EA008B;
	margin-bottom: 20px;
}
.personDetails blockquote {
	color: #000;
	font-style: italic;
	font-size: 38px;
	margin-bottom: 20px;
}
.latestTweet p {
	overflow: hidden;
	width: 100%;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
}
.personDetails a:link, .personDetails a:visited {
	color: #000;
	font-weight: bold;
}
.personDetails a:hover, .personDetails a:active {
	color: #F7931E;
}

/* Key People */

.key .shouldFollow {
	margin-bottom: 40px;
}
.personDetails.key h2 {
	margin-bottom: 6px;
	color: #F7931E;
	font-size: 45px;
}
.keyPersonDetails {
	margin-bottom: 30px;
}
.keyPersonDetails h3 {
	font-size: 20px;
	color: #222;
	margin-bottom: 20px;
	margin-top: 0;
}
.keyPersonDetails p {
	margin-bottom: 10px;
	font-size: 14px;
	width: 100%;
	line-height: 1.4em;
}
.personDetails.key blockquote {
	font-size: 26px;
}


/* Individual Clients */

.clientBoard {
	height: 520px;
	padding-top: 130px;
	margin-bottom: 4px;
}
.clientShort {
	width: 535px;
	margin: 0 auto;
	/* border-top: 1px solid #F0F1F5; */
}
.clientShort p {
	margin-bottom: 20px;
	line-height: 1.5em;
	font-size: 15px;
}
.clientShort strong {
	color: #222;
}
p.clientLogo {
	text-align: right;
	margin: 30px 0;
}



/* >Contact
---------------------------------------------------------------------------------------- */

#contact #main p {
	width: 100%;
}
#contact form {
	margin: 20px 0;
}
.input-text {
	font-size: 20px;
	padding: 2px;
	width: 80%;
}
.labelHighlight {
	color: #ccc;
}
#contact form .input-text.mini {
	width: 30px;
	text-align: center;
}
#contact form textarea {
	font-size: 14px;
	width: 100%;
}
#contactForm {
	width: 50%;
}
#contactForm p em {
	font-size: 13px;
	color: #aaa;
	font-style: normal;
}
address {
	font-style: normal;
	font-size: 14px;
	margin-bottom: 20px;
}
.tel {
	margin-top: 8px;
	display: block;
}
#postal h2 {
	margin-bottom: 15px;
}
#postal {
	margin-top: 40px;
	overflow: auto;
	width: 360px;
}
#postal #map {
	width: 120px;
	float: left;
	font-size: 14px;
	text-align: center;
}
#postal #map img {
	border: 0;
}
#postal #map em {
	font-size: 10px;
	font-style: normal;
}
#postal address {
	width: 200px;
	float: right;
	line-height: 1.4em;
}
#postal address a:link, #postal address a:visited {
	color: #555;
	font-weight: normal;
}
#postal address a:hover, #postal address a:active {
	color: #000;
}


/* >Feedback
---------------------------------------------------------------------------------------- */

#flash p {
	font-size: 20px;
	margin-bottom: 20px;
}
#main p.notice {
	color: #6EA833;
	background: #E6F2D6;
	border: 2px solid #CEE0A4;
	width: 90%;
	padding: 10px 20px;
	font-weight: bold;
	font-size: 15px;
}
div .fieldWithErrors {
	display: inline;
	margin: 0;
	padding: 0;
}
div .errorExplanation {
	color: #fff;
	font-size: 15px;
	padding: 15px 20px;
	margin-bottom: 20px;
	background: #FF3A6A;
	border: 3px solid #A00017;
}
.errorExplanation {
	color: #AF123F;
}
#main .errorExplanation h2 {
	color: #fff;
}
#main .errorExplanation p {
	margin-bottom: 0;
}
#errorPage #content {
	min-height: 50px;
	border-bottom: 4px solid #e8e8e8;
}
.404#errorPage #content {
	background: #fff;
}
.error404#errorPage #content,
.error422#errorPage #content {
	background: #fff url("/images/people/kateg-huh.jpg") no-repeat 90% 100%;
}
.maintenance#errorPage #content,
.error500#errorPage #content {
	background: #fff url("/images/people/steve-huh.jpg") no-repeat 90% 100%;
}
#errorPage #main {
	width: 60%;
	margin-left: 50px;
	float: none;
}
#errorPage #main p.explain {
	color: #000;
	font-style: italic;
	font-size: 30px;
	width: 85%;
}
#errorPage h1 {
	font-weight: bold;
	color: #EA008B;
}


#apprenticeships {
	padding-bottom: 300px;
	background: url("/images/apprenticeships.jpg") 0 100% no-repeat;
}