body{
	font-family: 'Hind', sans-serif;
	margin: 0;
	padding: 0;
	background-color: #efefef;
}


img{max-width: 100%;}
img a, a img, img {border: none!important}
a{text-decoration: none;}

li{list-style-type: none;}

p{margin: 1.12em 0 }

/*
	blue	color: #4a505c	rgba(74, 80, 92, 1)
	
	green	color: #388c38	rgba(5, 124, 5, 1)
	
	purple	color: #800080 rgba(128, 0, 128, 1)
	
	grey	color: #717071 rgba(113, 112, 113, 1)
*/


#pagina{
	max-width: 1200px;
	margin: 0 auto;
	background-color: #fff;
	overflow: hidden;
}


#maxw{
	max-width: 1070px;
	margin: 0 auto;
	background-color: #fff;
}


#mobile-menu .sub-menu {
	position: relative;
	display: block;
	background: white!important;
	margin: 0 0 0 0px!important;
	width: 100%!important;
	line-height: 26px!important;
}

#mobile-menu .sub-menu a{
	padding-left: 4%!important;
}

	#mobile-menu .sub-menu li {
		margin: 0!important;
		width: 100%!important
	}
	

/*HEADER*/

#header{
	background-color: #fff;
	padding: 20px 0px;
	line-height: 90px;
}

.logoheader{
	float: left;
	height: 90px;
}

#support{
	float: right;
	font-size: 16px;
}

#support a{
	color: #4a505c;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#support a:hover{
	color: #388C38;
}

#support span{
	margin-right: 10px;
}

/********/



/*MENU*/

#menu{
	background-color: #4a505c;
	height: 56px;
	line-height: 56px;
}

#menu ul{
	float: left;
	margin-left: 6%;
	width: 76%;
}

#menu li{
	display: inline-block;
	float: left;
	margin-left: 5.9%;
	font-size: 16px;
	font-weight: 600;
}

#menu .first{
	margin-left: 0px!important;
}

#menu li  li a{
	height: 40px;
	line-height: 40px;
}

#menu li a{
	color: #fff;
	display: inline-block;
	height: 56px;
	line-height: 56px;
}

#menu a .telknop{
	color: #fff;
	font-size: 16px;
	font-weight: 300;
	background-color: #388c38;
	padding: 5px 17px;
	font-family: 'Lato', sans-serif;
	border-radius: 3px;
	float: right;
	margin: 12px 20px 0px 0px;
	line-height: 120%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#menu a .telknop:hover{
	opacity: 0.8;
}

#menu .telknop span{
	float: left;
	width: 30px;
	margin-top: 3px;
	font-size: 18px;
}

#menu2{display: none;}

#menu .menu-item-43{
	font-size: 0px;
	display: inline-block!important;
	width: 10px!important;
	margin-left: 0!important;
}

#menu .menu-item-43 a:before{
	font-size: 18px!important;
	content: '\f015';
	font-family: "FontAwesome";
	display: inline-block!important;
	height: 56px;
	line-height: 56px;
	width: auto!important;
}

#menu-item-42 a:after{
	content: '\f0d7';
	font-family: "FontAwesome";
	float: left;
	position: absolute;
	padding-left: 7px;
}


.menu ul {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0.0}

#menu li:hover .sub-menu {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	background:transparent!important;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC4A505C,endColorstr=#CC4A505C)!important; 
    zoom: 1;
	background: rgba(74, 80, 92, 0.9)!important;
	opacity: 1;
}



.sub-menu {
	position: absolute;
	border-radius: 0px;
	text-align: left!important;
	list-style-type: none;
	padding-bottom: 0px!important;
	z-index: 89988888;
	margin-top: 0px!important;
	margin-bottom: 0!important;
	width: 220px!important;
	margin-left: -20px!important;
	line-height: normal!important;
}

.sub-menu li{
	display: block!important;
	width: 100%!important;
	margin-left: 0%!important;
	padding: 0px!important;
}

.sub-menu li a{
	width: 100%!important;
	display: inline-block!important;
	font-size: 16px!important;
	padding: 0px 10px!important;
	height: 40px;
	line-height: 40px;
}

.sub-menu:hover {
	background-color: rgba(74, 80, 92, 0.9)!important;
}

.sub-menu li a:after {content: ''!important;}

/********/



/*SLIDER*/

.container  {
	max-width: 1200px;
	margin: 0 auto;	
	clear: both
}

.caption {
	background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC4A505C,endColorstr=#CC4A505C); 
       zoom: 1;
	background: rgba(74, 80, 92, 0.8);
	position: absolute;
	padding: 20px;
	margin-left: 65px;
	top: 15%;
	color: white;
	z-index: 984;
	max-width: 450px;
}

.caption #kop{
	font-size: 32px;
	font-weight: 300;
	padding-left:6%;
	margin-bottom: 10px!important;
}

.caption #kop p{
	margin-bottom: 10px!important;
	margin-top: 15px;
}

.caption .slidertekst{
	padding-left: 12%;
	font-weight: 300;
}
/********/



/*INHOUD*/

#inhoud{
	padding-top: 65px;
	padding-bottom: 60px;
}
/********/



/*INHOUDTEKST*/

#inhoudtekst #kop, #footerbalk #kop{
	font-size: 32px;
	color: #4a505c;
	margin-bottom: 40px;
}

#inhoudtekst #inleidendetekst{
	font-weight: 500;
	font-size: 16px;
	color:  #717071;
	padding: 0 2%;
}

#inhoudtekst #tekst, #footerbalk #tekst{
	font-weight: 400;
	font-size: 14px;
	color:  #717071;
	padding: 0 2%;
}

/********/




/*OPLOSSINGEN*/

#oplossingen{
	padding-left: 2%;
}


#oplossingen #kop, #oplossingen #kopdownloads{
	font-size: 32px;
	color: #4A505C;
	margin-bottom: 40px;
	font-weight: 700;
}

#oplossingen #inner{
	display: inline-block;
	margin-bottom: 4%;
	margin-left: 4%;
	padding-right: 3%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#inner #inhoudoplossingen{
	width: 70%!important;
}

#inner #imgblok{
	width: 30%!important;
}

#inner #imgblok img{
	max-width: 93px!important;
}

#oplossingen #inner span{
	float: left;
	max-height: 93px;
	max-width: 93px;
}

#oplossingen #inner #kop2{
	color: #388c38;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 1%;
}

#oplossingen #inner #tekst, #inner #tekstdownloads{
	color: #717071;
	font-size: 14px;
	font-weight: 400;
	line-height: 140%;
}

#oplossingen a #inner:hover{
	background:transparent;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#1A4A505C,endColorstr=#1A4A505C); 
       zoom: 1;
	background-color: rgba(74, 80, 92, 0.1);
	opacity: 0.9;
}

#oplossingen #inner .tekstfrontpage{
	height: 38px;
	overflow: hidden;
}

/********/


/*FOOTERBALK*/

#footerbalk{
	background-color: #4a505c;
	padding-top: 40px;
	padding-bottom: 30px;
}

#footerbalk #kop{
	color: #fff;
	margin-bottom: 20px;
	font-weight: 400;
}

#footerbalk #tekst{
	color: #e3e3e5;
	font-weight: 500;
	font-size: 14px;
	padding-right: 4%;
}

#footerbalk #referenties #tekst, #footerbalk #referenties #quote{
	padding-left: 4%;
}

#referenties #quote{
	float: left;
	font-size: 24px;
	color: #e3e3e5;
	opacity: 0.3;
	height: 100px;
	margin-top: -10px;
	margin-right: 10px;
}

#footerbalk #referenties span{
	font-weight: 600;
}

#footerbalk #brochureknop, #moreinfo{
	margin-top: 10px;
	color: #fff;
	font-size: 16px;
	background-color: #388c38;
	height: 36px;
	line-height: 36px;
	display: inline-block;
	padding: 0 20px;
	font-weight: 500;
		-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#footerbalk #brochureknop:hover, #moreinfo:hover{
	opacity: 0.8;
}

a #moreinfo{
	color: #fff;
}

#moreinfo{
	margin-left: 12%;
	margin-top: 0px!important;
	margin-bottom: 15px;
}

#footerbalk #brochureknop span, #moreinfo span{
	margin-left: 31px;
	height: 36px;
	line-height: 36px;
}

#footerbalk #referenties #brochureknop{
	background-color: transparent;
	float: right;
	margin-top: 10px;
}

#footerbalk #referenties #brochureknop span{
	margin-left: 20px;
}
/********/


/*FOOTER*/

#footer{
	font-size: 14px;
	padding: 25px 0;
	color: #646872;
	font-weight: 500;
}

#footer a{
	color: #646872;
}

#footer span{
	float: right;
}

/********/



/*PAGE*/

#page #inner{
	width: 100%;
}

#page #inner span{
	width: 20px;
}

#page #inner a{
	color: #388C38;
}

#page #inner #tekst{
	margin-left: 4%;
	line-height: 170%;
}

.imggebouw{
	float: left;
    margin-left: 57%;
    width: 45%;
    margin-top: -190px;
}

#oplossingen #kopdownloads{
	color: #388c38;
	margin-bottom: 20px;
	margin-top: 30px;
}

#inner #tekstdownloads span{
	width: 30px;
}

#inner #tekstdownloads{
	display: block;
	margin-left: 0;
	padding-bottom: 7px;
	margin-bottom: 12px;
	border-bottom: 1px solid rgba(113, 112, 113, 0.4);
	border-bottom: 1px solid #E3E3E3;
}

/********/



/*DOWNLOADPAGE*/

#downloadvak{
	padding: 1% 2%;
	min-height: 220px;
}

#downloadkop{
	font-size: 24px;
	border-bottom: 1px solid #7B7A7B;
	border-bottom: 1px solid rgba(113, 112, 113, 0.8);
	line-height: 100%;
	padding-bottom: 5px;
	margin-bottom: 15px;
	font-weight: 500;
	color: #4a505c;
}

#downloadvak a {
	color: #7B7A7B;
	color: rgba(113, 112, 113, 0.8);
}

#downloadvak a:hover span, #inner a:hover #tekstdownloads span{
	color: rgba(5, 124, 5, 1);
	color: #717071;
}

#tekstdownloads{
	padding: 0 2%;
	margin: 5% 3%;
	border-bottom: 1px solid #E3E3E3;	
	border-bottom: 1px solid rgba(113, 112, 113, 0.2);	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	font-size: 14px;
	line-height: 120%;
}


a:hover #tekstdownloads, #tekstdownloads:hover{
	border-bottom: 1px solid rgba(113, 112, 113, 0.8);	
}

#downloadvak span, #inner #tekstdownloads span{
	float: left;
	width: 40px;
	line-height: 120%;
	height: 25px;
}

/********/



/*FORM*/

#wpcf7-f107-o1{
	width: 45%!important;
	float: left;
	font-family: 'Hind', sans-serif;
}

.wpcf7-text{
	width: 100%;
	height: 30px;
	padding-left: 5px;
}

.wpcf7-textarea{
	width: 100%;
	height: 150px;
	padding: 5px;
}

.wpcf7-submit{
	height: 36px;
	width: 120px;
	border: none;
	background-color: #388c38;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	font-family: 'Hind', sans-serif;
}

.wpcf7-submit:hover{
	opacity: 0.7;
}

.wpcf7-not-valid-tip{
	display: none!important;
}

.wpcf7-validation-errors{
	border: none!important;
	margin: 10px 0 0 0!important;
	padding: 0!important;
	width: 100%!important;
}

.maps{
    width: 47%;
    float: right;
    margin-top: 34px;
    height: 250px;
}


/********/

/*REVIEWPAGE*/

#referenties span{
	float: left;
	margin-top: 8px;
	font-weight: 500;
}

#referenties #tekstdownloads{
	padding-bottom: 3px;
	color: #717071;
	margin-bottom: 50px;
	line-height: 160%;
}


/********/



/*MEDIAQUERIES*/

@media screen and (max-width: 1200px){

#menu ul{
	margin-left: 2%;
	width: 80%;
}

.telknop{
	height: 56px!important;
	margin: 0px!important;
	line-height: 56px!important;
	padding: 0 20px!important;
	border-radius: 0!important;
}



.telknop span{
	margin-top: 20px!important; 
}

.caption{
	top: 10%!important;
}
}

@media screen and (max-width: 1150px){
	
	.sub-menu{
			-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FFFFFFFF)!important; 
    zoom: 1;
	background: #fff!important;
	background-color: #fff!important;
	opacity: 1!important;
	}
	
	#menu{display: none;}
	#menu2{display: block;}
	#mobile-menu-container {display: block;}
	#mobile-menu-button {font-weight:; width: 94%; text-align: left; font-size:24px; color:#fff; display:block; text-decoration:none; height: 40px; background-color: #4a505c; padding-top: 3px; padding-left: 1%;}
	#mobile-menu-button.active {color: ;}
	#mobile-menu {list-style:none; display:none;}
	#mobile-menu li a {display:block; color:#4A505C; font-size:16px; font-weight:500;  width: 100%; text-align: left; text-decoration:none; padding: 3px 0 3px 3%; border-top: 0px solid #fff; border-bottom: 1px solid #919DB5;}
	#mobile-menu li a:hover, #mobile-menu li.current-menu-item a {color:rgba(5, 124, 5, 1); opacity: 0.7;}  

.telknop{
	font-size: 0px;
	float: right;
	padding: 0px!important;
	margin-top: -40px!important;
	width: 6%;
	height: 40px!important;
	background-color: #388c38;
	padding-left: 2%!important;
}
a .telknop span{
	font-size: 24px;
	line-height: 40px!important;
	margin-top: 5px!important;
	color: #fff;
}

}

@media screen and (max-width: 1100px){
	#maxw{padding: 0 2%;}
	
	#downloadvak{
		width: 50%!important;
	}
	.caption{
	top: 5%!important;
}
}


@media screen and (max-width: 1000px){
	#footer #maxw{float: left;}
	#footer span{float: inherit; width: 100%;}
	
	.caption{
		top: auto!important;
		bottom: 10%;
	}
	
	.caption .slidertekst{
		display: none!important;
	}
	
	.caption #kop{
		padding-left: 0;
	}
	#moreinfo{
		margin-left: 10%;
	}
	
}


@media screen and (max-width: 960px){
	#inhoud #oplossingen {width: 100%; padding-left: 0!important;}
	#inhoud #oplossingen #kop{margin-bottom: 30px; margin-top: 40px}
	#inhoud #inhoudtekst{width: 100%;}
	#inhoud #oplossingen #inner{width: 60%!important;}
	
		#downloadvak{
		width: 33.33333%!important;
	}
	#oplossingen #inner #tekst{
	height: 57px;
	overflow: hidden;
}
}

@media screen and (max-width: 800px){
	#mobile-menu-button {width: 85%!important;}
	
.telknop{
	width: 15%;
	padding-left: 6%!important;
}

	
}

@media screen and (max-width: 750px){
	
	#downloadvak{
		width: 50%!important;
	}
}



@media screen and (max-width: 650px){
	
	#inhoud{padding-top: 40px;}
	
	#inhoudtekst #kop{margin-bottom: 30px;}
	
	#footerbalk #downloads{width: 100%!important;}
	#footerbalk #referenties{width: 100%!important;}
	#footerbalk #kop{margin-top: 0px;}
	#referenties #kop{margin-top: 60px;}
	
	#inhoud #oplossingen #inner{width: 80%!important;}
	
	#wpcf7-f107-o1{
	width: 100%!important;
	float: left;
}
	
	
	.maps{float: left; width: 100%;}
	
	.caption{
		padding: 10px;
	}
	
	.caption #kop{
		font-size: 24px;
	}
	#moreinfo{
		margin-left: 0
	}
	
	.flex-control-nav{display: none!important;}
}

@media screen and (max-width: 550px){
	#downloadvak{
		width: 100%!important;
	}
}


@media screen and (max-width: 500px){
	#maxw{padding: 0 3%;}
	
	#inhoud #oplossingen #inner{width: 100%!important; margin-left: 0;}
	#support{display: none;}
	#header {text-align: center;}
	.logoheader{float: none;}
	
.telknop{
	width: 15%;
	padding-left: 5%!important;
}

	.caption{
		display: none!important;
	}

}

@media screen and (max-width: 400px){
	#inner #tekst{display: none!important;}
	#page #inner #tekst{display: block;}
	#inner #kop2{margin-top: 15px; margin-left: 9%!important;}
	a #inner{background-color: rgba(74, 80, 92, 0.05);}
	
	#kop{line-height: 120%;}
	
	#page .imggebouw{display: none;}
	
}
/********/




































/*
	
	
