body{margin: 0; padding: 0;   font-family: "Roboto", serif;	background: #fff; color: #202020; font-size: 16px; font-weight: 400;} 
*{margin: 0; padding: 0; box-sizing: border-box; }


.h1,.h2,.h3,.h4,.h5,.h6,
h1,h2,h3,h4,h5,h6{line-height: 100%; display: block; font-weight: 700}

h1,.h1{font-size: 30px}
h2,.h2{font-size: 24px}
h3,.h3{font-size: 22px}
h4,.h4{font-size: 20px}
h5,.h5{font-size: 18px}
h6,.h6{font-size: 16px}


/**** Page ****/
#maxw1{max-width: 1230px; margin: 0 auto; padding: 0 15px;}

.frame {margin: 0 auto; max-width: 100%; }
.frame:after{content: ""; display: table; clear: both; }
.bit-1 {float: left; width: 100%; }
.clear:after{content: "\00a0"; visibility: hidden; display: block; height: 0; clear: both; } 


/**** Custum ****/
*:focus{outline: none;}

.fa{font-weight: 400!important}

input,
select,
textarea,
button{font-family: "Roboto", serif;}

a{text-decoration: none;}

img{max-width: 100%;}

ul li{list-style-type: none;}

input[type="button"],
input[type="submit"],
a,
button,
.knop{transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -webkit-transition: 0.2s ease-in-out; cursor: pointer;}
.transition{transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -webkit-transition: 0.2s ease-in-out;}


.n_shadow{-webkit-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); -moz-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24);}


/**** Buttons ****/
.btn{display: inline-block; border: none; background: transparent; color: transparent; text-align: center; border-radius: 50px;}
.s_btn{font-size: 13px; line-height: 16px; padding: 8px 15px;}
.n_btn{font-size: 14px; line-height: 16px; padding: 11px 20px;}
.l_btn{font-size: 15px; line-height: 16px; padding: 14px 25px;}
.xl_btn{font-size: 16px; line-height: 16px; padding: 18px 35px;}

.btn.color_1{background: #00A19C; color: #fff;}
.btn.color_1:hover{background: #0c1619; color: #fff;}
.btn.color_2{background: #00A19C; color: #fff;}
.btn.color_2:hover{background: #0c1619; color: #fff;}
.btn.color_3{background: #00A19C; color: #fff;}
.btn.color_3:hover{background: #0c1619; color: #fff;}

.btn .left{display: inline-block; margin-right: 15px;}
.btn .right{display: inline-block; margin-left: 15px;}

.btn.l_btn .left{margin-right: 25px;}
.btn.l_btn .right{margin-left: 25px;}
.btn.xl_btn .left{margin-right: 30px;}
.btn.xl_btn .right{margin-left: 30px;}


/**** Content container ****/
#content_container{line-height: 175%;}
#content_container > *:first-child{margin-top: 0;}
#content_container > *:last-child{margin-bottom: 0;}
#content_container  h1 + *,
#content_container  h2 + *,
#content_container  h3 + *,
#content_container  h4 + *,
#content_container  h5 + *,
#content_container  h6 + *{margin-top: 5px!important}
#content_container > ul,#content_container > ol,#content_container table,
#content_container p, p{margin: 1.8em 0;}
#content_container > ol, #content_container > ul{padding: 0 0 0 20px;}
#content_container ul li{list-style-type: disc;}
#content_container ol ul,#content_container ol ol,#content_container ul ol,#content_container ul ul{padding: 0 0 0 20px;}
#content_container a{text-decoration: underline; color: #202020}
#content_container a:hover{color: #EFEB3B;}



/**** Header ****/
#header {background: #00A19C; border-bottom:7px solid #EFEB3B}
.logo{float: left; font-size: 0; margin: 15px 0; width: 330px; height: 100px; text-align: left; display: table;}
.logo span{display: table-cell; vertical-align: middle}
.logo img{max-width: 100%; max-height: 100px;}

.right_header{float: right; width: 680px; max-width: calc(100% - 370px); margin: 38px 0 0;}

.search_form{float: left; width: 270px; position: relative;}
#mobile-menu .search_form{display: none;}
.search_form input{float: left; width: 100%; height: 54px; border-radius: 50px; border: 1px solid #eee; padding: 0 70px 0 30px; font-size: 14px;}
.search_form input::-webkit-input-placeholder{color: #ccc; }
.search_form input::-moz-placeholder{color: #ccc;}
.search_form input:-ms-input-placeholder{color: #ccc;}
.search_form input:-moz-placeholder{color: #ccc;}
.search_form button{float: left; width: 70px; color: #ccc; height: 54px; position: absolute; top: 0; right: 0; border-radius: 100%; border: none; background: transparent; font-size: 16px;}

.rh_btns{float: right; margin: 0 0 0 30px}
.rh_btns a{float: left; width: 54px; height: 54px; line-height: 54px; font-size: 18px; background: #0c1619; color: #fff; border-radius: 100%; text-align: center; margin: 0 0 0 16px;}
.rh_btns a:first-child{margin: 0;}
.rh_btns a.mail{background: #EFEB3B; color:#0c1619}
.rh_btns a.mail:hover {background: #0c1619; color:#fff}
.rh_btns a:hover{background: #EFEB3B; color:#0c1619}




/**** Menu ****/
#menu{background: #0c1619; position: relative; z-index: 2;}

.menu{float: left;}
.menu > li{float: left; position: relative;}
.menu > li > a{float: left; line-height: 70px; color: #fff; font-size: 18px; padding: 0 70px 0 0;}
.menu > li.menu-item-has-children > a:after{content: "\f0d7"; font-family:"Font Awesome 6 Pro";font-weight:900; margin: 0 0 0 10px;}
.menu > li.active > a,
.menu > li:hover > a{color: #00A19C;} 
.menu > li:hover > ul{display: block;}

.menu ul{display: none; position: absolute; top: 100%; left: 0; float: left; min-width: 230px; background: #fff; -webkit-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); -moz-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); white-space: nowrap;}
.menu ul li{float: left; width: 100%;}
.menu ul li a{float: left; width: 100%; line-height: 14px; padding: 14px 15px; color: #202020; border-left: 4px solid #fff;}
.menu ul li a:hover{border-color: #00A19C; background: #eee}
.menu ul ul{display: none!important;}

.menu_btn{display: none; background: #0c1619!important;}
#mobile-menu{display: none;}

.menu_overlay{display: none;}
.menu_overlay{position: fixed; top: 0; left: 0; height: 100%; background: #0c1619; opacity: 0.3; z-index: 190}
.menu_overlay.active{display: inline-block}



/**** Slider ****/
#slider{position: relative; z-index: 1;}
.home_slide{padding: 35% 0 0; min-height: 320px;}
.page_slide{padding: 20.8% 0 0; min-height: 250px;}
.slide_content{position: absolute; left: 0; top: 0; margin: auto 0;}
.slide_content .h1{font-weight: 300; color: #fff; text-align: center; line-height: 114.29%; font-size: 42px; text-shadow: 0 0 16px rgba(0,0,0,0.56);}
.slide_btns{text-align: center; font-size: 0; margin: 50px 0 0}
.slide_btns a{vertical-align: top; margin: 8px 10px; font-size: 18px;}


/**** Breadcrumbs ****/
#breadcrumbs{padding: 15px 0; font-size: 14px;}
.breadcrumbs_container{color: #bcbcbc}
.breadcrumbs_container > *{float: left; line-height: 14px;}
.breadcrumbs_container i.fa-angle-right{margin: 0 7px;}
.breadcrumbs_container a{color: #bcbcbc}
.breadcrumbs_container a:hover{color: #0c1619}



/**** Content ****/
#content{padding: 10px 0 40px;}
.left_column{float: left; width: 60%; padding: 30px 0 0; margin: 0 0 40px;}
.left_column.full_width{width: 100%;}
.right_column{float: right; width: 32.9%}

.page_head{margin: 0 0 46px;}
.page_head span{color: #00A19C}

.contact_info{background: #f9f9f9; padding: 35px}
.contact_info .h3{color: #00A19C; margin: 0 0 25px;}
.contact_info li{float: left; width: 100%; line-height: 16px; padding: 3px 0;}
.contact_info li span{display: inline-block; width: 45px;}
.contact_info li i{color: #00A19C}
.contact_info li a{color: #202020}
.contact_info li a:hover{color: #EFEB3B}
.contact_info .route_btn{margin: 25px 0 0;}

.rc_thumb img{border-radius: 17px; -webkit-box-shadow: 7px 7px 0px 0px #EFEB3B; -moz-box-shadow: 7px 7px 0px 0px #EFEB3B; box-shadow: 7px 7px 0px 0px #EFEB3B;}

.rc_usps{margin: 45px 0 0;}
.rc_usps span{float: left; width: 100%; line-height: 20px;      padding: 14px 0 14px 34px;}
.rc_usps span:before{content: "\f00c"; font-family:"Font Awesome 6 Pro";font-weight:900; float: left; line-height: 20px; margin: 0 0 0 -34px; color: #00A19C}


/**** Content btns ****/
.content_btns{margin: 30px 0 0;}
.content_btns a{float: left; margin: 10px 15px 0 0;}


/**** Zoeken ****/
.search_item{margin: 0 0 30px;}
.search_item .h3{margin: 0 0 15px; color: #0c1619}
.search_item_content{padding: 20px; border: 1px solid #f9f9f9}
.search_item_bottom{padding: 15px 20px; background: #f9f9f9}


/**** Footer ****/
#footer{background: #00A19C; padding: 55px 0 0;}

.footer_left{float: left; width: calc(50% - 97px); text-align: center; margin: 0 0 35px}
.footer_left .btn.xl_btn {background: #0c1619}
.footer_left .btn.xl_btn:hover {background: #EFEB3B;}
.footer_logo{float: left; width: 245px;}
.footer_left .btn{margin: 20px 0 0;}
.footer_center{float: left; width: calc(50% - 97px);}
.footer_center ul{float: left; width: 100%; -webkit-columns: 2; -moz-columns: 2; columns: 2;}
.footer_center a{display: inline-block; padding: 0 0 0 34px; line-height: 16px; color: #fff; font-size: 16px; font-weight: 400; margin: 8px 0}
.footer_center a:before{content: "\f00c"; font-family:"Font Awesome 6 Pro";font-weight:400; float: left; line-height: 16px; margin: 0 0 0 -34px; color: #ffffff}
.footer_center a:hover{color: #0c1619}
.footer_right{float: left; width: 194px}
.social_btns{float: left; width: calc(100% + 12px); margin: 0 -6px; text-align: left;}
.social_btns a{display: inline-block; width: 54px; height: 54px; line-height: 54px; font-size: 18px; background: #0c1619; color: #fff; border-radius: 100%; text-align: center; margin: 5px 6px;}
.social_btns a:first-child {margin: 0 6px 0 0;}
.social_btns a:hover{background: #EFEB3B; color:#0c1619}
.bottom{margin: 10px 0 0; text-align: center; font-size: 14px; border-top: 1px solid rgba(255, 255, 255, 0.13); line-height: 16px; padding: 28px 0; color: rgba(255, 255, 255, 0.35);}
.bottom a{color: rgba(255, 255, 255, 0.35)}
.bottom a:hover{color: #0c1619}


/**** Formulieren ****/
#content_container div.wpcf7{float: left; width: 100%; margin: 15px 0;}
#content_container .wpcf7-form{float: left; width: 550px; max-width: 100%;}
#content_container .wpcf7 .form_item{float: left; width: 100%; position: relative; padding: 0 0 0 160px; margin: 0 0 15px; resize: none;}
#content_container .wpcf7 .form_label{float: left; width: 150px; line-height: 16px; margin: 13px 0 0 -160px;}
#content_container .wpcf7 input,
#content_container .wpcf7 select,
#content_container .wpcf7 textarea{float: left; width: 100%; height: 42px; border: 1px solid #e3e3e3; padding: 0 15px; font-size: 14px; background: #fff; resize: none;}
#content_container .wpcf7 textarea{height: 140px; padding: 10px 15px;}
#content_container .wpcf7 .wpcf7-radio{float: left; width: 100%; margin: 0 0 13px; line-height: 16px;}
#content_container .wpcf7 .wpcf7-radio .wpcf7-list-item{float: left; width: 100%; margin: 13px 0 0;}
#content_container .wpcf7 input[type="checkbox"],
#content_container .wpcf7 input[type="radio"]{float: left; width: auto; height: 16px; margin: 0 5px 0 0}

span.wpcf7-not-valid-tip{display: none!important;}
[aria-invalid="true"]{border-color: #EFEB3B!important;}
div.wpcf7-response-output{float: left; width: 100%; margin: 10px 0 0!important; border: none!important; padding: 0!important; color: #EFEB3B}
div.wpcf7-response-output.wpcf7-validation-errors{color: #EFEB3B;}


/**** Galerij ****/
.gallery_block{background: #f9f9f9; padding: 25px; margin: 40px 0 0}
.gallery_list{float: left; width: calc(100% + 12px); margin: -6px;}
.gallery_list a{float: left; width: calc(25% - 12px); margin: 6px;}
.gallery_list a span{padding: 85% 0 0;}
.gallery_list a:hover span{background: #000; opacity: 0.3}


/**** FAQ ****/
.faq_block{margin: 25px 0 0;}
.faq_block .h3{color: #0c1619; margin: 15px 0 15px;}
.faq_item{margin: 0 0 20px;}
.faq_item:last-child{margin: 0;}
.faq_question{background: #f9f9f9; cursor: pointer; padding: 15px 50px 15px 15px; font-weight: bold; position: relative; border-bottom: 1px solid #202020}
.faq_question i{position: absolute; float: left; width: 50px; text-align: center; line-height: 30px; right: 0; top: 50%; margin: -15px 0 0;}
.faq_item.active .faq_question i{transform: rotate(180deg);}
.faq_answer{padding: 15px; display: none; font-size: 93%}


/**** Downloads ****/
.download_block{margin: 40px 0 0;}
.download_block .h3{color: #0c1619; margin: 0 0 15px;}
.download_item{background: #f9f9f9; cursor: pointer; padding: 15px 15px 15px 60px; font-weight: bold; position: relative; border-bottom: 1px solid transparent; margin: 0 0 5px; color: #202020}
.download_item i{position: absolute; float: left; width: 14px; text-align: center; line-height: 20px; left: 23px; top: 50%; margin: -10px 0 0; border-bottom: 2px solid #202020;}
.download_item:hover{border-color: #202020}


/**** Item list ****/
.item_list{float: left; width: calc(100% + 30px); margin: 15px -15px;}
.item_item{float: left; width: calc(50% - 30px); margin: 20px 15px; border: 1px solid rgb(0, 74, 98); display: flex; flex-wrap: wrap;}
.item_image{width: 30%;}
.item_title{ color:#00A19C;}
.item_title h4{display: table;}
.item_title h4 span{display: table-cell; vertical-align: middle}
.item_content{padding: 15px 20px; width: 70%;}
.item_content #content_container{margin: 15px 0 0 0px; overflow: hidden; position: relative; color: #202020;}
.item_content #content_container p {margin: 0 0 15px 0;}
.item_content #content_container div {color: #00A19C;}
.item_content #content_container > ul, 
.item_content #content_container > ol, 
.item_content #content_container table, 
.item_content #content_container p, 
.item_content #content_container p {
    margin: 0;
}
/******************
MEDIAQUERIES
*****************/
@media screen and (max-width: 1100px){
	.menu > li > a{line-height: 62px; padding: 0 20px;}
}

@media screen and (max-width: 960px){
	body{margin: 90px 0 0;}
	
	#header{position: fixed; top: 0; left: 0; z-index: 900; background: #00A19C;-webkit-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); -moz-box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24); box-shadow: 0px 5px 13px 0px rgba(0,0,0,0.24);}
	
	.logo{margin: 10px 0; width: 250px; height: 70px;}
	.logo img{max-height: 70px;}
	
	.search_form input{height: 42px;}
	.search_form button{height: 42px;}
	
	.right_header{margin: 24px 0 0; max-width: calc(100% - 280px); width: 560px;}
	.rh_btns a{height: 42px; line-height: 42px; width: 42px; margin: 0 0 0 12px;}
	
	#menu{display: none;}
	
	.menu_btn{display: block;}
	.menu_btn.active i:before{content: "\f00d";}
	.menu{display: none;}
	#mobile-menu{float: left; display: block; position: fixed; display: inline-block; padding: 30px 20px; left: 0; top: 90px; height: calc(100% - 90px); width: 340px; max-width: 100%; background: #fff; z-index: 700; margin: 0 0 0 -340px; transition: 0.1s ease-in-out; -moz-transition: 0.1s ease-in-out; -webkit-transition: 0.1s ease-in-out; overflow: auto; -webkit-overflow-scrolling: touch;}
	#mobile-menu.active{margin: 0;}
	#mobile-menu > ul{float: right; width: 500px; max-width: 100%;}
	#mobile-menu > ul > li{float: left; width: 100%; margin: 0 0 15px;}
	#mobile-menu > ul > li:last-child{margin: 0;}
	#mobile-menu > ul > li > a{float: left; width: 100%; background: #0c1619; color: #fff; line-height: 16px; font-size: 15px; padding: 16px 20px; position: relative; border-radius: 30px; font-weight: 600;}
	#mobile-menu > ul > li > a:hover,
	#mobile-menu > ul > li.sub > a{background:#00A19C;}
	#mobile-menu > ul > li.sub > a i:before{content:"\f106"; font-family:"Font Awesome 6 Pro";font-weight:900;}

	#mobile-menu ul ul{display: none; float: left; width: 100%; border-radius: 30px; overflow: hidden; margin: 10px 0 0;}
	#mobile-menu ul ul > li{float: left; width: 100%; margin: 0}
	#mobile-menu ul ul > li > a{float: left; width: 100%; padding: 10px 25px; background: #eee; color: #202020;}
	#mobile-menu ul ul > li > a:hover{background: #00A19C; color: #fff;}

	#mobile-menu li.child > a i{float: left; position: absolute; right: 0; top: 0; height: 100%; width: 50px; text-align: center;}
	#mobile-menu li.child > a i:before{float: left; width: 100%; height: 30px; line-height: 30px; position: absolute; top: 50%; margin: -15px 0 0; left: 0; font-size: 20px; border-left: 1px solid rgba(255,255,255,0.3)}
	
	.slide_btns{margin: 20px 0 0}
	
	#footer{padding: 40px 0 0}
	.footer_left{width: 48%;}
	.footer_center{float: right; width: 48%;}
	.footer_right{width: 100%; margin: 0 0 20px;}
	.social_btns{text-align: center;}
	.social_btns a{height: 42px; line-height: 42px; width: 42px; margin: 0 0 0 12px;}

	.item_item {
        width: calc(100% - 30px);
        margin: 10px 15px;
    }

}

@media screen and (max-width: 850px){
	body{font-size: 15px;}
	#breadcrumbs {    font-size: 13px; line-height: 13px;	}
	h1,.h1{font-size: 24px}
	h2,.h2{font-size: 21px}
	h3,.h3{font-size: 19px}
	h4,.h4{font-size: 17px}
	h5,.h5{font-size: 16px}
	h6,.h6{font-size: 15px}

	.footer_center a {font-size: 15px;}

	.xl_btn{font-size: 15px; line-height: 16px; padding: 14px 30px;}
	
	.right_header{width: auto; max-width: none;}
	
	#header .search_form{display: none;}
	#mobile-menu .search_form{display: block;}
	.search_form{width: 100%; margin: 0 0 30px;}
	
	.slide_content .h1{font-size: 32px;}
	
	#content{padding: 0 0 40px 0;}
	.left_column{width: 100%; padding: 0;}
	.right_column{width: 100%;}
	
	.page_head{margin: 0 0 25px;}
	
	.rc_thumb{text-align: center; font-size: 0;}
	.rc_thumb a{width: 400px; max-width: 100%; float: none; display: inline-block;}
	}

@media screen and (max-width: 720px){
		
	.footer_left{display: none;}
	.footer_center{width: 100%; margin: 0 0 35px; padding: 0;}
}

@media screen and (max-width: 550px){
	body{margin: 60px 0 0;}
	
	#maxw1{padding: 0 10px;}
	
	#mobile-menu{top: 60px; height: calc(100% - 60px);}
	
	.logo{margin: 5px 0; width: 130px; height: 50px;}
	.logo img{max-height: 50px;}
	.right_header{margin: 12px 0 0;}
	.rh_btns{margin: 0;}
	.rh_btns a{height: 36px; line-height: 36px; width: 36px; margin: 0 0 0 6px; font-size: 14px;}
	
	#content_container .wpcf7 .form_item{padding: 0; margin: 0 0 25px;}
	#content_container .wpcf7 .form_label{margin: 0 0 6px; width: 100%;}
	
	.gallery_list a{width: calc(33.3333% - 12px);}

	.item_image {
        width: 100%;
        content: "";
        padding-bottom: 35%;
    }
	.item_content {
        width: 100%;
    }
}

@media screen and (max-width: 470px){
	
	.content_btns a{width: 100%;}
}