@font-face {font-family: 'ProximaNovaA-Thin';src: url('../webfonts/2BD08F_0_0.eot');src: url('../webfonts/2BD08F_0_0.eot?#iefix') format('embedded-opentype'),url('../webfonts/2BD08F_0_0.woff') format('woff'),url('../webfonts/2BD08F_0_0.ttf') format('truetype');}
@font-face {font-family: 'ProximaNovaT-Thin';src: url('../webfonts/2BD08F_2_0.eot');src: url('../webfonts/2BD08F_2_0.eot?#iefix') format('embedded-opentype'),url('../webfonts/2BD08F_2_0.woff') format('woff'),url('../webfonts/2BD08F_2_0.ttf') format('truetype');}

@font-face {
	font-family:'font1';
	src: url('../fonts/font1.eot');
	src: url('../fonts/font1.eot?#iefix') format('embedded-opentype'),
		url('../fonts/font1.woff') format('woff'),
		url('../fonts/font1.ttf') format('truetype'),
		url('../fonts/font1.svg#font1') format('svg');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+0020-FB02;
}

@font-face {
	font-family: "icon";
	src: url("../fonts/icon.eot");
	src: url("../fonts/icon.eot#iefix") format("embedded-opentype"),
	url("../fonts/icon.woff") format("woff"),
	url("../fonts/icon.ttf") format("truetype"),
	url("../fonts/icon.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}
[class^="icon-"]:before, [class*=" icon-"]:before,
[class^="icon-"]:after, [class*=" icon-"]:after {   
	font-family: icon;
    font-size: 24px;
	font-style: normal;

}.icon-arrow429:before {
	content: "\e000";
}
.icon-pdf19:before {
	content: "\e001";
	font-size: 20px;
	margin:0px 4px;
}
.icon-pins53:before {
	content: "\e002";
}
.icon-plus79:before {
	content: "\e003";
}
.icon-right106:before {
	content: "\e004";
}
.icon-thin35:before {
	content: "\e005";
}



.element.style {
    display: block;
}
.slick-prev-tcc {
    left: 0;
}

.slick-prev-tcc i:before{
	content: "\e005";
}

.slick-next-tcc {
    right: 0;
}

.slick-arrow{
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
	z-index: 1;
	margin: -30px 0 0 0;
    height: 60px;
    line-height: 60px;
    width: 60px;
    text-align: center;
    cursor: pointer;
    background-color: #000;
    opacity: 0.8;
	color: white;
}




html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike,  sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0px;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	
	font-family: inherit;
	vertical-align: baseline;
	-webkit-text-size-adjust: 100%;
}


body{
	margin:0px;
	font-family:"ProximaNovaT-Thin","Helvetica Neue", helvetica, Arial;
	font-size:20px;
	line-height:32px;
	color:#fff;
	background-color:#fff;
	height:auto;
	overflow:scroll-y;
	font-weight:400; 
}

h1, h2, h3{font-family:"font1", "ProximaNovaT-Thin","Helvetica Neue", helvetica, Arial;}

h1{
	font-size:38px; 
	line-height:42px; 
	color:#FFF;
	
	width:100%;/* Content Width */
	margin-bottom:30px;
	
	display:block;
	text-align:left;
	
	}
	
h3{ 
	position:relative; 
	float:left; 
	width:150px; 
	padding:45px 45px 0px;  
	font-size:22px; 
	text-align:left;
	line-height:24px; 
	color:#222; 
	opacity:0; 
	-webkit-transition: all 0.3s ease; 
	transition: 
	all 0.3s ease;}

h4{margin-top: 10px; margin-bottom: 3px; font-size: 14px;}

a, a:visited{
	color:#E66464;
	text-decoration:none;
	
	}
a.achtergrond{color:#fff;}

a:hover{ }
a i{color:#fff;}

.container{
	position:absolute;
	margin: 0 auto -140px;
	padding:0px;
	height:100%;
	width:100%;
	display:block;
	}


.content{
	position:fixed;
	width:230px;
	margin-left:-110px;/* Content Width */
	height:100%;/* Screenheight */
	float:left;
	display:block;
	text-align:center;
	display:block;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	z-index:50;
	}

	.content:hover{
	
	-webkit-transition: all 0.3s ease;
	
	transition: all 0.3s ease;

	}
	
.arrowbalk{
	position:fixed;
	width:130px;
	/* Content Width */
	height:100%;/* Screenheight */
	right:0;
	display:block;
	text-align:center;
	display:block;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	opacity:1;
	z-index:50;
	pointer-events: none;
	}
		
		.uitz{ right:auto; left:120px; z-index:19; display:none;}
		.uitz .arrow{ right:auto; left:0;}
		.links{display:none;}

.arrow{ 
	position:absolute; 
	top:50%; 
	right:0px; 
	margin:-30px 0 0 0; 
	height:60px; 
	line-height:60px; 
	width:60px; 
	text-align:center; 
	cursor:pointer; 
	background-color:#000;
	opacity:0.8;
	pointer-events:visible;
	}
	
	.arrow:hover{
	opacity:1;
	}
	
	.logo{ position:relative; margin:0px auto 0;  left:54px;width:45px; height:70px; display:block; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
	.logo img { border:none; position:relative; margin:0px auto 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease;width:45px; height:70px;  }
	
	.menul{position:absolute; right:0;width:36px;height:25px; margin: 68px 43px auto auto; float:right;cursor:pointer;-webkit-transform:translateX(0px);transform:translateX(0px);-webkit-transition:-webkit-transform 0.4s;transition: -webkit-transform 0.4s;transition: transform 0.4s;transition:transform 0.4s, -webkit-transform 0.4s }

  	.menul::before{content:"";position:absolute;top:0;height:0;border-bottom:1px solid #111;width:100%;left:0;right:0;-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: -webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition:transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55)}

   	.menul::after{content:"";position:absolute;height:0;border-bottom:1px solid #111;width:100%;left:0;right:0;top:100%;-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transition:-webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: -webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition:transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55)}
   	.menul span{position:absolute;top:50%;height:1px;width:100%;background:#111;white-space:nowrap;overflow:hidden;text-indent:100%;display:block;-webkit-transition:opacity 0.2s 0.15s;-webkit-transition-delay:ease;-webkit-transition: opacity 0.2s 0.15s ease;transition:opacity 0.2s 0.15s ease}
   

	
/*	
	.content:hover > .hoofd h3{ opacity:1; transition: opacity 0.3s ease; transition-delay:0.1s;}
	.content:hover > .hoofd div{ opacity:0; transition: opacity 0.3s ease; }
	.content:hover > .hart .navi{ opacity:1; transition: opacity 0.4s ease;  }
	.content:hover > .logo{ opacity:1; left:0;transition: all 0.3s ease; }
	.kleur1{ background-color:#fff; position:fixed; left:0px; color:#b7b7b7; z-index:20; }
*/
	.aan .content {margin-left:0px;}
	.aan .omhulsel{margin-left: 120px;}
	.aan .hoofd h3{ opacity:1; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; -webkit-transition-delay:0.1s; transition-delay:0.1s;}
	.aan .hoofd div{ opacity:0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
	.aan .hart .navi{ opacity:1; -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease;  }
	.aan .logo{ opacity:1; left:0;-webkit-transition: all 0.3s ease;transition: all 0.3s ease; }
	
	.kleur1{ background-color:#fff; position:fixed; left:0px; color:#b7b7b7; z-index:20; }
	
	
.hoofd{
	position:absolute;
	width:100%;
	height:140px;
	}



.tabel ul, .tabel li{ list-style:square; padding-left:15px; line-height:24px;}
.tabel li{ margin-bottom:7px;}



.hart{
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	overflow:auto;
	width:600px;/* Content Width */
	height:auto;/* Screenheight */
	padding:140px 20% 5px;
	display:block;
	text-align:left;
	display:table-cell;
	vertical-align:middle;
	
	}
	.kleur1 .hart{ overflow:hidden;}
	
	.navi a{
		font-family:"ProximaNovaA-Thin","Helvetica Neue", helvetica, Arial; text-decoration:none;color:#222;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;
		display: block;
}
	.navi a:hover, .navi a.actief {color:#E66464;}
	
	.navi { opacity:0;}

.voeten{
    height: 140px;
    line-height: 25px;
    margin: -140px auto;
    position: fixed;
    text-align: right;
    width: 120px;
    z-index: 21;
	top:100%;
	
}

.voet{
	position:fixed;
	width:120px; 
	left:0px;
	height:140px;
	}

.contact{line-height:20px;}

.wrapper{
	position:absolute; left:0;
	height:100%; width:2620px; display:block;
	z-index:10;
	}
	
.omhulsel{
	position:absolute; 
	float:left;
	left:120px;
	margin-left: 10px;
	height:auto; 
	width:auto; 
	display:block;
	z-index:10;
	background-color:#111;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}

	.omhulsel2{
	position:relative; 
	float:right;
	display: block;
	margin:0px;
	height:auto; 
	width:auto;
	display:block;
	z-index:10;
	background-color:#111;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
	
.tekst{width:80%; display:block; height:auto; position:relative; float:left; overflow:hidden; padding:60px 10%;}
.tekst2{width:84%; display:block; height:auto; position:relative; float:right; overflow:hidden; padding:60px 8%;}
.achtergrond{
	position:relative; float:left;
	background-color:#111;
    background-image: url("../img/koffie1.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto auto;
	display:block;
    height: 100%;
    width: 500px;
	background-size: cover;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
  }

  .achtergrondx{position:relative; float:left;
	background-color:#111;
    background-image: url("../img/koffie1.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto auto;
	display:block;
    height: 100%;
    width: 500px;
	background-size: cover;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
  
.achterrechts{position:fixed; right:0;}

.first{width:120px; position:relative; float:left; height:100%; display:block;}

.achtergrondx .bg{position:absolute; width:100%; height:100%; background-color:#000; opacity:0; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}

.achtergrondx:hover > .bg{opacity:0.7; -webkit-transition: all 0s ease; transition: all 0s ease;}
.achtergrondx:hover > h2 {opacity:1;-webkit-transition: all 0.3s ease;transition: all 0.3s ease; -webkit-transition-delay:0.3s; transition-delay:0.3s; cursor:pointer;}
.achtergrondx h2{color:#fff;position:absolute; padding:0px; margin:-16px 0px; top:50%; height:32px; font-size:32px;  line-height:32px; text-align:center; width:100%; opacity:0; -webkit-transition: all 0.8s ease; transition: all 0.8s ease; -webkit-transition-delay:0s; transition-delay:0s;}
#whh1{  background-image: url("../img/whh5.jpg");}
#whh2{  background-image: url("../img/whh23.jpg");}
#whh3{ background-image: url("../img/whh22.jpg"); }
#whh4{  background-image: url("../img/whh17.jpg");}
#whh5{  background-image: url("../img/whh9.jpg");}
#whh6{  background-image: url("../img/whh18.jpg");}
#whh7{  background-image: url("../img/whh11.jpg");}
#whh9{  background-image: url("../img/whh20.jpg");}
#all{ position: relative; float: right; height: auto;}
#all .piccas{position: relative; float: right; display: block; width: 100%; height: auto; background-color: #111;}
#all span{position: relative; float: right; width: 225px; height: 225px; display: block;}
#all span img{position: absolute; width: 100%; height: 100%;}
#all span h5{width: 100%; height: 20px; line-height: 20px; text-align: center; margin-top: 45%; }
#all span:hover img{opacity: 0.2;}
#all span:hover h5{z-index: 20;}

.vlies{display:block; width:100%; height:auto; }

.popup{position: fixed; width: 100%;  height: 100%; padding: 0; left: 0; display: block;  z-index: 900;}
.closer{position: fixed;width: 100%;  height: 100%; padding: 0; left: 0; display: block; background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.6);}
.schermpie{position: absolute; left:5%; width: 90%; background-color: #000; height: 100%; margin-top: 10px; display: block;}
.slidertje{position: relative; float: left; width: 100%; height: 100%; display: block;}

.achtergrond2{
	position: absolute;  
	width:100%; 
	height: 100%;  
	margin:0px; 
	background: url(../img/shoot/7.jpg) no-repeat center center;
	background-size: cover; 
	-webkit-transition: opacity 0.6s ease;
  	transition: opacity 0.6s ease;
  	opacity:0;
  	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  	filter: alpha(opacity=0);
  	z-index: 9;
}

.opaque{ 
  opacity:1;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=1);
  z-index:10;
  }


.contenti{
	position: absolute;
	width: 100%; height: 100%;
	z-index: 11;
}

.close{position: absolute; cursor: pointer;  right:0; padding: 0px 18px; line-height: 50px; height: 50px; color:#000; background-color: rgba(255, 255, 255, 0.8);}
.close:hover{background-color: rgba(0, 0, 0, 0.8); color:#E66464;}

.markerr{position: absolute; cursor: pointer; top:50%; margin-top: -35px; padding: 10px 20px; line-height: 50px; height: 50px; display: none;}
a.leftt, .leftt{left:0;}
a.rightt, .rightt	{ right:0;}
.markerr:hover > i{ color:#E66464; }

a.knopp{font-family: "font1","ProximaNovaT-Thin","Helvetica Neue",helvetica,Arial;position: absolute; cursor: pointer; z-index:10; bottom: 0; color:#fff; padding: 0px 18px; line-height: 41px; height: 42px; background-color: #E66464;}
a.knopp:hover{background-color: rgba(0, 0, 0, 0.7); color:#E66464;}

.vlakk{position: absolute; width: 360px; height: 100%; left:50%; margin-left:-180px; overflow: hidden; font-size: 17px; line-height: 26px;}
.vlakk h2{background-color: rgba(255, 255, 255, 0.8); padding: 0px 10%; width:80%; height: 50px; line-height:48px; text-align: center; color:#000; font-size: 24px;  }
.vlakk .tekstt {position: relative; width: 80%; height: 100%; color: #000; margin-top: 50px; padding: 11px 10%;background-color: rgba(255, 255, 255, 0.9);}

.vlakk h3 {
    color: #000;
    float: left;
    clear: both;
    font-size: 22px;
    line-height: 24px;
    opacity: 1;
    margin-top: 0;
    padding: 8px 0px 12px;
    position: relative;
    text-align: left;
    -webkit-transition: none;
    transition: none;
    width: 100%;
    cursor: pointer;
    z-index: 30;
}
.vlakk h3::after{content: "+"; position: relative; float: right; font-family:"ProximaNovaT-Thin","Helvetica Neue", helvetica, Arial; font-size: 17px; color:#E66464;} 
.go h3::after{content: "-";}
.vlakk h3:hover {color:#E66464;}
.vlakk li{ list-style: none; line-height: 26px;}
.vlakk li::before{color:#E66464; content: "•"; font-size: 30px; line-height: 26px; margin-right: 10px;}

.vlakk p{margin-bottom: 20px;}
.vlakk .klapp{opacity: 0; display: none;  -webkit-transition-delay:0.2s;  transition-delay:0.2s;
    -webkit-transition: opacity 0.5s ease ;
    transition: opacity 0.5s ease ;}
.vlakk p span{float: right;}




.go .klapp {
    display:block;
    opacity: 1;
    -webkit-transition-delay:0.2s;
    transition-delay:0.2s;
    -webkit-transition: opacity 0.5s ease ;
    transition: opacity 0.5s ease ;
}

.popup{display: none;}


.vergader{position: relative; float: left; margin-top:30px;  display: block; cursor: pointer; width: 98%;-webkit-transition: opacity 0.5s ease ;transition: opacity 0.5s ease ;}
.vergader:hover > img{opacity: 0.5;-webkit-transition: opacity 0.5s ease ;transition: opacity 0.5s ease ;}
.vergader:last-child{margin-right: 0;}
.vergader img{ display: block; width: 100%; height: 100%;}
.vergader h3{ display: block; position:absolute; width: 90%; font-size: 28px; top: 0; text-align:center; z-index: 10; padding: 0 5%; height: 50px; line-height: 50px; opacity: 1; -webkit-transition: none; transition:none; background-color: rgba(255, 255, 255, 0.7);}
.vergader .btnbekijk{ display: block; position:absolute; left:0; bottom: 0; z-index: 10; padding: 0 5%; font-family: "font1","ProximaNovaT-Thin","Helvetica Neue",helvetica,Arial; height: 38px; line-height: 36px; opacity: 1; -webkit-transition: none; transition:none; background-color: #E66464;}


.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

.touchscreen .achtergrondx h2 {
    color: #fff;
    font-size: 32px;
    height: 32px;
    line-height: 32px;
    margin: -16px 0;
    opacity: 1;
    padding: 0;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transition: all 0.8s ease 0s;
    transition: all 0.8s ease 0s;
    width: 100%;
}

.touchscreen .achtergrondx .bg{opacity:0.5; -webkit-transition: all 0s ease; transition: all 0s ease;}


.touchscreen.vierkant .wrapper{}

.mobielmenu{position: fixed; display: none; right: 0; top: 0; height: 70px; width: 70px; background-color: #fff; z-index: 999; background-image: url("../img/mobielmenu.jpg"); background-size: 70px 70px;}


.video .omhulsel{
	width: 100% !important;
	height: 100% !important;
}

.slides{
	background-color: #111;
}

.slides .omhulsel{
	width: 90% !important;
	height: 100% !important;
}

.slideshow {
	width: 80%;
	margin: auto;
	margin-bottom: 0 !important;
	height: 90vh;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.slideshow .slick-slide{
	
	background: #111;
}

.slick-slide img{
	height: 90vh;
	width: auto;
	margin: auto;
}

.slick-list{
	
}

.uppercase{text-transform: uppercase;}


	/* MEDIA QUERIES */

@media screen and (min-width: 1640px) {
	
	.achtergrond{width:1000px;}
	.achtergrondx{width: 700px;}
	.wrapper{width:3620px;}
	.achtergrond h2{ font-size:30px; }

	
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 800px;}
	.vierkant .wrapper{width:100%; height: auto; float: right; position: relative;}
		
}

@media screen and (max-width: 1640px) {
	.achtergrond{width:800px;}
	.achtergrondx{width: 600px;}
	.wrapper{width:3120px;}
	.achtergrond h2{ font-size:30px; }

	
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 600px;}
	.vierkant .wrapper{width:98%; height: auto; float: right; position: relative;}
}

@media screen and (max-width: 1440px) {
	.achtergrond{width:700px;}
	.achtergrondx{width: 500px;}
	.wrapper{width:2620px;}
	.achtergrond h2{ font-size:30px; }

	
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 540px;}
	.vierkant .wrapper{width:96%; height: auto; float: right; position: relative;}
}

@media screen and (max-width: 1190px) {
	.wrapper{	}
	.achtergrond{width:700px;}
	.achtergrond h2{ font-size:28px; }

	
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 480px;}
	.vierkant .wrapper{width:88%; height: auto; float: right; position: relative;}
}

@media screen and (max-width: 990px) {
	.achtergrond{width:362px;}
.kleur1 {display: block;}
.vierkant .kleur1 {display: block;}
	
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 420px;}
	.vierkant .wrapper{width:86%; height: auto; float: right; position: relative;}
}

@media screen and (max-width: 720px) {
	.achterrechts{display:none;}
	.mobielmenu{display: block;}
	.kleur1 {display: none;}
	.vierkant .kleur1 {display: none;}
	.first{display: none;}
	.uitz {left:0;}
	.wrapper {width: 2500px;}
	.tekst2 {
    padding: 60px 8%;
    width: 84%;
	}
	
	.omhulsel{
	left:0px;
	margin-left: 0px;
	}
	.vierkant .achtergrondx{width: 100%; float: right; clear: both; height: 380px;}
	.vierkant .wrapper{width:100%; height: auto; float: right; position: relative;}

	
	.slides .omhulsel{
		width: 100% !important;
	}
}



@media screen and (orientation:portrait) {
	.achterrechts{position:relative;float:right;}
	.arrowbalk{ display:none;}
}