



*{
	position:relative;
	margin:0;
	padding:0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
html{
	width:100%;
	height:100%;
	overflow-x:auto;
	overflow-y:scroll;
	-webkit-overflow-scrolling:touch;
}
body{
	background:#FFFFFF;
	font-size:12px;
	min-height:100%;
}
input,button,textarea,label,a{
	-webkit-appearance:none;
	-moz-appearance:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	cursor:pointer;
}
header,section,footer{
	width:100%;
}
section{
	margin:0 auto;
}
header{
	position:fixed;
	height:12.5em;
	border-bottom:1px solid #F0F0F0;
	background:#FFF;
	z-index:1000;
}
p a,
p a:link,
p a:visited{
	color:#000;
}
p a:hover,
p a:active{
	color:#939393;
}
	a.home{
		float:left;
		display:block;
		text-decoration:none;
		margin:2em 0 0 2em;
		width:8em;
		height:8em;
		background:url("/inc/img/asset.1.11.svg");
		background-size:18em 15em;
		background-position:-.1em -3em;
	}
	a.home:hover{
		background-position:-9.1em -3em;
	}
	nav{
		float:right;
		margin:5.25em 0 0 0;
	}
	nav a{
		display:inline-block;
		padding:.6em 1em;
		font:normal normal 400 1.5em/1.2em "Quicksand", sans-serif;
		text-decoration:none;
	}
	nav a,
	nav a:link,
	nav a:visited{
		color:#939393;
	}
	nav a:hover,
	nav a:active{
		color:#000;
	}
	nav a.active,
	nav a.active:link,
	nav a.active:visited{
		color:#000;
	}
	nav a.active:hover,
	nav a.active:active{
		color:#939393;
	}
body>section:first-of-type{
	padding-top:11.5em;
}
body>section:last-of-type{
	padding-bottom:15em;
}
.fullscreen{
	width:100%;
	height:90vh;
	/*height:100vh;*/
	max-width:none;
	text-align:center;
/*	border-bottom:1px solid #F0F0F0;*/
	overflow:hidden;
}
	.fullscreen .img{
		display:block;
		position:absolute;
		top:12.5em;
		right:0;
		bottom:10em;
		left:0;
		background-repeat:no-repeat;
		background-position:center center;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		-o-background-size:cover;
		background-size:cover;
	}
	.fullscreen .photo-container,
	.fullscreen .photo-wrapper{
		height:100%;
	}
	.fullscreen .photo-wrapper .img{
		top:0;
	}
	
	.nav{
		display:block;
		position:absolute;
		right:0;
		bottom:3.6em;
	}
	a.instagram,
	a.facebook,
	a.vimeo,
	a.mail,
	a.phone{
		display:inline-block;
		width:2em;
		height:2em;
		margin:0 2.5em 0 0;
		background:url("/inc/img/asset.1.11.svg");
		background-size:18em 15em;
		background-position:-6em 0em;
		text-indent:-9999px;
	}
	a.facebook{
		background-position:0 0;
	}
	a.vimeo{
		background-position:-3em 0;
	}
	a.mail{
		background-position:-9em 0;
	}
	a.phone{
		background-position:-12em 0;
	}
	
	a.instagram:after,
	a.facebook:after,
	a.vimeo:after,
	a.mail:after,
	a.phone:after{
		display:block;
		position:absolute;
		content:"";
		top:0;
		right:0;
		bottom:0;
		left:0;
		background:#ffffff;
		opacity:.8;
		transition:opacity .15s ease-in-out;
	}
	a.instagram:hover:after,
	a.facebook:hover:after,
	a.vimeo:hover:after,
	a.mail:hover:after,
	a.phone:hover:after{
		opacity:0;
	}
	a.instagram.big,
	a.facebook.big,
	a.vimeo.big,
	a.mail.big,
	a.phone.big{	
		font-size:24px;
	}

	.big:last-of-type{
		margin-right:0;
	}

h1,h2,h3{
	margin:.72em auto .84em auto;
	padding:0 .138em;
	/*font:normal normal normal 6em/1.1em "HelveticaNeueLTPro-UltLtCn", sans-serif;*/
	/*font:normal normal normal 6em/1.1em "interstate-condensed", sans-serif;*/
	font-family: interstate-condensed, sans-serif;
	font-size: 6em;
	line-height: 1.1em;
	font-weight: 200;
	font-style: normal;

	text-align:center;
}
h3{
	margin:2em auto;
	font-size:2.25em;
}
h4,p,th,td,label,input,textarea{
	margin:0 auto 1em auto;
	padding:0 .555em;
	/*font:normal normal 400 1.5em/1.83em;*/
	font-size: 1.5em;
	line-height: 1.83em;
	font-family: proxima-nova,sans-serif;
	font-weight: 300;
	font-style: normal;
}
table{
	width:100%;
	margin-top:2.8em;
	border-collapse:collapse;
	border:0;
}
th{
	width:5em;
	border:0;
	vertical-align:top;
}
td{
	border:0;
}
label,input,textarea{
	display:inline-block;
	width:100%;
	margin:0 auto;
	line-height:1em;
	text-align:left;
}
label{
	padding:1em 1em .5em 1em;
}
input,textarea{
	padding:1em 1em;
	height:3em;
	appearance:none;
	box-shadow:none;
	border-radius:none;
	outline:none;
	border:1px solid #F0F0F0;
}
input:focus,textarea:focus{
	border-color:#000000;
}
label.error{
	color:#B30000;
}
input.error,
textarea.error{
	border-color:#B30000;
}
textarea{
	height:8.5em;
	resize:none;
}

section nav{
	float:none;
	margin:10em 0 5em 0;
	text-align:center;
}
section nav a.active{
	padding:.6em 1em;
	background:#EFF2F3;
	border-radius:4px;
}

.error404{
	max-width:100%;
	padding-bottom:6.8em;
	border-bottom:1px solid #F0F0F0;
}
	.error404 h1,
	.about h1{
		max-width:13.33em;
	}
	.error404 p,
	.about p{
		margin:0 auto 1.83em auto;
		max-width:53.33em;
	}
	
.content{
	max-width:80em;
}
.content-50{
	display:inline-block;
	width:50%;
	padding:0 .8em;
	vertical-align:top;
	text-align:left;
}

.cover-all{	
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:200;
}



.about{
	overflow-x:hidden;
}
	.about:after{
		display:block;
		position:absolute;
		content:"";
		right:50%;
		bottom:0;
		width:80%;
		max-width:63.16em;
		padding-bottom:87.12%;
		margin-right:-60em;
		background:url("/inc/img/martijn.5.png");
		background-position:center bottom;
		background-repeat:no-repeat;
		background-size:100% auto;
		z-index:-1;
	}
	
	.about-content{
		max-width:80em;
		margin:0 auto;
		padding:0;
	}
	.about h1,
	.about p{
		width:57%;
		margin:.72em 0 .84em 0;
		text-align:left;
	}
	.about p{
		margin:0 0 1em 0;
	}

button{
	position:absolute;
	right:-4em;
	bottom:-4em;
	width:7.83em;
	height:7.83em;
	background:transparent;
	border:none;
}
button:hover:after{
	-ms-transform:rotate(-35deg);
	-ms-transform-origin:50% 50%;
	-webkit-transform:rotate(-35deg);
	-webkit-transform-origin:50% 50%;
	transform:rotate(-35deg);
	transform-origin:50% 50%;
}
button:before,
button:after{
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:7.5em;
	height:7.5em;
	content:"";
	background:url("/inc/img/mail.1.1.svg");
	background-repeat:no-repeat;
	background-size:auto 7.5em;
	background-position:0 0;
    transition:transform .15s ease-in-out,top 2s ease-in, left 2s ease-in, opacity .3s ease-in 1.7s;
}
button:after{
	top:2.1em;
	left:2.05em;
	width:3.9em;
	height:2.6em;
	background-position:-8em 0;
}
button.sent:after{
	-ms-transform:rotate(-35deg);
	-ms-transform-origin:50% 50%;
	-webkit-transform:rotate(-35deg);
	-webkit-transform-origin:50% 50%;
	transform:rotate(-35deg);
	transform-origin:50% 50%;
	top:-4.9em;
	left:17.05em;
	opacity:0;
}
button.error:after{
	-ms-transform-origin:50% 50%;
	-webkit-transform-origin:50% 50%;
	transform-origin:50% 50%;
	-webkit-animation-name:shake;
    -webkit-animation-duration:.25s;
    -webkit-animation-iteration-count:3;
    -webkit-animation-timing-function:linear;
    animation-name:shake;
    animation-duration:.25s;
    animation-iteration-count:3;
    animation-timing-function:linear;
}
@keyframes shake{
    0% {
	    -ms-transform:rotate(-35deg);
		-webkit-transform:rotate(-35deg);
		transform:rotate(-35deg);
	}
    50%  {
	    -ms-transform:rotate(35deg);
		-webkit-transform:rotate(35deg);
		transform:rotate(35deg);
	}
    100% {
	    -ms-transform:rotate(-35deg);
		-webkit-transform:rotate(-35deg);
		transform:rotate(-35deg);
	}
}
@-webkit-keyframes shake{
    0% {
	    -ms-transform:rotate(-35deg);
		-webkit-transform:rotate(-35deg);
		transform:rotate(-35deg);
	}
    50%  {
	    -ms-transform:rotate(35deg);
		-webkit-transform:rotate(35deg);
		transform:rotate(35deg);
	}
    100% {
	    -ms-transform:rotate(-35deg);
		-webkit-transform:rotate(-35deg);
		transform:rotate(-35deg);
	}
}



.expertise-container{
	max-width:85em;
	text-align:center;
}
.expertise{
	display:inline-block;
	width:20%;
	margin:1em 0;
	padding-top:11.7em;
	vertical-align:top;
}
	.expertise:before,
	.expertise.film:after,
	.expertise.audio:after,
	.expertise.media:after,
	.expertise.production:after,
	.expertise.photography:after{
		display:block;
		position:absolute;
		top:0;
		left:50%;
		content:"";
		background:url("/inc/img/expertises.1.svg");
		background-repeat:no-repeat;
		background-size:27em 18.9em;
	}
	.expertise:before{
		width:11.7em;
		height:11.8em;
		margin-left:-5.85em;
		background-position:0 -7.1em;
	}
	.expertise.film:after{
		top:3.30em;
		width:4.21em;
		height:5.4em;
		margin-left:-1.60em;
		background-position:0 0;
	}
	.expertise.audio:after{
		top:3em;
		width:5.9em;
		height:6.3em;
		margin-left:-2.9em;
		background-position:-4.3em 0;
	}
	.expertise.media:after{
		top:3.1em;
		width:5.3em;
		height:6.5em;
		margin-left:-2.2em;
		background-position:-10.25em 0;
	}
	.expertise.production:after{
		top:2.5em;
		width:4.5em;
		height:7.2em;
		margin-left:-2.25em;
		background-position:-15.9em 0;
	}
	.expertise.photography:after{
		top:3.7em;
		width:6.5em;
		height:4.5em;
		margin-left:-3.2em;
		background-position:-20.4em 0;
	}
	
.client-container{
	max-width:80em;
	margin-top:-4em;
	text-align:center;
}
	.client{
		display:inline-block;
		width:16em;
		height:7.5em;
		margin:2em;
	}
	
	.client:after{
		display:block;
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		content:"";
		background:url("/inc/img/clients.1.png") no-repeat 50% 0;
		background-repeat:no-repeat;
		background-size:16em 144.5em;
	}
	.client.radbout:after{
		background-position-y:0;
	}
	.client.teva:after{
		background-position-y:-8.5em;
	}
	.client.robeco:after{
		background-position-y:-17em;
	}
	.client.dnb:after{
		background-position-y:-25.5em;
	}
	.client.thole:after{
		background-position-y:-34em;
	}
	.client.smulweb:after{
		background-position-y:-42.5em;
	}
	.client.stage:after{
		background-position-y:-51em;
	}
	.client.pinkpop:after{
		background-position-y:-59.5em;
	}
	.client.npo:after{
		background-position-y:-68em;
	}
	.client.klm:after{
		background-position-y:-76.5em;
	}
	.client.ncrv:after{
		background-position-y:-85em;
	}
	.client.npo3:after{
		background-position-y:-93.5em;
	}
	.client.ing:after{
		background-position-y:-102em;
	}
	.client.rtl:after{
		background-position-y:-110.5em;
	}
	.client.biogen:after{
		background-position-y:-119em;
	}
	.client.airfrance:after{
		background-position-y:-127.5em;
	}
	.client.gen:after{
		background-position-y:-136em;
	}

#work{
	position:absolute;
	top:100vh;
	margin-top:-12.5em;
}

.work,
.work-video{
	max-width:100%;
	min-height:100vh;
	padding-bottom:5em;
	border-bottom:1px solid #F0F0F0;
	overflow:hidden;
}
.work-video{
	max-width:80em;
}
	.work-grid{
		max-width:80em;
	}
	.work img{
		display:block;
		margin:0 auto;
		max-width:80em;
		height:auto;
		border:none;
	}
	.work-info{
		margin:0 auto;
		max-width:80em;
	}
		.work-info p,.work-info th,.work-info td{
			margin:0 auto;
			padding:0;
			color:#939393;
			text-align:left;
		}.work-info td{
			color:#000000;
		}
		.work-info .right{
			z-index:950;
		}
		.work-info p a,
		.work-info p a:link,
		.work-info p a:visited{
			color:#939393;
		}
		.work-info p a:hover,
		.work-info p a:active{
			color:#000;
		}
	.video-wrapper{
		display:block;
		margin:0 auto;
		max-width:80em;
		height:0;
		padding-bottom:56.25%;
	}
		.video-wrapper iframe {
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
		}
	.photo-wrapper{
		float:left;
	}
	.photo-container{
	    transform:translate3d(0, 0, 0);
	    transition:transform .5s ease-in-out;
	}
	.photo-wrapper:last-of-type:after {
		content:"";
		display:block;
		clear:both;
	}
	.photo-wrapper:after{
		position:absolute;
		display:block;
		content:"";
		top:0;
		right:0;
		bottom:0;
		left:0;
		z-index:1;
	}
	.photo-previous,
	.photo-next{
		position:absolute;
		top:0;
		right:50%;
		bottom:0;
		left:0;
		cursor:pointer;
		z-index:900;
	}
	.photo-next{
		right:0;
		left:50%;
	}

	
	.photo-previous:before,
	.photo-previous:after,
	.photo-next:before,
	.photo-next:after{
		content:"";
		position: absolute;
		top:50%;
		height:1.8em;
		width:2px;
		margin-top:-.6em;
		background-color:#BFBFBF;
	}
	
	.fullscreen .photo-previous:before,
	.fullscreen .photo-previous:after,
	.fullscreen .photo-next:before,
	.fullscreen .photo-next:after{
		top:40%;
	}
	
	.photo-previous:before,
	.photo-previous:after{
		left:2em;
	}
	.photo-next:before,
	.photo-next:after{
		right:2em;
	}
	
	.photo-previous:before{
		transform:rotate(45deg);
	}
	.photo-next:before{
		transform:rotate(-45deg);
	}
	.photo-previous:after{
		transform:rotate(-45deg);
		margin-top:.6em;
	}
	.photo-next:after{
		transform:rotate(45deg);
		margin-top:.6em;
	}
	
	
	.work-back{
		display:block;
		margin:5.5em auto 0 auto;
		padding:0;
		max-width:53.3em;
	}
		.work-back a{
			text-decoration:none;
		}
section.work-thumb,
section.work-thumb-small{
	display:inline-block;
	vertical-align:top;
	width:50%;
	max-height:21.83em;
	margin:0;
	cursor:pointer;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	overflow:hidden;
}

.work-thumb.show{
	display:inline-block;
}
.work-thumb.hide{
	display:none;
}


section.work-thumb-small{
	width:33%;
}
	section.work-thumb{
		height:0;
	}
	section.work-thumb.padding-left{
		padding:.84em .42em 27.8% 0;
	}
	section.work-thumb.padding-right{
		padding:.84em 0 27.8% .42em;
	}
	section.work-thumb-small:nth-child(3n+2){
		padding:.42em .84em .42em 0;
	}
	section.work-thumb-small:nth-child(3n+3){
		padding:.42em;
	}
	section.work-thumb-small:nth-child(3n+4){
		padding:.42em 0 .42em .84em;
	}
	
	

	
	section.work-thumb h4,
	section.work-thumb-small h4{
		position:absolute;
		top:58%;
		right:0;
		left:0;
		text-align:center;
		color:#FFF;
		transform:translate(0,-50%);
		z-index:100;
	}
	section.work-thumb h4,
	section.work-thumb-small h4{	
		/*font:normal normal normal 3em/1.1em;*/
		font-size: 3em;
		line-height: 1.1em;
		font-family: proxima-nova,sans-serif;
		font-weight: 900;
		font-style: normal;	
		margin:0 1em;
	}
	
	section.work-thumb h4 a{
		top:-2em;
		/*font:normal normal 400 .3em/1.83em;*/
		font-size: .3em;
		line-height: 1.83em;
		font-family: proxima-nova,sans-serif;
		font-weight: 300;
		font-style: normal;
	}
	section.work-thumb-small h4{
		top:50%;
		margin:0;
		font-size:1.75em;
	}
	section.work-thumb-small h4 a{
		display:none;
	}
	section.work-thumb a,
	section.work-thumb-small a{
		text-decoration:none;
	}
	section.work-thumb a,
	section.work-thumb a:link,
	section.work-thumb a:visited,
	section.work-thumb-small a,
	section.work-thumb-small a:link,
	section.work-thumb-small a:visited{
		color:#FFF;
	}
	section.work-thumb a:hover,
	section.work-thumb a:active,
	section.work-thumb-small a:hover,
	section.work-thumb-small a:active{
		color:#FFF;
	}
	section.work-thumb img,
	section.work-thumb video,
	section.work-thumb-small img{
		display:block;
		width:100%;
		height:auto;
	}

#testimonial-container{
	overflow:hidden;
    transform:translate3d(0, 0, 0);
    transition:transform .5s ease-in-out;
	width:400%;
}


.testimonial{
    float:left;
	width:25%;
}

#testimonial-link-list{
	text-align:center;
}
	ul{
		display:inline-block;
	}
	.testimonial-link{
		float:left;
		width:1em;
		height:1em;
        margin:1em;
		border:2px solid #000000;
		border-radius:50%;
        text-align:center;
        list-style:none;
        cursor:pointer;
	}
	.testimonial-link.active{
		background:#000000;
	}

footer{
	position:absolute;
	left:0;
	bottom:0;
	height:10em;
	margin:0;
	background:#ffffff;
	border-top:1px solid #F0F0F0;
}
	footer p{
		margin:3.2em 0 0 2em;
		font-size:1.25em;
		color:#B4B4B4;
	}

.hide-overflow{
	overflow:hidden;
}
	.center{
		text-align:center;
	}
	.work-grid .center{
		margin:3em 0 2.5em 0;
	}
.right{
	float:right;
}
.left{
	float:left;
}

@media(max-width:1100px){
	button{
		right:1em;
	}
}

@media(max-width:1000px){
	.work{
		height:auto;
		min-height:auto;
	}
	.work img,.video-wrapper{
		max-width:100%;
	}
	.work-info{
		margin-left:1em;	
	}
	p.work-back{
		margin:2em auto 1.2em 1em;
	}
}
@media(max-width:960px){
	.expertise{
		width:26%;
	}
	button{
		right:0em;
	}
}
@media(max-width:800px){
	.content-50{
		width:80%;
	}
	button{
		right:-2em;
		bottom:-2em;
	}
	.about:after{
		margin-right:-75%
	}
	.expertise{
		width:30%;
	}

}
@media(max-height:500px), (max-width:550px){
	header{
		height:6em;
	}
	.content-50{
		width:100%;
	}
	button{
		right:0em;
		bottom:-2em;
	}
	a.home{
		font-size:18px;
		width:3em;
		height:3em;
		background-position: 0 -12em;
	}
	a.home:hover{
		background-position:0 -12em;
	}
	nav{
		margin:2.1em 0 0 0;
	}
	.fullscreen .img{
		top:6em;
	}
	.about h1,
	.about p{
		width:100%;
	}
	.about{
		padding-bottom:25em !important;
	}
}
@media(max-width:600px){
	section.work-thumb h4 {
		padding:0 0;
	}
}

@media(max-width:550px){
	header{
		text-align:center;
		height:auto;
	}
	a.home{
		float:none;
		display:inline-block;
		margin:1em 0;
	}
	nav{
		float:none;
		display:inline-block;
		width:100%;
		margin:1em 0;
	}
	nav a:last-child,div.nav a:last-child{
		margin-right:0;
	}
	div.nav{
		left:0;
		text-align:center;
	}
	section nav{
		margin:7em 0 3em 0;
	}
	section nav a{
		margin:.2em 1.8em 0 0;
	}
	section.work-thumb,
	section.work-thumb-small{
		width:100%;
	}
	
	
	section.work-thumb-small{
		padding:.42em 0 .42em 0 !important;
	}
	section.work-thumb{
		padding:.84em 0 56.3% 0 !important;
	}
	a.instagram.big,
	a.facebook.big,
	a.vimeo.big,
	a.mail.big,
	a.phone.big{
		margin:0 1.25em 2.5em 1.25em;
	}
	
	
	
	
	.expertise{
		width:40%;
	}
	body>section:last-of-type{
		padding-bottom:17em;
	}
	.client{
		width:46%;
		margin:2%;
	}
	footer{
		height:13em;
	}
	footer .nav{
		top:3.6em;
		bottom:auto;
	}
	footer p{
		margin:6em 0 0 0;
		text-align:center;
	}
}
@media(max-width:550px){
	.expertise{
		width:50%;
	}
}
@media(max-width:400px){
	nav a{
		font-size:1.2em;
	}
}

.introduction {
	font-family: 'Quicksand', sans-serif;

}

.intro{
	padding: 0 .338em;
}