@charset "utf-8";

#contactgegevensdata{ display: none; }

/*  template gedeeld --------------------------------------- */
#inhoud.vervolgpagina { line-height: 180%;   }
#inhoud.vervolgpagina h1{ font-size: 50px;  padding-bottom: 10px; font-weight: bold; }
#inhoud.vervolgpagina h2{ font-size: 32px;  padding: 30px 0 15px; font-weight: bold; } 


#contactmap_container{  margin-top: 0px; z-index: 0; }
#map_container { position: absolute; bottom: 0px; left: 0px; right: 0px; height:200px; border-radius: 0 0 20px 20px;  background: #f5f5f5 url(../img/loading.gif) no-repeat center center; }
#mapscrolloverlay{ position: absolute; bottom: 0px; left: 0px; right: 0px; top: 0px; }


#inhoud.offerte .contactinfocontainer { display: none; }
#inhoud.offerte .centered .container.contactpagina:before { display: none; }
#inhoud.offerte #contact-formulier2 textarea { height: 250px; }

.checkboxrij { min-height: 30px; padding-left: 40px; font-size: 14px; font-weight: bold; margin-bottom: 10px; overflow: hidden; }
.checkboxrij input[type=checkbox]{ position: absolute; top: 0px; left: -80px; }
.checkboxrij label{ position: relative; float: left; width: 100%; cursor: pointer; }
.checkboxrij:before{ position:absolute; top: 4px; left: 0px; width: 23px; height: 23px; background:url("../img/svg-vink-bol-licht.svg") no-repeat top left; cursor: pointer;}
.checkboxrij.active:before{  background:url("../img/svg-vink-bol-kleur.svg") no-repeat top left;}
.checkboxrij span{  font-weight: normal; }


.offertetekst{ padding-bottom: 25px; }
.offertetekst ul li:before{ content:''; position: absolute; top: 8px; left: -25px; width: 26px; height: 26px;  background: #79A108;  border-radius: 100%;   }
.offertetekst ul li:after{ content:''; position: absolute; top: 17px; left: -17px; width: 10px; height: 8px; background: url("../img/svg-vink.svg") no-repeat; background-size: 100% auto; }



.contactpagina { margin-top: 170px; padding-bottom: 80px; border-bottom: 2px solid #EEEEF4; }
.contactpagina .contactlinks{ width: 50%; padding-right: 100px; }

.contactpagina .contactlinks .tel{ width: 50%; font-weight: 500; font-size: 25px; color: #2B2873;  height: 55px; padding-left: 55px; text-align: left; margin-top: 20px; line-height: normal; }
.contactpagina .contactlinks .tel a{ text-decoration: none!important; color: #2B2873!important; }
.contactpagina .contactlinks .tel span{ font-size: 14px; padding-top: 0px; color: #2B2873;  }
.contactpagina .contactlinks .tel:before{  position: absolute; top: 0px; left: 0px; bottom: 0px; width: 38px; background:url("../img/svg-telefoon-donker.svg") no-repeat top left; background-size:  auto 100%; }
.contactpagina .contactlinks .tel:hover {  text-decoration: none; }

.contactpagina .contactlinks .email{ width: 50%; font-weight: 500; font-size: 25px; color: #2B2873;  height: 55px; padding-left: 75px; text-align: left; margin-top: 20px; line-height: normal; }
.contactpagina .contactlinks .email a{ text-decoration: none!important; color: #2B2873!important; }
.contactpagina .contactlinks .email span{ font-size: 14px; padding-top: 0px; color: #2B2873;  }
.contactpagina .contactlinks .email:before{ position: absolute; top:0; left: 0; width: 55px; height: 55px; border-radius: 100%; box-shadow: 0px 3px 30px rgba(43,40,115,0.2); background: #fff url("../img/svg-email-donker.svg") no-repeat center center; background-size: auto 14px; }
.contactpagina .contactlinks .email:hover {  text-decoration: none; }

.contactpagina .contactlinks .split{ height: 1px; background: #eee; margin: 60px 0; }
.contactpagina .contactlinks .txt { padding-bottom: 20px;  }
.contactpagina .contactlinks .txt a{ font-weight: bold; text-decoration: none!important; color: #2B2873!important;  }


.contactpagina .contactlinks .kennismaken{ margin-top: 50px; height: 210px; border-radius: 20px; background: url("../img/visual-kennismaken-kort.jpg") no-repeat center center; background-size: cover; }
.contactpagina .contactlinks .kennismaken .kennismakentitel{     font-size: 23px;    font-weight: bold;    line-height: 130%;    padding-bottom: 5px; color:#fff;   }
.contactpagina .contactlinks .kennismaken .kennismakenblok{ position: absolute; top: 30px; left: 30px; width: 320px;   padding: 30px 40px 25px;  background: #00A7E1; border-radius: 15px; }
.contactpagina .contactlinks .kennismaken .kennismakentitel span{ font-size: 20px;    font-weight: 500;    font-style: italic; }
.contactpagina .contactlinks .kennismaken .kennismakenlink{ font-size: 13px; text-transform: uppercase; font-weight: bold; color: #2B2873; }
.contactpagina .contactlinks .kennismaken .kennismakenblok:hover{   background: #2B2873;  }
.contactpagina .contactlinks .kennismaken .kennismakenblok:hover .kennismakenlink{   color: #00A7E1;  }

.contactpagina .contactlinks .adres{ margin-top: 80px; width: 50%; padding-left: 55px; padding-right: 50px; line-height: 150%; font-size: 13px; }
.contactpagina .contactlinks .adres:before{  position: absolute; top: 0px; left: 0px; bottom: 0px; width: 38px; background:url("../img/svg-pin-donker.svg") no-repeat top left; background-size:   60% auto; }
.contactpagina .contactlinks .adres span{ font-size: 14px;  color: #2B2873; font-weight: bold;  }

.contactpagina .contactlinks .info{ margin-top: 80px; width: 50%; line-height: 150%; font-size: 13px; }
.contactpagina .contactlinks .info span{ font-size: 14px;  color: #2B2873; font-weight: bold;  }



.contactpagina .contactlinks .volgons { position: absolute; top: 70px; right: 0px;  font-size: 14px; font-style: italic; z-index: 1;  }
.contactpagina .contactlinks .volgons a.facebook{ width: 32px; height: 32px; background: url("../img/svg-socialmedia-facebook.svg") no-repeat;   background-size: auto 100%;  margin-right: 5px; }
.contactpagina .contactlinks .volgons a.instagram{ width: 32px; height: 32px; background: url("../img/svg-socialmedia-instagram.svg") no-repeat;  background-size: auto 100%; margin-right: 5px;   }
.contactpagina .contactlinks .volgons a.instagram:hover{ background: url("../img/svg-socialmedia-instagram-hover.svg") no-repeat;   background-size: auto 100%; }
.contactpagina .contactlinks .volgons a.facebook:hover{  background: url("../img/svg-socialmedia-facebook-hover.svg") no-repeat;   background-size: auto 100%; }




.contactpagina .contactrechts{ width: 50%; padding-left: 50px; padding-top: 50px;  }
.contactpagina .contactrechts .rijtitel{ font-weight: 600; }
.contactpagina .contactrechts .rij{ padding-bottom: 15px; }


#contact-formulier2 textarea{	border: 1px solid rgba(0,0,0,0.1); background: #fff;	width:100%;	height: 220px;	padding: 25px; box-sizing: border-box;	border-radius: 3px;	    font-family: 'Montserrat', sans-serif;}
#contact-formulier2 input[type=text], #contact-formulier2 input[type=email]{	border: 1px solid rgba(0,0,0,0.1); background: #fff;	width:100%;	padding: 0 15px; box-sizing: border-box;  height: 40px; line-height: 40px;	border-radius: 3px;	font-family: 'Montserrat', sans-serif; }
#contact-formulier2 select{	border: 1px solid rgba(0,0,0,0.1); background: #fff  url("../img/svg-pijl-beneden-donker-1.svg") no-repeat 97% center; background-size: 10px auto;	width:100%;	padding: 0 15px; box-sizing: border-box;  height: 40px; line-height: 40px;	border-radius: 3px;    font-family: 'Montserrat', sans-serif;	-webkit-appearance: none;	}
#contact-formulier2 input[type=submit]{	    background: #5BCBF5;    font-family: 'Montserrat', sans-serif; border: 0;	border-radius: 50px;	position: relative; 	float: left; 	height: 50px; 	line-height: 47px; 	font-size: 16px; 	font-weight: 600; 	color: #fff; 		padding: 0 25px;    transition:all .2s linear;     -o-transition:all .2s linear;     -moz-transition:all .2s linear;     -webkit-transition:all .2s linear;	cursor: pointer;	-webkit-appearance: none;	}
#contact-formulier2 input[type=submit]:hover{	background: #2B2873;   text-decoration: none; ;}

#contact-formulier2 textarea, #contact-formulier2 input[type=text], #contact-formulier2 select, #contact-formulier2 input[type=email] { outline-style: none; }

#contact-formulier2 textarea:hover, #contact-formulier2 input[type=text]:hover, #contact-formulier2 select:hover, #contact-formulier2 input[type=email]:hover { border: 1px solid rgba(0,0,0,0.2); box-shadow: 0px 3px 10px rgba(0,0,0,0.1);  }


@media screen and (min-width: 1320px) and (max-width: 1660px) {
	
	.contactpagina .contactlinks{ width: 55%; padding-right: 100px; }
	.contactpagina .contactrechts{ width: 45%; padding-left: 30px;  }

}

@media screen and (min-width: 1024px) and (max-width: 1319px) {
	
	.contactpagina .contactlinks{ width: 60%; padding-right: 60px; }
	.contactpagina .contactrechts{ width: 40%; padding-left: 20px; padding-top: 30px; }
	
	#inhoud.vervolgpagina h1 { font-size: 40px; }
	.contactpagina { margin-top: 150px; }
	.contactpagina .contactlinks .tel { font-size: 20px; }
	.contactpagina .contactlinks .tel span { font-size: 13px; }
	.contactpagina .contactlinks .email { font-size: 20px; }
	.contactpagina .contactlinks .email span { font-size: 13px; }
	#contact-formulier2 textarea { height: 245px; }
	
	
	.contactpagina .contactlinks .volgons { width: 32px;   }
	.contactpagina .contactlinks .volgons a.facebook{ margin-bottom: 7px; }
}

@media screen and (min-width: 740px) and (max-width: 1023px) {
	
	.contactpagina { margin-top: 130px; }
	#inhoud.vervolgpagina h1 { font-size: 40px; }
	.contactpagina .contactlinks{ width: 100%; padding-right: 0px; padding-bottom: 40px; border-bottom: 2px solid #EEEEF4;   }
	.contactpagina .contactlinks .txt {    padding-bottom: 0px; }
	.contactpagina .contactrechts{ width: 100%;  padding-left: 0px; }
	.contactpagina .contactlinks .kennismaken { margin-top: 40px; }
	.contactpagina .contactlinks .adres { margin-top: 60px; }
	.contactpagina .contactlinks .info { margin-top: 60px; }
}


@media screen and (min-width: 1px) and (max-width: 739px) {
	
	.contactpagina { margin-top: 110px; }
	#inhoud.vervolgpagina h1 { font-size: 24px; }
	.contactpagina .contactlinks{ width: 100%; padding-right: 0px; padding-bottom: 40px; border-bottom: 2px solid #EEEEF4;   }
	.contactpagina .contactlinks .txt {    padding-bottom: 0px; }
	.contactpagina .contactrechts{ width: 100%;  padding-left: 0px; }
	.contactpagina .contactlinks .kennismaken { margin-top: 40px; }
	
	.contactpagina .contactlinks .tel { width: 100%; padding-left: 65px; margin-top: 25px; }
	.contactpagina .contactlinks .tel span { font-size: 13px; }
	.contactpagina .contactlinks .tel { font-size: 20px; }
	.contactpagina .contactlinks .tel:before { left: 5px; }
	
	.contactpagina .contactlinks .email { width: 100%; margin-top: 30px; }
	.contactpagina .contactlinks .email span { font-size: 13px; }
	.contactpagina .contactlinks .email { font-size: 20px; }
	
	.contactpagina .contactlinks .kennismaken { height: 120px; margin-bottom: 200px; }
	.contactpagina .contactlinks .kennismaken .kennismakenblok { top: 135px;  left: 0px; width: 100%; padding: 25px 40px 25px; }
	
	.contactpagina .contactlinks .adres { margin-top: 50px; width: 100%; padding-left: 45px; }
	
	.contactpagina .contactlinks .info { margin-top: 20px; width: 100%; padding-left: 45px; }
	.contactpagina .contactlinks .info:before{  position: absolute; top: 0px; left: 0px; bottom: 0px; width: 38px; background:url("../img/svg-information-donker.svg") no-repeat top left; background-size:  auto 40%; }

	.contactpagina .contactlinks .volgons { top: 45px;   }
	
	#contact-formulier2 { font-size: 12px; }
	#contact-formulier2 select{ position: absolute; top: 0px; ;left: 0px; }
	#contact-formulier2 .selectmenu{ min-height: 80px; }
	#contact-formulier2 input[type=submit] { width: 100%; }

	
}