@charset "utf-8";
/*! normalize.css v2.1.0 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{
	display:block;}
audio,canvas,video{
	display:inline-block;}
audio:not([controls]){
	display:none;
	height:0;}
[hidden]{
	display:none;
	}
html{
	font-family:"Abel",sans-serif;
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
	}
body{
	margin:0;
	}
a:focus{
	outline:thin dotted;
	}
a:active,a:hover{
	outline:0;
	}
h1{
	font-size:2em;
	margin:.67em 0;
	}
abbr[title]{
	border-bottom:1px dotted;
	}
b,strong{
	font-weight:bold;
	}
dfn{
	font-style:italic;
	}
hr{
	-moz-box-sizing:content-box;
	box-sizing:content-box;
	height:0;
	}
mark{
	background:#ff0;
	color:#000;
	}
code,kbd,pre,samp{
	font-family:monospace,serif;
	font-size:1em;
	}
pre{
	white-space:pre-wrap;
}
q{
	quotes:"\201C" "\201D" "\2018" "\2019";
	}
small{
	font-size:80%;
	}
sub,sup{
	font-size:75%;
	line-height:0;
	position:relative;
	vertical-align:baseline
	}
sup{
	top:-0.5em;
	}
sub{
	bottom:-0.25em;
	}
img{
	border:0;
	}
svg:not(:root){
	overflow:hidden;
	}
figure{
	margin:0;
	}
fieldset{
	border:1px solid #c0c0c0;
	margin:0 2px;
	padding:.35em .625em .75em;
	}
legend{
	border:0;
	padding:0;
	}
button,input,select,textarea{
	font-family:inherit;
	font-size:100%;
	margin:0;
	}
button,input{
	line-height:normal;
	}
button,select{
	text-transform:none;
	}
button,html input[type="button"],input[type="reset"],input[type="submit"]{
	-webkit-appearance:button;
	cursor:pointer;
	}
button[disabled],html input[disabled]{
	cursor:default;
	}
input[type="checkbox"],input[type="radio"]{
	box-sizing:border-box;
	padding:0;
	}
input[type="search"]{
	-webkit-appearance:textfield;
	-moz-box-sizing:content-box;
	-webkit-box-sizing:content-box;box-sizing:content-b
	}
	input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{
	-webkit-appearance:none;
	}
button::-moz-focus-inner,input::-moz-focus-inner{
	border:0;
	padding:0;
	}
textarea{
	overflow:auto;
	vertical-align:top;
	}
table{
	border-collapse:collapse;
	border-spacing:0;
	}
.header-font{
	font-family:"Abel",sans-serif;
	}
.body-font{
	font-family:"Vollkorn",serif;
	}

	
body{
	font-family:"Vollkorn",serif;
	color:#fff;
	background:#fff;
	text-align:center;
	line-height:1.6;
	font-size:9px;
	font-size:.9rem;
	min-width:15em;
	position:relative;
	right:0;
	-webkit-transition:all .5s ease-out .4s;
	-moz-transition:all .5s ease-out .4s;
	transition:all .5s ease-out .4s;
	}
h1,h2,h3,h4,h5,h6{
	font-family:"Abel",sans-serif;
	font-weight:400;
	line-height:1;
	font-style:normal;
	margin:.4em 0 0 0;
	position:relative;
	}
h1{
	font-size:25px;
	font-size:2.5rem;
	}
h2{
	font-size:35px;
	font-size:3.5rem;
	}
h3{
	font-size:20px;
	font-size:2rem;
	}
h4{
	font-size:17.5px;
	font-size:1.75rem;
	}
a{
	text-decoration:none;
	color:#ff891f;
	}
p,ol,ul{
	font-style:italic;
	}
section{
	padding: 60px 30px 30px 30px;
	overflow:hidden;
	zoom:1;
	}
section:before,section:after{
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
	}
section:after{
	clear:both;
	}
img{
	max-width:100%;
	}
form{
	margin-bottom:3.2em;
	}
form>ul>li{
	margin-bottom:.8em;
	}
label{
	position:absolute;
	margin:-1px;
	padding:0;
	height:1px;
	width:1px;
	overflow:hidden;
	border:0;
	clip:rect(0 0 0 0);
	}
input,textarea{
	border:0 none;
	background:rgba(0,0,0,0.075);
	color:#081724;
	display:block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
	width:100%;
	padding:.8em;
	resize:none;
	border:1px solid rgba(255,255,255,0);
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
	}
input:focus,textarea:focus{
	border:1px solid #fff;
	}
input:invalid,textarea:invalid{
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	}
::-webkit-input-placeholder{
	color:rgba(255,255,255,0.9);
	}
:-moz-placeholder{
	color:rgba(255,255,255,0.9);
	}
::-moz-placeholder{
	color:rgba(255,255,255,0.9);
	}
:-ms-input-placeholder{
	color:rgba(255,255,255,0.9);
	}
.unstyled{
	margin:0;
	padding:0;
	list-style-type:none;
	}
.hidden{
	display:none;
	visibility:hidden;
	}
.vishid{
	position:absolute;
	margin:-1px;
	padding:0;
	height:1px;
	width:1px;
	overflow:hidden;
	border:0;
	clip:rect(0 0 0 0);
	}
.clearfix{
	zoom:1;
	}
.clearfix:before,.clearfix:after{
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
	}
.clearfix:after{
	clear:both;
	}
.ir{
	display:block;
	overflow:hidden;
	background-repeat:no-repeat;
	text-align:left;
	text-indent:-999em;
	direction:ltr;
	}
.ir br{display:none}
.skin-primary{
	background:#fff;
	-webkit-box-shadow:inset 0 0 2em 0 rgba(0,0,0,0.2);
	-moz-box-shadow:inset 0 0 2em 0 rgba(0,0,0,0.2);
	box-shadow:inset 0 0 2em 0 rgba(0,0,0,0.2);
	background-attachment:fixed;
	}
.skin-primary h1,.skin-primary h2,.skin-primary h4 .skin-primary p{
	color:#081724;
	}
.skin-secondary{
	background:#081724;
	}
.skin-secondary h1,.skin-secondary h2,.skin-secondary a{
	color:#fff;
	}
.skin-primary button{
	background:#081724;
	font-family:"Abel",sans-serif;
	display:block;
	width:100%;
	color:#081724;
	border:0 none;
	padding:.8em 0;
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
	}
.skin-primary button:hover,.skin-secondary button:focus{
	background:#fff;
	}
.wrap{
	max-width:50em;
	margin:auto;
	zoom:1;
	}
.wrap:before,.wrap:after{
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
	}
.wrap:after{clear:both}

	.animate{
		margin-left: auto;
		margin-right: auto;
		width: 90%;
		position:relative;
		margin-top: 150px;
	}

@media screen and (min-width:40em){
	
	.animate{
		width: 100%;
		position:relative;
		margin-top: 30%;
	}
	
	.sub-header{
		margin-bottom:1.6em;
		position:relative;
		}
	.sub-header{
		position:relative;
		padding:0 5em;
		display:inline-block;
		}
	.sub-header:before,.sub-header:after{
		content:"";
		display:inline-block;
		border-bottom:.1em solid rgba(255,255,255,0.5);
		width:4em;
		position:absolute;
		top:50%;
		}
	.sub-header:before{
		left:0;
		}
	.sub-header:after{
		right:0;
		}
}



.mast-head{
	position:fixed;
	top:0;
	left:0;
	right:0;
	padding:.8em 1.6em;
	zoom:1;
	z-index:1000;
	background:rgba(27,44,60,0);
	-webkit-transition:all .5s ease-out .4s;
	-moz-transition:all .5s ease-out .4s;
	transition:all .5s ease-out .4s;
	}
.mast-head:before,.mast-head:after{
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
	}
.mast-head:after{
	clear:both;
	}
.mast-head .wrap{
	padding:0;
	}
.mast-head h1{
	margin:5px 0 -15 0;
	float:left;
	background-image:url("images/logo_small.png");
	width:107px;
	height:40;
	}
[role=navigation] .menu-button{
	float:right;
	top:.3em;
	-webkit-transition:opacity .2s ease-out;
	-moz-transition:opacity .2s ease-out;
	transition:opacity .2s ease-out;
	left:0;-webkit-opacity:.8;
	-moz-opacity:.8;
	opacity:.8;
	width:21px;
	height:21px;
	position:relative;
	}
[role=navigation] .menu-button:focus{
	outline:0;
	}
[role=navigation] .menu-button:hover{
	-webkit-opacity:1;
	-moz-opacity:1;
	opacity:1;
	}
[role=navigation] .menu-button img{
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
	position:absolute;
	top:0;
	right:0;
	}
[role=navigation] .menu-button .close{
	-webkit-opacity:0;
	-moz-opacity:0;
	opacity:0;
	right:-1em;
	}
#nav{
	font-family: 'Abel', sans-serif;
	color:#fff;zoom:1;
	float:right;
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
	position:relative;
	-webkit-transition:all .5s ease-out .4s;
	-moz-transition:all .5s ease-out .4s;
	transition:all .5s ease-out .4s;
	}
#nav:before,#nav:after{
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
	}
#nav:after{
	clear:both;
	}
#nav a{
	color:#fff;
	font-style:normal;
	}
.open .mast-head{
	background:#081724;
	}
.open #nav{
	right:0;
	-webkit-opacity:1;
	-moz-opacity:1;
	opacity:1;
	}
.open .menu-button .close{
	-webkit-opacity:1;
	-moz-opacity:1;
	opacity:1;
	right:-15em;
	}
.open .menu-button .open{
	-webkit-opacity:0;
	-moz-opacity:0;
	opacity:0;
	right:-1em;
	}
#nav{
	position:fixed;
	top:0;
	right:-10em;
	bottom:0;
	background:#081724;
	width:10em;
	z-index:1000;
	-webkit-box-shadow:inset 0 0 1em 0 rgba(0,0,0,0.2);
	-moz-box-shadow:inset 0 0 1em 0 rgba(0,0,0,0.2);
	box-shadow:inset 0 0 1em 0 rgba(0,0,0,0.2);
	}
#nav li{
	padding:.8em;
	border-bottom:1px solid rgba(255,255,255,0.1);
	text-align:left;
	text-indent:.8em
	}
.open{
	right:10em;
	}.
open .mast-head{
	left:-10em;
	right:10em;
	}
	
.not-mobile {
	display: none;
}
@media screen and (min-width:40em){
	body{
		position:static;
		}
	body.open{
		right:0;
		}
	.mast-head{
		right:0;
		left:0;
		}
	#nav{
		top:.1em;
		right:-30em;
		width:20em;
		-webkit-opacity:0;
		-moz-opacity:0;
		opacity:0;
		background:0;
		position:relative;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
		box-shadow:none;
		}
	#nav li{
		float:left;
		width:25%;
		padding:0;
		border:0 none;
		text-align:center;
		text-indent:0;
		}
	.open .mast-head{
		right:0;
		left:0;
		}
		
	.mobile {
		display: none;
	}
	.not-mobile {
		display: block;
	}
}
@media screen and (min-width:45em){
	#nav{
		width:25em;
		}
}

.footer .logo{
	background-image:url("images/logo_small.png");
	background-size: cover;
	width:107px;
	height:35px;
	display:inline-block;
	vertical-align:middle;
	margin-left:.8em;
	}
.footer .wrap{
	padding:0;
	}
#splash{
	margin: 0;
	height: 450px;
	background-image: url("images/background_mobile.png");
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	overflow: hidden;
	}
#splash img{
	position:relative;
	}
#splash .sub-header{
	font-size:15px;
	font-size:1.5rem;
	}
#intro {
	position: relative;
	z-index: 80;
}
#portfolio {
	margin-top: -60px;
	margin-bottom: 160px;
}

.filterd {
	display: none;
}

@media screen and (min-width:880px){
	#splash{
	height: 550px;
	background-image: url("images/background_main.png");
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	overflow: hidden;
	}
	#splash h2{
		font-size:45px;
		font-size:4.5rem;
		}
	#categories {
	position: absolute;
	z-index: 100;
	width: 100%;
	margin-top: -50px;
}


.filterd {
	position: relative;
	list-style: none;
	display: inline-block;
	z-index: 50;
}

.filterd li {
	margin-left: 10px;
	margin-right: 10px;
	position: relative;
	display: inline-table;
	width: 135px;
	height: 130px;
	padding: 0;
	background-repeat:no-repeat;
	text-align:left;
	text-indent:-999em;
	direction:ltr;
	overflow:hidden;
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
}

#ux-ui {
	
	background: url('images/UX-UI_button_135x130.png');
}

#ux-ui:hover {
	
	background: url('images/UX-UI_button_hover_135x130.png');
	
}

#environmental {
	background: url('images/ENVIRONMENTAL_button_135x130.png');

}

#environmental:hover {
	background: url('images/EVIRONMENTAL_button_hover_135x130.png');
	
}

#web {
	background: url('images/WEB_button_135x130.png');
}

#web:hover {
	background: url('images/WEB_button_hover_135x130.png');
}

#print {
	background: url('images/PRINT_button_135x130.png');
}

#print:hover {
	background: url('images/PRINT_button_hover_135x130.png');
}

#animation {
	background: url('images/ANIMATION_button_135x130.png');
}

#animation:hover {
	background: url('images/ANIMATION_button_hover_135x130.png');
}









}



#filter:after {
	content:""; clear: both; display: block;
}

#grid {
	clear: both; 
	position: relative
	}

#grid p {
	margin-top: 5px;
	color: 	#38B449;
	font-size: 20px;
}

.item {
	float: left; 
	margin-right: 10px; 
	margin-bottom: 10px; 
	cursor: default;
}

#portfolio {
	text-align: left;
}


	
#i-am {
	margin-left: auto;
	margin-right: auto;
	list-style: none;
	postion: relative;
	z-index: 50;	
	width: 100%;
	height: auto;

}

#i-am h2 {
	position: absolute;
	text-align: left;
	text-indent: -999em;
	direction: ltr;
}

#i-am img{
	overflow: hidden;
	margin-top: -30px;
	height: auto;
	width: 100%;
	text-align: left;
	text-indent: -999em;
	direction: ltr;
}




@media screen and (min-width:40em){.faction-list>li{float:left;width:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}}

#services{background-image:url("../img/bg-services.jpg");background-position:center center;background-size:cover;background-repeat:no-repeat}.services-list>li{margin-bottom:3.2em}.services-list h4{margin-bottom:.8em}

@media screen and (min-width:40em){.services-list{padding-top:3.2em}.services-list>li{float:left;width:25%}}

.logos>li{border:1px solid rgba(255,255,255,0.2);border-width:0 0 1px 0}

@media screen and (min-width:580px){
	#splash{
	height: 550px;
	background-image: url("images/background_middle.png");
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	overflow: hidden;
	}
	
	#i-am img{
		display: none;
	}
	#i-am h2 {
	position: relative;
	overflow: hidden;
	margin-left: 145px;
	height: 195px;
	width: 535px;
	background-repeat: no-repeat;
	background: url('images/i-am-a-designer_535x195.png');
	text-align: left;
	text-indent: -999em;
	direction: ltr;
	-webkit-transition:all .2s ease-out;
	-moz-transition:all .2s ease-out;
	transition:all .2s ease-out;
}

#i-am h2:hover {
	background: url('images/i-am-a-mad-scientist_535x195.png');
	background-repeat: no-repeat;
}

#i-am:after {
	content:"";
	clear: both;
	display: block;
}


	
	.logos>li{float:left;width:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.logos>li:nth-child(2n){border-width:0 0 1px 1px}.logos>li:nth-child(7){border-width:0}.logos>li:last-child{border-width:0 0 0 1px}
}

@media screen and (min-width:40em){.logos{padding-top:1.6em}.logos>li{float:left;width:25%;border-width:0 0 1px 1px}.logos>li:first-child{border-width:0 0 1px 1px;border-left-color:transparent}.logos>li:nth-child(3){border-width:0 0 1px 1px}.logos>li:nth-child(4){border-width:0 0 1px 1px}.logos>li:nth-child(5){border-width:0}.logos>li:nth-child(6){border-width:0 0 0 1px}.logos>li:nth-child(7){border-width:0 0 0 1px}.logos>li:nth-child(8){border-width:0 0 0 1px}}


@media screen and (min-width:60em){.process-flow{padding-top:3.2em}.process-flow>li{float:left;clear:right;margin:0;height:11.200000000000001em;position:relative;width:20em}.process-flow>li .bar{position:absolute;height:28.5em;right:-25%;top:-6.75em;-webkit-transform:rotate(-69.5deg);-moz-transform:rotate(-69.5deg);transform:rotate(-69.5deg)}.process-flow>li .bar.active .progress{height:28.5em}.process-flow>li:nth-child(2n){float:right;clear:left}.process-flow>li:nth-child(2n) .bar{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg);left:-176%;-webkit-transform:rotate(69.5deg);-moz-transform:rotate(69.5deg);transform:rotate(69.5deg)}}

.ajax-form{max-width:25em;margin:auto;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;transition:all .2s ease-out;-webkit-opacity:1;-moz-opacity:1;opacity:1}.thanks{border:1px solid rgba(255,255,255,0.2)}.thanks p{color:#1b2c3c;font-size:8.75px;font-size:.875rem}.thanks .special{font-family:"klavika_lightplain",sans-serif;color:#fff;font-size:15px;font-size:1.5rem;margin-top:0;font-style:normal}

@media screen and (min-width:40em){.ajax-form{padding:1.6em 0}}