/* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here	that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
 * ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */


/*
 * ERIC MEYER RESET
 * --------------------------------------------------
 */

html, body { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; }
table { border-collapse: collapse; border-spacing: 0; }
ol, ul { list-style: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; }


/* Normalize.css
 * Pulling in select resets form the normalize.css project
 * --------------------------------------------------
 */

/* Display in IE6-9 and FF3
 * -------------------------
 * Source: http://github.com/necolas/normalize.css
 */

html {
  overflow-y: scroll;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: none;
}
// Focus states
a:focus {
  outline: thin dotted;
}
// Hover & Active
a:hover,
a:active {
  outline: 0;
}

// Display in IE6-9 and FF3
// -------------------------
// Source: http://github.com/necolas/normalize.css
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

// Display block in IE6-9 and FF3
// -------------------------
// Source: http://github.com/necolas/normalize.css
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

// Prevents modern browsers from displaying 'audio' without controls
// -------------------------
// Source: http://github.com/necolas/normalize.css
audio:not([controls]) {
    display: none;
}

// Prevents sub and sup affecting line-height in all browsers
// -------------------------
// Source: http://github.com/necolas/normalize.css
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}

// Img border in a and image quality
// -------------------------
// Source: http://github.com/necolas/normalize.css
img {
    border: 0;
    -ms-interpolation-mode: bicubic;
}

// Forms
// -------------------------
// Source: http://github.com/necolas/normalize.css

// Font size in all browsers, margin changes, misc consistency
button,
input,
select,
textarea {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  *vertical-align: middle;
}
button,
input {
  line-height: normal; // FF3/4 have !important on line-height in UA stylesheet
  *overflow: visible; // Inner spacing ie IE6/7
}
button::-moz-focus-inner,
input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  border: 0;
  padding: 0;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer; // Cursors on all buttons applied consistently
  -webkit-appearance: button; // Style clicable inputs in iOS
}
input[type="search"] { // Appearance in Safari/Chrome
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
}
textarea {
  overflow: auto; // Remove vertical scrollbar in IE6-9
  vertical-align: top; // Readability and alignment cross-browser
}



@font-face {
	font-family: 'GroteskFSLight';
	src: url('../src/Grotesk-Light-webfont.eot');
	src: local('☺'), url('../src/Grotesk-Light-webfont.woff') format('woff'), url('../src/Grotesk-Light-webfont.ttf') format('truetype'), url('../src/Grotesk-Light-webfont.svg#webfont0SNIFvmL') format('svg');
	font-weight: normal;
	font-style: normal;
}


	/*
	//
	//
	//       T Y P E   S P E C
	//
	//
	*/

	html, body {
		-webkit-font-smoothing : antialiased;
		text-rendering : optimizelegibility;
	    -webkit-text-size-adjust: none;
		margin: 0;
	}
	
	
			#footer	{
				font-family: 'Helvetica Neue', Arial, sans-serif;
				font-size: .72em;
				margin-top: 5em;
		    }
				
			.col h2,
			.col h3  {
				font-family: 'GroteskFSLight', Helvetica, arial, sans-serif;
				font-size: 20px;
			}
				
			li, p, q, cite
			{
				font-family: Helvetica, Arial, sans-serif;
				font-size: 0.8em;
				line-height: 1.2em;
			}
			
			q {
				font-style: italic;
			}
		
			.col cite {
				text-align: left;
				display: block;
				margin: 0.33em 0 1.3em 0;
			}

			.studio li,
			.studio p,
			.inner-col li,
			.inner-col p,
			.inner-col cite,
			.post p,
			a.more,
			.post .post_categories {
				font-family: 'GroteskFSLight', Helvetica, arial, sans-serif;
				font-size: 0.9em;
			}			

			a {
				text-decoration: none;
			}
		
		/* About */
		div.col.twelve.studio ul.sub {
			margin-top: .66em;
		}
		
		div.col.twelve.studio ul.sub li {
			float: left;
			font-size: 1.75em;
			margin-right: 20px;
		}
			
			div.col.twelve.studio ul.sub li:last-child {
				margin-right: 0;
			}
		
			div.col.twelve.studio ul.sub li a {
				overflow: hidden;
				margin-right: 0;
				padding-bottom: 3px;
			}
		
			div.col.twelve.studio ul.sub li a:after {
				right: -24px;
				top: -3px;
				padding-top: 22px;
				height: 0;
				content: "";
				width: 22px;
				display: block;
				background: transparent url('http://sevilpeach.co.uk/img/sprite-assets.png') -127px -152px no-repeat;
			}
				div.col.twelve.studio ul.sub li:last-child a:after {display: none}
		
		/* Project Listings */
		
		ul.projectListings li {
			margin-right: 10px;
			margin-bottom: 2em;
		}
		ul.projectListings>li h3 {
			font-size	  : 1.28em;
			font-family	  : 'GroteskFSLight', Helvetica, Arial, sans-serif;
		}
			ul.projectListings>li h3:after {
				content: ' \2192';
			}	
	

			
		/*  Archive  */
	
		ul.archive li {
			font-family	  : 'GroteskFSLight', helvetica, arial, sans-serif;
			font-size	  : 1em;
		}
		
		ul.archive li a  {
			line-height: 17px;
		}
		
		ul.archive li a:hover {
			text-decoration: none;
		}
		
		/* Studio */
		.inner-col q {
			font-family: Georgia, 'Times New Roman', Times, serif; 
			font-style: normal;
			font-size: 1.4em;
			line-height: 1.1em;
		}
				
		/* Slideshow */

		.slideshow.active {
			margin-bottom: 4.5em;
			position: relative;
		}
		.slideshow.active .slide {
			width: 100%;
		}

		.slideshow.active .slide img {
			margin: 0 auto;
			display: block;
			max-height: 100%;
			max-width: 100%;
		}

		.total_counter {
			position: absolute;
			top: 0;
			left: 0;
			font-family: Helvetica, Arial, sans-serif;
			font-size: 0.8em;
			letter-spacing: 1px;
			z-index: 30;
		}

		.arrow {
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 30;
			line-height: 2em;
		}
			.arrow.forward {
				right: 0;
				left: auto;
				text-align: right;
			}

		@media screen and (max-width: 460px) {
			.slideshow.active {
				margin-top: 2em !important;
			}
			.total_counter {
				width: 100%;
				text-align: center;
			}
			.arrow, .total_counter {
				top: -2em;
			}
		}


		@media all and (min-width: 460px) {

			.arrow {
				width: 70px;
				height: 0px;
				padding-top: 70px;
				overflow: hidden;
				background: transparent url('../img/sprite-assets.png') -160px -192px no-repeat; /* Default is back facing */
				top: 50%;
				margin-top: -35px;
			}
				.arrow.forward {
					background-position: -165px -261px;
				}
		}
	
	/*
	//
	//
	//       L A Y O U T
	//
	//
	*/
	

	div.vcard {
		font-family: 'GroteskFSLight', Helvetica, arial, sans-serif;
		margin-top: 1em;
	}
		div.vcard .adr {margin-bottom: 1em}
		div.vcard .org {display: none}

	#bg	{
		position: fixed; top:0px; left: 0px;
		z-index: -99;
	}
	
			.bgwidth { width : 100%; }
			.bgheight { height : 100%; }
		
			html.backgroundsize #bg	{display : none}
		
		div#container,
		.wrapper {
			margin-left: 4.5%;
			margin-top: 17px;
			max-width : 1050px;
			width: 95.5%;
		}
	
		ul.nav
		{
			height : 36px;
			margin-bottom: 35px;
			z-index: 99;
		}

			#project-links a,
			ul.sub li a,	
			ul.nav li  {
				float : left;
				margin-bottom: .3em;
				font-family: 'GroteskFSLight', Helvetica, arial, sans-serif;
				font-size: 20px;
				margin-right: 3.5%;
				width: auto;
				background-image: none;
			}

				html.front ul.nav li {float: none}

				ul.nav li:first-child {
					display: block;
					width: 100%;
				}
		
				ul.nav li:last-child a {
					margin-right: 0;
				}
		
				ul.nav li:first-child a,
				html.front ul.nav li a  {
					background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -3px -8px no-repeat;
					display: block;
					height: 36px;
					text-indent: -9999em;
					margin-bottom: 5px;
					margin-right: .6em;
					-webkit-box-sizing: border-box;
					-moz-box-sizing: border-box;
					box-sizing: border-box;
				}
			
				html.front ul.nav li a.sevil-peach,
				ul.nav li a.sevil-peach  {
				width: 145px;
				}

				html.front ul.nav li a.projects,		
				ul.nav li a.projects  {
				width: 107px;
				background-position: -3px -44px;
				}
				
				html.front ul.nav li a.studio,
				ul.nav li a.studio  {
				width: 84px;
				background-position: -5px -80px;
				}
				
				html.front ul.nav li a.news,
				ul.nav li a.news  {
				width: 73px;
				background-position: -3px -115px;
				}
				
				html.front ul.nav li a.contact,
				ul.nav li a.contact {
				width: 105px;
				background-position: -162px -80px;
				}
				
				ul.nav li a:hover,
				ul.nav li a.selected  {
					padding-bottom: 2px;
					border-bottom: 1px solid #222;
					-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
					-moz-box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
					box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
				}
			
				.windows ul.nav li a:hover, .windows ul.nav li a.selected	{
				border-bottom: 2px solid #222;
				}
			
		/*  */
			
			body.project div.col.eight {max-width:950px}
			
			hr
			{
			height: 0px;
			width: 0px;
			margin: 0px;
			padding: 0px;
			border: 0px;
			}
	
			div.col
			{
				float: left;
				position: relative;
				margin: 0 10px;
			}

				ul.archive,
				div.col div.inner-col {
					float: left;
					width: 96%;
					margin: 0 1.9436345967% 0 0;
				}
				
					div.col div.inner-col:first-child {
						margin: 0 20% 0 0;
					}
					
			
				div.no-left  {
				margin-left: 0px;
				}
				
				div.no-left.slideshow  {
				margin-right : 65px;
				}
			
				div.col.first  {
				margin-left: 0px;
				}
			
				div.col.two  {
				width: 150px;
				}
				
				div.col.five  {
				width : 390px;
				}
				
				div.col.six  {
				width : 470px;
				}
				
				div.col.ten {
				width: 790px;
				}
				
				div.col.twelve  {
				width: 96%;
				max-width : 950px; 
				}
			
			/* Layout */
	
				.clear	{
				float: none;
				clear: both;
				}
				
				#footer	{
					height: 50px;
					padding-left: 4.5%;
					opacity: 0.45;
				    -webkit-transition: all 0.3s ease;
				    -moz-transition: all .3s ease;
				    -o-transition: all .3s ease;
				    transition: all .3s ease;
			    }	
			    	#footer a {cursor: pointer}
			    
			    	html.front #footer {display: none}
			    	
			    	.contact #footer {
					    position: absolute;
					    bottom: 0;
					    left: 0;
			    	}
				
				#footer:hover {
					opacity: 1;
				}
				
			/* Type */
	
			h2.img
			{
			height: 36px;
			margin-bottom: 36px;
			}
	
			.col h2,
			.col h3  {
				margin-bottom: 15px;
			}
	
				.project h2 {
					background-repeat: no-repeat;
					padding-top: 65px;
					height: 0;
					overflow: hidden;
				}
	
				.studio .col h3,
				.inner-col h3 {
					margin-top: 1.35em;
					margin-bottom: 0.85em;
				}
				
				.studio .col h3:first-child {
					margin-top: 0;
				}
				
				.inner-col p  {
				margin-bottom: 1.2em;
				}
			
				.col .inner-col ul {
					overflow: hidden;
					margin-bottom: 1.3em;
				}
					.col .inner-col p a,
					.col .inner-col:last-child ul li a {
						display: inline;
						border-bottom: 1px solid #222;
					}	
			
				.col .inner-col ul li {
					margin-bottom: 0;
				}
	
			li, p, q, cite
			{
				display: block;
				margin-bottom: 10px;
				color: #222;
			}
			
			q {
				margin-bottom: 0;
			}
			
			a
			{
			text-decoration: none;
			color: #222;
			}
			
			p a:hover{
				padding-bottom: 1px;
				border-bottom: 1px solid #222;
				-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0);
				-moz-box-shadow: 0px 1px 0px rgba(0,0,0,0);
				box-shadow: 0px 1px 0px rgba(0,0,0,0);
			}
			
	
		
			/* About */
			div.col.twelve.studio ul.sub {
				overflow: hidden;
			}
			
			#who-we-are,
			#what-we-do,
			#what-were-proud-of {
				overflow: hidden;
			}
		
			div.col.twelve.studio ul.sub li {
				float: left;
				font-size: 1.75em;
				margin-bottom: 0;
				height: 1em;
/* 				padding-right: .33em; */
				position: relative;

			}
	
				div.col.twelve.studio ul.sub li:last-child:after {
					display: none;
				}
				
					div.col.twelve.studio ul.sub li:nth-child(1) a {
						background-position: -3px -551px;
					}

					div.col.twelve.studio ul.sub li:nth-child(2) a {
						background-position: -3px -631px;
					}

					div.col.twelve.studio ul.sub li:nth-child(3) a {
						background-position: -3px -511px;
					}

					div.col.twelve.studio ul.sub li:nth-child(4) a {
						background-position: -3px -591px;
					}
				
					ul.sub span.slash {
						position: relative;
						top: -11px;
						left: 4px;
					}
			
			/* @Studio */
			.studio  .slideshow.active {
				margin: 1em 0 2em;
			}

			@media screen and (min-width: 460px) {
				.studio .slideshow.active .arrow.forward	{right: 10%}
				.studio .slideshow.active .arrow.backward	{left: 10%}
			}
			
			h2.img {
			margin-left: -3px;
			text-indent : -9999em;
			background : url('http://sevilpeach.co.uk/img/sprite-assets.png') no-repeat; 
			}
	
			h2.about
			{
			background-position : -162px -8px;
			width: 105px;
			}
			
			h2.clients
			{
			background-position : -162px -44px;
			width: 105px;
			}
			
			h2.contact
			{
			background-position : -162px -80px;
			width: 105px;
			}
			
			/* Project Listings */
			
			ul.projectListings {
				max-width: 1120px;
				width: 100%;
				white-space: normal;
				clear: both;
				padding-bottom: 100px;
			}
	
			ul.projectListings > li {
				float: left;
				width: 95%;
				position: relative;
			}
				ul.projectListings>li h3 {
					margin-top    : 5px;
					margin-bottom : 12px;
					font-size	  : 1.28em;
					font-family	  : 'GroteskFSLight', Helvetica, Arial, sans-serif;
					-webkit-font-smoothing : antialiased;
				}
				
				ul.projectListings>li img {max-width: 100%}
			
				ul.projectListings>li div.arrow {
					display: none;
				}
	
				ul.projectListings>li,
				ul.projectListings>li>a:hover	{
				border-bottom: 1px solid #fff;
				}
				
			h3.img	{
			background:  url('http://sevilpeach.co.uk/img/sprite-assets.png') -280px -3px no-repeat;
			text-indent: -9999em;
			height: 20px;
			}
			
				.deloitte {}	
				h3.eczacibasi {background-position: -280px -21px}
				h3.euroshop {background-position: -280px -40px}
				h3.mexx{background-position: -280px -58px}
				h3.microsoft{background-position: -280px -76px}
				h3.novortis{background-position: -280px -94px}
				h3.norvartis-pilot{background-position: -280px -111px}
				h3.orgatec{background-position: -280px -130px}
				h3.spaces{background-position: -280px -148px}
				h3.vitra-summer{background-position: -280px -166px}
				h3.vitra-showrooms{background-position: -280px -184px}
				h3.vitra-offices{background-position: -280px -201px}
				
				#project-links {
					margin: .66em 0 4em;
				}
					
					#project-links a.selected {margin-right:.25em}
				
					#project-links i {
						display: inline-block;
						width: 15px; height:25px;
						position: relative;
						float:left;
						background: transparent url('http://sevilpeach.co.uk/img/sprite-assets.png') -128px -159px  no-repeat;
					}
				
					#project-links a:hover,
					#project-links a.active,
					div.col.twelve.studio ul.sub li:hover a,
					div.col.twelve.studio ul.sub li.active-tab a {
						-webkit-box-sizing: border-box;
						-moz-box-sizing: border-box;
						box-sizing: border-box;
						border-bottom: 1px solid #222;
						-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
						-moz-box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
						box-shadow: 0px 1px 0px rgba(0,0,0,0.45);
					}
					
				ul.sub li a:after,
				#project-links a:after {
					background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -122px -152px no-repeat;
					content: "aaaaa";
					display: block;
					overflow: hidden;
					height: 0;
					padding-top: 35px;
					width: 22px;
					position: absolute;
					top:0;
					right: -23px;
				}
					ul.sub li a {
						border-bottom: 1px solid #fff;
						padding-bottom: 0;
						margin-bottom: 0;
					}
					
					ul.sub li:nth-child(2) a:after {}
					
					ul.sub li a:after {
						right: -15px;
						top: -2px;
						content: "";
						background: transparent url('http://sevilpeach.co.uk/img/sprite-assets.png') -128px -159px no-repeat;
						padding-top: 0;
						height: 24px;
						width: 10px;
						display: none;
					}
					
					#project-links a:after {display: none}
	
				span.slash {
					display: inline-block;
					width: 22px;
					background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -122px -152px no-repeat;
				}
	
			ul.sub li:last-child a:after,
			#project-links a:last-child:after,
			.hidden {
				display: none;
			}
		
	
		/*  Archive  */
	
	
		ul.archive {}
		ul.archive li {
			margin-bottom : 0px;
			font-family	  : 'GroteskFSLight', helvetica, arial, sans-serif;
			font-size	  : 1em;
			margin-bottom : 15px;
			border-bottom: 1px solid #fff;
		}
		
		ul.archive li a  {
			line-height: 17px;
		}
		
		ul.archive li a:hover {
			text-decoration: none;
			border-bottom: 1px solid;
			padding-bottom: 0px;
			margin-bottom: 0px;
		}
		
		/* Studio */
		
		.studio  .col.twelve {
		}
		
		.studio .col.eight {
			position: relative;
		}
	
			.studio .col.eight div.active {
				display: block;
				opacity: 1;
				filter: opacity(alpha=100);
				height: auto;
			}
			
				.studio .col.ten .inner.col.six {
					margin-left: 0;
				}
				
					.studio .col.ten .inner.col.six q,
					.inner-col>q {
						font-family: Georgia, 'Times New Roman', Times, serif; 
						font-style: normal;
						font-size: 1em;
						line-height: 1.21em;
					}
				
				.studio .col.ten .inner.col.four {
					margin-right: 0;
					width: 300px;
					padding-top: 0.2em;
				}
				
	/*
	//
	//
	//       M E D I A  Q U E R I E S
	//
	//
	*/
	
	@media all and ( min-width: 460px ) {

		ul.nav li  {
			float : left;
		}
		
		div.col div.inner-col {
			width: 66%;
			min-width: 422px;
		}

	} 

	@media all and ( min-width: 500px ) {
	
		div#container,
		.wrapper {
			margin-top: 33px		
		}

		ul.projectListings>li {
			height: 270px;
			width: 230px;
		}
			ul.projectListings>li h3:after {display: none}
		
		ul.projectListings>li div.arrow {
			background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -165px -122px no-repeat;
			display: block;
			position: relative;
			height: 0;
			width: 70px;
			margin: 0 0 0 75px;
			cursor: pointer;
			z-index: 99;
			opacity: 0;
			-webkit-transition: .23s ease opacity;
			   -moz-transition: .23s ease opacity;
			     -o-transition: .23s ease opacity;
				    transition: .23s ease opacity;
		}

		ul.projectListings>li:hover div.arrow {
			opacity: 1;
		}
	}
	
	@media all and ( min-width: 670px) {
		
		.project h2 {
			width: 500px;
		}
		
		div.col div.inner-col:first-child {
			margin-right: 2.0833333333%;
		}
		
			.studio .col.ten .inner.col.six q,
			.inner-col>q {
				font-size: 1.4em
			}

		ul.sub li:nth-child(2) {width: auto}
		ul.sub li:nth-child(2) a:after {display: block !important}
	
		div.vcard {
		
			font-family: 'GroteskFSLight', Helvetica, arial, sans-serif;
	
			background: url('http://sevilpeach.co.uk/img/sprite-assets.png') 0 -728px no-repeat;
			padding-top: 300px;
			margin-top: 3em;
			height: 0;
			overflow: hidden;
			position: relative;
		}
			div.vcard a.email {
				position: absolute;
				top: 11.25em;
				left: 0;
				padding-top: 2.05em;
				width: 20.2em;
				display: block;
				zoom: 1;
				opacity: 1;
				height: 0;
				overflow: hidden;
				border-bottom: 1px solid #fff;
			}
			
			div.vcard a.email:hover {
				border-bottom: 1px solid #222;
				-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.45);
				-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.45);
				box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.45);
			}
	}


	@media all and ( min-width: 760px ) {

		div.col div.inner-col {
			width: 32%;
			min-width: 0;
		}
		
		div.col div.inner-col:last-child {
			margin-right: 0;
		}
	}

	@media all and ( min-width: 855px) {
	
		/* PROJECTS */

		/* ABOUT */
		div.col.twelve.studio ul.sub {
			margin-top: 0;
			height: 4em;
			margin-bottom: .7em;
		}

		html.front ul.nav li {float:left}
		
		ul.nav li {margin-right: 0}
		
		ul.nav li a {
			background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -3px -8px no-repeat;
			display: block;
			height: 36px;
			text-indent: -9999em;
			margin-bottom: 5px;
			margin-right: .6em;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}

		html.front ul.nav li:last-child a,
		ul.nav li:last-child a {
			margin-right: 0;
		}
				
		div#project-links {
			margin: 1.66em 0 2em;
			clear: both;
			overflow: hidden}

		#project-links i {display: none}
		
		#project-links a,
		li span {
			display: inline-block;
			height: 36px;
			text-indent: -9999em;
			border-bottom: 2px solid #fff;
			padding-bottom: 2px;
			margin-right: 23px;
			margin-bottom: 20px;
			position: relative;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}
		
				#project-links a:after {
					display: block
				}

				#project-links a.selected {
					width: 116px;
					background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -3px -152px no-repeat;
					margin-right: 25px;
				}
				#project-links a.archive {
					width: 100px;
					background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -3px -188px no-repeat;
				}		
		
		
		div.col.twelve.studio ul.sub li {margin-right: 35px}

		div.col.twelve.studio ul.sub li a {
			background: transparent url('http://sevilpeach.co.uk/img/sprite-assets.png') no-repeat 0 0;
			display: inline-block;
			height: 0;
			overflow: hidden;
			padding: 1em 0 0 0;
			font-size: 1.16em;
			margin-bottom: 0
		}
			ul.sub li a[href='#our-story']  		{width: 121px}
			ul.sub li a[href='#who-we-are'] 		{width: 154px}
			ul.sub li a[href='#what-we-do'] 		{width: 155px}
			ul.sub li a[href='#what-were-proud-of'] {width: 266px}

			div.col.twelve.studio ul.sub li a:after {
				right: -24px;
				top: -3px;
				padding-top: 35px;
				height: 0;
				content: "";
				width: 22px;
				display: block;
				background: url('http://sevilpeach.co.uk/img/sprite-assets.png') -123px -152px no-repeat;
			}
	
			div.col.twelve.studio ul.sub li:last-child a:after {
				display: none;
			}
		ul.nav li {margin-right:31px}
	}
	
	@media all and ( min-width: 950px) {

		ul.nav li:first-child {
			width: auto;
		}
	}
	
	@media all and (min-width: 1280px) {
		
		ul.projectListings {
			max-width: none;
			width: 120%;
		}
		
	}
	.rule {
		position: absolute;
		top: 1em;
		left: 0;
		width: 100%;
		height:1px;
		background: rgba(255, 0,0,0.23);
	}