@charset "utf-8";
@import url('pm-layout.css?v=19');
@import url('animations.css?v=1');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;500;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;500;600;700;800;900&display=swap');
 /*font-family: 'Poppins', sans-serif;
 font-family: 'Noto Serif', serif;
 */
 
/* ---------- standaard lettertype en kleur ---------- */

/*
=============
site colors
=============

*/

.layout {
	color: 		 #3E3D40;
    font-size: 23px;
    font-family: 'Montserrat', serif;
    line-height: 1.65em;
    font-weight: 500;
}

.layout.__bigger {
	font-size: 26px;
}


/* ---------- standaard lettertype en kleur ---------- */
.layout td, .layout th, .layout a{
	
	font-family: 'Montserrat', serif;
}

.layout h1,.layout h2,.layout h3,.layout h4,.layout h5,.layout h6 {	
	margin: 0 0 0 0;
	font-family: 'Montserrat', serif;
	font-weight:600;
}

.layout h1 { line-height: 1.35em; color:#3E3D40; font-size: 4.5em;}
.layout h2 { line-height: 1.25em; color:#3E3D40; font-size: 3em;font-weight:800; }
.layout h3 { line-height: 1.35em; color:#D36050; font-size: 2em;font-weight:bold; }
.layout h4 {line-height: 1.35em; color:#3E3D40; font-size: 2.2em;font-weight:800; }
.layout h5 {}
.layout h6 {}
.layout p  {}

.layout a {text-decoration: none;}



/* headerbar twisted */

#layer1{
	overflow-y: scroll;
	transition: filter 0.5s;
}
#blockArea{
	-webkit-transition: filter 0.3s;
	transition: filter 0.3s;
}
.layout #layer1::-webkit-scrollbar-thumb, .layout #blockArea::-webkit-scrollbar-thumb {
    background-color: #D36050;
    border-radius: 8px;
    border: 2px solid #F4F0E6;
}
.layout #layer1::-webkit-scrollbar-track, .layout #blockArea::-webkit-scrollbar-track {
    background-color: #F4F0E6;
    width: 15px;
}

#layout #layer1:before{
	content : '';
	opacity: 0;
	transition: opacity 0.5s;
	display:block;position: absolute;
	top: 0;right:0;left:0;
}
#layout #layer1:after{
	content : '';
	display:block;position: absolute;
	top: 0;right:0;left:0;
}
/*
==========
Header
==========
 */
 
#topbar {
	background-color: #ffffff;
	height: 6.8vw;
	position:fixed;
	transition: all 0.5s;
	width:100%;
}
#topbar > ._inner{
	height: 6.8vw;
	width:100%;
}
#topbar a.logo{
	height: 4.76vw;
    width: 7.5vw;
    background-repeat: no-repeat;
    display: block;
    background-position: left center;
    float: left;
	margin:1.1vw  1.1vw 1.1vw 2.08vw;
    background-size: 100% auto;
    background-image: url(../../images/moti55/logos/logo-menu.png);
    margin-right: 2vw;
}

#topbar a.menu-item{
	float: left;
	display: block;
	width: auto;
	font-weight: bold;
	padding-bottom: 1vw;
	position: relative;
	color: #35342F;
	transition: all 0.3s;
	height: 6.8vw;
	box-sizing: border-box;
	padding: 2.5vw 1vw 2.5vw 1vw;
	/* margin-top: -8px; */
	font-size: 1.1vw;
	border-left: 1px solid #e0dcd5;
	line-height: 2em;
}

.menu-item.__contact{
	border-right: 1px solid #e0dcd5;
}

#topbar a.bigger-text{
float: right;
display: block;
width: 3.56vw;
height: 2.56vw;
position: relative;
transition: all 0.3s;
margin-top: 2.7vw;
margin-right: 1vw;
background-repeat: no-repeat;
background-size: 100% auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='35' viewBox='0 0 59.6 35'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23000000;%7D%0A%3C/style%3E%3Cpath class='st0' d='M27.7 28.9H14.4L12 35H0L15.3 0h11.6l15.3 35H30L27.7 28.9zM24.4 20.4L21 11.6l-3.4 8.8H24.4z'/%3E%3Crect x='48.8' y='0.4' class='st0' width='4.4' height='17.2'/%3E%3Crect x='42.4' y='6.8' class='st0' width='17.2' height='4.4'/%3E%3C/svg%3E");
    
}


#topbar a.menu-item.__active,
#topbar a.menu-item:hover{
	background-color:#a3d5d8;
}


#layer1 {
	position: absolute;
	top:6.8vw;
}
.hero-image {
	position: absolute;
	top: 0;
	left: 0;
	background-color: #5b3a0e;
}
.heroText{
	max-width:840px;
	z-index:5;
	position: absolute;
}
.heroImage{
	background-position: center;
}
.pm-scale{
    transform-origin: left center;
    margin: 0 auto;
}






/*
==========
Formulier
==========
 */
.default_table input[type="submit"] {
	display: inline-block;
	padding: 15px 50px 15px 50px;
	box-sizing: border-box;
	font-size: 1.0em;
	margin: 20px 0 0 0;
	background-color: #000000;
	color: #ffffff;
	font-weight: 700;
}

.layout .default_table input[type="text"],
.layout .default_table input[type="email"],
.layout .default_table input[type="tel"],
.layout .default_table textarea{
	padding: 10px 10px 10px 10px;
    background-color: #E9E5DB;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    border-top:        solid 70px #ffffff;
    border-right:      solid 15px #ffffff;
    border-bottom:     solid 10px #ffffff;
    border-left:       solid 20px #ffffff;
    color:             #35342F;
}
.layout .default_table img {
	width: 24px;
	height: 24px;
}



/* formulier velden */
label.__labelTitel {
    display: block;
    position: relative;
    top: 60px;
    left: 17px;
    font-size: 20px;
    font-weight: 700;
/*    color: #445593; */
}
.__form-message {
    padding: 10px 10px 10px 10px;
    background-color:     #ffffff;
    box-sizing:           border-box;
    font-family:          'Montserrat', sans-serif;
    border-top:           solid 70px #35342F;
    border-right:         solid 20px #35342F;
    border-bottom:        solid 20px #35342F;
    border-left:          solid 20px #35342F;
}
/* formulier velden */



/* checkbox */
.question-title.inp-checkbox{
	    font-weight: 500;
}
.question-title.inp-checkbox .input{
	display: inline-block;
    height: 25px;
    margin: 5px 16px -2px 0px;
    width: 25px;
    background-size: 70% auto;
    background-repeat:no-repeat;
    background-position:center;
    margin-left:-25px;
    transition: all 0.3s;
    background-color:#FFF;
}

.question-title.inp-checkbox.__checked .input{
	background-image: url(/svg/moti55/ffffff/icon-gelukt.svg);
	background-color:#D36050;
}
.question-title.inp-checkbox.__checked{
	color:#D36050;
	font-weight:bold;
}
.question-title.inp-checkbox:before{
display:none!important;	
}
/* blockstyle */
.blockCoverWidth,
.blockCoverWidth > .fs{
	position: absolute;
    left: 0;
    right: 0;
    width: 100%!important;
    max-width: none;
}



body .pblock.reveal-img {
	overflow: hidden;
}
body .pblock.reveal-img.__rechts{
	
}

body .pblock.reveal-img img{width: 1024px!important; height: auto!important;}
body .pblock.reveal-img img{float:right;}
body .pblock.reveal-img.__rechts img{float:left;margin-left:-135px;}




/* split columns */
.split-columns{
	
}
.split-columns:after{
	content: '';
	clear: both;
	display: block;
}
	.split-columns .column-left,
	.split-columns .column-right
	{
		box-sizing: border-box;
		float:left;
		padding:10px;
	}
	.split-columns .column-left{
		width: 40%;
	}
	.split-columns .column-right{
		width: 60%;
	}


/* footer */
.footer_content{
	    background-color: #F2F1F0;
    color: #000;
    box-sizing: border-box;
    padding: 50px;
	font-size:0.8em;
	line-height:normal;
}

.footer_content > ._inner{
	max-width: 1680px;
	margin: 0 auto;
	padding-top:10px;
	
	}

.footer_content a{
	color: #000;
}

.footer_content ._logo{
	width:253px;
	height:94px;
	float:left;
	margin:20px;
	    margin-top: -6px;
	margin-right:50px;
	background-image: url('../../images/moti55/logos/logo-versvlavingskunde.png');
	background-repeat:no-repeat;
	background-size: 100% auto;
	
}
.footer_content ._text{
	float:left;
	max-width: 890px;
}
.footer_content ._statement{
	float:right;
	margin-top: 4em;
}

	
.pblock.__show-scroll.__black-scroll  ._button,
.pgroup.__show-scroll.__black-scroll ._button{
	background-image: url(../../images/moti55/svg/icon-arrow-scroll-black.svg);
}
.pblock.__show-scroll.__white-scroll ._button,
.pgroup.__show-scroll.__white-scroll ._button{
	background-image: url(../../images/moti55/svg/icon-arrow-scroll.svg);
}


/* feitfabel */
#liveFeitfabel{
	padding:20px;
	min-height:800px;
}
#liveFeitfabel ._pagDots{
	margin:20px 0;
}
#liveFeitfabel .live-text{
	padding-bottom: 50px;
	padding-top: 50px;
    clear: both;
}
#liveFeitfabel .nav-block{
	position: absolute;
	bottom: 20px;
	right: 20px;
}
.pm-section #liveFeitfabel .live-image-cnt{
	    padding-right: 35px;
    position: relative;
    padding-bottom: 20px;
    z-index: 0;
}
.pm-section #liveFeitfabel .live-image{
	z-index:1;position:relative;
}
.pm-section #liveFeitfabel .live-image-cnt:after{
	content:'';
	display:block;
	width:100px;height:455px;
	position: absolute;
	right:0;bottom:0;
}

	
/* fase test */
.fase-cnt{
	display:none;
}

.fase-cnt:first-child{
	display:block;
}

/* fase blok */
.fase-form .result-slide{
	display:none;
}
	.fase-block{
		background-size: 140px auto;
		background-position: 0 0;
		background-repeat: no-repeat;
	}
	
/**
Stipsets
**/

._pagDots{
	display:block;	
	height:20px;
}	
._pagDots ._dot{
	display:block;
	float:left;
	width: 20px;
	height: 20px;
	margin: 5px 10px;
	background-color: #0a0a0a;
	border-radius: 100%;
}	

._pagDots ._dot.__active{
background-color:#C86050;
}

#statsCnt ._pagDots{
	position: absolute;
	right: 75px;
	top: 0;
	margin: 15px;
}
#statsCnt .nav-block{
	position: absolute;
	right: 75px;
	bottom: 50px;
	margin: 15px;
}

#layout.__bigger .pgroup,
#layout.__bigger .pblock{
	height: auto;
}


/* landkaart */
#landkaart-container{
	position: relative;    margin: 60px 25px;
}
#landkaart-container > ._text{
	position: absolute;
	color:#B24E44;
	width:380px;
	height:270px;
	left: 0;
	top: 50px;
}
#landkaart-container #landkaart{
	background-image:url('../../images/moti55/graphics/graphic-map.svg');
	background-size:100% auto;
	background-repeat:no-repeat;
	width: 580px; height:690px;
	position: absolute;
	z-index: 2;
	right: 0;
}
#landkaart-container #landkaart ._prov{
	background-size:100% auto;
	background-repeat:no-repeat;
	width: 62px; height:77px;
	background-image:url('/resources/images/moti55/icons/icon-moti-map.svg');
	position: absolute;	
	transition: transform 0.3s;
	transform-origin: center bottom;
}
#landkaart-container #landkaart ._prov.__active,
#landkaart-container #landkaart ._prov:hover{
	transform: scale(1.3,1.3);
}
#landkaart-container #landkaart > ._positions{
	position: absolute;	
	margin-left:-35px;
}
#landkaart-container #landkaart ._prov.__groningen{
left: 525px; top: 0;
}
#landkaart-container #landkaart ._prov.__friesland{
left: 380px; top: 50px;
}
#landkaart-container #landkaart ._prov.__drenthe{
left: 500px; top: 120px;
}
#landkaart-container #landkaart ._prov.__overijssel{
left: 483px; top: 230px;
}
#landkaart-container #landkaart ._prov.__flevoland{
left: 340px; top: 190px;
}
#landkaart-container #landkaart ._prov.__gelderland{
left: 400px; top: 330px;
}
#landkaart-container #landkaart ._prov.__utrecht{
left: 275px; top: 290px;
}
#landkaart-container #landkaart ._prov.__noord-holland{
left: 216px; top: 188px;
}
#landkaart-container #landkaart ._prov.__zuid-holland{
left: 166px; top: 325px;
}
#landkaart-container #landkaart ._prov.__zeeland{
left: 107px; top: 410px;
}
#landkaart-container #landkaart ._prov.__noord-brabant{
left: 290px; top: 446px;
}
#landkaart-container #landkaart ._prov.__limburg{
left: 385px; top: 583px;
}

#con-show-organisatie table{
	width:100%;
}
#con-show-organisatie h3{
	font-size:1.25em;
}


.keuze-blok{
	opacity:0.75;
	transition:all 0.5s;
}
.keuze-blok.__toggle-active{
	opacity:1;
}


/* NOTIFICATIE APPJE */

.layout *.__required._error{
	border: 1px solid #D24E89!important;
}

#kc-cnt {
    position: absolute;
    left: 50%;
    margin-left:-35px;
    margin-top: -35px;
    top:50%;
    width:70px;height:70px;
    z-index: 20;
}
#notif-cnt {
    position: absolute;
    left: 0;
    right: 0;
    height: 18%;
    top: 82%!important;
    overflow: hidden;
    background-color: #000;
    z-index: 5
}

#notif-cnt .notif_row:after {
	content:'';
	display:block;
    position: absolute;
    width: 100px;
    height: 100px;
    top: 20px;    
    right:20px;
    background-repeat: no-repeat;
   	background-size:cover;
}
#notif-cnt .notif_row {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 100%;
   	background-size:cover;
}
#notif-cnt .notif_row.green_block{
	background-color:#6af091;
}
#notif-cnt .notif_row.info_block{
	background-color: #1edaff;
}

#notif-cnt .notif_row.red_block{
	background-color:#fd1b65;
}

#notif-cnt .notif_row .notif-icon_cnt {
    position: absolute;
    left: 4%;
    right: 70%;
    top: 10%;
    bottom: 5%
}

#notif-cnt .notif_row .notif-text_cnt {
    position: absolute;
    left: 4%;
    margin-left:100px;
    right: 5%;
    top: 23%;
    bottom: 5%;
    color: #FFF;
}
#notif-cnt .notif_row .notif-text_cnt h3{
    color: #FFF;
}
#notif-cnt .notif_row .notif-icon_cnt .nOk,
#notif-cnt .notif_row .notif-icon_cnt .nInfo,
#notif-cnt .notif_row .notif-icon_cnt .nNotOk
{
	background-repeat:no-repeat;
	display:block;
	height:110px;
	width:110px;
	background-size:100% auto;
    margin-left:-10px;
    margin-top:-10px;
	background-image: url('../../images/moti55/icons/icon-notif-ok.svg');
}
#notif-cnt .notif_row .notif-icon_cnt .nNotOk
{
	background-image: url('../../images/moti55/icons/icon-notif-notok.svg');
}
#notif-cnt .notif_row .notif-icon_cnt .nInfo
{
	background-image: url('../../images/moti55/icons/icon-notif-info.svg');
}


.layout #overLayer{
	background-color:#f2f2f261;
}

/* Saved popup */
.kc-saved{
	display: block;
	background:#D8E4E5;
	position: absolute;
	right:0;
	bottom:0;
	width:70px;
	height:70px;
	-webkit-transition: all 0.2s;
	transition: all 0.4s;
	transition-delay: 0.5s;
	-webkit-animation:fade-in 0.3s 1;-webkit-animation-fill-mode: forwards;animation:fade-in 0.3s 1 ;animation-fill-mode: forwards;
	-webkit-box-shadow: 0px 1px 10px 0px rgba(15, 15, 15, 0.25);box-shadow: 0px 1px 10px 0px rgba(15, 15, 15, 0.25);
	border-radius: 20px;
	border: 3px solid #FFF;
}
	.kc-saved:before{
		content:'';
		display:block;
		width:100%;
		height:100%;		
		position: absolute;
		background-repeat: no-repeat;
		-webkit-transition: background 0.1s;		
	transition-delay: 0.5s;
		transition: background 0.1s;		
		background-size:50%;
		background-position:center;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='' height='' viewBox='0 0 53.4 60.4'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Crect x='14' y='2' class='st0' width='8.3' height='13.6'/%3E%3Cpath class='st0' d='M44.8 9.5c0.3 1 0.4 2.1 0.4 3.1v6.6h-37V1.1c0-0.4 0.2-0.8 0.6-1.1H6.7C3 0 0 3 0 6.7v47c0 3.7 3 6.7 6.7 6.7h40c3.7 0 6.7-3 6.7-6.7V17.9L44.8 9.5zM39.7 46H13.5v-3.4h26.2V46zM39.7 36.1H13.5v-3.4h26.2V36.1z'/%3E%3C/svg%3E");
	}
	
	.kc-saved:after{
		content: 'Opgeslagen!'; 
		display: block;
		margin-top: 80px;
    	font-size:0.75em;
    	font-weight: bold;
    	text-align: center;
	}	



	.kc-saved.__ok{
		background-color: #98f679;       
background-size: cover;
		border-radius: 100%;
	}

	.kc-saved.__notok{
		border-radius: 100%;
	}
	.kc-saved.__notok:before{ 
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='' height='' viewBox='0 0 14.4 14.4'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M10.7 7.2l3-3c1-1 1-2.5 0-3.5 -1-1-2.5-1-3.5 0l-3 3 -3-3c-1-1-2.5-1-3.5 0 -1 1-1 2.5 0 3.5l3 3 -3 3c-1 1-1 2.5 0 3.5s2.5 1 3.5 0l3-3 3 3c1 1 2.5 1 3.5 0 1-1 1-2.5 0-3.5L10.7 7.2z'/%3E%3C/svg%3E");
	}
	
a.button-kies-bh {
    display: block;
    padding: 15px 50px 15px 25px;
    box-sizing: border-box;
    text-decoration: none;
    font-size: 1.2em;
    margin-top: 10px;
    font-weight: 700;
    text-align: center;
    background-color: #9bcdd0;
    color: #000000;
    /* margin-bottom: -10px; */
    font-family: 'Merriweather', serif;
}
.con-form{
	display:none;
}

._logo-vnw{	
	width: 336px;
}

.pm_flow .menu-flag{
	float: right;
	text-transform: uppercase;
	margin: 1.85vw 1vw 0 0.6vw;
	display: block;
	height: 3.57vw;
	background-color: #000;
	border-radius: 100%;
	padding-top: 0.6vw;
	text-align: center;
	font-size: 1.5vw;
	font-weight: 700;
	box-sizing: border-box;
	width: 3.57vw;
	color: #FFF;
	line-height: 1.7em;
}
#submenu-cnt .menu-flag{	
	margin: 54px 17px 0 10px;
	height: 49px;
	/* padding-left: 60px; */
	padding-top: 10px;
	background-position: left center;
	color: #FFF;
	width: auto;
	font-weight: bold;
	font-size: 0.8em;
	float: none;
	border-radius: 0;
}
#submenu-cnt .menu-flag:before{	
	content:'';	
}	



.pm_flow .menu-flag.__active{
	opacity: 1;
}
.pm_flow .menu-flag.__en:before{
	content:'EN';
}
.pm_flow .menu-flag.__nl:before{
	content:'NL';
}




#pc-form{
	display: none;
	position: absolute;
	right: 0;
	background-color: #fffffff0;
	width: 740px;
	box-sizing: border-box;
	top: 0;
	padding: 20px;
	bottom: 0;
	overflow: auto;
}
#pc-result{
	display: none;
	position: absolute;
	right: 0;
	background-color: #fffffff0;
	width: 740px;
	box-sizing: border-box;
	top: 0;
	padding: 20px;
	bottom: 0;
	font-size: 18px;
	overflow: auto;
}
#pc-search{
	border: 2px solid #CCC;
	font-size: 2em;
	margin-bottom: 50px;
}