/*
	Theme Name: Zoo Elements Template
	Theme URI: https://www.earthbee.nl
	Description: Basis voor de website
	Version: 1.0
	Author: Studio Earthbee
	Author URI: https://www.earthbee.nl

*/


a:before,a, a:after, input,button, h1, h2, h3, h4, .side-cta > div:before,.video-box-url:before, .more-projects-item:before,p,.project-nav, label, .logo-slide img  {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
	outline:0
}


/*------------------------------------*\
    MAIN

font-family: 'Zilla Slab', serif;
font-family: 'Josefin Sans', sans-serif;
\*------------------------------------*/

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}

h1, h2,h3, h4, h5, h6 {
    margin: 0 0 25px;color:#000; font-size:40px; font-weight:700;line-height:1.2; text-transform:uppercase;font-family: 'Josefin Sans', sans-serif;
    font-size: 40px;    font-weight: 700;letter-spacing:2px;
}
h2.with-subtitel {margin:0}
h3.subtitel {
    font-size: 30px;
    color: #e10b0b;
    font-family: 'Zilla Slab', serif;

    font-weight: 300;
    text-transform: none;
    margin: 0 0 20px;
}

.black-box h1, .black-box h2, .black-box h3, .black-box h4, .black-box h5, .black-box h6 {color:#fff}
.black-box, .black-box p {color:#d6d6d6}

body {font-size: 19px;    line-height: 1.5;color:#5d5d5d;font-family: 'Lato', sans-serif;
}

p {    font-size: 19px;    line-height: 1.5;}


.title-box h1, .title-box h2, .title-box h4 {display:inline-block;position:relative;margin-bottom:35px}


@media screen and (max-width:767px){
h1, h2,h3, h4, h5, h6 {    margin: 0 0 15px; font-size:23px;}	
	body, p {font-size:16px}
}

/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}

.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:#e10b0b;
	text-decoration:none;
}
.layout-row a {font-weight:800}
a:hover {
	color:#000;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/
.nomargin,.no-margin {margin-bottom:0!important;}
.marginfix, .margin-fix, .margin-box, .marginbox {margin-bottom:35px!important}

.end-box {margin-bottom:30px;}

.textcenter, .text-center {text-align:center;}
/* wrapper */
.wrapper {
	max-width:1500px;
	width:100%;
	margin:0 auto;
	position:relative;
}

p { margin:0 0 25px}
p:last-child {margin:0}

strong {text-transform:none;color:#000}


.center-align{
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;	
  -moz-align-items:center;
  -ms-align-items:center;
}


.video-box-url {    display: block;    position: relative;}
.video-box-url:before {    content: "";
    width: 60px;
    height: 60px;
    position: absolute;
    left: calc(50% - 30px);
    top: calc(50% - 30px);
    z-index: 10;
    border-radius: 50%;
    background-color: #fff;
    opacity: 1;
    -webkit-box-shadow: 0px 0px 0px 20px rgba(35, 151, 57, 0.28);
    -moz-box-shadow: 0px 0px 0px 20px rgba(35, 151, 57, 0.28);
    box-shadow: 0px 0px 0px 20px rgba(35, 151, 57, 0.28);}
.video-box-url:hover:before {    -webkit-box-shadow: 0px 0px 0px 0 rgba(35, 151, 57, 0.28);
    -moz-box-shadow: 0px 0px 0px 0 rgba(35, 151, 57, 0.28);
    box-shadow: 0px 0px 0px 0 rgba(35, 151, 57, 0.28);}
/*------------------------------------*\
    layouts
\*------------------------------------*/
.regular-padding {padding: 60px 0 35px;}
.no-padding-top{padding:0 0 35px}
.no-padding-bottom{padding: 60px 0 0}
.no-padding-both {padding:0;}

.layout-row img {width:100%}

.layout-row {background-size:cover;background-position:center center;position:relative;}
.layout-row:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;}
.white-box:before {background-color:#fff;opacity:0.8;}
.black-box:before {background-color:#000;opacity:0.6;}

.black-box {    background-color: #1d1d1d;}
.white-box {    background-color: #fff;}

.row {    position: relative;}

.layout-row-with-image {background-size:cover;background-position:center center;background-repeat:no-repeat;}


.video-box { 
		position: relative; 
		padding-bottom: 56.25%;
		overflow: hidden;
		max-width: 100%;
		height: auto;
	} 

	.video-box  iframe,
	.video-box  object,
	.video-box  embed { 
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
.gal-image a.video-box-url {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
}
.video-box-url:after {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 24px solid black;
    content: "";
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 15px);
    z-index: 10;
}

.gal-image {
    padding-bottom: 100%;
    margin-bottom: 20px;
    background-size: cover;
    background-position: center center;
    position: relative;
}

.gal-image .overlay {opacity:0;background:#000}
.gal-image:hover .overlay {opacity:0.6}


.review-holder {position:relative;}

.review-slider-single {
    padding-right: 40px;
    padding-left: 40px;

    padding-top: 70px;
    padding-bottom: 70px;
    text-align: center;
   /* background-color: rgba(251, 251, 251, 0.25);*/
}
.review-slide h3 {font-size: 35px;}





p.review-naam {
    font-size: 24px;
    color: #e10b0b;
    font-family: 'Zilla Slab', serif;
    font-weight: 300;
    text-transform: none;
    margin: 0;
}
.review-slide p {
    font-size: 30px;
}

.review-holder i:first-child {
    position: absolute;
    font-size: 50px;
    color: #000;
    right: 30px;
    bottom: 20px;
    z-index: 1000;
}
.review-holder i:last-child {
    position: absolute;
    font-size: 50px;
    color: #000;
    left: 30px;
    top: 20px;
    z-index: 1000;
}
.black-box .review-holder i:last-child, .black-box .review-holder i:first-child {
    color: #fff!important;
}
.with-line .review-holder {
    border-top: 1px solid #242424;
    margin-top: 20px;
}



.kol-image {margin-bottom:20px}
.kol-content h2 {font-size:30px;margin:0;}

@media screen and (min-width:768px){
	.medium-2-third {width:66.666667%}
	.medium-third {width:33.33333%}
	.double-col:nth-child(1) {padding-right:30px;}
	.double-col:nth-child(2) {padding-left:30px;}
}

@media screen and (max-width:991px){
	.double-col:nth-child(1) {padding-right:10px;}
	.double-col:nth-child(2) {padding-left:10px;}
	
	p.review-naam {font-size: 26px;}
	.review-slide p {    font-size: 26px;line-height:1}
	
	.review-slide p {
    font-size: 25px;
}
}

@media screen and (max-width:767px){
		
	p.review-naam {font-size: 22px;}
	.review-slide p {    font-size: 22px;}
	.review-slide p {
    font-size: 20px;
}s
}

/*------------------------------------*\
    404
\*------------------------------------*/
.error-row h1 {    font-size: 65px;}

.slick-slide {outline:none;outline:0}



/*------------------------------------*\
    PROJECTEN
\*------------------------------------*/
.archive-row {padding:30px 0 0}
.searchandfilter ul, .searchandfilter li, .searchandfilter ul li {display:inline-block;float:left;}
.searchandfilter ul {    width: 100%;}
.searchandfilter ul li {padding:0}
li.sf-field-taxonomy-filters li {    width: 20%;}
li.sf-field-taxonomy-filters {width:83.33333%}
li.sf-field-reset {width:16.666667%;padding:5px 0!important}

input[type="checkbox"] {display:none;}

.searchandfilter label {
    padding: 10px!important;
    background: #bdbdbd;
    display: block;
    text-align: center;
    width: 98%;
    margin-left: 1%;
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 600;cursor:pointer;
}

.searchandfilter li:hover > label, .searchandfilter input[type="checkbox"]:checked ~ label, a.search-filter-reset:hover {background:#000}
a.search-filter-reset {
    padding: 10px!important;
    background: #e10b0b;
    display: block;
    text-align: center;
    width: 98%;
    margin-left: 1%;
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 600;
}



.pagination {    padding: 0 70px;position:relative;margin-top:40px;margin-bottom:50px}
.page-numbers {
    width: 45px;
    height: 45px;
    display: inline-block;
    line-height: 1;
    font-size: 20px;
    font-weight: 800;
    border: 2px solid #d6d6d6;
    color: #d6d6d6;
    border-radius: 50%;
    padding-top: 10px;
    margin: 0 5px;
}
a.page-numbers:hover, a.page-numbers:focus,.page-numbers.current {border-color:#000;background-color:#000;color:#fff}
a.next.page-numbers { display:none;   position: absolute;    right: 0;top:0;}
a.prev.page-numbers { display:none;    position: absolute;    left: 0;top:0;}


ul.slick-dots {    display: block;    float: left;    width: 100%;    padding: 0 5px;    text-align: center;}
ul.slick-dots li {display:inline-block;margin:0 5px;}
ul.slick-dots li button {
    text-index:-99999px;overflow:hidden;font-size:0;width:15px;height:15px;display:inline-block;border-radius:50%;    background-color: #CBCBCB;
}
ul.slick-dots li:hover button, ul.slick-dots li.slick-active button {background-color:#e10b0b}

@media screen and (max-width:900px){
	li.sf-field-taxonomy-filters li,
	li.sf-field-taxonomy-filters,
	li.sf-field-reset {width:100%}
	
	li.sf-field-taxonomy-filters li{width:50%;}
	li.sf-field-taxonomy-filters li:last-child {width:100%}
}

/*------------------------------------*\
    SINGLE
\*------------------------------------*/
.galerij-holder {margin-bottom:15px;}
.galerij-media {margin-bottom:20px}

.post-content .firstbox h1 {    font-size: 45px;margin:0; }
.post-sidebar, .post-sidebar p {
    font-size: 17px;
    line-height: 1.4;
}

ul.post-info,  ul.post-info li {padding:0;margin:0;list-style:none}
.post-content ul.post-info {margin:0 0 15px;}
.post-content ul.post-info:last-child {margin:0}
.post-content ul.post-info li {       display: inline-block;
    margin-right: 10px;
    font-size: 30px;
    color: #e10b0b;
     font-family: 'Zilla Slab', serif;
    font-weight: 300;
    text-transform: none;}
.post-content ul.post-info li {
    position: relative;
    padding-left: 15px;
}
.post-content ul.post-info li:before {content:"";width:6px;height:6px;position:absolute;left:0;top:calc(50% - 3px);border-radius:50%;    background: #e10b0b;}


.post-content {width:calc(100% - 340px)}
.post-sidebar {	width: 320px;position:relative;z-index:1}
.post-sidebar {    margin-top: -100px;    margin-left: 20px;}

.post-sidebar > div {    background: #f1f1f1;    padding: 20px;margin:0 0 25px}
.post-sidebar h4 {font-size:19px;margin:0 0 10px}
.int-kort-box h4 {    margin-top: 15px;}

.nieuws-image {background-size:cover;background-position:center center; background-color:#ffff;position:relative;}
.post-content {    padding: 60px 0 35px;}

.nieuws-content h3 {font-size:20px;margin:0}
.nieuws-content p {font-size:15px;line-height:1.4}

p.date {    margin: 0;}


.latest-box {margin:0 0 20px;}
.latest-box:last-child {margin:0}
.latest-box .nieuws-image {width:80px;min-height:80px;}
.latest-box .nieuws-content {width:calc(100% - 80px);padding-left:15px}
.latest-box p {color:#656565}
.latest-box p.date {    font-size: 14px;    margin: 0 0 5px;    color: #000;}


.post-sidebar .taxlist-box {padding-left:20px;padding-right:20px;margin-bottom:25px}
.taxlist-box li {margin:3px 0;}
.taxlist-box a {position:relative;padding-left:25px;}

.cat-img {position:absolute;width:20px;height:20px;background-size:cover;background-position:center center;background-color:#000;background-repeat:no-repeat;left:0;top:50%;top:calc(50% - 10px)}


.post-sidebar .back-btn {    background: none;    padding: 0;}
.post-sidebar .back-btn .btn {    width: 100%;    min-width: auto;}


.gerelateerd h2 {color:#fff;font-size:40px}

.gerelateerd {background:#000;position:relative;padding:60px 0 35px }
.gerelateerd:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#000;opacity:0.8;z-index:1;}
.gerelateerd .wrapper {z-index:10}
.gerelateerd .nieuws-image {    padding-bottom: 50%;    min-height: 150px;background-color:#f1f1f1}
.gerelateerd .nieuws-content {    padding: 35px 20px 20px;    background: #fff;}


.project-holder {padding:10px 5px}
.more-projects {background:none;position:relative;padding:0 5px}
.more-projects-title {position:absolute;top:-20px;left:0;width:100%;z-index:10}
.more-projects-title h3 {    display: inline-block;
    background: #000;
    color: #fff;
    line-height: 1;
    font-size: 20px;
    padding: 15px 25px 10px;
    border-bottom: 3px solid #eaeaea;}
.more-projects-item {position:relative;padding:50px 20px;background-size:cover;background-position:center center;background-color:#000;}

.more-projects-holder {
    margin-top: 20%;
  
}
.more-projects-holder > div {
   background: #fff;
    padding: 20px 15px;
    float: none;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.more-projects-holder h3 {
    font-size: 20px;
    margin: 0 0 5px;
}
.more-projects-holder h3, .more-projects-holder h3 a {color:#000}

.more-projects-holder p {
    color: #afafaf;
    font-size: 17px;
}
.more-projects-item:before {content:"";width:100%;height:100%;background:#000;position:absolute;opacity:0.4;left:0;top:0;z-index:1}
.more-projects-item:hover:before {opacity:0.1}
.more-projects-item:hover h3 a {color: #e10b0b;}
.more-projects-item:hover .more-projects-holder p {color:#7d7d7d}
.more-projects-holder {position:relative;z-index:2}
.more-projects-item .overlay {z-index:10}


.project-slider {position:relative;}
.project-nav {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #000;
    color: #fff;
    position: absolute;
    font-size: 25px;
    z-index: 100;
    line-height: 1;
    padding-top: 6px;
    text-align: center;
    font-weight: normal;
	top:calc(50% - 20px);
}
.project-nav:hover, .project-nav:focus {    background: #e10b0b;}

.project-prev {left:2px;}
.project-next {right:2px;}

.cat-icon {    width: 60px;    height: 60px;    position: absolute;    bottom: -30px;    left: calc(50% - 30px);    background: #fff;    border-radius: 50%;    border-bottom: 3px solid #ddd;}
.cat-icon div {    background-position: center center;    background-repeat: no-repeat;    background-size: cover;    width: 66%;    height: 66%;    margin-left: 17%;
    margin-top: 17%;}



.nieuws-box {margin:0 0 25px}



.taxlist-box .tag-links li {
    display: inline-block;margin:2px
}
.taxlist-box .tag-links a {
    padding: 7px 15px;
    border-radius: 5px;
    background: #e10b0b;
    color: #fff;display:block;
}
.taxlist-box .tag-links a:hover, .taxlist-box .tag-links a:focus {background:#000}



.side-cta > div {background-size:cover;background-position:center center;position:relative;padding: 25px;}
.side-cta > div:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#000;opacity:0.4;}
.side-cta > div:hover:before {opacity:0.6}

.side-cta h3 {
    color: #fff;
    font-size: 22px;
    margin: 0;
       line-height: 1.2;
    text-align: center;position:relative;z-index:1;
}
.side-cta .overlay {z-index:10}












@media screen and (min-width:768px){
	.nieuws-box {    width: 33.3333%;}
	
}


@media screen and (max-width:767px){
	.post-content {width:100%}
	.post-sidebar {width:100%;margin:0}
	
}
/*------------------------------------*\
    uls a& lis
\*------------------------------------*/
ul, ol, li {
padding:0; margin:0; list-style:none	
}


/*------------------------------------*\
    BUTTONS
\*------------------------------------*/


.btn {
    color: #fff;
    border: none;
    outline: none;
        padding: 15px 30px;
    display: inline-block;
	font-size:23px; text-transform:uppercase; font-weight:normal;
    min-width:270px;text-align:center;line-height: 1;
	background-color:#e10b0b;
	    font-family: 'Zilla Slab', serif;
    font-weight: 600!important;
}

.btn:hover, .btn:focus {
   color:#fff	;background-color:#000000
}
.overlay {content:"";position:absolute; top:0; left:0; width:100%; height:100%;  z-index:1;}


/*------------------------------------*\
    BANNER
\*------------------------------------*/
.layout-cta:before {content:"";position:absolute; top:0; left:0; width:100%; height:100%; opacity:0.8; z-index:1; background-color:#000}


.banner {min-height:550px; background-size:cover;background-position:center center;background-color:#CCC; background-repeat:no-repeat; position:relative;padding:300px 0 180px;overflow:hidden}
.banner:before{content:"";position:absolute; top:0; left:0; width:100%; height:100%;z-index:1}
.dark-overlay:before, .light-overlay:before{background:#000;opacity:0.8}
.light-overlay:before{opacity:0.4}
.banner.img-banner {min-height:auto!important;padding:0!important}

.banner .wrapper {position:relative;z-index:10;}

.img-banner {padding:0}
.banner img {    width: 100%;}
.img-banner .banner-video-intro {    display: block;    width: 100%;}

article.img-banner-content {
    position: absolute;
    left: 0;width:100%
}
.banner h1, .banner h2 {font-size:72px;color:#fff;margin:0;}
.banner .banner-with-btns h1 {margin-bottom:50px;}
.banner h2, .banner p {color:#fff}

.banner h3 {
    color: #fff;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    text-transform: none;
    font-size: 22px;margin:10px 0 0;
}


.banner-video-intro {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 1;
}

.regular-video-banner .banner-video-intro{position:relative;}
.regular-video-banner .img-banner-content , .img-banner.no-overlay .img-banner-content {
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    z-index: 200;
    height: 100%;
	  display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;	
  -moz-align-items:center;
  -ms-align-items:center;
}
.regular-video-banner:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;opacity:.6;background:#000;z-index:1}


@media screen and (max-width:767px){
	.banner {padding:100px 0}
}

@media screen and (max-width:1100px){
.banner h1, .banner h2 {font-size:52px;}
	
}

@media screen and (max-width:767px){
.banner h1, .banner h2 {font-size:35px;}
	.banner {min-height:400px }	
	
	.img-banner .btn {display:none}
	.banner .banner-with-btns h1, .banner .banner-with-btns h2 {margin-bottom:0;}

}
.grecaptcha-badge {visibility:hidden}

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

	.banner.img-banner {
    min-height: 360px !important;
    padding: 0 !important;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    background-color: #1d1d1d;
}
}

/*------------------------------------*\
    HEADER
\*------------------------------------*/
.header {position:fixed;width:100%;left:0;z-index:9000}
.header-logo {width:180px}
.desktopnav {width:calc(100% - 180px);margin-top:25px}


.topbar li {display:inline-block;margin:0 5px;}
.topbar li:first-child {margin-left:0;}
.topbar li:last-child {margin-right:0;}

.topbar a, .topbar {color:#fff;font-size:18px}

.topbar a {
    width: 27px;
    height: 27px;
    display: inline-block;
    text-align: center;
    /* border: 1px solid; */
    position: relative;
}
.topbar a:before {z-index:-1;width:100%;height:100%;border:1px solid #fff;background-color:transparent;content:"";position:absolute;left:0;top:0}
.topbar a:hover:before {background-color:#fff}

.topbar a:hover, .topbar a:focus   {color: #e10b0b;}
.header-logo > div {    background: none;    padding: 15px;}

.phone i {margin-right:5px}




.nav-holder {    margin-top: 15px;}

.nav-holder li {display:inline-block;position:relative;}
.nav-holder >ul>li {margin:0 20px;}
.nav-holder >ul>li:first-child {margin-left:0;}
.nav-holder >ul>li:last-child {margin-right:0;}

.nav-holder a {font-size:25px;text-transform:uppercase;font-weight:900;color:#fff;padding:5px 0;}
.nav-holder a:hover, .nav-holder a:focus, .nav-holder .current-menu-ancestor > a, .nav-holder .current-menu-item > a {color: #e10b0b;}

.desktopnav .nav-holder {text-align:right}
.fixed-header .nav-holder {    margin-top: 28px;}


.desktopnav .sub-menu {display:none;padding:5px;
position:absolute;background:#fff;   width: 200px;left:calc(50% - 100px);top:35px}
.nav-holder li:hover .sub-menu {display:block}

.nav-holder .sub-menu li {display:block;text-align:center;border-bottom:1px solid #afafaf}
.nav-holder .sub-menu li:last-child {border:none}
.nav-holder .sub-menu a {color:#000;font-size:15px;font-weight:600;padding:5px;text-transform:none;line-height:1;display:block}
.nav-holder .sub-menu a:hover, .nav-holder .sub-menu a:focus, .nav-holder .sub-menu .current-menu-item > a {color: #e10b0b;}



.header {background-color:transparent}

.fixed-header .header-logo {    width: 120px;}

.fixed-header .header-logo > div {
    background: rgba(0, 0, 0, 0);
    padding: 5px 5px 10px 15px;
}

.fixed-header .desktopnav {width: calc(100% - 120px);    margin-top: 0;}
.fixed-header {background-color:#fff;border-bottom:1px solid #f1f1f1}
.fixed-header .nav-holder a {color:#000}
.fixed-header .nav-holder a:hover, .fixed-header .nav-holder a:focus, .fixed-header .nav-holder .current-menu-item > a, .fixed-header .nav-holder .current-menu-ancestor > a {color: #e10b0b;}

.header-logo a {    position: relative;    display: block;}

.regular-logo {opacity:1;}
.fixed-header .regular-logo {opacity:0;}
.fixed-logo {position:absolute;top:0;left:0;opacity:0;}
.fixed-header .fixed-logo {opacity:1;}




.mobile-holder {display:none;width:calc(100% - 200px);}
.mobile-holder > div {text-align:right}

.mobile-holder li {margin:0 5px;display:inline-block}
.mobile-holder li:last-child {margin-right:0;}

.mob-social li.phone {
    width: 100%;
    line-height: 1;
    margin-bottom: 9px;
}



.mobile-holder a {color:#fff;}
.fixed-header .mobile-holder a {color:#000;}
.mobile-holder a:hover, .mobile-holder a:focus {color: #e10b0b;}
.fixed-header .mobile-holder {width:calc(100% - 120px);}


.menu {
  cursor: pointer;
  margin: 0 auto;
  padding-left: 0;
  position: relative;
  width: 50px;
  height: 50px;
}
.menu-global {
  backface-visibility: hidden;
  position: absolute;
  left: 0;
  border-top: 5px solid white;
  width: 100%;
  transition: 0.55s;
}
.menu-top {
  top: 0;
}
.menu-middle {
  top: 23px;
}
.menu-bottom {
  top: 45px;
}
.menu-top-click {
  backface-visibility: hidden;
  top: 22px;
  transform: rotate(50deg);
  transition: 0.55s 0.5s;
}
.menu-middle-click {
  opacity: 0;
}
.menu-bottom-click {
  backface-visibility: hidden;
  top: 22px;
  transform: rotate(-410deg);
  transition: 0.55s 0.5s;
}
.mob-btn {
        width: 80px;
    margin-top: 10px;    float: right;
}
.mob-social {width:calc(100% - 80px);}
.mobile-holder {    margin-top: 25px;}
.fixed-header .mobile-holder {    margin-top: 15px;}
 .fixed-header .menu-global {    border-color:#000}

.sidenav {right:-250px;background:#fff;position:fixed;top:0;width:250px;height:100%;    z-index: 999;padding:20px;}


.mobnav-holder li, .mobnav-holder ul, .mobnav-holder a {display:block;position:relative;}
.mobnav-holder .sub-menu {display:none;}

.mobnav-holder a {border-bottom:1px solid #f3f3f3;padding:5px 10px;color:#000;font-size:22px;text-transform:uppercase;font-weight:900;} 
.mobnav-holder > ul:last-child > li:last-child > a {border:none} 
.mobnav-holder .sub-menu a {    font-size: 16px;    font-weight: 500;    padding-left: 20px;    text-transform: none;}
.mobnav-holder a:hover, .mobnav-holder a:focus, .mobnav-holder .current-menu-item > a, .mobnav-holder .current-menu-ancestor > a {color: #e10b0b;}

.mobnav-holder .menu-item-has-children > span {position:absolute;right:0;top:0;width:44px;height:44px;cursor:pointer}
.mobnav-holder .menu-item-has-children > span:after, .mobnav-holder .menu-item-has-children > span:before {width:2px;height:30%;background:#000;position:absolute;top:35%;    right: 10px;content:"";}
.mobnav-holder .menu-item-has-children > span.open:after {display:none}

.mobnav-holder .menu-item-has-children > span:before {  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg); 
  transform: rotate(90deg); }


.side-socials {text-align:center;margin-top:40px;}
.side-socials li {    display: inline-block;float:left;width:25%}
.side-socials li.phone {    display: block;    text-align: center;    width: 100%;    margin-top: 10px;    font-size: 22px;    font-weight: 600;    color: #444;} 

.side-socials li.phone i{    color: #e10b0b;}

.side-socials a:before {
    z-index: -1;
    width: 100%;
    height: 100%;
    border: 1px solid #444;
    background-color: transparent;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}
.side-socials a {
    width: 37px;
    height: 37px;
    display: inline-block;
    text-align: center;
    /* border: 1px solid; */
    position: relative;
    color: #444;
    font-size: 24px;
}
.side-socials a:hover {background:#444;color:#fff}


@media screen and (max-width:900px){
.mobile-holder {display:block}
	.desktopnav {display:none}

	header.active-hamburger {left:-250px;}
	.sidenav.active-hamburger {right:0;}
	
	
	.header-logo {
    width: 130px;
}
	.mobile-holder {
    width: calc(100% - 130px);
}
}


@media screen and (min-width:768px){
	.desktopnav:last-child .topbar {text-align:right}
}

@media screen and (max-width:767px){
	.mob-social {display:none!important}
	.mobile-holder {    margin-top: 20px;}
	.fixed-header .mobile-holder {    margin-top: 2px;}
}


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



.header-logo, .header-logo > div, .desktopnav, .header, .mobile-holder, .sidenav, .header-logo img, .nav-holder  {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
	outline:0
}

/*------------------------------------*\
    FOOTER
\*------------------------------------*/
footer {background-color:#000;padding:70px 0 35px;position:relative;background-image:url('img/footer.gif');overflow:hidden}
footer:before {width:100%;height:100%;content:"";position:absolute;background:#000;z-index:1;opacity:0.9;top:0;left:0}

footer .wrapper, .footer-bottom {position:relative;z-index:10;}

footer, footer p, footer a, footer h4 {color:#fff}
footer, footer p {font-size:16px}
footer a:hover, footer a:focus {color:#ccc}

footer h4 {
	font-size:26px;
    color: #e10b0b;
	font-family: 'Lato', sans-serif;font-weight:900;
	text-transform:uppercase;font-size:18px;
	margin:0 0 10px;
}

footer> .wrapper {margin-bottom:50px}
.footer-widget {    margin: 0 0 25px;    text-align: center;}


.footer-ending {    text-align: center;    margin-bottom: 50px;}
.footer-ending h4 {    color: #fff;    font-size: 38px;font-family: 'Poppins', sans-serif;display:inline-block;position:relative;margin-bottom:15px;}
.footer-ending h4:after, .footer-ending h4:before {content:"";height:2px;width:60px;background:#fff;position:absolute;top:50%;top:calc(50% - 1px);}
.footer-ending h4:after {right:-75px;}
.footer-ending h4:before {left:-75px;}


.footer-widget  a{font-family: 'Poppins', sans-serif;font-size:20px;text-transform:uppercase;color:#fff}
.footer-widget  a:hover, .footer-widget  a:focus {color:#ccc}

.footer-bottom li{display:inline-block;margin:0 10px}
.footer-bottom li a {font-size:30px}

.footer-copyright, .footer-copyright p {font-size:14px;}

footer .menu {    width: 100%;    height: auto;}

.footer-logo {display:inline-block;width:110px;margin-bottom:20px}
.footer-ending p {
    margin: 0 0 15px;
}

@media screen and (min-width:768px){
	.footer-widget {    width: 33.333%;  }
	.footer-copyright .small-20:last-child {text-align:right}
}

@media screen and (max-width:767px){
	.footer-copyright .small-20 {text-align:center}
}
/*------------------------------------*\
    Logoslider
\*------------------------------------*/
.logo-row {padding:45px 0;}

.logo-slider {position:relative;z-index:10}
.logo-slide {position:relative;outline:none;padding:0 20px;}
.logo-slide:hover img{filter: grayscale(0%);}
.logo-slide img {max-width:290px;margin:0 auto;width:100%;filter: grayscale(100%);}



/*------------------------------------*\
    FORMULIEREN & CONTACT
\*-----------------------------------*/
ul.contact-socials .phone {    display: block;margin-bottom:30px}
ul.contact-socials .mailto {display:block;margin-bottom:5px}
ul.contact-socials .mailto a {width:auto;height:auto;background:none;border:none;    color: #5d5d5d;font-size:19px;font-weight:normal}
ul.contact-socials .mailto a:before {display:none}
ul.contact-socials .phone i, ul.contact-socials .mailto i {color:#000;display:inline-block;width:30px;margin-right:5px}
ul.contact-socials li {display:inline-block}

ul.contact-socials li a{   
    width: 40px;
    height: 40px;
    display: inline-block;
    text-align: center;
    /* border: 1px solid; */
    position: relative;
    color: #fff;
    font-size: 25px;
    padding-top: 2px;
}
ul.contact-socials li a:before {
    z-index: -1;
    width: 100%;
    height: 100%;
    border: 1px solid #000;
    background-color: #000;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}
ul.contact-socials li a:hover:before {
    background-color: #e10b0b;border-color:#e10b0b
}
input,textarea {outline:0}
.wpcf7-text {
    width: 100%;
    box-sizing: border-box;
    height: 50px;
    padding-left: 15px;
        border: none;
    border-bottom: 2px solid #c6c6c6;
    margin-bottom: 15px;background:#fff;    font-size: 18px;
}
.wpcf7-textarea {
    width: 100%;
    resize: none;
    padding-left: 15px;
    padding-top: 10px;
    height: 150px;
    margin-bottom: 15px;
	    border: none;
    border-bottom: 2px solid #c6c6c6;border-top: 2px solid #c6c6c6;background:#fff;    font-size: 18px;outline:0
}
span.wpcf7-form-control-wrap.onderwerp {
    width: 100%;
    display: block;
    float: left;margin-bottom:10px
}

.wpcf7-submit {
    color: #fff;
    border: none;
    outline: none;
    padding: 0 30px;
    display: inline-block;float:right;
    font-size: 23px;
    text-transform: uppercase;
    font-weight: 600;
    min-width: 250px;
    text-align: center;
    line-height: 1;
	height:50px;
    background-color:#000;outline:none; -webkit-appearance:none;-moz-appearance:none; appearance:none;border:none;
	    font-family: 'Zilla Slab', serif;
    font-weight: 600!important;
}
.wpcf7-submit:hover, .wpcf7-submit:focus {
	     color:#fff	;background-color:#e10b0b
}



.wpcf7-response-output {
    clear: both;
    text-align: center;
    padding: 10px!important;
    float: left;
    font-size: 15px;
    width: 100%;
    margin: 0!important;
    margin-top: 10px!important;
}
div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {
    border: 2px solid #ff0000;
}
span.wpcf7-not-valid-tip {display:none}
.wpcf7-not-valid {
    border-color: #ff0000!important;
}

.contact-box-form .wpcf7-text, .contact-box-form .wpcf7-textarea{border:1px solid transparent}

input[type="radio"] {display:none}
input[type="radio"] ~ span {position:relative;padding-left:40px;}

input[type="radio"] ~ span:before, input[type="radio"] ~ span:after {content:"";width:30px;height:30px;position:absolute;top:-3px; left:0;border:2px solid #c6c6c6;}

input[type="radio"] ~ span:after {
    border: none;
    width: 20px;
    height: 20px;
    top: 2px;
    left: 5px;
    background: #e10b0b;opacity:0;
}
input[type="radio"]:checked ~ span:after {opacity:1}
.onderwerp span.wpcf7-list-item {float:left;width:50%;margin:0;padding:0 10px;margin-bottom:10px;color:#777777;font-size:19px}
/*------------------------------------*\
    FOOTER
\*------------------------------------*/



/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#e10b0b;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#e10b0b;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#e10b0b;
	color:#FFF;
	text-shadow:none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}