/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 1280 PX *******************************************/
/******************************************************************************/
@media screen and (max-width: 1280px) {
	#footer .wrapper, .onderfooter.wrapper, #content, #kruimelpad .kp-wrapper, .onderfooter .wrapper{max-width:unset;margin-left:20px;margin-right:20px}
  #menu ul li a{padding-left:8px;padding-right:8px}
  #kolom_contact .contactpersonen .fa-users{font-size:55px}
	
	/* diensten homepage */
	#diensten{width:100%;text-align:center;text-align-last:center}
	#diensten a.item, #diensten a.item:nth-of-type(4n){margin:16px}
	#diensten a.item .titel{text-align:right;text-align-last:right}
}

/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 1220 PX *******************************************/
/******************************************************************************/
@media screen and (max-width: 1220px) {
	#home_blok.contact h3, #home_blok h2{line-height:20px}
}

/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 1120 PX *******************************************/
/******************************************************************************/
@media screen and (max-width: 1120px) {
	#home_blok h2{font-size:20px}
	
	/* speepunten homepage */
	#speerpunten .item{width:calc(33.33333% - 20px)}
}

/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 960 PX ********************************************/
/******************************************************************************/ 
@media screen and (max-width: 960px) {
	#home_blok .tekst{text-align:left}
	#home_blok .tekst h3{margin-top:20px}
	#home_blok .tekst p{display:none}
	
	#logo{top:43px}
	#logo img{max-height:73px;}
	
	#header .knoppen .knop{font-size:18px;}
	#header .knoppen .knop.email, #header .knoppen .knop.tijden{font-size:12px}
	#header .knoppen .knop.nood{font-size:14px;}
	
	/* afbeeldingen */
	#afbeeldingen, #afbeeldingen.home{height:300px;}
	#afbeeldingen .tekst h2{font-size:48px;line-height:52px;}
	
	#home_blok{padding:20px}
	#home_blok form .input_box, #home_blok form .input_box:nth-of-type(2n){width:100%;margin:1px 0;height:30px}
	#home_blok input{text-indent:10px;height:30px}
	#home_blok select{text-indent:3px;height:30px}
	#home_blok textarea{padding:6px 10px;margin-top:1px;height:50px}
	#home_blok form button{position:absolute;bottom:34px;left:50%;transform:translate(-50%);margin:0}
	
	/* speepunten homepage */
	#speerpunten .item{width:calc(33.33333% - 40px)}
	#speerpunten .item i{height:38px;font-size:40px;}
	
	
	/* recensies homepage */
	#recensies .item .sterren i{font-size:18px}
	
	/* footer */
	#footer .blok{float:none;width:auto;margin:0 auto 50px;text-align:center;clear:both}
	#footer form{margin:0 auto 50px}
	
	#footer .blok.contact i, #footer .blok.contact span{float:none;display:inline}
	#footer .blok.informatie{padding:0}
}

/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 830 PX ********************************************/
/******************************************************************************/ 
@media screen and (max-width: 830px) {
	#afbeeldingen .tekst, #header .wrapper, #content, #projecten,
	#footer .wrapper, .onderfooter.wrapper{box-sizing: border-box;width:100%;margin-left:0;margin-right:0;padding-left:20px;padding-right:20px;}
	
	/* #content.home #btn_nooddienst{position:absolute;top:30px;left:50%;transform:translate(-50%)} */
	#content.home{margin-top:50px}
	#content #text, #content.home .textpage{float:none;width:100%}
	
	#projecten{float:none;text-align:center}
	#projecten a.item, #projecten .project .img{float:none;display:inline-block}
	#contactform{float:none;margin:30px auto;clear:both}
	
	
	/* blokken home */
	#home_blok, #home_blok.projecten, #home_blok.contact{width:100%;height:auto;float:none;max-width:420px;margin:40px auto;text-align: center;}
	#home_blok.recensies, #home_blok.foto {height:365px}
	#home_blok .button, #home_blok form button{position:relative;bottom:auto;margin:20px auto 0;left:auto;transform:none}
	
	/* onderste footer */
	.onderfooter .copy{display:block;float:none;padding-bottom:20px}
	.onderfooter .wrapper{height:auto;text-align:center;line-height:unset}
	.onderfooter .facebook{display:inline-block;float:none}
	
	/***** MENU *****************************************************************/
	#menu{position:absolute;top:0;right:0;width:100%;}
	#btn_menu_mobiel{display:block;position:absolute;top:34px;right:10px;width:62px;height:62px;cursor:pointer}
	#btn_menu_mobiel span{width:30px;height:2px;display:block;overflow:hidden;background:#1f1f1f;margin:7px 0;}
	
	#menu ul{display:none;background:#fff;text-align:left;width:100%;list-style:none;margin:0;padding:100px 0 0 0}
	#menu ul li{display:block}
	#menu ul li.uitklap i{display:none}
	#menu ul li a{padding:5px 30px;color:#1f1f1f}
	#menu ul li a:hover{border:none}
	#menu ul#submenu{display:block;position:relative;top:auto;left:auto;margin:0 30px;padding:0 30px;background:none;}
	
}

/******************************************************************************/
/******************************************************************************/
/***** SCHERMEN KLEINER DAN 660 PX ********************************************/
/******************************************************************************/ 
@media screen and (max-width: 660px) {

	#btn_esvelddak .tekst{display:none}
	#btn_esvelddak .site{font-size:14px;line-height:42px;}
	#btn_esvelddak{background-size: 24px;background-position:9px 20px;padding-left:40px;padding-right:8px;right:0}
	
	#header{height:200px;position:absolute}
	#afbeeldingen .tekst h2 {font-size: 38px;line-height: 42px;}
	
	/* menu mobiel */
	#btn_menu_mobiel{top:20px;right:10px;width:42px;height:46px;cursor:pointer}
	#btn_menu_mobiel span{width:24px;height:2px;display:block;overflow:hidden;background:#1f1f1f;margin:5px 0;}
	
	/* logo */
	#logo{top:34px;left:30px}
	#logo img{max-height:62px;}
	
	/* knoppen */
	#header .knoppen .knop span{display:none}
	#header .knoppen .knop, #header .knoppen{height:50px}
	#header .knoppen .knop i, #header .knoppen .knop.telefoon i, #header .knoppen .knop.tijden i {margin-top:14px}
	
	#container{padding-top:200px}
	
	/* button esveld dak */
	#kruimelpad{height:106px}
	#kruimelpad .kp-wrapper{text-align:center}
	#btn_esvelddak{position:absolute;bottom:0;top:auto;width:100%;text-align:center;background-size: 36px;background-position:30px 18px;}
	#btn_esvelddak .tekst{display:block}
	#btn_esvelddak .site{font-size:22.85px;line-height:20px}
	
	/* speepunten homepage */
	#speerpunten{text-align:center;text-align-last:center;margin-top:0}
	#speerpunten .item{width:100%;max-width:340px;height:auto;margin:0 auto 60px;}
	#speerpunten .item .tekst{text-align:center;text-align-last:center}
	
	/* recensies homepage */
	#recensies .item .tekst{font-size:14px;line-height:17px}
	#recensies .item .sterren i{font-size:14px}
	
	/* noodknop */
	#content.home #btn_nooddienst{width:270px;font-size:16px}
	#btn_nooddienst .nummer{font-size:23.6px;letter-spacing:3px}
	#content img{max-width:100%}
	
	/* certificeringen */
	#certificeringen{margin-top:40px}
	#certificeringen h2{font-size:22px}
	#certificeringen #logos{margin-top:40px}
	#certificeringen #logos ul li{height:32px;width:200px}
	
	#contactform, form{width:100%;max-width:320px;height:auto}
	form .input_box, form .input_box:nth-of-type(2n){width:100%;margin:1px 0;height:30px}
	input{text-indent:10px;height:30px}
	select{text-indent:3px;height:30px}
	textarea{padding:6px 10px;margin-top:1px;height:50px}
	form button{position:relative;bottom:auto;left:auto;transform:none;margin:0 auto;margin-top:20px}
	
	
}