/*---[ Details ]---------------------------------------
Site: www.soup.co.uk
Author: Lee Powell
Contact: lee.powell@soup.co.uk
Date Created: 02.05.2008
Date Modified: 02.09.2008
-------------------------------------------------------*/

/*-----------------------------------------------------
Site Structure
-------------------------------------------------------*/
body {
	background: /*#000000;*/ url('/media/site/images/front-end/branding/bg-site.gif') 0 0 repeat;
	}

/* [01] Container
-------------------------------------------------------*/
#container {
	padding: 35px 45px;
	width: 885px;
	z-index: 1;
	position: relative;
	}

/* [02] Header
-------------------------------------------------------*/
#soup-site-link {
	background:url('/media/site/images/front-end/branding/bg-soup-link.png') 0 0 repeat;
	padding:4px 0 7px 35px;
}

#soup-site-link p {
	margin:0;
	font-size:1.2em;
	
}
#soup-site-link p a{
	text-decoration:none;
	color: #FFF;
}

#header {
	background: #FFF;
	padding: 27px 35px 0;
	position: relative;
	background: url('/media/site/images/front-end/navigation/bg-header-line.gif') 35px 103px no-repeat #FFF;
	}
#branding-logo {
	float: left;
	}

/* [03] Content
-------------------------------------------------------*/
#content {
	font-size: 1.4em;
	color: #5E6367;
	line-height: 1.2em;
	}
#content h1 {
	width: 700px;
	margin: 0;
	}
div#glossary {
	padding:38px 35px 22px;
}
div#glossary span {
	padding-bottom:		29px;
}

#sitemap .content-block,
#glossary-index .content-block {
	padding:0px 35px 20px;
}

ul#glossary {
	list-style-type:none;
	color:#000;
	padding:0;
}

ul#glossary li p.glossary-toggle {
	cursor:pointer;
}

ul#glossary li span.glossary-definition {
	padding-bottom:10px;
}
/* [04] Navigation
-------------------------------------------------------*/
#navigation-site {
	padding: 37px 0 0;
	margin: 0 0 0 10px;
	list-style: none;
	float: left;
	width: 461px;
	background: url('/media/site/images/front-end/navigation/bg-navigation-line.gif') 0 55px repeat-x;
	}
#navigation-site li {
	margin: 0;
	padding: 0 0 2px;
	float: left;
	}
#navigation-site li a {
	display: block;
	margin-right: 14px;
	height: 23px;
	background: url('/media/site/images/front-end/navigation/spr-navigation.gif') 0 0 no-repeat;
	text-indent: -9999px;
	}
#navigation-site li a.ppc {
	width: 39px;
	}
#navigation-site li.selected a.ppc,
#navigation-site li a.ppc:hover {
	background-position: 0 -23px;
	}
#navigation-site li a.seo {
	width: 35px;
	background-position: -39px 0;
	}
#navigation-site li.selected a.seo,
#navigation-site li a.seo:hover {
	background-position: -39px -23px;
	}
#navigation-site li a.lead-generation {
	width: 146px;
	background-position: -74px 0;
	}
#navigation-site li.selected a.lead-generation,
#navigation-site li a.lead-generation:hover {
	background-position: -74px -23px;
	}
#navigation-site li a.email {
	width: 56px;
	background-position: -220px 0;
	}
#navigation-site li.selected a.email,
#navigation-site li a.email:hover {
	background-position: -220px -23px;
	}
#navigation-site li a.analytics {
	width: 85px;
	background-position: -276px 0;
	}
#navigation-site li.selected a.analytics,
#navigation-site li a.analytics:hover {
	background-position: -276px -23px;
	}
#navigation-site li a.work {
	width: 40px;
	height:16px;
	background-position: 0 -46px;
	}
#navigation-site li.selected a.work,
#navigation-site li a.work:hover {
	background-position: 0 -63px;
	}
#navigation-site li a.news {
	width: 40px;
	height:16px;
	background-position: -40px -46px;
	}
#navigation-site li.selected a.news,
#navigation-site li a.news:hover {
	background-position: -40px -63px;
	}
#navigation-site li a.glossary {
	width: 61px;
	height:16px;
	background-position: -80px -46px;
	}
#navigation-site li.selected a.glossary,
#navigation-site li a.glossary:hover {
	background-position: -80px -63px;
	}
#navigation-site li a.sitemap {
	width: 60px;
	height:16px;
	background-position: -141px -46px;
	}
#navigation-site li.selected a.sitemap,
#navigation-site li a.sitemap:hover {
	background-position: -141px -63px;
	}
#navigation-site li a.contact {
	position:				absolute;
	bottom:					1px;
	right:					35px;
	width:					113px;
	height:					22px;
	background-position:	0 -86px;
	margin:					0;
}

#navigation-site li.selected a.contact,
#navigation-site li a.contact:hover {
	background-position:	-114px -86px;
}
	
	
/* [05] Footer
-------------------------------------------------------*/

/* [06] Rollovers
-------------------------------------------------------*/
a.rollover img {
	visibility: hidden;
	}

/* [07] Image Replacements
-------------------------------------------------------*/
.imr {
	display: block;
	text-indent: -9999px;
	}

/* [08] Clearfixes
-------------------------------------------------------*/
/* More info at: http://www.positioniseverything.net/easyclearing.html */
.clearfix:after,
.thumbnail-list:after,
#container:after,
#header:after,
#content:after,
.content-header:after,
ul.pagination:after,
ul#crumbtrail:after,
span.button:after,
#news .story:after,
#thoughts #thirdLevel:after,
#clients #clientlist:after,
#project #project-navigation:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}
.clearfix,
.thumbnail-list,
#container,
#header,
#content,
.content-header,
ul.pagination,
ul#crumbtrail,
span.button,
#news .story,
#thoughts #thirdLevel,
#clients #clientlist,
#project #project-navigation {
	display: block;
	}

/* [09] Accessible Hide
-------------------------------------------------------*/
.w3c,
#news h1,
#thoughts #thought-latest .thought-poster a span,
#work #content.cols2 .content-col2 h2,
#get-in-touch .vcard h2.org {
	position: absolute;
	display: block;
	height: 0;
	visibility: hidden;
	left: -9999px;
	}

/* [10] Misc
-------------------------------------------------------*/
/* Quotes */
.dialog {
	font-size: 1.714em; /* 25px */
	color: #000;
	line-height: 1.1em;
	}

/* Strapline / Site Location */
.strapline,
.sitelocation {
	font-size: 1.285em; /* 18 px */
	line-height: 1.2em;
	margin-bottom: 6px;
	display: block;
	}

/* Dark Grey Button */
span.button.s1 a {
	background: #2B3131;
	}

/* Light Grey Button */
span.button.s2 a,
.thumbnail-list span.button.s2 a span,
#work .content-col2 span.button.s2 a span,
#client .content-col2 span.button.s2 a span {
	background: #5E6367;
	}

/* Very Dark Grey Button :P */
span.button.s3 a {
	background: #1D1E1E;
	}

/* Image Replacement Headings */
#index #content .content-col1 h2,
#index #content .content-col2 h2,
#index #content .content-col3 h2,
#creds #content .content-col2 h4,
#thoughts .content-col1 h2,
#thoughts .content-col2 h2,
#work .content-col1 h2 {
	height: 23px;
	text-indent: -9999px;
	margin-bottom: 5px;
	}
/* Soup Media Home Contact blocks */
.content-col3 .contact {
	background:#ccc;
	padding:6px 6px 6px 12px;
	margin-bottom:10px;
}
.content-col3 .contact p{
	margin:0 0 2px 0;
}

.content-col3 .contact p.add{
	font-size:0.8em;
}
.content-col3 .contact h3{
	color:#FFF;
	margin:0;
}
/* Unstyled Lists */
.thumbnail-list,
#thoughts .content-col2 #thirdLevel,
#clients #clientlist,
#project #project-navigation,
#get-in-touch #contact-emails,
#creds #contact-emails,
#working-at-soup #job-vacancies,
#jobs #job-vacancies {
	list-style: none;
	padding: 0;
	margin: 0;
	}

/* Client Link */
span.client {
	display: block;
	margin: 20px 0 5px;
	font-size: 0.857em; /* 12px */
	}
span.client a,
span.client a:hover {
	text-decoration: none;
	}
/* This is to highlight a client, with using a span instead of an achor i.e. the clients pages */
span.client span {
	color: #000;
	}

/* Thumbnail List */
.thumbnail-list li {
	width: 140px;
	padding: 0 10px 10px 0;
	float: left;
	position: relative;
	height: 120px;
	overflow: hidden;
	}
/* Thumbnail List - View Buttons */
.thumbnail-list li span.button {
	font-size: 0.857em; /* 12px */
	}
.thumbnail-list li span.button a {
	display: block;
	padding: 0;
	width: 140px;
	height: 104px;
	background: none;
	float: none;
	position: absolute;
	top: 0;
	left: 0;
	border:1px solid #DEDEDE;
	}
	
.thumbnail-list li span.button a span {
	display: block;
	padding: 2px 35px 2px 6px;
	color: #FFF;
	text-decoration: none;
	position: absolute;
	bottom: 0;
	left: 0;
	cursor: pointer;
	}
.thumbnail-list li span.button a:hover {
	background-color: transparent;
	text-decoration: none;
	}
#container .thumbnail-list li span.button a:hover span {
	background: #C03;
	text-decoration: none;
	}
/* Thumbnail List - Project Client */
.thumbnail-list .project-client {
	font-size: 0.785em; /* 11px */
	}
.thumbnail-list .project-client a {
	color: #5E6367;
	}
/* Thumbnail List - Project Name */
.thumbnail-list .project-name,
#thoughts .thumbnail-list .thought-title {
	color: #000;
	padding: 10px 0 1px;
	}

/* Off/On Anchor Decoration */
#index .thought-poster a,
.thumbnail-list li a {
	text-decoration: none;
	}
#index .thought-poster a:hover,
.thumbnail-list li a:hover {
	text-decoration: underline;
	}

/* Legal */
.legal-notes {
	font-size: 0.785em; /* 11px */
	color: #5E6367;
	}

	
/*-----------------------------------------------------
Page Specific - Template Structures
-------------------------------------------------------*/

/* Column Structure */
#thoughts #content.cols2 .content-col1,
#work #content.cols2 .content-col1,
#client #content.cols2 .content-col1 {
	width: 290px;
	}
#thoughts #content.cols2 .content-col2,
#work #content.cols2 .content-col2,
#client #content.cols2 .content-col2 {
	width: 450px;
	padding-left: 75px;
	padding-right: 25px;
	position: relative;
	}
	
	
.work-details {
	margin-left: 20px;
	padding: 0;
}
.work-details li {
	list-style-type: none;
}
.work-details li img {	
	float: left;
	margin-right: 12px;
}
.work-details li p {
	float: right;
	width: 230px;
}
.work-details .button {
	float: left;
	margin-right: 5px;
}
.work-details .button a {
	padding-right: 30px;
}
	
/*-----------------------------------------------------
Page Specific
-------------------------------------------------------*/

/* [01] Home
-------------------------------------------------------*/
/* Latest */
#index .story {
	background: #2B3131;
	color: #5E6367;
	padding: 12px 15px ;
	margin: 0 0 5px;
	}
#index .story h3 {
	margin-bottom: 5px;
	}
#index .story h3 a {
	color: #CCC;
	text-decoration: none;
	}
#index .story .story-date {
	font-size:0.857em;
	display: block;
	margin: 0 0 3px;
	}
#index .story.first .story-date {
	font-size:0.757em;
	}
#index .story .story-nav,
#index .thought .thought-nav {
	margin: 5px 0 0;
	}
#index .story.first .story-nav {
	margin-top: 30px;
	}
#index .story.first h3 {
	font-size: 1.065em; /* 18px */
	font-weight:normal;
	}
#index .story h3 {
	font-size: 1.176em; /* No idea, it looks ok though */
	}	
#index .story.first {
	font-size: 1.156em; /* No idea */
	}
#index .story {
	font-size: 1em;
	}

/* Thoughts */
#index .thought {
	padding: 0 10px;
	font-size: 0.857em; /* 12px */
	line-height: 1.3em;
	}
#index .thought-poster {
	font-size: 0.833em; /* 10px */
	display: block;
	margin-bottom: 5px;
	}
#index .thought h3 {
	font-size: 1.166em; /* 14px */
	margin-bottom: 3px;
	font-weight: bold;
	}
.thought-nav form {
	margin: 0;
	}
#index .thought .thought-nav span {
	font-size: 1em; /* 12px */
	}
	
/* Image Replacement Headings */
#index #content .content-col1 h2,
#index #content .content-col2 h2,
#index #content .content-col3 h2 {
	background-image: url('/media/site/images/front-end/home/spr-headings.gif');
	}
#index #content .content-col1 h2 {
	width: 63px;
	}
#index #content .content-col2 h2 {
	width: 57px;
	background-position: -63px 0;
	}
#index #content .content-col3 h2 {
	width: 132px;
	background-position: -120px 0;
	}

#index #content .content-col2 img,
#index #content .content-col3 img {
	margin-bottom: 10px;
	}

/* [02] News
-------------------------------------------------------*/
#news .story {
	margin-bottom: 30px;
	clear: both;
	}	
#news .story .story-header {
	padding: 20px 35px 0;
	}
#news .story img {
	float: left;
	margin: 0 15px 10px 0;
	}
#news .story .story-header h2 {
	width: 590px;
	margin: 0;
	padding-bottom: 10px;
	}
#news .content-header + .story .story-header h2 {
	font-size: 2.857em; /* 40px */
	}
#news .story .story-header p span {
	font-size: 0.857em;
	}
#news .story .story-content {
	float: left;
	width: 570px;
	padding: 0 15px 0 35px;
	}
#news .story blockquote {
	float: right;
	width: 205px;
	padding: 0 50px 0 10px;
	}
#news .story .story-header,
#news .story .story-content,
#news .story blockquote {
	background: #FFF;
	}
#news .story .story-content,
#news .story blockquote { 
	padding-bottom: 50px;
	}
#datebox {
	width: 268px;
	background: url('/media/site/images/front-end/news/bg-dropdown.gif') bottom right no-repeat;
	color: #FFF;
	font-size: 1.142em;
	display: none;
	padding: 0 4px 4px 0;
	float: left;
	cursor: pointer;
	}
#datebox span {
	display: block;
	padding: 0 0 2px 1px;
	background: url('/media/site/images/front-end/news/bg-dropdown-arrow.gif') 247px 5px no-repeat #2B3131;
	}
#pagerbox{
	position: absolute;
	top: 0px;
	left: 0px;
	display: none;
	z-index: 99;
	background-color: #FFF;
	border: 1px solid #DDD;
	}
#pagerbox a{
	display: block;
	width: auto;
	margin: 2px;
	border: 1px solid #FFF;
	text-decoration: none;
	}
#pagerbox a:hover{
	background-color: #EEE;
	border: 1px solid #DDD;
	}
#pagerbox a.selected{
	background-color: #F8F8F8;
	border: 1px solid #EEE;
	}
#news .rss {
	float: right;
	font-size: 0.857em; /* 12px */
	}

#content.news .content-block{
	padding-bottom:30px;
}
/* [03] Creds
-------------------------------------------------------*/
#creds #content .content-col1 {
	width: 515px;
	}
#creds #content .content-col2 {
	width: 290px;
	}
#creds #movie-creds {
	margin-bottom: 10px;
	}
#creds .button a {
	padding-right: 6px;
	min-width: 202px;
	}
#creds p.dialog {
	padding-bottom: 20px;
	}
#creds #content .content-col2 h4 {
	width: 95px;
	background: url('/media/site/images/front-end/creds/imr-enquires.gif') top left no-repeat;
	}

/* [04] Thoughts
-------------------------------------------------------*/	
#thoughts #content.cols2 .content-col1 h2,
#thoughts #content.cols2 .content-col2 h2 {
	background: url('/media/site/images/front-end/thoughts/spr-headings.gif') 0 0 no-repeat;
	}
#thoughts #content.cols2 .content-col1 h2 {
	width: 62px;
	}
#thoughts #content.cols2 .content-col2 h2 {
	width: 116px;
	background-position: -63px 0;
	}
#thoughts #content.cols2 .content-col2 h2.archive {
	width: 100px;
	background-position: -179px 0;
	}
#thoughts #thought-latest .thought-date,
#thoughts #thought-latest .thought-poster {
	font-size: 0.857em; /* 12px */
	}
#thoughts #thought-latest .thought-date {
	margin: 20px 0 0;
	float: left;
	}
#thoughts #thought-latest .thought-date span {
	color: #000;
	}
#thoughts #thought-latest .thought-content .button {
	float: right;
	margin: 18px 0 0;
	}
#thoughts #thought-latest .thought-content h3 {
	clear: both;
	padding-top: 10px;
	font-size: 1.785em; /* 25px */
	}
#thoughts #thought-latest .thought-poster {
	padding: 20px 0 0;
	}
#thoughts #thought-latest .thought-poster img {
	float: left;
	margin: -20px 10px 0 0;
	}
#thoughts #thought-latest .thought-poster span {
	display: block;
	font-size: 1.416em; /* 17px */
	color: #000;
	padding: 2px 0;
	}
#thoughts #thought-latest .button {
	margin: 10px 0;
	}
#thoughts .content-col2 #secondLevel {
	margin-bottom: 15px;
	}
#thoughts .content-col2 #secondLevel,
#thoughts .content-col2 #thirdLevel {
	clear: both;
	}
#thoughts .content-col2 #thirdLevel li {
	float: left;
	padding-right: 10px;
	width: 65px;
	}
#thoughts .content-col2 #secondLevel .thought-poster {
	line-height: 1.090em;
	font-size: 0.785em; /* 11px */
	}
#thoughts .content-col2 #secondLevel .thought-poster span{ 
	color:#000;
	font-weight:bold;
	}
#thoughts .thumbnail-list.edit li {
	height: 190px;
	}
#thoughts .thumbnail-list .thought-title {
	padding-bottom: 3px;
	}
#thoughts .thumbnail-list .thought-edit {
	margin-top: 5px;
	}
#thoughts .thumbnail-list .thought-edit a {
	font-size: 0.785em; /* 11px */
	}
#thoughts #thought-latest #thoughtForm {
	clear: both;
	margin: 0;
	}
#thoughts #thought-latest #thoughtForm h3 {
	font-size: 1em;
	}
#thoughts #thought-latest #thoughtForm div {
	clear: both;
	margin: 0 0 15px;
	}
#thoughts #thought-latest #thoughtForm label {
	display: block;
	margin: 0 0 5px;
	}
#thoughts #thought-latest #map {
	margin: 5px 0 0;
	clear: both;
	}
#thoughts #thought-latest #thoughtForm #map div {
	margin: 0;
	}
#thoughts #thought-latest #thoughtForm textarea,
#thoughts #thought-latest #thoughtForm #thoughtTitle {
	width: 280px;
	border: 1px solid #CCC;
	padding: 3px;
	font-size: 1em;
	}
#thoughts #thought-latest #thoughtForm #thoughtFile,
#thoughts #thought-latest #thoughtForm #submit {
	font-size: 0.928em; /* 13px */
	}
#thoughts #thought-latest #thoughtForm textarea {
	margin: 0;
	}
#thoughts #thought-latest #thoughtForm #thoughtTitle {
	display: block;
	}
#thoughts #loginBar {
	padding: 10px 35px 0;
	background: #FFF;
	font-size: 1.1em;
	}
#thoughts #thought-latest #thoughtForm.edit,
#thoughts #thought-latest #thoughtForm.add {
	padding: 15px 0;
	}
#thoughts #thought-latest #thoughtForm.edit #map,
#thoughts #thought-latest #thoughtForm.add #map {
	position: relative;
	top: -10px;
	margin: 0 0 5px;
	}
#thoughts #movingLayerDiv {
	border: 1px solid black;
	padding: 0;
	margin: 0;
	background-color: transparent;
	position: absolute;
	}
#thoughts #shareLinkBox {
	position: absolute;
	padding: 0;
	margin: 0;
	background-image: url('/media/site/images/front-end/thoughts/share_bg.png');
	width: 118px;
	height: 160px;
	top: -1000px;
	left: 0;
	z-index: 4000;
	}
#thoughts #shareLinkText {
	margin: 13px 20px;
	padding: 0;
	}
#thoughts #shareLinkText ul {
	list-style: none;
	padding: 0;
	margin: 0;
	}
#thoughts #shareLinkText ul li {
	margin-bottom: 6px;
	padding-left: 20px;
	min-height: 12px;
	line-height: 12px;
	background: top left no-repeat;
	}
#thoughts #shareLinkText ul li.delicious {
	background-image: url('/media/site/images/front-end/thoughts/img-delicious.gif');
	}
#thoughts #shareLinkText ul li.digg {
	background-image: url('/media/site/images/front-end/thoughts/img-digg.gif');
	}
#thoughts #shareLinkText ul li.reddit {
	background-image: url('/media/site/images/front-end/thoughts/img-reddit.gif');
	}
#thoughts #shareLinkText ul li.technorati {
	background-image: url('/media/site/images/front-end/thoughts/img-technorati.gif');
	}
#thoughts #shareLinkText ul li.sphinn {
	background-image: url('/media/site/images/front-end/thoughts/img-sphinn.gif');
	}
#thoughts #shareLinkText ul li.newsvine {
	background-image: url('/media/site/images/front-end/thoughts/img-newsvine.gif');
	}
#thoughts #shareLinkText ul li.twitter {
	background-image: url('/media/site/images/front-end/thoughts/img-twitter.gif');
	}
#thoughts #shareLinkText a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em; /* 11px */
	color: #FFF;
	text-decoration: none;
	}
#thoughts #shareLinkText a:hover {
	color: #CCC;
	}
#thoughts #shareLinkClose {
	position: absolute;
	top: 130px;
	right: 15px;
	width: 16px;
	height: 16px;
	overflow: hidden;
	text-decoration: none;
	background-image: url('/media/site/images/front-end/thoughts/close_share_thought.gif');
	}
#thoughts #thoughtUserDropDown {
	position: absolute;
	top: 210px;
	left: 616px;
	padding: 0;
	margin: 0;
	z-index: 1000000;
	}
#thoughts #shareThoughtButton {
	display: none;
	}
#thoughts .thumbnail-list li span.button a {
	height: 103px;
	}
	
/* [05] Work
-------------------------------------------------------*/
#work #content.cols2 .content-col2 {
	padding-top: 28px;
	}
#work .content-col1 h2 {
	background: url('/media/site/images/front-end/work/spr-headings.gif') top left no-repeat;
	}
#work .content-col1 .work-latest-content {
	margin-bottom: 20px;
	}
#work .content-col1 h3 {
	font-size: 1.785em; /* 25px */
	margin-top:	15px;
	}
#work .content-col2 #work-projects .project-name,
#work .content-col2 #work-projects .project-name a {
	color: #000;
	}

/* [06] Clients
-------------------------------------------------------*/
#clients #clientlist {
	padding-bottom: 100px;
	}
#clients #clientlist li {
	float: left;
	margin-right: 10px;
	width: 140px;
	height: 104px;
	position: relative;
	border: 1px solid #DEDEDE;
	}
#clients #clientlist li a {
	position: absolute;
	top: 0;
	left: 0;
	width: 140px;
	height: 104px;
	background: url('/media/site/images/front-end/clients/bg-linkarrow.gif') 125px 85px no-repeat;
	text-indent: -9999px;
	}

/* [07] About
-------------------------------------------------------*/
#about h1 {
	width: 670px;
	}
#about #content .content-col1 {
	width: 440px;
	padding-right: 85px;
	}
#about #content .content-col1 span.button {
	margin-top: 20px;
	}
#about #content .content-col2 {
	width: 290px;
	}
#about #content .content-col2 img {
	position: relative;
	left: -20px;
	}
.content-col2 img.section-image {
	margin-left:50px;
}
/* [08] Project
-------------------------------------------------------*/
#project h1 {
	width: auto;
	margin: 0 0 20px;
	}
#project .content-header {
	padding-bottom: 29px;
	}
#project #content.cols2 .content-col1 {
	width: 355px;
	padding-right: 10px;
	}
#project #content.cols2 .content-col2 {
	width: 475px;
	padding-left: 10px;
	padding-right: 0;
	}
#project #project-content {
	padding-right: 65px;
	margin-bottom: 20px;
	}
#project #project-navigation {
	padding-top: 20px;
	}
#project #project-navigation li {
	float: left;
	margin: 0;
	}
#project #project-navigation li.next {
	float: right;
	}
#project #project-content .project-intro {
	font-size: 1.714em; /* 25px */
	color: #000;
	line-height: 1.1em;
	margin-bottom: 20px;
	}
#project .project-mainimage {
	margin-bottom: 30px;
	}
#project .project-mainimage img {
	margin-bottom: 10px;
	}
#project #project-additionalimages {
	padding-right: 25px;
	}
#project #project-additionalimages img {
	margin: 0 10px 10px 0;
	vertical-align: top;
	}
#project .project-mainimage,
#project #project-additionalimages p {
	padding-right: 35px;
	}

/* [09] Client
-------------------------------------------------------*/
#client .content-col1 .client-intro {
	font-size: 1.785em;
	color: #000;
	line-height: 1.1em;
	}
#client .content-col1 .client-content {
	margin-bottom: 20px;
	}

/* [10] Get In Touch
-------------------------------------------------------*/
#get-in-touch .vcard {
	font-size: 1.571em; /* 22px */
	color: #2B3131;
	margin-bottom: 25px;
	}
#get-in-touch .vcard div {
	margin-bottom: 10px;
	}
#get-in-touch .vcard .office,
#get-in-touch .vcard .adr {
	font-size: 0.636em; /* 14px */
	margin-bottom: 0;
	}
#get-in-touch .vcard .office {
	margin-bottom: 5px;
	}
#get-in-touch .vcard .adr {
	color: #666;
	}
#get-in-touch #contact-emails {
	margin: 15px 0 25px;
	}
#get-in-touch #contact-emails li,
#creds #contact-emails li {
	margin: 0 0 4px;
	}
#get-in-touch #contact-emails .button a {
	min-width: 179px;
	padding-right: 0;
	}
#get-in-touch .content-col2 {
	text-align: right;
	}
/*#get-in-touch .content-col2 img {
	margin-top: -40px;
	}
*/
/* [11] People
-------------------------------------------------------*/
#people .content-flash {
	background: #FFF;
	}

/* [12] Working At Soup
-------------------------------------------------------*/
#working-at-soup #content .content-col1,
#jobs #content .content-col1 {
	width: 525px;
	padding-right: 0px;
	padding-bottom: 145px;
	background-image: url('/media/site/images/front-end/workatsoup/bg-col1.gif');
	background-position: 25px bottom;
	background-repeat: no-repeat;
	}
#jobs #content .content-col1 {
	background-image: url('/media/site/images/front-end/workatsoup/bg-col1-jobs.gif');
	background-position: 35px bottom;
	padding-bottom: 160px;
	}
#working-at-soup #content .content-col2,
#jobs #content .content-col2 {
	width: 215px;
	padding-left: 75px;
	padding-top: 180px;
	background-image: url('/media/site/images/front-end/workatsoup/bg-col2.gif');
	background-position: 75px 0;
	background-repeat: no-repeat;
	}
#working-at-soup .content-col1 .content-wrapper,
#jobs .content-col1 .content-wrapper {
	margin: 15px 0;
	padding-right: 50px;
	}
#working-at-soup #job-vacancies li,
#jobs #job-vacancies li {
	margin-bottom: 4px;
	}
#working-at-soup #job-vacancies span.button a,
#jobs #job-vacancies span.button a {
	width: 174px;
	}
#jobs #content.internship h1,
#jobs #content.internship .content-header h2 {
	font-size: 2.14em;
	margin-bottom: 0;
	width: 450px;
	}
#jobs #content.internship h1 {
	margin-top: 25px;
	color: #C03;
	}
#jobs #content.internship .content-header h2 {
	margin-bottom: 10px;
	}
#jobs #content.internship .content-col1 {
	background-image: none;
	padding-bottom: 65px;
	}
#jobs #content.internship .content-col2 {
	padding-top: 0;
	background-image: none;
	margin-top: -85px;
	padding-bottom: 280px;
	}
#jobs #content.internship .content-col2 h2 {
	margin-bottom: 20px;
	}
#jobs #content.internship .content-col2 p {
	font-style: italic;
	margin-bottom: 20px;
	}

/* [13] Project Popup
-------------------------------------------------------*/
#project-popup h1,
#project-popup h2 {
	font-size: 1em;
	font-weight: normal;
	width: 500px;
	float: left;
	line-height: normal;
	}
#project-popup h1 {
	color: #F60;
	}
#project-popup #content {
	background: #FFF;
	width: 824px;
	height: 670px;
	margin: 10px 15px;
	padding: 15px;
	}
#project-popup #content #flash-background {
	background-position: top left;
	background-repeat: no-repeat;
	width: 824px;
	height: 595px;
	position: relative;
	clear: both;
	}
#project-popup #navigation {
	float: right;
	}
#project-popup #navigation span {
	display: inline;
	float: left;
	margin-left: 10px;
	}
	
#buildkit h3.element-heading {
	border-bottom: 1px solid #CCC;
	margin-top: 20px;
	}
	
	
#sitemap .nav_ul_level_0 li {
	font-weight:			bold;
	list-style-type:		none;
}
#sitemap .nav_ul_level_1 li {
	list-style-type:		inherit;
	font-weight:			normal;
}

/* Weather */
#weather {
	text-indent: -9999px;
	position: absolute;
	width: 80px;
	height: 30px;
	top: 12px;
	right: 33px;
	}
#weather span {
	position: absolute;
	width: 80px;
	height: 30px;
	background: top left no-repeat;
	top: 0;
	left: 0;
	}
/* Weather - Cloudy */
#weather.c19 span,
#weather.c20 span,
#weather.c21 span,
#weather.c22 span,
#weather.c25 span,
#weather.c26 span {
	background-image: url('/media/site/images/front-end/weather/cloudy.gif');
	}
/* Weather - Fair Night */
#weather.c31 span,
#weather.c33 span {
	background-image: url('/media/site/images/front-end/weather/fair-night.gif');
	}
/* Weather - Hail */
#weather.c17 span {
	background-image: url('/media/site/images/front-end/weather/hail.gif');
	}
/* Weather - Mostly Cloudy Night */
#weather.c27 span {
	background-image: url('/media/site/images/front-end/weather/mostly-cloudy-night.gif');
	}
/* Weather - Mostly Cloudy */
#weather.c28 span {
	background-image: url('/media/site/images/front-end/weather/mostly-cloudy.gif');
	}
/* Weather - Partly Cloudy Night */
#weather.c29 span {
	background-image: url('/media/site/images/front-end/weather/partly-cloudy-night.gif');
	}
/* Weather - Partly Cloudy */
#weather.c30 span,
#weather.c44 span {
	background-image: url('/media/site/images/front-end/weather/partly-cloudy.gif');
	}
/* Weather - Rail and Hail */
#weather.c35 span {
	background-image: url('/media/site/images/front-end/weather/rain-and-hail.gif');
	}
/* Weather - Rain and Snow */
#weather.c5 span,
#weather.c8 span {
	background-image: url('/media/site/images/front-end/weather/rain-and-snow.gif');
	}
/* Weather - Showers */
#weather.c9 span,
#weather.c10 span,
#weather.c11 span,
#weather.c12 span,
#weather.c40 span {
	background-image: url('/media/site/images/front-end/weather/showers.gif');
	}
/* Weather - Sleet */
#weather.c6 span,
#weather.c7 span,
#weather.c18 span {
	background-image: url('/media/site/images/front-end/weather/sleet.gif');
	}
/* Weather - Snow */
#weather.c13 span,
#weather.c14 span,
#weather.c15 span,
#weather.c16 span,
#weather.c41 span,
#weather.c42 span,
#weather.c43 span,
#weather.c46 span {
	background-image: url('/media/site/images/front-end/weather/snow.gif');
	}
/* Weather - Sunny */
#weather.c32 span,
#weather.c34 span,
#weather.c36 span {
	background-image: url('/media/site/images/front-end/weather/sunny.gif');
	}
/* Weather - Thunderstorm */
#weather.c3 span,
#weather.c4 span,
#weather.c37 span,
#weather.c38 span,
#weather.c39 span,
#weather.c45 span,
#weather.c47 span {
	background-image: url('/media/site/images/front-end/weather/thunderstorm.gif');
	}
/* Weather - Windy */
#weather.c0 span,
#weather.c1 span,
#weather.c2 span,
#weather.c23 span,
#weather.c24 span {
	background-image: url('/media/site/images/front-end/weather/windy.gif');
	}