body{margin: 0; padding: 0;font-family: montserrat, sans-serif; background: #fff; color: #000; font-size: 14px; letter-spacing:0.045em} 
*{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: 600; text-transform:uppercase;}

h1,.h1{font-size: 36px}
h2,.h2{font-size: 30px}
h3,.h3{font-size: 25px}
h4,.h4{font-size: 20px}
h5,.h5{font-size: 16px}
h6,.h6{font-size: 14px}


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

.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: montserrat, sans-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;}



/**** Buttons ****/
.btn{display: inline-block; border: none; background: transparent; color: transparent; text-align: center;}
.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: 16px; line-height: 16px; padding: 21px 25px;}
.xl_btn{font-size: 16px; line-height: 16px; padding: 17px 30px;}

.btn.color_1{background: #070e15; color: #fff;}
.btn.color_1:hover{background: #eee; color: #202020;}
.btn.color_2{background: #070e15; color: #fff;}
.btn.color_2:hover{background: #eee; color: #202020;}
.btn.color_3{background: #070e15; color: #202020;}
.btn.color_3:hover{background: #202020; color: #f9f9f9;}

.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: 45px;}
.btn.xl_btn .right{margin-left: 45px;}


/**** Content container ****/
#content_container{line-height: 180%;}
#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.12em 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: #1f2020}
#content_container a:hover{color: #fff;}
#content_container p:first-child{font-size:128%}

.jspHorizontalBar{display: none!important}


/**** Header ****/
#header{float: left; width: 400px; position: fixed; top: 0; left: 0; height: 100%; background: #fff; z-index: 1; padding: 0 0 10px;}
.logo_block{font-size: 0; padding: 0 10px; height: 250px; text-align: center; display: table;}
.logo{display: table-cell; vertical-align: middle}
.logo img{max-height: 100%;}

.times_list{margin: 15px 0 0; line-height: 175%;}
.times_list > span{padding: 0 0 0 155px;}
.times_list > span span{float: left; width: 150px; margin: 0 0 0 -150px; font-weight: bold;}



/**** Menu ****/
@media screen and (min-width: 971px){
.menu{margin: 3px 0 0}
.menu > li{float: left; width: 100%; position: relative; margin: -3px 0 0;}
.menu > li.current-menu-parent > a,
.menu > li.current-menu-item > a{font-weight: bold;}
.menu > li.menu-item-has-children > a:after{content: "\f054"; font-family: fontawesome; font-weight: bold; float: left; position: absolute; height: 20px; line-height: 20px; top: 50%; right: 28px; margin: -10px 0 0; color: #eee}
.menu > li > a{float: left; width: 100%; padding: 30px; line-height: 24px; color: #1f2020; font-size: 22px; text-align: center; position: relative;}
.menu > li:hover > a{background: #eee}
.menu > li:hover > a:after{color: #1f2020}
.menu > li > a:before{content: "\00a0"; float: left; width: 66px; height: 3px; background: #ebe9e8; font-size: 0; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto;}
.menu > li:last-child > a:before{display: none;}
.menu > li:hover > ul{display: block}
.menu ul{float: left; background: #fff; position: absolute; left: 0; top: calc(100% - 3px); width: 100%; z-index: 2; background: #eee; white-space: nowrap; display: none; -webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.2); -moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.2); box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.2);}
.menu ul li{float: left; width: 100%;}
.menu ul li a{float: left; width: 100%; padding: 15px 30px; line-height: 20px; font-size: 15px; color: #1f2020;}
.menu ul li a:hover{background: rgba(255,255,255,0.3); color: #1f2020;}
.menu ul li:last-child a{border: none;}
.menu ul ul,
.menu ul ul ul{display: none;}
}

.menu_btn{display: none;}
#mobile-menu{display: none;}

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


/**** Social ****/
.social{text-align: center; margin: 50px 0 40px;}
.social a{display: inline-block; width: 50px;  vertical-align: top; margin: 0 2px; color: #837b76; font-size: 26px;}
.social a:hover{color: #1f2020;}

.contact_info .social{text-align:left; margin-bottom:0}

.cert {text-align:center; padding: 0 20px;}
.cert img{max-width:200px;}


/**** Slider ****/
#slider{float: left; width: calc(100% - 1130px); position: fixed!important; z-index: 1; top: 0; right: 0; height: 100%; background: #575756; overflow: auto;}
.slide{position: absolute; left: 0; top: 0; height: 100%;}
.cycle-pager{position: absolute; left: 40px; bottom: 30px; z-index: 200; display:none}
.cycle-pager span{float: left; width: 12px; height: 12px; border-radius: 100%; margin: 0 8px 0 0; cursor: pointer; font-size: 0; background: #fff;}
.cycle-pager span.cycle-pager-active{background: #1c2a37}



/**** Content ****/
#content{float: left; width: 730px; position: fixed; top: 0; left: 400px; height: 100%; background: #8e7e76; color: #fff;}
.content_scroll{height: 100%; position: relative; left: 0; top: 0; overflow: auto;}
.content_scroll_container{padding: 160px 80px 40px 70px;}

.right_column{float: left; width: 100%; margin: 40px 0 0}

.page_head{float: left; width: 100%; margin: 0 0 35px;}
.page_head span{font-weight: 300;}

.contact_info{background: #fff; padding: 35px; color: #1f2020}
.contact_info .h3{color: #8e7e76; 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: #8e7e76}
.contact_info li a{color: #1f2020}
.contact_info li a:hover{color: #1d9fca}
.contact_info .route_btn{margin: 25px 0 0;}

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

.rc_usps{margin: 45px 0 0;}
.rc_usps span{float: left; width: 100%; line-height: 16px; font-size: 114%; font-weight: 600; padding: 14px 0 14px 75px;}
.rc_usps span:before{content: "\f00c"; font-family: fontawesome; font-weight: bold; float: left; line-height: 16px; margin: 0 0 0 -42px; color: #8e7e76}


/**** Content btns ****/
.content_btns{margin: 30px 0 0;}
.content_btns a{float: left; margin: 10px 15px 0 0;}
.content_btns.btn_128 .btn{width:210px; text-align:center;     display: block;    float: none;}
.content_btns.btn_128 .btn_3, .content_btns.btn_128 .btn_4 {
    margin-left: 60px;
    padding: 15px;
}

.front_page .content_btns{padding:0 80px; text-align:right}
.front_page .content_btns a{float:right; margin: 10px 0 0 15px}

/**** 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;}
#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;}
#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: red!important;}
div.wpcf7-response-output{float: left; width: 100%; margin: 10px 0 0!important; border: none!important; padding: 10px 20px!important; color: red; background:#fff; }
div.wpcf7-response-output.wpcf7-validation-errors{color: red;}


/**** Galerij ****/
.gallery_block{background: #898988; padding: 25px; margin: 40px 0 0}
.gallery_list{float: left; width: calc(100% + 12px); margin: -6px;}
.gallery_list a{float: left; width: calc(33.3333% - 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: #fff; margin: 15px 0 15px;}
.faq_item{margin: 0 0 20px;}
.faq_item:last-child{margin: 0;}
.faq_question{background: #898988; cursor: pointer; padding: 15px 50px 15px 15px; font-weight: bold; position: relative; border-bottom: 1px solid #fff}
.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: #fff; margin: 0 0 15px;}
.download_item{background: #898988; cursor: pointer; padding: 15px 15px 15px 60px; font-weight: bold; position: relative; border-bottom: 1px solid transparent; margin: 0 0 5px; color: #fff}
.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 #fff;}
.download_item:hover{border-color: #fff}


/**** Item list ****/
.item_list{float: left; width: calc(100% + 16px); margin: 15px -8px;}
.item_item{float: left; width: calc(50% - 16px); margin: 12px 8px; border-bottom: 3px solid #898988; background: #fff}
.item_item:hover{border-color: #202020}
.item_item:hover .item_title{background: #202020}
.item_image{padding: 50% 0 0;}
.item_title{height: 60px; padding: 0 20px; background: #898988; color: #fff;}
.item_title h4{height: 60px; display: table;}
.item_title h4 span{display: table-cell; vertical-align: middle}
.item_content{padding: 15px 20px;}
.item_content #content_container{font-size: 93%; height: 100px; overflow: hidden; position: relative; color: #202020}
.item_content #content_container:after{content: "\00a0"; float: left; width: 100%; position: absolute; left: 0; bottom: 0; height: 60px; background: url(img/overlay.png) repeat-x center / auto 60px; }





/******************
MEDIAQUERIES
*****************/
@media screen and (max-width: 1300px){
	#header{width: 350px;}
	#content{width: 600px; left: 350px;}
	#slider{width: calc(100% - 950px);}
}

@media screen and (max-width: 970px), screen and (max-height: 650px){
	#maxw1{max-width: 700px; padding: 0 40px;}
	
	body{margin: 80px 0 0; background: #40281f}
		
	#header{width: 100%; height: 80px; z-index: 800; padding: 0 20px; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);}
	
	.logo_block{width: auto; height: 80px; margin: 0; padding: 0;}
	.logo img{height: 70px; max-height: 100%;}
	
	.menu_btn{display: block; color: #40281f; float: right; height: 50px; line-height: 50px; width: 50px; text-align: center; margin: 15px 0 0; font-size: 30px;}
	.menu_btn.active i:before{content: "\f00d";}
	.menu{display: none;}
	.social {text-align: center; margin-top: 25px; float: left;  font-size: 28px; width: calc(100% - 400px);}
	.cert{width:150px; float:left; margin-top:15px;}
	.cert a{display:inline-block}
	.cert a img{max-width:100%}
	#mobile-menu{float: left; display: block; position: fixed; display: inline-block; padding: 40px 0; left: 0; top: 80px; height: calc(100% - 80px); 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 .social{display: none;}
	#mobile-menu .cert{display: none;}
	#mobile-menu ul{float: left; width: 100%; font-size: 17px; font-weight: 300; background: #fff;}
	#mobile-menu ul ul{padding: 0 0 0 20px; display: none; background: #eee}
	#mobile-menu li{float: left; width: 100%;}
	#mobile-menu li a{float: left; width: 100%; color: #1f2020; line-height: 20px; font-size: 16px; padding: 15px 20px; position: relative; border-bottom: 1px solid #eee}
	#mobile-menu > ul > li:first-child{border-top: 1px solid #eee}
	#mobile-menu > ul > li > a:hover{background: #1f2020!important; color: #fff!important}
	#mobile-menu ul ul a{font-size: 15px; line-height: 18px; padding: 10px 20px;}
	#mobile-menu ul ul ul a{background: #c5dc9f}
	#mobile-menu li.child > a i{float: left; position: absolute; right: 0; top: 0; height: 100%; width: 40px; text-align: center;}
	#mobile-menu li.child > a i:before{float: left; width: 100%; height: 20px; line-height: 20px; position: absolute; top: 50%; margin: -10px 0 0; left: 0;}
	#mobile-menu li.sub > a{background: #1f2020!important; color: #fff!important}
	#mobile-menu li.sub > a > i:before{content:"\f056";}	
	
	#slider{width: 42%; top: 80px; height: calc(100% - 80px);}
	#content{width: 58%; left: 0; top: 80px; height: calc(100% - 80px);}
	
	.content_scroll_container{padding: 70px 30px 40px;}
	.front_page .content_btns{padding:0 30px;}
	.knoppen_block a{width: 100%;}
}


@media screen and (max-width: 850px){
	
	body{font-size: 13px;}
	
	h1,.h1{font-size: 24px}
	h2,.h2{font-size: 22px}
	h3,.h3{font-size: 20px}
	h4,.h4{font-size: 18px}
	h5,.h5{font-size: 16px}
	h6,.h6{font-size: 14px}
	.l_btn{font-size: 15px; line-height: 16px; padding: 14px 15px;}
	.xl_btn{font-size: 15px; line-height: 16px; padding: 14px 15px;}
	
	#header .cert{display: none;}
	.social { width: calc(100% - 250px);}
	#mobile-menu .cert{display: block; width:100%}
	#mobile-menu .cert img{width:150px}
	
	@media screen and (min-width: 651px), screen and (max-width: 450px){
		#content_container .wpcf7 .form_item{padding: 0; margin: 0 0 25px;}
		#content_container .wpcf7 .form_label{margin: 0 0 6px; width: 100%;}
	}
}

@media screen and (max-width: 650px){
	
	#slider{position: relative!important; left: 0; top: 0; height: auto; width: 100%;}
	.slide{padding: 275px 0 0;}
		
	#content{width: 100%; position: static; height: auto;}
	
	.content_scroll_container{padding: 45px 15px 40px;}
}

@media screen and (max-width: 550px){
	body{font-size: 13px; margin: 60px 0 0}
	
	#header{height: 60px; padding: 0 10px;}
	.logo_block{height: 60px;}
	.logo img{height: 52px;}
	
	#header .social{display: none;}
	#mobile-menu .social{display: block;}
	.social{width: 100%; margin: 30px 0 0}
	
	.menu_btn{margin: 5px 0 0}
	
	#mobile-menu{height: calc(100% - 60px); top: 60px;}
	
	.page_head{margin: 0 0 25px;}
	
}

::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #aa9a92;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #6d6059;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #6d6059;
}