/*
Theme Name: Das Lab
Author: Das Lab
Author URI: http://das-lab.com/
Version: 1.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html

*/


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,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}




@font-face {
  font-family: 'HKNova-Bold';
  src: url('font/HKNova-Bold.eot'); /* IE9 Compat Modes */
  src: url('font/HKNova-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/HKNova-Bold.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/HKNova-Bold.woff') format('woff'); /*, /* Pretty Modern Browsers */
}

@font-face {
  font-family: 'HKNova-Regular';
  src: url('font/HKNova-Regular.eot'); /* IE9 Compat Modes */
  src: url('font/HKNova-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/HKNova-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/HKNova-Regular.woff') format('woff'); /*, /* Pretty Modern Browsers */
}
@font-face {
  font-family: 'HKNova-LightNarrow';
  src: url('font/HKNova-LightNarrow.eot'); /* IE9 Compat Modes */
  src: url('font/HKNova-LightNarrow.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/HKNova-LightNarrow.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/HKNova-LightNarrow.woff') format('woff'); /*, /* Pretty Modern Browsers */
}



@font-face {
  font-family: 'Lickety Split';
  src: url('font/Lickety Split 2015.eot'); /* IE9 Compat Modes */
  src: url('font/Lickety Split 2015.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/Lickety Split 2015.woff') format('woff'), /* Modern Browsers */
       url('font/Lickety Split 2015.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('font/Lickety Split 2015.svg#d2a26f594776142a9e8ea24f2e86c6f9') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}

/* font-family: 'Lickety Split'; */


 .lickety {
	font-family: 'Lickety Split';
    transform: rotate(-12deg);
    display: inline-block;
	text-transform:capitalize;
	font-size:67px;
 }
 
 #flexibel_text_animatie {
	width:220px;
	height:120px;
	display: inline-block;
	position: absolute;
    top: 43px; 
 }
div {
	/*overflow: hidden;*/
}
	/*
	font-family: 'Titillium Web', sans-serif;
font-family: 'Oswald', sans-serif;*/	
body {
	font-family: 'Montserrat', sans-serif;
	font-family: 'Source Sans Pro', sans-serif;
	margin: 0px;
	font-size:16px;
	text-align:center;
	color:#5f727f;	
	line-height:140%;
}

html {
	background-color:#ededed;
	
}
html, body {
	height:100%	;	
	min-width:320px;
}
div {
	position:relative;
	line-height:140%;
}


.addmargin_fix_uitkit {
	/*margin-bottom: -40px;*/
	margin-bottom:30px;
}
.fullwidth-and-center {
	text-align: center;
	width:100%;
}
.fullwidth-and-right {
	text-align: right;
	width:100%;
}

.table {	display:table;	}
.table-cell {	display:table-cell;	}


a,
.button,
header li a,
.rollover-fade,
.btn-client-login {
	opacity:1;
	-o-transition:.15s;
	-ms-transition:.15s;
	-moz-transition:.15s;
	-webkit-transition:.15s;
	transition:.15s;  
}
 a:hover,
 .button:hover,
 header li a:hover,
 .rollover-fade:hover,
 .btn-client-login:hover  {
	opacity:0.65;
}
a.portfolio-a {
	transition:none;
	opacity:1;
}
a.portfolio-a:hover {
	transition:none;
	opacity:1;
}
.button {
	
	font-family: 'Oswald', sans-serif;
	font-weight:300;
	
	display:block;
    background-color: #d83f87;
    border: none;
    color: #ffffff;
    height: 34px;
	padding: 0 7px 0 7px;
	/*letter-spacing:3px;*/
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin-top: 12px;
    text-transform: uppercase;    

    cursor: pointer;
}
nav,
#followbar {
	transition:none
}

.width-center {
	position:relative;
	display:block;
	width:100%;	
	text-align:center;
}

/* responsive video's */ 
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* uit bug fix */

.uk-navbar-flip {
	margin-bottom: -2px;	
}

.uk-sticky-placeholder {
	display: none !important;	
}


h1, h2, h3, h4, h5, h6 {		
	font-family: 'Oswald', sans-serif;
	font-weight:500;
	color:#26293c;
	margin:0;
	text-transform:uppercase;
	/*font-weight:bold;	*/
	text-align: left;
	line-height: 100%;
}
strong {
	font-weight:bold;	
}

p {
	text-align:left;
	margin-bottom:20px;
}


h1 {	
	font-family: 'Titillium Web', sans-serif;
	font-weight:900;
	color:#a6a7ab;
	font-size:42px;
	/*letter-spacing: 2px;*/
	margin-bottom:53px;
	
	text-align: center;
}

/*contact-wraps"*/
h2 {
	
	line-height: 110%;
    font-size: 36px;
	font-weight:400;
	color:#26293c;
	margin-bottom:50px;
   /* letter-spacing: 2px;*/
}
h3 {	

	font-size:24px;
	text-transform:none;
	margin-bottom:20px;	
	/*padding: 15px 15px 0 15px;
	letter-spacing:3px;*/
}
.portfolio-items-text p {
	/*font-weight:400;
	font-size:15px;	*/
	text-align: left;
	/*padding: 0 15px 0 15px;*/
}

.h1-line {
	display:block;
	width:205px;
	height:1px;
	background-color:#5f727f;
	margin:0 auto;
	margin-top:50px;
	margin-bottom:50px;
}
.h2-line {
	display:block;
	width:100%;
	height:1px;
	/*background-color:#ffffff;	*/
	margin-top:11px;
	margin-bottom:20px;
	
	border-bottom:1px dashed #5f727f;
	width:75%;
}


a,
a:visited ,
a:active ,
a:hover {
	 color: #d83f87;
 }
 /*#info {
	color: #ffffff;
	position: absolute;
	top: 10px;
	width: 100%;
}*/ 
#pagina-wrap {
	overflow: hidden; 
} /* 
	width:100%;
	display:block;
	position:relative;
	z-index:1;
}*/

header {
	position:absolute;
	width:100%;
	text-align:right;	
	min-height: 80px;
	/*padding-bottom:21px;
	padding-top:30px;*/
	z-index:1;
	    max-width: 1750px;
    /* margin: 0 auto; */
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
	z-index: 99;
	display: none;
}/*
header a.header-iconlinks {
	display:inline-block;
	margin-left: 7px;
    margin-top: 0px;	   
}*/

/*

header .header-social-links {
	position: absolute;
	right: 33px;
	top: 10px;
}*/
header .menu-mobile {
    background-color: #d83f87;
	/*background-color: #fc0;
	opacity: 0.6;*/
	    height: 207px;
    width: 103px;
}
header.uk-sticky-fixed  .menu-mobile {
	
	height: 72px;
    width: 72px;
}
.menu-mobile button {  /* in gebruik  */
background-color: transparent;
    border: transparent;
	transform: scale(0.6);
}
.menu-mobile button:focus {
outline: 0;
}
/*
header .menu-mobile .header-social-links {
	position:relative;
	width:100%;
	text-align:center;
	right: 0;
    margin-top: 15px;
}
header .menu-mobile a.header-iconlinks {
	display:inline-block;
	margin-left: 8px;
	margin-right: 8px;   
}
header.uk-sticky-fixed	.header-social-links {
	top: 0px;
	top: 5px;
}
*/
/*header #logo-color { display:none; 
    transform: rotate(90deg);}*/
/*header #logo-white { display:block;	}
.logo-hitzone {
	transform: rotate(270deg);
}*/
/* 
header.uk-sticky-fixed #logo-white { display:none; }
header.uk-sticky-fixed #logo-color { display:block;	}*/


/*background-color: #fff;*/

header.uk-sticky-fixed .top-logo {
	/*top: -9px;
	top: 11px;*/
	
    
	/**width:143px;/
	
}
header nav {
	/*margin-top: 30px;
	max-width:1080px;
	
	margin:0 auto;
	width:100%;*/
	/*padding: 0 33px 0 33px;*/
}
/*object {
	position:absolute;	
	left:0;
	top:0;
}*/
header ul {
	margin-right:33px;
	margin-top:42px;
}

header li a { text-decoration:none !important;  }
header li {
	display : inline-block;	
	font-family: 'Montserrat', sans-serif; 
	margin-left:70px;
	font-size:16px;
	color:#fff;
	text-transform:uppercase;
	font-weight:700;
	cursor:pointer; 
	    vertical-align: middle;
}


/*header li a {
	font-family: 'Montserrat', sans-serif; 
	font-size:14px;
	color:#fff;
	/*letter-spacing:2px;*/
/*}*/
/*
header li a:link ,*/

header li a,
header li a:hover,
header li a:visited,
header li a:active  {	
	color:#fff ;
	text-shadow: 0px 1px 5px rgba(0, 0, 0, 0.35); 
}
header .menu-mobile a,
header .menu-mobile a:hover,
header .menu-mobile a:visited,
header .menu-mobile a:active  {	
	color:#d83f87 ;
	text-shadow:none; 
}

/*
header svg, header object {
	/*webkit-filter: drop-shadow( 0px 0px 3px #9A1 );
    filter: drop-shadow( 0px 0px 3px #999 );*/
/*}*/
/*
header.uk-sticky-fixed svg, header.uk-sticky-fixed object, header .menu-mobile svg , header .menu-mobile object {
	webkit-filter:none;
    filter:none;
}*/

header.uk-sticky-fixed {
	/*background-color:#fff;		
	border-bottom:1px solid #f0f3f2;*/
	left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
header.uk-sticky-fixed ul {
    /* margin-top: 24px;
	 margin-top: 29px;*/
}
	
	
	
header.uk-sticky-fixed li, 
header.uk-sticky-fixed  li a:hover,
header.uk-sticky-fixed  li a:visited,
header.uk-sticky-fixed  li a:active,
header.uk-sticky-fixed  li a {	
	color:#d83f87;	
	text-shadow:none; 
}

header.uk-sticky-fixed  .menu-mobile .nav-icon span {
	background: #fff;
	-webkit-box-shadow:none;
	-moz-box-shadow: none;
	box-shadow: none;
}






#top-logo-wrap {
	
	z-index: 100;
}
#top-logo-wrap a.logo-hitzone {
	position: absolute;
    top: 100px;
    left: -27px;
    width: 180px;
    z-index: 2;
    transform: rotate(270deg);
}
#logo-svg {
	
}
						 
            
         


.menu-mobile li { 
	display:block;
	margin-left:0;
	color:#d83f87;
	/*margin-top: 4px;*/
	
}


header .uk-icon-button {
	width: 22px;
    height: 22px;
    border-radius: 3px;
	padding:0;
	
}

header .menu-mobile  ul {
   margin-right: 0; 
   margin-top: 0; 
}

.uk-nav>li>a.uk-icon-button { padding:0; }
/*
.uk-icon, .uk-icon svg , footer svg, .uk-icon:before .uk-icon a { 
	color:#020000 ;	
}*/

/*.uk-icon-bullhorn:before {  
  color: #FF0000;  
}
header button { margin-right: 20px; }*/



/**** MENU ICON ****/
/* Icon 1 */

header button {
	/*background-color:none !important;	
	background-color:transparent;
	border:hidden;
	transform:scale(0.45);
	outline: none;*/
}

.nav-icon {
  width: 60px;
  height: 45px;
  position: relative;
  /*margin: 50px auto;*/
 /* -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;*/
  cursor: pointer;
  /*margin-right:-60px;*/
  margin-right: 0px;
  margin-top: 20px;

   margin-right: 30px;
   margin-top: 163px;
}

header.uk-sticky-fixed .nav-icon {
	
  margin-right: 0px;
  margin-top: 20px;
}

.nav-icon span {
  display: block;
  position: absolute;
  height: 7px;
  width: 100%;
  background: #fff;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
 /* 
  -webkit-box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.75);*/
}



.nav-icon span:nth-child(1) {
  top: 0px;
}

.nav-icon span:nth-child(2) {
  top: 18px;
}

.nav-icon span:nth-child(3) {
  top: 36px;
}

.nav-icon.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.nav-icon.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.nav-icon.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}













/**** FOOTER *******/
/*
.vignette-inset {
  position: relative;
  height: 400px;
  display: block;
  background-image: url('../images/posts/css-effects/3/atx-rooftop.jpg');
  background-size: cover;
}*/

#map:after {
  content: '';
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  background: radial-gradient(circle, transparent 50%, black 150%);
}

/* removing shadow on hover
for demonstration purposes */
#map:hover:after {
/*  background: none;*/
}

#footer-content-wrap {
	position: absolute;
   /** background-color: #fff;*/
    z-index: 2;
    padding: 50px;
	padding-bottom: 33px;
    left: 13%;
    text-align: left;
	max-width:420px;
	width: 100%;
	box-sizing: border-box;
}
#footer-content-wrap { /* new styles */
	font-family: "HKNova-Narrow", "Source Sans Pro", sans-serif;
	text-transform:uppercase;
	font-size:13px;	
    padding: 40px;
	max-width: 460px;
	line-height: 140%;
}
#footer-content-wrap h2 {
	font-family: "HKNova-Narrow", "Source Sans Pro", sans-serif;
	font-weight:bold;
	font-size:16px !important;
}


#footer-content-wrap h1 {	
	margin-bottom:12px;
}
#footer-content-wrap address {
	margin-bottom:13px;	
	line-height: 170%;
}
footer {
	/*margin-top:116px;*/
	box-sizing: border-box;
}
#footer-content-wrap h1 { text-align: left; }

#footer-content-wrap a.footer-links svg {
    position: absolute;
    left: 50px;
    /* top: 0px; */
    margin-top: -8px;
}




	
#footer-content-wrap h2 {
	margin-top:30px;
	font-size:17px;
}
#footer-content-wrap  .footer-title {		
	margin-bottom:4px;
	display:block;
}

#footer-content-wrap a.footer-links {
	display:block;	
	display: inline-block;
	background-position: left 5px;
	background-repeat:no-repeat;	
	/*padding-left: 27px;*/
	margin-bottom:5px;
	width: fit-content;
}
#footer-content-wrap a:last-child { margin-bottom:0px; }

#footer-content-wrap a.footer-iconlinks {
	display:inline-block;
	margin-right:15px;
	margin-top:27px;	   
}


#footer-content-wrap .icon-vervangers {
	display:inline-block;
	width:60px;
	color:#d83f87;
}





/*  copy paste  ***/

footer a.footer-links svg {
    position: absolute;
    left: 0px;
    /* top: 0px; */
    margin-top: -10px;
}
	

footer a.footer-links {
	display:block;	
	display: inline-block;
	background-position: left 5px;
	background-repeat:no-repeat;	
	padding-left: 27px;
	margin-bottom:5px;
	width: fit-content;
	position: relative;
	color:#d83f87;
}
footer a.footer-links:hover {
	/*opacity:1 !important;	
	color:#fff;*/
	text-decoration:none;
}

/* *****/



.contact-h1 {
	
		MARGIN-TOP:70px;
	position: absolute;
	z-index:2;
	color:#fff;
}

#lokatie-wrap {
	margin-right:550px;
	    width: 320px;
}
    #contactgegevens-wrap {
		max-width: 500px;
		}
		
		
		
.contact-wraps {
	MARGIN-TOP:70px;
	position: absolute;
	right:20px;
			background-color: #fff;
	z-index: 2;
	padding: 50px;
	/*	padding-bottom: 33px;
	left: 13%;
	text-align: left;
	max-width:420px;
	width: 100%;*/
	box-sizing: border-box; 
	text-align:left
}

.contact-wraps h2 {	
	margin-bottom:25px;
}
	
	
#map {
	height: 800px;
	width: 100%;
}


/*
.button-up-fixed { 
	cursor:pointer; 
	background-color: #33cccc; color:#fff; 

	 
	position:fixed; 
	border-radius:initial; 
	width: 36px;   
	height: 36px; 

	right:-30px; 
	bottom:20px; 
	opacity:0
}
.button-up-fixed span { 	
	margin-top: -3px;
    margin-left: -1px;	
}
*/


/************************************************  HOME  ************/
/************************************************  HOME  ************/
/************************************************  HOME  ************/

#slider {
	/*background-image: url(images/header.jpg);
	background-position: center top;
	background-size: cover;	*/
	width:100%;
	height:100%;
	max-width: 1750px;
    margin: 0 auto;
	/*height:100vh;*/
	/*top: -1000px;
	opacity:0;*/
}
  .header-images-wrap {   
     height: 80vh;
    width: 100%;
    display: block;
    position: relative;
    
    }
	 .header-images-wrap img {
		 width:100%;
		 height:auto;
	 }

#start-logo-wrap {
	position:fixed;
	display:block;
	width:100%;
	height:100vh;
	z-index: 99;
	background-color:#ededed;
}
#start-logo {
	position:absolute;
	  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);	
}
#slider .slider-pijlen {
	height:50px;	
	width:50px;	
	text-align:center;
	color:#ffffff;
	    margin: 0;
	line-height:50px;
	background-color:#d83f87;
	opacity:0.85;
	/*display:block;
	position:absolute;
	top: 50%;
    transform: translateY(-50%);
	left:0;
	cursor:pointer;*/
}
#slider #slider-pijl-rechts { right:0; left:auto; }



#page-home #showreel-text h2 {
    cursor: pointer;
}
/*
.footer-logo {
	position: relative;
	width: 226px;
	height: auto; /* 31 */
/*}*/
#slider #scroller-wrap {
	position:absolute;
	/*right: 135px;*/
    width: 300px;
  /*  bottom: 60px;	*/
	text-align:left;
	font-family: 'Oswald', sans-serif;
    font-weight: 500;
	font-size:23px;
	text-transform:uppercase;
	color: #fff;
	z-index: 2;
	
	    right: 45px;
    bottom: 55px;
	/*cursor:pointer;*/
}
#klanten-section li {
	display: table-cell;
            height: 100px;
            list-style-type: none;
           
}

.binnekort {
	position:absolute;
	/*top:177px;*/
	left:25px;
	z-index:2;	
	width:420px;
	width: 260px;
	/* top: 227px;*/
    left: 45px;	
	bottom: 96px;
}
.binnekort h1 {	
	text-align:left;
	color:#fff;
}
#scroller-wrap .down-pijltjes-wrap {
	width: 70px;
}
 #scroller-wrap .down-pijltjes {
	transform: rotate(90deg); 
	width: fit-content;
	margin-top: 9px;
	position: relative;
    display: block;
    top: 10px;
    left: -26px;
	text-align: center;
 }
  #scroller-wrap .down-pijltjes span {
	margin-left: 13px; 
	text-shadow: 2px 2px 8px rgba(0,0,0,0.37);
  }
 #scroller-wrap .down-pijltjes #pijl1 {
 }
 
 
 
 
 
 @keyframes flickerAnimation {
  0%   { opacity:1; }
  50%  { opacity:0.3; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0.3; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0.3; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0.3; }
  100% { opacity:1; }
}
.animate-flicker,
#scroller-wrap .down-pijltjes #pijl1,
#scroller-wrap .down-pijltjes #pijl2,
#scroller-wrap .down-pijltjes #pijl3 {
   -webkit-animation: flickerAnimation 1s infinite;
   -moz-animation: flickerAnimation 1s infinite;
   -o-animation: flickerAnimation 1s infinite;
    animation: flickerAnimation 1s infinite;
}
#scroller-wrap .down-pijltjes #pijl2 {
	animation-delay: 0.33s;
}
#scroller-wrap .down-pijltjes #pijl3 {
	animation-delay: 0.66s;
}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

 .portfolio-background-grey  {
	 
	background-color:#ededed;
 	background-image: url(images/daslab_portfolio_topgradient.jpg);
	background-position: top left;
	background-repeat:repeat-x;

}
.portfolio-bottom-gradient {
 	background-image: url(images/daslab_portfolio_bottomgradient.jpg);
	background-position: top left;
	background-repeat:repeat-x;
	width:100%;
	height:163px;
	position:absolute;
	
	
	position: absolute;
    bottom: 0;
    
}
 
 

#klanten-section li img {
	
	/*height: 100px;*/
	position: relative;
	top: 50%;
	transform: translateY(-50%);
    margin-right: 100px;
    margin-left: 20px;
}
#klanten-section li {
height: 291px;
}

.watwedoen-blocktable {
	
	max-width:870px;
	position:relative;
}
.watwedoen-blocktable  tr {

	

	
}
.watwedoen-blocktable td {
	width:33%;
	height:165px;
	color:#a6a7ab;
  	text-transform:uppercase;
  
	font-family: 'Oswald', sans-serif;
	font-weight:500;
	
	border:2px solid #ededed;
	vertical-align: middle;
}
.background-grey {
    background-color:#ededed;
    width:100%;
}

.watwedoen-blocktable  .watwedoen-block div {
/*	 position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);	
  color:#a6a7ab;
  text-transform:uppercase;
  
	font-family: 'Oswald', sans-serif;
	font-weight:500;*/
}

.watwedoen-blocktable {}
.watwedoen-block{
	/*padding:30px;
	border:2px solid #ededed;*/
}
	


#page-home .slider-info {
  
	
	/*padding-right:40px;*/
}
/*
#page-home .slider-info .date {
	background-color:rgba(255,255,255,0.8);
	padding:2px 17px 2px 17px;
	color:#2686b8;
	font-weight:700;
	width: fit-content;
	font-size: 18px;
	
	box-sizing:border-box;
	
}
#page-home .slider-info .titel {
	background-color:rgba(64,142,192,0.8);
	padding:2px 17px 2px 17px;
	color:#ffffff;
	font-size: 28px;
	width:100%;	
	font-family: 'Montserrat', sans-serif; 
	
	box-sizing:border-box;
	
}
#page-home .slider-info .content {
	background-color:rgba(255,255,255,0.8);
	padding:2px 17px 2px 17px;
	color:#2686b8;
	font-size: 18px;
	width:100%;
	
	box-sizing:border-box;
	
}
titel-deel1 titel-deel2 project-titel project-subtitel slider-btn  */
#page-home #slider .project-info {
	  position: absolute;
    top: 43%;
    right: 130px;
	/*width:100%;
    max-width: 450px;*/
	text-align:left;
	overflow:visible;
	box-sizing:border-box;	
}

#page-home #slider .slide-info {
	position: absolute;
    top: 27%;
    left: 68%;
    /* max-width: 450px; */
    text-align: left;
    width: 100%;
    overflow: visible;
    box-sizing: border-box;
    z-index: 2;
}

#page-home #slider .titel-deel1  {
	font-family: 'Titillium Web', sans-serif;
	font-weight:900;
	color:#fff;
	font-size:67px;
}
#page-home #slider .titel-deel2-wrap  .titel-deel2  { /* yep  */
	color:#0cb8ff;
	font-family: 'Lickety Split';
    transform: rotate(-15deg);
    display: inline-block;
    font-size: 67px;
    position: absolute;
    top: -42px;
    /*top: 0;
	width:300px;
	text-align:center*/

}
#page-home #slider .project-titel  { 
	text-transform: uppercase;
	color:#0cb8ff;
	font-family: 'Oswald', sans-serif;
	font-weight:500;
	font-size:36px;
}
#page-home #slider .project-subtitel  { 
	color:#fff;
	font-size:16px;
	font-family: 'HKNova-LightNarrow';
}
#page-home #slider .slider-btn {
	    float: right;	
}


#page-home #showreel-wrap {
	 position: absolute;
     top: -125px;;
    left: 30px;
	/*display:none;*/
	z-index: 4	;
}
#page-home #showreel-text {
	   width: 780px;
   /* height: 275px;*/
    position: absolute;
    right: 40px;
    padding: 45px 0 200px 150px;
    background-color: #fff;
    box-sizing: border-box;
    /* display: none; */
    text-align: left;
	top:-30px;
    margin: 0 auto;
    z-index: 2;
   /* width: 500px;*/
	width:780px;
	
	
}

#page-home #showreel-text h2 {
	text-align:left
}
#page-home #showreel-text h2,  #page-home #showreel-text  p {
	
	    text-align: left;
}
#page-home #intro-wrap   {
	width:1255px;
	/*height:442px;*/
	min-height:389px;
	background-color:#631e96;
  	background-image: url(images/intro_bg.jpg);
	background-position: center center;
	/*bottom:-33px;
	right:-135px;*/
	color:#fff;

	
	max-width: 1255px;
    width: 100%;
    
 
    /*bottom: -33px;
    right: -135px;*/
    color: #fff;
    padding: 90px 130px  50px 490px;
    box-sizing: border-box;
    position: absolute;
	
	top: 235px ;
	right: -110px;
	
	z-index: 3;
 }
 #page-home #intro-wrap h2 {
	 
	color:#fff;
	display:block;
 }
   

 



#whatwedid {
	margin-top: 78px;
}






#whatwedo h1, #whoweare h1 {
	text-align:left;
}
#whatwedo, #whoweare { 
	/*min-height:650px; */
	padding:75px;
	text-align:left;
	margin-top: 0;	
}
#whoweare p {
	margin-bottom:20px;	
}
#whatwedo p, #whoweare p { 
	text-align:left;
}

.section-center-and-limit {
	max-width:1750px;
	margin: 0 auto;	
}
#whoweare {
	
	
}

#klanten-section {
	/*margin-bottom:120px;	*/
}
#watwedoen-section {	
	padding-top:120px;
	padding-bottom: 116px;
	padding-top:60px;
	padding-bottom: 66px;
/*	background-color:#fff;*/
}
#klanten-section .klanten-scroller-wrap {
	background-color:#40177c;
  background-image: url(images/client_bg.jpg);
	background-position: center center;
	/*background-repeat:no-repeat;*/
	height:291px;
}
    
    
	
	


#whoweare::after {
  content: "";
  background-image: url(images/logo-icon-white.svg);
	background-position: center bottom;
	background-repeat:no-repeat;
	background-size: 52%;

  opacity: 0.1;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}
.portfolio-items {
	background-size: cover;	
	width:100%; /* 416  283  (234) 281
	height:283px;
	
	padding-top: 56.25%;*/
}
.portfolio-items-wrap {
    margin-top: 30px;
	overflow:hidden;
}
.portfolio-background {
	opacity:0;
	width:100%;
	/*height:283px;*/
	background-color: rgba(128, 73, 170, 0.6);/* 8049aa */
	position:relative;
	padding-top: 56.25%;
	
	padding-top: 56.25%;
	padding-top: 66%;
	/*text-align:center;
	display: flex;
  flex-direction: column;
  justify-content: center;*/
}


.portfolio-items-wrap button {

	/*position: relative;
	top: 50%;
	transform: translateY(-50%);
	margin:0;
	opacity:1 !important;*/
	opacity:0;
	    position: absolute;
    top: 60%;
    /* margin: 0; */
   /* opacity: 1 !important;*/
    margin: 0 auto;
    left: 50%;
    transform: translate(-50%, -50%) ;/* translateX(-50%);*/
}
.portfolio-items-wrap button.touchdevice {
	opacity:1 !important;
	background-color: transparent;
	border: 1px solid #fff;
	top: 50%;
	text-shadow: 0px 0px 4px rgba(150, 150, 150, 1);
	
	-webkit-box-shadow: 0px 0px 33px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 0px 33px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 33px 0px rgba(0,0,0,0.25);

}
.portfolio-background button:hover {
	
	/*opacity:1 !important;*/
}

.uk-icon-button, .uk-icon-button:focus, .uk-icon-button:hover {
    background-color: #fff;
    color: #020000 !important;
    outline: 0;
}
.team-item .uk-icon-button, .team-item .uk-icon-button:focus, .team-item .uk-icon-button:hover {
	color:#fff !important;
}



/************************************************  PROJECT DETAILPAGE  ************/
/************************************************  PROJECT DETAILPAGE  ************/
/************************************************  PROJECT DETAILPAGE  ************/

#project-info-section {
	max-width: 1750px;
	margin: 0 auto;
	padding-top:140px;
}

#page-project #portfolio-section {
	background:none;
	
}
	
#project-info h2 {
	font-family: "HKNova-Regular", "Source Sans Pro", sans-serif;
	text-transform:uppercase;
	color:#5c5c5c;
	font-size:24px;
}
.breadcrumbs {
	font-family: 'Oswald', sans-serif;
	color:#5c5c5c;
	font-weight: 300;
	text-transform:uppercase;
	font-size:18px;
	/*margin-bottom:70px;*/
	margin-bottom:20px;
	display: block;
}
#topimage {
	background-image: url(images/header.jpg);
	background-position: center center;
	background-size: cover;	
	width:100%;
	max-width: 1750px;
    margin: 0 auto;
	height:800px;
}

#topimage .titel-wrap {
    top: 50%;
    transform: translateY(-50%);
	padding-left:110px;
}
#topimage h1 {
	font-family: 'Oswald', sans-serif;
	font-weight:500;
	text-transform:uppercase;  
	color: #fff;
	text-align: left;
	margin-bottom: 15px;
    font-size: 50px;	
	text-shadow: 0px 1px 5px rgb(0 0 0 / 20%);
}

#topimage h4 {    
	color: #fff;
    font-size: 22px;
    font-family: 'HKNova-LightNarrow';
	text-transform:none;
	text-shadow: 0px 1px 5px rgb(0 0 0 / 20%);
	}
#project-media img,
#project-media video {
	margin-bottom:47px;
}
#project-media video {
	max-width:960px; 
	width: 100%;
}
#project-info,
#project-info h1 {
	text-align:left;
}
page-project h1 {
	font-size: 32px;	
}

#project-info h2 {
	margin-bottom:15px;	
	    margin-bottom: 12px;
}
#project-info p {
	margin-bottom:35px;	
}
#project-info div {
	/*padding-left:81px;*/	
	
}

#project-grid {
	max-width:1920px;
	margin:0 auto;
	margin-top:78px; 
	position:relative;
	display:block;
}
#project-info button {
	/*width:147px;
	height:50px;*/	
}

.anchor_pos {
	display: block;
    width: 5px;
    height: 5px;
    background-color: #d83f87;	
	border:1px solid #333;/**/
	
	cursor:default;
    top: -125px;
	
	width: 1px;
    height: 1px;

    position: absolute;	
	margin-left:4px;
    padding: 0;
	
	opacity:0;
}


 
 
 #header-vlakken {
    margin-top:14px;
	position:relative; 
	background-color:#ededed; 
	height:540px;
	z-index: 2;
}
.bg-header-img {
	background-image:url(images/large_bg.jpg); 
	background-size:cover;    
	height: 90vh;
	background-position: center;
	
}


	.playknop-hitzone {
		/*width: 100%;
		position: relative;
		margin: 0;
		padding: 0;
		height:80vh;
		transform-style: preserve-3d;*/
		
	    top: 0;
		width: 100%;
		position: absolute;
		margin: 0;
		padding: 0;
		height: 100%;
		transform-style: preserve-3d;
	
	}
	.playknop-wrap {
		width: 300px;
		height: 300px;
		position: absolute;
		padding:50px;
		text-align: center;
		box-sizing: border-box;			
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		transform-style: preserve-3d;
		cursor:pointer;
	
	}
	.playknop-wrap img {		
		position: absolute;
		width:150px;
		top:75px;
		left:75px;
		transform: translateZ(30px);
		/*transform: scale(1);*/
		transition: all .4s cubic-bezier(.1,.7,.3,1);
	}
	
	#logo-svg-playknop { transform: translateZ(-50px);	opacity:0.85; }
	
	#logo-svg-playknop.translatez-class1 { 
		transform: scale(1.1)  translateZ(30px)  !important; 
		
	 }	
	.translatez-class2 { 
		transform: translateZ(30px) !important; 
		opacity:1 !important;	
	}

.hide-me-for-uikit-animation {
	opacity:0;
}








#close-btn-vimeo {
	color:#fff;	
	right:40px;
	top:40px;
	position:absolute;
	cursor:pointer;
	z-index:55;
}
#close-btn-vimeo:hover {
	opacity:0.6;	
}
.embed-container { 
	padding-left:20px;
	padding-right:20px;
	position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; 

    /*   top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);*/
	} 

.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.showreel-container-tempsite {
	position:fixed;
	top:0;
	left:0;
	width:100%;	
	height:100vh;
	background-color:#000;
	z-index:20;
	display:none;
	
}
 
#footer-content-wrap a.footer-iconlinks span {
		position:relative;	
	}

h1, h2, h3, p, header li, #slider .slider-pijlen , #page-home .slider-info, #page-home .slider-info *, #footer-content-wrap a.footer-iconlinks span, #page-home #slider .titel-deel1, #page-home #slider .titel-deel2-wrap .titel-deel2 , .binnekort h1, #slider #scroller-wrap, #close-btn-vimeo, #page-home #slider .slide-info, #page-home #showreel-text   {  
  -moz-transition: all .4s cubic-bezier(.1,.7,.3,1);
  -webkit-transition: all .4s cubic-bezier(.1,.7,.3,1);
  -o-transition: all .4s cubic-bezier(.1,.7,.3,1);
  -ms-transition: all .4s cubic-bezier(.1,.7,.3,1);
  transition: all .4s cubic-bezier(.1,.7,.3,1);
}

.rechterkolom { padding-right:75px; }
.linkerkolom { padding-left:75px; }

/************** CUBES **************/
	#whatwedo .scene {
			/*width: 200px;
			height: 200px;
			/*border: 1px solid #CCC;*/
			margin: 80px;
			perspective: 220px;
		    
			margin: 0;
			display: inline-block;
		}
		
		#whatwedo .cube {
		/*  width: 200px;
		  height: 200px;*/
		  position: relative;
		  transform-style: preserve-3d;
		  transform: translateZ(-100px);
		  transition: transform 1s;
		}
		
		.cube__face {
			position: absolute;
			/*width: 200px;
			height: 200px;
			/* border: 2px solid black;*/
			/*line-height: 200px;*/
			/*font-size: 18px;
			font-weight: bold;*/
			color: white;
			text-align: center;
			font-family: 'Oswald', sans-serif;
			text-transform:uppercase;
		}
		
	/*	.cube.show-front  { transform: translateZ(-100px) rotateY(   0deg); }
		.cube.show-right  { transform: translateZ(-100px) rotateY( -90deg); }
		.cube.show-back   { transform: translateZ(-100px) rotateY(-180deg); }
		.cube.show-left   { transform: translateZ(-100px) rotateY(  90deg); }
		.cube.show-top    { transform: translateZ(-100px) rotateX( -90deg); }
		.cube.show-bottom { transform: translateZ(-100px) rotateX(  90deg); }
		
	
		
		
		
		.cube__face--front  { transform: rotateY(  0deg) translateZ(100px); }
		.cube__face--right  { transform: rotateY( 90deg) translateZ(100px); }
		.cube__face--back   { transform: rotateY(180deg) translateZ(100px); }
		.cube__face--left   { transform: rotateY(-90deg) translateZ(100px); }
		.cube__face--top    { transform: rotateX( 90deg) translateZ(100px); }
		.cube__face--bottom { transform: rotateX(-90deg) translateZ(100px); }*/
		
		
		
		label { margin-right: 10px; }
		
		.cube_white { background-color:#ffffff; color:#a6a7ab; /*border:5px solid #ededed;*/ }
		.cube_pink { background-color:#d83f87;  background-color:rgba(216,63,135,1);} 
		.cube_purple { background-color:#654389;  background-color:rgba(101,67,137,1);} 
		.cube_lightpurple { background-color:#b27ed7;  background-color:rgba(178,126,215,1);} 
		.cube_blue { background-color:#069cda;  background-color:rgba(6,156,218,1);} 
		.cube_yellow {  background-color:#ffc333;  background-color:rgba(255,195,51,1);} 
		.cube_green {  background-color:#65bd77; /* background-color:rgba(255,195,51,1);*/} 
		
		.cube-wraps {
			display:block;	
			background-color: #ededed;
			/*width: 620px;*/
			padding: 5px;
			padding-bottom: 0px;
			padding-right: 0px;
			transform: scaleY(0.7);
		}
		.cube__face span {
			
			display:block;
			transform: scaleY(1.5);
		}
		
		.cube, .scene, .cube__face, .cube-wraps {
			transition: transform 1s;
			
			margin: 0;
    		/*padding: 0;*/
		}
		.cube-wraps {
			margin: 0 auto;
		}


/*  Ukit
s : 640px
m : 960px
l : 1200px
xl : 1600 px */
 .hide-fourth-item-ad-m  { display:block }
 .contact-h1, .contact-h1:after, .contact-h1:before {
    
		width: 360px;
 }
 
 #grid-6177 .tg-grid-preloader-inner>div {
    background: #654389 !important;
}

#portfolio-section {
	background-color: #fff;	
	padding-top:135px;
	/*top:-33px;*/
	margin-top: 50px;
    position: relative;
	
	background: rgb(255,255,255);

background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(237,237,237,1) 25%, rgba(237,237,237,1) 75%, rgba(255,255,255,1) 100%);
	background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(237,237,237,1) 25%, rgba(237,237,237,1) 75%, rgba(255,255,255,0) 100%);
	
	/*background: rgb(219,10,10);
background: linear-gradient(180deg, rgba(219,10,10,1) 0%, rgba(0,241,255,1) 25%, rgba(0,249,255,1) 75%, rgba(0,255,8,1) 100%);*/
	padding-bottom: 85px;
	
}
 #page-home #showreel-wrap-mobile {
	display:none; 
	z-index: 3; 
	width:100%;
	max-width:800px;
	margin: 0 auto;
 }
 
 
 
 
 
 
 
 
 /************************************************/


/*.hide-portfolioitem {
	display:none;
}*/




 	/*.justified-gallery {
   		padding-bottom: 30px;
		overflow: visible;
	}*/
	 .portfolio-sections .portfolio-tilt:hover {
		/*position: absolute;
		visibility: hidden;
		top: 3%;
		left: 5%;
		width: 90%;
		height: 90%;
		transition: all 0.3s ease-out;*/
		box-shadow: 0 8px 10px rgba(14,21,47,.4);
		z-index:9
	}
	
	.portfolio-item {
		position: absolute;
		/*transition: all 1.2s cubic-bezier(.1,.7,.3,1);*/
		z-index:1;
		opacity:1;
	}
	#portfolio-gallery {
		transition: all 1.2s cubic-bezier(.1,.7,.3,1);

	}
	.portfolio-hide {
		z-index:-1 ;
		opacity:0;
		top:0 !important;
		left:0 !important;
	}
	.tilt-innner-info {
		/*-webkit-transform: translateZ(150px) translateY(-50%) translateX(-50%);
		transform: translateZ(50px) translateY(-50%) translateX(-50%);
		position: absolute;
		top: 50%;
		left: 50%;*/
		/*width: 50px;
		height: 50px;*/
		
		/* -webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform: perspective(300px);
		transform: perspective(300px);*/
		
	   /* background-color: white;
		box-shadow: 0 0 50px 0 rgba(51, 51, 51, 0.3);*/
	}
	
	.portfolio-tilt:hover h2 {
		opacity:1;	
		transition: all 1.0s cubic-bezier(.1,.7,.3,1);
		transform: translateZ(120px) translateY(-50%) translateX(-50%);position: absolute;top: 50%;left: 50%;
		font-size: 36px;
	
	}
	.portfolio-tilt h2 {
		font-size: 26px;
		 transition: all 1.0s cubic-bezier(.1,.7,.3,1);
		opacity:0;	
		color:#fff ;
		transform: translateZ(0) translateY(-50%) translateX(-50%);position: absolute;top: 50%;left: 50%;
		padding-bottom: 110px;
	}

	 
	
	.tilt-innner-info h2 {
		/*color:#fff !important;*/
		
		
		
		/* -webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform: perspective(300px);
		transform: perspective(300px);*/
	}
	.portfolio-tilt {
		/*display:none !important;*/
		
	   /* -webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform: perspective(300px);
		transform: perspective(300px);*/
		transform-style: preserve-3d;
		width: 100%;
	   /* height: 150px;
		display: block;
	
	
		box-shadow: 0 3px 47px rgba(0, 0, 0, 0.2);*/
	   /* -webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform: perspective(300px);
		transform: perspective(300px);*/
		
		/*display: none !important;*/
	}
	.portfolio-tilt.entry-visible {
		/*display: inline-block !important;*/
	}
	.catagorie-blokjes-wrap {
		left:10px;
		bottom:130px;
		bottom:120px;
		position:absolute;
	}
	.portfolio-tilt .catagorie-blokjes {
		padding:5px 10px;
		background-color:#d83f87;
		color:#fff;
		
		font-family: 'Oswald', sans-serif;
		font-weight:300;
		font-size:14px;	
		display:inline-block;
		margin-right:6px;
		text-transform:uppercase;
		
		transform: translateZ(0px);
	}
		  .portfolio-tilt:hover	 .catagorie-blokjes-wrap {
		 transform: translateZ(40px);
			  transition: all 1.0s cubic-bezier(.1,.7,.3,1);
			   

	 }
		 
	.overflow-kader {
		/*overflow:hidden;	*/
		
		width: 100%;
   		/* border: 5px solid #fff;*/
   		height: 100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
		position: absolute;
    	top: 0;
		
	}

	.portfolio-tilt:hover  .overflow-kader {
		filter: grayscale(1.0);
	}

	/*.justified-gallery > a, .justified-gallery > div, .justified-gallery > figure {
    	overflow:visible !important;	
	}*/
		 .portfolio-img-hidden {
			opacity:0 !important;	 
		 
		 }
		 .portfolio-overlay {
			 background-color:#631e96; /*  631e96  0.65  */
			 width:100%;
			 height:100%;
			 position: absolute;
			 top:0;
			 left:0;
			 opacity:0;
			  transition: all 1.0s cubic-bezier(.1,.7,.3,1);
			 
		 }
		 .portfolio-tilt:hover .portfolio-overlay  {opacity:0.65;}
		 .portfolio-infoblock {
			 background-color:#fff; /*  631e96  0.65  */
			 width: 100%;
			 height:120px;
			 height:110px;
			 padding:25px 15px;position: absolute;
			 bottom:0;
			 box-sizing: border-box;
			 
			  transition: all 1.0s cubic-bezier(.1,.7,.3,1);
		 }
		 .portfolio-tilt:hover .portfolio-infoblock  {background-color:#8049aa;} 
		 
		 .portfolio-infoblock h3 { /*5c5c5c*/
			color:#5c5c5c;
			font-family: "HKNova-Narrow", "Source Sans Pro", sans-serif;
			text-transform:uppercase;
			font-size:22px;
			 
			  transition: all 1.0s cubic-bezier(.1,.7,.3,1);
			 
		 }
		
		 
		 .portfolio-infoblock p {color:#a6a7ab; 
			  transition: all 1.0s cubic-bezier(.1,.7,.3,1);}  /*a6a7ab*/
		 
		 .portfolio-tilt:hover .portfolio-infoblock p, .portfolio-tilt:hover .portfolio-infoblock h3 {color:#fff;} 
		
	/* add transform: scale(1.1)  translateZ(30px)  by text  */ 



/********************************************/
 
 
 
 
 
 
 /***** PROJECT PAGE *****/
 
 #project-info-section {
	background-color:#fff;
 }
 
 
 
 
 
 
 

@media (max-width: 1842px) { /*1764px*/
	#ourwork {
		padding-right: 78px;
		padding-left: 78px;
	}

	#whatwedid {
		margin-right: 78px;
		margin-left: 78px;
	}
	
	#page-home #intro-wrap {
 	   left: auto;
    	margin: 0 auto;
	}
	.contact-h1, .contact-h1:after, .contact-h1:before {
    	padding-left: 25px;
		
	}
	
}
@media (max-width: 1700px) { 
	/*#page-home #intro-wrap {
	    padding:80px 175px  40px 640px;
	}*/
	#page-home #showreel-wrap {
	    width: 800px;
	}
}
@media (max-width: 1700px) { 
	#page-home #intro-wrap {
	  /*  padding:80px 175px  40px 640px;*/
	}
}
@media (max-width: 1542px) { 
	#page-home #showreel-text {
		right: -130px;
    	padding: 45px 200px 200px 150px;
	
	}
}

@media (max-width: 1422px) { 
	header li {
		margin-left: 30px;
	}
	
	
		#page-home #slider .titel-deel1 {
		font-size: 47px;
	}
	#page-home #slider .titel-deel2-wrap .titel-deel2 {
		font-size: 47px;
		top: -22px;
	}

	#page-home #intro-wrap {
		top: 305px;
		
	}
	
	 #page-home #showreel-text {
   		right: -240px;
		padding: 45px 285px 200px 150px;
	 }
}

@media (max-width: 1300px) { 
.contact-wraps {
    	margin-top: 138px;
	 }
	 
	 #page-home #intro-wrap {
		 padding: 90px 130px 50px 490px;
		 right: 0px;
	 }
	
}
@media (max-width: 1240px) {
	/*.btn-client-login {
		margin-top: 20px;
	}*/
	#page-home #showreel-text {
		    right:auto ;
	}
	
	/*header .logo-hitzone, header.uk-sticky-fixed .logo-hitzone { 
		top: 25px;
		top: 15px;
	}*/
	/*.hide-fourth-item-ad-m { display:none }*/
	
	/*header.uk-sticky-fixed .top-logo {
   	 	top: -1px;
	}*/
	
	
	.binnekort {		
		width: 280px;
		width: 160px;
	}
	.binnekort h1 {
		font-size: 28px;	
	}
	#slider #scroller-wrap {
   		right: 25px;
		font-size: 21px;
	}
	
	 #page-home #intro-wrap {
		width: 100%; 
		padding: 170px 30% 110px 50px;
		position: relative;
		top: -100px;
		z-index: -1;
	 }
	#header-vlakken {
		height: auto;	
		height: 1060px;
		/*background: #fff;*/
	}
	 #page-home #showreel-wrap {
		/*position: relative;
		top: auto;
		left: auto;
		margin: 0 auto;*/
		display:none;
	 }
	  #page-home #showreel-wrap-mobile {
		display:block;  
	  }
	 #page-home #showreel-text {
		position: relative;
		width: 100%;
		height:auto;
		padding: 45px;
	 }
	 #portfolio-section {
		margin-top:0;
		/*top: -140px;*/
		
	 }
	 #flexibel_text_animatie {
 	    top: 116px;
	 }	 
	 
	  #page-home #intro-wrap {	
		
		background-position: top center !important;
   		 background-size: cover !important;
	 }
	 
	 
	  #header-vlakken {
		margin-top:0; 
	 }
	 #page-home #showreel-text {
		 top:-18px;
		 right:auto;
	 }
	 
	 
}

	
@media (max-width: 1120px) {
	/*header .top-logo {
    	margin-left: 20px;
	}*/
	#page-home #slider .slide-info {  
    	left: 60%
	}
	
}

@media (max-width: 1080px) {
	.rechterkolom { padding-right:30px; }
	.linkerkolom { padding-left:30px; }
	
}
@media (max-width: 960px) {	
	.hide-fourth-item-ad-m  { display:block }
	
	.contact-wraps {
		width: 100%;
		position: relative;
		right: auto;
		margin-top:0;
	}	
	#lokatie-wrap {
		width: 100%;
		padding-bottom: 0;	
	}
	#contactgegevens-wrap {
		max-width:none;
	}
	
	 #page-home #intro-wrap {
	
		/*top: auto;*/
	 }
	 
	
	#whatwedo {
		padding:0;
		/*padding-top:55px;*/
	}
	#whoweare {
		margin-top: 80px;
	}
	
	
	
	 
}
@media (max-width: 810px) {
	#page-home .slider-info  {
		padding:0 20px 0 20px;	
		left:auto;
	}
	
	
	#header-vlakken {	
		background: #fff;
		background: #fcfcfc;
	}
	
	
	#page-home #slider .titel-deel1 {
		font-size: 37px;
	}
	#page-home #slider .titel-deel2-wrap .titel-deel2 {
		font-size: 37px;
		top: -10px;
	}
	.binnekort {
		width:280px;
	}
	.binnekort h1 {
		font-size: 28px;	
	}
	#slider #scroller-wrap {
   		right: 100px;
		font-size: 17px;
	}
	
}




@media (max-width: 640px) {
	
	#map {
    	height: 600px;
	}
	
	.bg-header-img, .playknop-hitzone {
	   
		height: 80vh;
	}
	
	 footer {
    	/*margin-top: 256px;*/
	 }
	
	.rechterkolom { padding-right:0px; }
	.linkerkolom { padding-left:0px; }
	

	header {
	    padding-bottom: 0px;
	}


	#footer-content-wrap {
    	position: relative;
	}
	

	#footer-content-wrap {
		left:auto;
    	text-align: center;
	}
	#footer-content-wrap a {
  		margin: 0 auto;	
    	margin-bottom: 20px;
	}
	#footer-content-wrap h1, #footer-content-wrap h2 {
		text-align:center;
	}

	#footer-content-wrap a.footer-iconlinks {
		margin: 0 8px 0 8px;
		margin-top: 27px;
	}
	
	
	
	
	#page-home #slider .titel-deel1 {
		font-size: 27px;
	}
	#page-home #slider .titel-deel2-wrap .titel-deel2 {
		font-size: 27px;
		top: -4px;
	}
	.binnekort {
		width:190px;
	}
	.binnekort h1 {
		font-size: 18px;	
	}
	.binnekort {		   
		left: 15px;
		/* bottom: 96px;*/			  
		bottom: -40px;
		bottom:20px;
	}
	#slider #scroller-wrap {
   		display:none;
	}
	#logo-svg {
    	top: 55px;
    	width: 100px;
	}



	
	 
	 #contactgegevens-wrap .table-cell {
		display: table-cell;
		display: block;
		padding-left: 0 !important;
	 }
	 .ricardo-cell {
		padding-top:30px; 
	 }
	
	 
	 #page-home #intro-wrap h2 {
     	line-height: 150%; 
	
	 }
	 
	 #page-home #slider .slide-info {
  		top: 30px;
    	left: 50%
	}
	
	
	#watwedoen-section {
		padding-bottom: 0px;	
	}
	#whatwedo .cube-kolom {
		padding-right: 30px;
   		padding-left: 10px;	
	}

}


@media (max-width: 570px) {
	.lickety_bottom {
			margin-top: 20px;
	}
}



@media (max-width: 460px) {

	#flexibel_text_animatie {
		left: 58px;
   		top: 183px;
	}
	#page-home #intro-wrap h2 {
	    margin-bottom: 80px;
	}
	
	#whoweare {   
		padding: 75px 25px;
	}
	#header-vlakken {	
		height: auto;
	}
	#portfolio-section {
    	margin-top: -100px;
	}
	
	#whatwedo {
   		padding-top: 55px;
	}

}

/*


@media (max-width: 400px) {
	/*#project-info div {
   	 	padding-left: 25px;
   		padding-right: 25px;
	}
	footer {
		margin-top:396px;
	}
}
*/


.video-viewport {
    position: absolute;
    top: 0;
    overflow: hidden;
    z-index: -1; /* for accessing the video by click */
	    z-index: 0;
	
}
.video-viewport video {
	max-width:none;
	object-fit: cover;
}
	



/* Gliching   */


.glitch_simple {
 /* color: white;
  /*font-size: 100px;
  position: relative;
  width: 400px;
  margin: 0 auto;
  
  display: block;
    width: 100%;*/
}
@keyframes noise-anim {
  0% { clip: rect(65px, 9999px, 29px, 0); }
  5% { clip: rect(53px, 9999px, 82px, 0); }
  10% { clip: rect(87px, 9999px, 65px, 0); }
  15% { clip: rect(26px, 9999px, 38px, 0); }
  20% { clip: rect(12px, 9999px, 37px, 0); }
  25% { clip: rect(4px, 9999px, 42px, 0); }
  30% { clip: rect(5px, 9999px, 51px, 0); }
  35% { clip: rect(23px, 9999px, 7px, 0); }
  40% { clip: rect(8px, 9999px, 64px, 0); }
  45% { clip: rect(38px, 9999px, 85px, 0); }
  50% { clip: rect(32px, 9999px, 57px, 0); }
  55% { clip: rect(69px, 9999px, 34px, 0); }
  60% { clip: rect(8px, 9999px, 33px, 0); }
  65% { clip: rect(96px, 9999px, 25px, 0); }
  70% { clip: rect(20px, 9999px, 25px, 0); }
  75% { clip: rect(70px, 9999px, 16px, 0); }
  80% { clip: rect(39px, 9999px, 33px, 0); }
  85% { clip: rect(36px, 9999px, 65px, 0); }
  90% { clip: rect(84px, 9999px, 38px, 0); }
  95% { clip: rect(30px, 9999px, 43px, 0); }
  100% { clip: rect(91px, 9999px, 51px, 0); }
}
.glitch_simple:after {
  content: attr(data-text);
  position: absolute;
  left: 2px;
  text-shadow: -1px 0 red;
  top: 0;
  color: white;
  /*background: black;*/
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  animation: noise-anim 2s infinite linear alternate-reverse;
}
@keyframes noise-anim-2 {
  0% {  clip: rect(65px, 9999px, 69px, 0); }
  5% {  clip: rect(44px, 9999px, 77px, 0); }
  10% {  clip: rect(96px, 9999px, 24px, 0); }
  15% {  clip: rect(54px, 9999px, 79px, 0); }
  20% {  clip: rect(66px, 9999px, 75px, 0); }
  25% {  clip: rect(4px, 9999px, 61px, 0); }
  30% {  clip: rect(41px, 9999px, 73px, 0); }
  35% {  clip: rect(22px, 9999px, 62px, 0); }
  40% {  clip: rect(11px, 9999px, 14px, 0); }
  45% {  clip: rect(63px, 9999px, 81px, 0); }
  50% {  clip: rect(23px, 9999px, 97px, 0); }
  55% {  clip: rect(75px, 9999px, 89px, 0); }
  60% {  clip: rect(98px, 9999px, 19px, 0); }
  65% {  clip: rect(90px, 9999px, 71px, 0); }
  70% {  clip: rect(60px, 9999px, 18px, 0); }
  75% {  clip: rect(18px, 9999px, 4px, 0); }
  80% {  clip: rect(16px, 9999px, 14px, 0); }
  85% {  clip: rect(96px, 9999px, 25px, 0); }
  90% {  clip: rect(44px, 9999px, 59px, 0); }
  95% {  clip: rect(42px, 9999px, 70px, 0); }
  100% {  clip: rect(18px, 9999px, 12px, 0); }
}
.glitch_simple:before {
  content: attr(data-text);
  position: absolute;
  left: -2px;
  text-shadow: 1px 0 blue;
  top: 0;
  color: white;
  /*background: black;*/
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  animation: noise-anim-2 3s infinite linear alternate-reverse;
}














/*
http://www.onlinetutorialsweb.com/pure-css-glitch-animation-effects-glitch-effect-images-tutorial/
<div class="box">
    <h1>Transparent Text Effects</h1>
</div>




body
{
	margin: 0;
	padding: 0;
}
section
{
	position: relative;
	width: 100%;
	height: 100vh;
	background: url(bg.jpg);
}
section:before
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(bg.jpg);
	opacity: .5;
	mix-blend-mode: hard-light;
}
section:hover:before
{
	animation: animate .2s linear infinite;
}
@keyframes animate
{
	0%
	{
		background-position: 0 0;
		filter: hue-rotate(0deg);
	}
	10%
	{
		background-position: 5px 0;
	}
	20%
	{
		background-position: -5px 0;
	}
	30%
	{
		background-position: 15px 0;
	}
	40%
	{
		background-position: -5px 0;
	}
	50%
	{
		background-position: -25px 0;
	}
	60%
	{
		background-position: -50px 0;
	}
	70%
	{
		background-position: 0 -20px;
	}
	80%
	{
		background-position: -60px -20px;
	}
	81%
	{
		background-position: 0 0;
	}
	100%
	{
		background-position: 0 0;
		filter: hue-rotate(360deg);
	}
}















				.dasMenu-wrap { 
				
					    z-index: 999;
				  -webkit-font-smoothing: antialiased;
				  -webkit-font-kerning: normal;
				  -webkit-text-size-adjust: 100%;
				  
				  
					height: 430px;
					display: block;
					top: 0;
  					left: 0;
					
					 width: 100vw;
				  height: 100vh;
					
					
					 background: linear-gradient(45deg, #02001F, #1F1B4E);
				  -webkit-transform-style: preserve-3d;
						  transform-style: preserve-3d;
				  -webkit-transform: perspective(60rem);
						  transform: perspective(60rem);
				  position: fixed;
				  display: flex;
				  align-items: center;
				  justify-content: center;
				}
				
				.dasMenu-wrap  .Menu-list {
				  font-size: 4.25rem;
				  line-height: 1.2;
				  text-transform: uppercase;
				  text-align: center;
				  display: flex;
				  flex-direction: column;
				  align-items: center;
				  -webkit-transform: rotateX(-10deg) rotateY(20deg);
						  transform: rotateX(-10deg) rotateY(20deg);
				}
				
				.dasMenu-wrap  .Menu-list-item {
				  position: relative;
				  color: transparent;
				  cursor: pointer;
				}
				.dasMenu-wrap  .Menu-list-item::before {
				  content: '';
				  display: block;
				  position: absolute;
				  top: 49%;
				  left: -10%;
				  right: -10%;
				  height: 4px;
				  border-radius: 4px;
				  margin-top: -2px;
				  background: #FF2C75;
				  -webkit-transform: scale(0);
						  transform: scale(0);
				  transition: -webkit-transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
				  transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
				  transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98), -webkit-transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
				  z-index: 1;
				}
				
				.dasMenu-wrap  .Mask {
				  display: block;
				  position: absolute;
				  overflow: hidden;
				  color: #FF2C75;
				  top: 0;
				  height: 49%;
				  transition: all 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
				}
				.dasMenu-wrap  .Mask span {
				  display: block;
				}
				
				.dasMenu-wrap  .Mask + .Mask {
				  top: 48.9%;
				  height: 51.1%;
				}
				.dasMenu-wrap  .Mask + .Mask span {
				  -webkit-transform: translateY(-49%);
						  transform: translateY(-49%);
				}
				
				.dasMenu-wrap  .Menu-list-item:hover .Mask,
				.dasMenu-wrap  .Menu-list-item:active .Mask {
				  color: #FFF;
				  -webkit-transform: skewX(12deg) translateX(5px);
						  transform: skewX(12deg) translateX(5px);
				}
				.dasMenu-wrap  .Menu-list-item:hover .Mask + .Mask,
				.dasMenu-wrap  .Menu-list-item:active .Mask + .Mask {
				  -webkit-transform: skewX(12deg) translateX(-5px);
						  transform: skewX(12deg) translateX(-5px);
				}
				.dasMenu-wrap  .Menu-list-item:hover::before,
				.dasMenu-wrap  .Menu-list-item:active::before {
				  -webkit-transform: scale(1);
						  transform: scale(1);
				}
				
				#dasMenu-desktop { 
					width: 100%;
					height: 100%;
					display: block;
					position: relative;
					height:260px;
				}
             	#dasMenu-mobile { display:none; }
				
				.menu-mobile .uk-dropdown {
				
					z-index: 1020;
					box-sizing: border-box;
					min-width: 200px;
					min-height: 200px;
					padding: 0px;
				}
				#dasMenu-desktop .Menu-inside {
					top: 50%;
    				transform: translateY(-50%) ;
				}
				#dasMenu-desktop.dasMenu-wrap .Menu-list-item {
    				font-size: 30px;
					margin-top: 16px;
				}

*/



















