@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Quicksand Regular'), local('Quicksand-Regular'), url(Quicksand.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Allerta Stencil Regular'), local('AllertaStencil-Regular'), url(Signerica_Medium.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

*{margin:0; padding:0; color:#777; font-family:'PT Sans',Sans-Serif;}
html{ font-size:15px; line-height:25px; overflow-x:hidden;}
a{text-decoration:none;}
.clear{width:100%; clear:both;}


::-moz-selection{ color: #fff; background:#000; }
::-webkit-selection{ color: #fff;	background:#000; }
::selection{ color: #fff;	background:#000; }

.middel{text-align:center;}

.meldknop{text-align:center; color:#4E4B4B; clear:both; border:#8E8E8E thin solid;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s; padding:10px 25px;-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;}
.meldknop:hover{background-color:#F1F1F1;}

#responsive_map { height: 350px; margin-top:50px; width: 100%;}
img[src*="iws3.png"] { display: none;}

#preloader {position:fixed;top:0;left:0;right:0;bottom:0; background-color:#fff; z-index:99999999999;}
.loadcontent {width:200px;height:200px;position:absolute;left:50%;top:50%;background-image:url(../img/status.gif);background-repeat:no-repeat;background-position:center;margin:-100px 0 0 -100px; text-align:center; color:#999;}
.laad, .lb-cancel{-webkit-animation: ladenanie 2.5s infinite; -moz-animation: ladenanie 2.5s infinite; -o-animation: ladenanie 2.5s infinite; animation: ladenanie 2.5s infinite;}


h1{text-align:center; font-size:14px; line-height:15px; font-family:'Work Sans',sans-serif; -webkit-transform: rotate(-10deg);-moz-transform: rotate(-10deg);-o-transform: rotate(-10deg);-ms-transform: rotate(-10deg);transform: rotate(-10deg);}

h2{ color:#353535; text-align:center; margin-top:50px; margin-bottom:45px;font-size:34px;}

canvas{display:block;vertical-align:bottom}
#particles-js{position:absolute;width:100%;height:100%; background-position:center top;text-shadow: 0px 0px 4px rgba(0,0,0,0.7); background-attachment:fixed; background-size:cover;}
#stats, .count-particles{display:none;visibility:hidden}

header{position:fixed;z-index:999;width:100%;height:100%; padding-top:50px;background:rgba(255,255,255,0.4);color:#fff;font-family:'PT Sans',sans-serif; z-index:9;-webkit-transition:all .7s ease;transition:all .7s ease}
header.sticky{height:60px;background:rgba(255,255,255,0.95); padding-top:10px; z-index:99;}
.logo{width:180px; position:fixed; top:15px;-webkit-transition: .7s;-moz-transition: .7;transition: .7s;}
.sticky .logo{width:100px; top:5px;}

.titelkop{top:35%; width:100%; height:100px;text-align:center; position:absolute; color:#FFFFFF; z-index:9;}
.slogan{width:100%; text-align:center;font-family:'Work Sans',sans-serif; font-weight:lighter; color:#FFFFFF; font-size:50px;}
.titelkop p{font-size:15px; color:#fff; letter-spacing:6.5px; margin-top:5px;}
.miniholder{margin:0 auto; width:400px; margin-top:30px;}
.leesmeer{padding:7px;  background-color:rgba(255,255,255,0.4);  float:left; width:170px; border:#FFFFFF solid 2px;text-transform:uppercase;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px; color:#fff !important;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.leesmeer:hover{background-color:#FFFFFF;text-shadow:none; color:#3c3c3b !important;}
.bestel{background-color:#FFFFFF; float:right; text-shadow:none; color:#3c3c3b !important;}
.bestel:hover{background-color:#3c3c3b; color:#FFFFFF !important;}
 
#gegevens{float:left; margin-top:-50px;}
#referenties, #vaardigheden, #ervaring{float:left; margin-top:-70px;}
.passfoto{width:35%; float: left; margin-top:35px; background-position:center; background-repeat:no-repeat; background-size:cover;-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);}

#nav {list-style: none; float:right;font-size:13px !important; margin-top:10px; }
#nav li {float: right; padding:0px 12px; text-transform:uppercase;}
#nav a {text-decoration:none; color:#262626; transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out; }
#nav a:hover {color:#4B4B4B;}
.container{position:absolute;top:100%; width:100%;background:#fff ;}
.containersub{position:absolute;top:30%; width:100%;background:#fff ; }

.form_label{width:100%; float:left;}
.form_input{width:98%; padding:10px; border:#FFFFFF 5px solid;font-family:'PT Sans',Sans-Serif; font-size:14px;}
.form_input:actif{width:98%; padding:10px; border:#FFFFFF 5px solid;}
#comments{height:150px;}

.form_btn{text-align:center; color:#4E4B4B; clear:both; border:#8E8E8E thin solid;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s; padding:10px 25px;-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; cursor:pointer; margin-top:25px;}
.form_btn:hover{background-color:#FFFFFF;text-shadow:none; color:#3c3c3b !important;}

.prijzen{float:left; margin:0 1%; padding:15px; background-color:#FFFFFF; width:28%;}

.foteritem{float:left; margin:0 1%; padding:15px; color:#fff; background-color:#4E4E4E; width:28%;}
.foteritem p{color:#fff;}
.foteritem h3{text-align:left;color:#FFFFFF;}

.copy{width:100%; background-color:#1B1B1B; padding:10px 0; color:#F8F8F8; font-size:9px; text-align:center;} 

.lijn{width:100%; margin-left:-15px; border-bottom:#C7C7C7 thin solid; padding-right:30px; margin-top:10px;}
.opsom{margin-top:15px; line-height:35px;}

.holder{width: 1170px; margin:0 auto;}
.koll{-webkit-column-count: 2;-moz-column-count: 2; column-count: 2;}
.itro{position:absolute;width:100%; height:100%; background-image: url("../afbeeldingen/achtergrond.jpg");background-attachment: fixed;background-size: cover;}
h1{font-size:36px; padding-bottom:50px;}

.module{float:left; width:20%; margin:5%; text-align:center;}
.module h3{text-align:center; font-weight:500;font-family:'Work Sans',sans-serif;}
.module img{width:30%;}

ul{list-style-type:none;margin:0;padding:0}
.nav{ width:1170px; margin:0 auto; margin-top:30px;}
.nav--active{-webkit-transform:translateY(0);transform:translateY(0)}
.nav__list{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}
.nav__item{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;position:relative;-webkit-transition:all .45s cubic-bezier(0.23,1,0.32,1);transition:all .45s cubic-bezier(0.23,1,0.32,1)}
.nav__item:hover{opacity:.75}
.nav__thumb{display:block;height:120px;-webkit-transition:all .45s cubic-bezier(0.23,1,0.32,1);transition:all .45s cubic-bezier(0.23,1,0.32,1)}
.nav__thumb:before{content:attr(data-letter);position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-size:70px;text-transform:uppercase;opacity:.15}
.nav__label{ width:80%; text-align:center; color:#1a1a1a;margin:0}

.section{will-change:transform;position:absolute;width:100%;top:0;left:0;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex; padding-top:80px; padding-bottom:80px;-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all .7s cubic-bezier(0.23,1,0.32,1);transition:all .7s cubic-bezier(0.23,1,0.32,1); }
.section--hidden{-webkit-transform:translateX(-100%);transform:translateX(-100%)}
.section--active{-webkit-transform:translateX(0) rotateY(0);transform:translateX(0) rotateY(0);z-index:2}
.section:before{content:attr(data-letter);position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-size:75vh;text-transform:uppercase;opacity:.15;z-index:-1}
.section__wrapper{width:100%;}
.section__title{margin:0 auto;font-size:24px;text-transform:uppercase;letter-spacing:4px}
.section p{margin:0 0 25px; color:#5A5A5A; font-weight:lighter; }
.section p:last-child{margin-bottom:0}

.modulbouw{margin-top:500px; padding-top:25px; height:80000px;}
.modulebutton{padding:7px 10px; border:#D5D5D5 thin solid; color:#000000; position:relative; top:10px; font-size:12px; letter-spacing:3px; text-transform:uppercase;font-family:'Work Sans',sans-serif;transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;}
.modulebutton:hover{border:#D5D5D5 thin solid; background-color:#C9C9C9;}

.footer{background-color:#4E4E4E; color:#FFFFFF; width:100%; padding:35px 0;}

.locatieimg{width:100%; height:200px; margin-top:70px; background-attachment:fixed; background-position:center; background-size:cover; }
.raster{background-image:url(../afbeeldingen/raster.png); width:100%; height:100%;}


.tumb{float:left;overflow:hidden !important;background-size:cover;background-position:center;width:28%;height:320px;background-color:#BBBBBB;margin:20px;cursor:pointer;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.thumbnoemer{width:100%;text-align:center;padding:20px 0;background:rgba(255,255,255,0.95);color:#151515;font-size:10px;text-transform:uppercase;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s; position:relative; z-index:9;}
.thumbnoemer h3{color:#151515; font-size:16px}

.masker{background-color:rgba(0,0,0,0); width:100%; height:320px; position:relative; z-index:9;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.tumb:hover >  .masker{height:230px; position:relative; z-index:9;background-color:rgba(0,0,0,0.5);}

.functieholder{clear:both; margin-top:50px; padding-bottom:50px; border-bottom:#E8E8E8 thin solid;}

.datumholder{ text-transform:uppercase; line-height:-1px !important; padding-top:14px;}
.datumholder h2{  margin-top:-5px; letter-spacing:-2px;}
.functielinks{width:200px;float:left;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.datlinks, .datrechts, .datmid{float:left; width:auto !important;}
.datmid{ padding-top:20px; color:#000000; font-weight:bold; margin:0 10px;}	
.datlinks, .datrechts{font-size:9px;}

.functierechts{ float:right; width:950px; border-left:#E8E8E8 thin solid; padding:15px 0 15px 15px;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.functierechts h1{ font-family:'PT Sans',Sans-Serif;color:#000000; font-size:30px; -webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg); margin-top:0px; text-transform:uppercase; text-align:left; padding-bottom:15px;-webkit-transition: 0.5s;-moz-transition: 0.5;transition: 0.5s;}
.functierechts h3{ text-transform:uppercase; color: #777; font-size:9px; font-weight:normal; letter-spacing:5px;}
.functierechts p{line-height:35px;}
.klein{font-size:14px; letter-spacing:1px; color:#ACACAC;-webkit-transform: rotate(-10deg);-moz-transform: rotate(-10deg);-o-transform: rotate(-10deg);-ms-transform: rotate(-10deg);transform: rotate(-10deg);}

@media screen and (max-width: 1170px) {
.holder, .nav { width:100%;}
.functierechts{width:70%;}
.functielinks{padding-left:15px;}
.functierechts h1{ line-height:50px;}
}
@media screen and (max-width: 980px) {
.prijzen, .foteritem { width:100%; margin:15px 0;}
.tumb{margin:10px;}
}
@media screen and (max-width: 870px) {
.koll{-webkit-column-count: 1;-moz-column-count: 1; column-count: 1;}
.functierechts{width:60%;}
}
@media screen and (max-width: 770px) {
.modulbouw{margin-top:600px;}
.functierechts{width:auto; padding-top:0;}
.tumb{height:150px;}
}
@media screen and (max-width: 500px) {
.modulbouw{margin-top:700px;}
.functierechts h1{ font-size:18px;}


}
@media screen and (max-width: 400px) {
.tumb{margin:5px; height:100px;}

}