@import url(https://fonts.googleapis.com/css?family=Hind:400,500,600,700,300);

@font-face {
    font-family: veldeman;
    src: url("../fonts/veldeman.eot");
    src: url("../fonts/veldeman.eot?#iefix") format("embedded-opentype"), url("../fonts/veldeman.woff") format("woff"), url("../fonts/veldeman.ttf") format("truetype"), url("../fonts/veldeman.svg#veldeman") format("svg");
    font-weight: normal;
    font-style: normal
}

[data-icon]:before {
    font-family: veldeman !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: veldeman !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-check:before {
    content: "\61"
}

.icon-navicon:before {
    content: "\62"
}

.icon-arrow-down:before {
    content: "\63"
}

.icon-arrow-left:before {
    content: "\64"
}

.icon-arrow-right:before {
    content: "\65"
}

.icon-arrow-up:before {
    content: "\66"
}

.icon-arrow:before {
    content: "\67"
}

.icon-left-arrow:before {
    content: "\68"
}

.icon-arrow-down-1:before {
    content: "\69"
}

.icon-omygod-bliksem:before {
    content: "\6a"
}

.btn {
    font-size: 17px;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration: none;
    color: #ffffff;
    background-color: #000000;
    padding: 10px;
    border: 2px solid #000000;
    border-radius: 0
}

.btn:is(:focus,:hover) {
    color: #000000;
    background-color: #ffffff
}

.btn.green {
    background-color: #54b948;
    border-color: #54b948
}

.btn.green:is(:focus,:hover) {
    color: #54b948
}

.btn.large {
    font-size: 20px;
    padding: 20px
}

.btn.spanned {
    width: 100%;
    text-align: center
}

.btn.back:before {
    content: 'h';
    font-family: 'veldeman';
    text-transform: none;
    position: relative;
    top: 3px;
    margin-right: 10px
}

.read-more {
    text-transform: uppercase;
    border-bottom: 1px solid #009ddc;
    display: inline-block;
    text-decoration: none;
    color: #009ddc;
    font-weight: 500;
    font-size: 95%;
    position: relative;
    line-height: 120%
}

.read-more:after {
    content: 'e';
    font-family: 'veldeman';
    text-transform: none;
    position: absolute;
    top: -1px;
    right: -18px;
    font-size: 16px
}

.read-more.green {
    border-bottom: 1px solid #54b948;
    color: #54b948
}

.read-more:hover {
    color: #939598 !important;
    border-bottom-color: #939598 !important
}

form input[type="submit"], form select[type="submit"], form textarea[type="submit"] {
    text-transform: uppercase
}

form input:focus, form select:focus, form textarea:focus {
    box-shadow: none !important;
    border-color: #54b948
}

form .frm_message p {
    margin-bottom: 0
}

body {
    font-family: 'Hind', sans-serif;
    font-size: 17px;
    line-height: 1.2;
    color: #333132
}

body .lang {
    visibility: hidden
}

body h1, body h2, body h3, body h4, body h5, body h6 {
    color: #54b948
}

body h1 {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 26px;
    margin-bottom: 20px
}

body h1:after {
    content: '';
    width: 30px;
    height: 2px;
    background-color: #54b948;
    display: block;
    margin-top: 3px
}

body h2 {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 22px;
    margin-bottom: 10px
}

body h3 {
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 19px
}

body h4 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 5px;
    text-transform: uppercase
}

body p, body ul {
    margin-bottom: 15px
}

body a {
    color: #54b948;
    text-decoration: underline
}

body a:is(:focus,:hover) {
    cursor: pointer;
    color: #939598
}

body a:focus {
    outline: none
}

body i {
    font-style: italic
}

body small {
    font-size: 85%
}

body img {
    max-width: 100%;
    height: auto
}

body figure {
    line-height: 1px
}

body b, body strong {
    font-weight: 700
}

body ul {
    list-style: none;
    padding: 0
}

body ul.list {
    font-size: 16px;
    margin-bottom: 0
}

body ul.list li {
    margin-top: 10px
}

body ul.list.checkmarks li {
    padding-left: 45px !important;
    position: relative
}

body ul.list.checkmarks li:before {
    content: 'a' !important;
    font-family: 'veldeman';
    position: absolute;
    left: 20px !important;
    top: -1px !important
}

body .bg-blue .checkmarks li:before, body .bg-color .checkmarks li:before, body .bg-green .checkmarks li:before, body .bg-purple .checkmarks li:before {
    color: #ffffff !important
}

body.schrijnwerkerij h1, body.schrijnwerkerij h2, body.schrijnwerkerij h3, body.schrijnwerkerij h4, body.schrijnwerkerij h5, body.schrijnwerkerij h6 {
    color: #009ddc
}

body.schrijnwerkerij h1:after, body.schrijnwerkerij h2:after, body.schrijnwerkerij h3:after, body.schrijnwerkerij h4:after, body.schrijnwerkerij h5:after, body.schrijnwerkerij h6:after {
    background-color: #009ddc
}

body.schrijnwerkerij a {
    color: #009ddc
}

body.schrijnwerkerij a:hover {
    color: #939598
}

body.schrijnwerkerij ul.list.checkmarks li:before {
    color: #009ddc
}

body.schrijnwerkerij .container-main-content ul li {
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

body.schrijnwerkerij .container-main-content ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #009ddc;
    font-size: 16px
}

body.schrijnwerkerij .bg-color {
    background: #009ddc;
    color: #ffffff !important
}

body.schrijnwerkerij .bg-color h1, body.schrijnwerkerij .bg-color h2, body.schrijnwerkerij .bg-color h3, body.schrijnwerkerij .bg-color h4, body.schrijnwerkerij .bg-color h5, body.schrijnwerkerij .bg-color h6 {
    color: #ffffff
}

body.schrijnwerkerij .row.projects figure .project-overlay {
    background: #009ddc !important
}

body.totaalprojecten h1, body.totaalprojecten h2, body.totaalprojecten h3, body.totaalprojecten h4, body.totaalprojecten h5, body.totaalprojecten h6 {
    color: #54b948
}

body.totaalprojecten h1:after, body.totaalprojecten h2:after, body.totaalprojecten h3:after, body.totaalprojecten h4:after, body.totaalprojecten h5:after, body.totaalprojecten h6:after {
    background-color: #54b948
}

body.totaalprojecten a {
    color: #54b948
}

body.totaalprojecten a:hover {
    color: #939598
}

body.totaalprojecten ul.list.checkmarks li:before {
    color: #54b948
}

body.totaalprojecten .container-main-content ul li {
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

body.totaalprojecten .container-main-content ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #54b948;
    font-size: 16px
}

body.totaalprojecten .bg-color {
    background: #54b948;
    color: #ffffff !important
}

body.totaalprojecten .bg-color h1, body.totaalprojecten .bg-color h2, body.totaalprojecten .bg-color h3, body.totaalprojecten .bg-color h4, body.totaalprojecten .bg-color h5, body.totaalprojecten .bg-color h6 {
    color: #ffffff
}

body.totaalprojecten .row.projects figure .project-overlay {
    background: #54b948
}

body.schilderwerken-decoratie h1, body.schilderwerken-decoratie h2, body.schilderwerken-decoratie h3, body.schilderwerken-decoratie h4, body.schilderwerken-decoratie h5, body.schilderwerken-decoratie h6 {
    color: #a9218e
}

body.schilderwerken-decoratie h1:after, body.schilderwerken-decoratie h2:after, body.schilderwerken-decoratie h3:after, body.schilderwerken-decoratie h4:after, body.schilderwerken-decoratie h5:after, body.schilderwerken-decoratie h6:after {
    background-color: #a9218e
}

body.schilderwerken-decoratie a {
    color: #a9218e
}

body.schilderwerken-decoratie a:hover {
    color: #939598
}

body.schilderwerken-decoratie ul.list.checkmarks li:before {
    color: #a9218e
}

body.schilderwerken-decoratie .container-main-content ul li {
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

body.schilderwerken-decoratie .container-main-content ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #a9218e;
    font-size: 16px
}

body.schilderwerken-decoratie .site-header-container .site-header nav div.lang a, body.schilderwerken-decoratie .mainHeader .site-header nav div.lang a {
    border: 2px solid #a9218e
}

body.schilderwerken-decoratie .btn-primary {
    background-color: #a9218e
}

body.schilderwerken-decoratie .bg-color {
    background: #a9218e;
    color: #ffffff !important
}

body.schilderwerken-decoratie .bg-color h1, body.schilderwerken-decoratie .bg-color h2, body.schilderwerken-decoratie .bg-color h3, body.schilderwerken-decoratie .bg-color h4, body.schilderwerken-decoratie .bg-color h5, body.schilderwerken-decoratie .bg-color h6 {
    color: #ffffff
}

body.schilderwerken-decoratie .row.projects figure .project-overlay {
    background: #a9218e
}

@media only screen and (min-width: 821px) {
    .home .intro {
        padding: 30px 0 90px
    }
}

@media only screen and (max-width: 820px) {
    .home .intro {
        padding: 40px 0
    }
}

@media only screen and (min-width: 821px) {
    .home .intro .contentWrapper {
        display: flex;
        align-items: center;
        gap: 60px
    }
}

@media only screen and (min-width: 821px) {
    .home .intro .contentWrapper .introContent {
        width: 70%
    }
}

.home .intro .contentWrapper .introContent p {
    color: #939598
}

.home .intro .contentWrapper .introContact {
    line-height: 1.4;
    font-weight: 700;
    text-transform: uppercase;
    color: #54b948
}

@media only screen and (min-width: 821px) {
    .home .intro .contentWrapper .introContact {
        width: 30%;
        padding: 0 20px;
        border-left: 2px solid #ffffff
    }
}

@media only screen and (min-width: 821px) {
    .home .services {
        margin-top: -40px
    }
}

@media only screen and (max-width: 820px) {
    .home .services {
        margin-top: 40px
    }
}

@media only screen and (min-width: 821px) {
    .home .services .contentWrapper {
        display: flex;
        justify-content: center;
        grid-gap: 30px
    }
}

.home .services .contentWrapper h3 {
    width: 100%;
    margin: 0
}

@media only screen and (max-width: 820px) {
    .home .services .contentWrapper h3 {
        margin-bottom: 20px
    }
}

@media only screen and (min-width: 821px) {
    .home .featured {
        padding: 48px 0
    }
}

@media only screen and (max-width: 820px) {
    .home .featured {
        padding: 50px 0
    }
}

@media only screen and (min-width: 821px) {
    .home .featured .contentWrapper {
        display: flex;
        /*align-items: center;*/
        gap: 40px
    }
}

.home .featured .contentWrapper h2 {
    color: #54b948
}

.home .featured .contentWrapper h2:after {
    content: '';
    width: 30px;
    height: 2px;
    background-color: #54b948;
    display: block;
    margin-bottom: 15px
}

@media only screen and (min-width: 821px) {
    .home .featured .contentWrapper .projectImg, .home .featured .contentWrapper .projectContent {
        width: 60%
    }
}

body.home .mainHeader, body.service .mainHeader {
    position: relative;
    z-index: 1;
    background-color: transparent
}

/*@media only screen and (min-width: 821px) {*/
/*    body.home .mainHeader, body.service .mainHeader {*/
/*        margin-top: 50px*/
/*    }*/
/*}*/

body.home .mainHeader .contentWrapper, body.service .mainHeader .contentWrapper {
    background-color: #ffffff
}

@media only screen and (min-width: 821px) {
    body.home .headerBanner, body.service .headerBanner {
        margin-top: -150px
    }
}

body.home .headerBanner .contentWrapper, body.service .headerBanner .contentWrapper {
    max-width: 1600px;
    padding: 0
}

body.home .site-header-container .slideshow-container, body.home .headerBanner .slideshow-container, body.service .site-header-container .slideshow-container, body.service .headerBanner .slideshow-container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto
}

body.home .site-header-container .slideshow-container .slideshow, body.home .headerBanner .slideshow-container .slideshow, body.service .site-header-container .slideshow-container .slideshow, body.service .headerBanner .slideshow-container .slideshow {
    position: relative;
    height: 167px;
    width: 100%;
    z-index: -1
}

body.home .site-header-container .slideshow-container .slideshow figure, body.home .headerBanner .slideshow-container .slideshow figure, body.service .site-header-container .slideshow-container .slideshow figure, body.service .headerBanner .slideshow-container .slideshow figure {
    background: transparent;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

body.home .site-header-container .container-main-navigation nav#main-navigation, body.home .headerBanner .container-main-navigation nav#main-navigation, body.service .site-header-container .container-main-navigation nav#main-navigation, body.service .headerBanner .container-main-navigation nav#main-navigation {
    width: auto;
    padding: 20px 30px 0
}

@media only screen and (min-width: 821px) {
    .page-template-news-page main .contentWrapper {
        display: flex;
        gap: 40px
    }
}

@media only screen and (min-width: 821px) {
    .page-template-news-page main .contentWrapper .newsImage {
        width: 40%
    }
}

@media only screen and (min-width: 821px) {
    .page-template-news-page main .contentWrapper .newsContent {
        width: 60%
    }
}

@media only screen and (min-width: 1025px) {
    .page-template-project-page .projects .contentWrapper {
        grid-template-columns:repeat(3, 1fr)
    }
}

@media only screen and (max-width: 1024px) {
    .page-template-project-page .projects .contentWrapper {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media only screen and (min-width: 561px) {
    .page-template-project-page .projects .contentWrapper {
        display: grid;
        grid-gap: 40px
    }
}

@media only screen and (min-width: 561px) {
    .page-template-services-page main .row .mainContent {
        display: flex;
        gap: 40px
    }
}

@media only screen and (min-width: 821px) {
    .page-template-services-page main .row .mainContent .serviceSidebar {
        width: 40%
    }
}

@media only screen and (max-width: 820px) {
    .page-template-services-page main .row .mainContent .serviceSidebar {
        display: none
    }
}

@media only screen and (min-width: 821px) {
    .page-template-services-page main .row .mainContent .serviceContent {
        width: 60%
    }
}

@media only screen and (max-width: 1024px) {
    .topHeader {
        display: none
    }
}

.topHeader .contentWrapper {
    padding-top: 20px;
    padding-bottom: 20px
}

.mainHeader {
    position: relative;
    background: #ffffff
}

.mainHeader .contentWrapper {
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: 60px
}

@media only screen and (min-width: 1025px) {
    .mainHeader .siteLogo {
        margin-top: -31px
    }
}

.mainHeader .siteLogo img {
    width: 100%;
    height: auto
}

@media only screen and (min-width: 821px) {
    .mainHeader .siteLogo img {
        max-width: 300px
    }
}

@media only screen and (max-width: 820px) {
    .mainHeader .siteLogo img {
        max-width: 200px
    }
}

@media only screen and (max-width: 1024px) {
    .mainHeader .menu-hoofdmenu-container {
        display: none
    }
}

.mainHeader .menuToggle {
    font-size: 20px;
    background: none;
    border: none;
    padding: 0
}

@media only screen and (min-width: 1025px) {
    .mainHeader .menuToggle {
        display: none
    }
}

.mainHeader .menuToggle:before {
    font-family: "veldeman";
    content: "b";
    position: relative;
    top: 8px;
    font-size: 30px
}

.mainHeader .menu-mobiel-menu-container {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: #54b948
}

.mainHeader .menu-mobiel-menu-container ul {
    display: block;
    padding: 40px
}

.mainHeader .menu-mobiel-menu-container ul li {
    font-size: 15px
}

.mainHeader .menu-mobiel-menu-container ul li a {
    text-transform: uppercase;
    text-decoration: none;
    display: block
}

.mainHeader .menu-mobiel-menu-container ul li ul {
    padding: 10px 0 0;
    margin-bottom: 0;
    background-color: transparent !important;
    position: relative
}

.mainHeader .menu-mobiel-menu-container ul li ul li {
    border: none;
    padding: 0 0 7px;
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

.mainHeader .menu-mobiel-menu-container ul li ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #ffffff;
    font-size: 16px
}

.mainHeader .menu-mobiel-menu-container ul li.current {
    opacity: 0.5
}

.mainHeader .menu-mobiel-menu-container ul.mobile-menu {
    padding: 0
}

.mainHeader .menu-mobiel-menu-container ul.mobile-menu li {
    padding: 7px 0 3px;
    border-top: 1px solid #939598
}

.mainHeader .container-main-navigation {
    background: #ebebeb;
    position: absolute;
    left: 0;
    right: 0;
    top: 103px;
    z-index: 1
}

.mainHeader .container-main-navigation nav#main-navigation {
    overflow: hidden;
    padding: 20px 15px 0;
    width: 1170px;
    margin: 0 auto
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories {
    border-bottom: 1px solid #939598;
    margin-bottom: 0
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories li {
    display: inline-block;
    padding-right: 30px;
    font-size: 16px
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories li a {
    text-transform: uppercase;
    text-decoration: none;
    color: #333132;
    display: block;
    padding: 10px 10px 10px 0
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories li:first-child.current a, .mainHeader .container-main-navigation nav#main-navigation ul.categories li:first-child:hover a {
    color: #a9218e
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories li:nth-child(2).current a, .mainHeader .container-main-navigation nav#main-navigation ul.categories li:nth-child(2):hover a {
    color: #009ddc
}

.mainHeader .container-main-navigation nav#main-navigation ul.categories li:nth-child(3).current a, .mainHeader .container-main-navigation nav#main-navigation ul.categories li:nth-child(3):hover a {
    color: #54b948
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block {
    padding: 20px 0 30px
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block .block {
    padding: 20px
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block ul li {
    padding: 0 0 10px;
    font-size: 15px
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block ul li a {
    text-transform: uppercase;
    color: #333132;
    text-decoration: none
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) li.current a, .mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) li:hover a {
    color: #a9218e
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) .btn-primary {
    background: #a9218e
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) .btn-primary:hover {
    background: #333132
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) .btn-secondary {
    border-color: #a9218e;
    color: #a9218e
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(2) .btn-secondary:hover {
    border-color: #939598;
    color: #939598
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) li.current a, .mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) li:hover a {
    color: #009ddc
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) .btn-primary {
    background: #009ddc
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) .btn-primary:hover {
    background: #333132
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) .btn-secondary {
    border-color: #009ddc;
    color: #009ddc
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(3) .btn-secondary:hover {
    border-color: #939598;
    color: #939598
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) li.current a, .mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) li:hover a {
    color: #54b948
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) .btn-primary {
    background: #54b948
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) .btn-primary:hover {
    background: #333132
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) .btn-secondary {
    border-color: #54b948;
    color: #54b948
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block:nth-child(4) .btn-secondary:hover {
    border-color: #939598;
    color: #939598
}

.mainHeader .container-main-navigation nav#main-navigation div.navigation-block .category-image img {
    max-height: 235px
}

.mainHeader .container-main-navigation nav#main-navigation .btn-primary {
    font-size: 16px;
    padding: 10px 50px 6px 15px;
    display: inline-block
}

.mainHeader .container-main-navigation nav#main-navigation .btn-primary:after {
    top: 7px;
    right: 15px;
    font-size: 19px
}

ul.menu {
    padding: 0;
    margin-bottom: 0;
    display: flex
}

ul.menu li.menu-item {
    list-style: none
}

ul.menu li.menu-item a {
    text-decoration: none;
    color: #000000
}

ul.menu li.menu-item a:is(:focus,:hover) {
    color: #54b948
}

ul.menu#menu-topmenu {
    justify-content: flex-end;
    gap: 20px
}

ul.menu#menu-topmenu li a {
    font-size: 14px;
    border-bottom: 1px solid #333132;
    display: inline-block;
    line-height: 100%
}

ul.menu#menu-topmenu li a:is(:focus,:hover) {
    color: #939598;
    border-color: #939598;
    text-decoration: none
}

ul.menu#menu-hoofdmenu {
    gap: 40px
}

ul.menu#menu-hoofdmenu li a {
    text-transform: uppercase;
    font-size: 18px
}

ul.menu#menu-hoofdmenu li.toggle-navigation {
    position: relative;
    padding-left: 25px
}

ul.menu#menu-hoofdmenu li.toggle-navigation:before {
    content: 'b';
    font-family: 'veldeman';
    font-size: 20px;
    position: absolute;
    left: 0;
    top: -1px;
    text-transform: none;
    color: white;
}

ul.menu#menu-hoofdmenu li.menu-item-has-children {
    position: relative
}

ul.menu#menu-hoofdmenu li.menu-item-has-children .sub-menu {
    width: 300px;
    height: 0;
    overflow: hidden;
    background-color: #ffffff;
    padding: 0;
    margin-bottom: 0;
    position: absolute;
    left: 0
}

ul.menu#menu-hoofdmenu li.menu-item-has-children .sub-menu li a {
    display: inline-block;
    padding: 10px 0
}

ul.menu#menu-hoofdmenu li.menu-item-has-children:is(:focus,:hover) .sub-menu {
    height: auto;
    padding: 10px 20px
}

.row {
    margin-left: 0;
    margin-right: 0
}

.contentWrapper {
    width: 100%;
    max-width: 1420px;
    margin: auto;
    padding: 0 40px
}

@media only screen and (max-width: 560px) {
    .contentWrapper {
        padding: 0 20px
    }
}

.bg-lightGrey {
    background-color: #ecf1f4
}

.projects .project {
    display: block;
    position: relative
}

@media only screen and (max-width: 560px) {
    .projects .project {
        margin-bottom: 20px
    }
}

.projects .project img {
    aspect-ratio: 3 / 2;
    object-fit: cover
}

.projects .project .projectOverlay {
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(51, 49, 50, 0.7);
    z-index: 1;
    -moz-transition: 0.23s opacity;
    -o-transition: 0.23s opacity;
    -webkit-transition: 0.23s opacity;
    transition: 0.23s opacity
}

.projects .project .projectOverlay h2 {
    color: #ffffff
}

.projects .project:is(:focus,:hover) .projectOverlay {
    opacity: 1
}

@media only screen and (min-width: 1025px) {
    .relatedProjects .projects {
        grid-template-columns:repeat(3, 1fr)
    }
}

@media only screen and (max-width: 1024px) {
    .relatedProjects .projects {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media only screen and (min-width: 561px) {
    .relatedProjects .projects {
        display: grid;
        grid-gap: 40px
    }
}

.sub-categories div:first-child a {
    border-top: 2px solid #ecf1f4
}

.sub-categories div a {
    position: relative;
    display: block;
    padding: 20px 50px 20px 20px;
    border-left: 2px solid #ecf1f4;
    border-right: 2px solid #ecf1f4;
    border-bottom: 2px solid #ecf1f4;
    text-decoration: none;
    font-weight: 700;
    font-size: 18px;
    color: #54b948
}

.sub-categories div a:after {
    content: 'g';
    font-family: 'veldeman';
    position: absolute;
    top: 22px;
    right: 20px;
    font-size: 24px
}

.sub-categories div a span.caption {
    font-size: 14px;
    font-weight: 400;
    color: #333132;
    display: block;
    padding-top: 2px
}

.sub-categories div a.current, .sub-categories div a:hover {
    color: #ffffff;
    background-color: #54b948
}

.sub-categories div a.current:after, .sub-categories div a:hover:after {
    color: #ffffff
}

.sub-categories div a.current span.caption, .sub-categories div a:hover span.caption {
    color: #ffffff
}

@media only screen and (min-width: 561px) {
    .site-footer {
        padding-top: 40px;
        padding-bottom: 40px
    }
}

@media only screen and (max-width: 560px) {
    .site-footer {
        padding-top: 20px;
        padding-bottom: 20px
    }
}

.site-footer a {
    color: #ffffff
}

.site-footer .mainFooter {
    display: flex;
    gap: 40px
}

@media only screen and (max-width: 560px) {
    .site-footer .mainFooter {
        flex-direction: column;
        gap: 20px
    }
}

@media only screen and (max-width: 560px) {
    .site-footer .mainFooter .col.footerContact {
        order: 2
    }
}

@media only screen and (max-width: 560px) {
    .site-footer .mainFooter .col.footerNav {
        order: 3
    }
}

.site-footer .mainFooter .col.footerNav h4 {
    visibility: hidden;
    opacity: 0
}

@media only screen and (max-width: 560px) {
    .site-footer .mainFooter .col.footerNav h4 {
        display: none
    }
}

.site-footer .mainFooter .col.footerNav .menu-footer-container ul.menu {
    display: block
}

.site-footer .mainFooter .col.footerNav .menu-footer-container ul.menu li {
    border-bottom: 1px solid #ffffff
}

.site-footer .mainFooter .col.footerNav .menu-footer-container ul.menu li a {
    color: #ffffff;
    display: block;
    padding: 3px 0
}

@media only screen and (min-width: 561px) {
    .site-footer .mainFooter .col.footerLogo {
        margin-top: -60px;
        margin-left: auto;
        margin-right: 0
    }
}

@media only screen and (max-width: 560px) {
    .site-footer .mainFooter .col.footerLogo {
        margin-top: -30px;
        order: 1
    }
}

@media only screen and (max-width: 560px) {
    .site-footer .disclaimer {
        margin-top: 20px
    }
}

.site-footer .disclaimer p {
    text-align: right
}

body.default .slideshow-container {
    margin-top: 0
}

body.default .slideshow-container .slideshow {
    overflow: hidden
}

body.default h3 {
    color: #a9218e
}

body.single h1, body.single h3 {
    color: #a9218e
}

body.single h1:after, body.single h3:after {
    background-color: #a9218e
}

body.single.single-partner h1, body.single.single-partner h3, body.single.single-project h1, body.single.single-project h3 {
    color: #333132
}

body.single.single-partner h1:after, body.single.single-partner h3:after, body.single.single-project h1:after, body.single.single-project h3:after {
    background-color: #333132
}

body.single.single-partner figure.logo {
    max-width: 250px;
    margin: 0 0 20px
}

#site-overlay .container ul, .container-main-content ul {
    position: relative
}

#site-overlay .container ul li, .container-main-content ul li {
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

#site-overlay .container ul li:before, .container-main-content ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #a9218e;
    font-size: 16px
}

.col-md-5 .slideshow-container .slideshow {
    position: relative;
    min-height: 300px
}

.col-md-5 .slideshow-container .slideshow .slide {
    position: absolute;
    top: 0
}

.row.projects h3 {
    margin-bottom: 10px
}

.row.projects figure {
    position: relative;
    line-height: 1px;
    margin-bottom: 20px
}

.row.projects figure .project-overlay {
    position: absolute;
    left: 15px;
    right: 15px;
    top: 0;
    bottom: 0;
    text-align: center;
    background: #333132;
    opacity: 0;
    -moz-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s
}

.row.projects figure .project-overlay .inner {
    position: relative;
    margin-top: 25%;
    top: 0;
    padding: 0 25px
}

.row.projects figure .project-overlay .inner h4 {
    color: #ffffff;
    line-height: 22px;
    font-weight: 300;
    text-transform: uppercase
}

.row.projects figure .project-overlay .inner p {
    color: #939598;
    margin: 0;
    line-height: 20px;
    font-size: 14px
}

.row.projects figure .project-overlay .inner p span:before {
    content: ' - '
}

.row.projects figure .project-overlay .inner p span:first-child:before {
    content: ''
}

.row.projects figure .project-overlay.purple {
    background: #a9218e
}

.row.projects figure .project-overlay.purple p {
    color: #ffffff;
    opacity: 0.7
}

.row.projects figure .project-overlay.blue {
    background: #009ddc
}

.row.projects figure .project-overlay.blue p {
    color: #ffffff;
    opacity: 0.7
}

.row.projects figure .project-overlay.green {
    background: #54b948
}

.row.projects figure .project-overlay.green p {
    color: #ffffff;
    opacity: 0.7
}

.row.projects figure:hover .project-overlay {
    opacity: 1;
    -moz-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s
}

.row.project-row {
    margin-bottom: 15px
}

.row.project-row .block, .row.project-row figure {
    display: inline-block
}

.row.project-row.single figure {
    margin-left: 15px;
    margin-right: 15px
}

.row.project-row.multiple div.block, .row.project-row.multiple figure {
    margin-left: 7.5px;
    margin-right: 15px
}

.row.project-row.multiple div.block:first-child, .row.project-row.multiple figure:first-child {
    margin-left: 15px;
    margin-right: 7.5px
}

.row.types {
    margin-top: 30px
}

.row.types figure {
    text-align: center;
    margin-bottom: 15px
}

.row.types figure a {
    text-decoration: none
}

.row.types figure a figcaption {
    text-transform: uppercase;
    display: block;
    padding: 5px 0 0;
    line-height: 20px;
    color: #939598
}

.row.types figure a:hover figcaption {
    color: #333132
}

.row.related-projects {
    margin-top: 45px
}

.row.related-projects h3 {
    font-weight: 500;
    margin-bottom: 15px
}

.row.news .item {
    border-bottom: 2px solid #ebebeb;
    margin-bottom: 15px;
    padding: 20px
}

.row.news .item h3 {
    text-transform: uppercase;
    font-weight: 500;
    line-height: 120%;
    color: #a9218e
}

.row.news .item h3 a {
    color: #a9218e;
    text-decoration: none
}

.row.news .item h3 a:hover {
    color: #939598
}

.row.news .item span.date {
    color: #939598;
    display: block;
    margin-bottom: 5px
}

.row.pictures {
    margin: 0
}

.row.pictures .col-md-6 {
    padding: 0
}

.row.pictures .col-md-6:nth-child(odd) {
    border-right: 3px solid #ffffff
}

.row.pictures .col-md-6 .block, .row.pictures .col-md-6 figure {
    border-bottom: 3px solid #ffffff
}

.row.pictures .col-md-6 figure:hover {
    opacity: 0.9
}

.row.partners .logo {
    margin-bottom: 15px;
    max-width: 225px
}

.block {
    padding: 25px 30px
}

.block.bg-color {
    padding-bottom: 30px
}

.block.bg-color.list-items {
    color: #ffffff
}

.block.testimonial p {
    margin: 0
}

.block.testimonial p i {
    display: block;
    padding-top: 5px
}

.btn-container {
    margin-top: 20px
}

.recent-news span.date {
    color: #939598;
    display: block;
    margin-bottom: 5px
}

.recent-news h4 {
    color: #a9218e;
    margin-bottom: 15px
}

#filter ul.categories {
    margin: 10px 0 20px
}

#filter ul.categories li {
    display: inline-block;
    text-transform: uppercase;
    font-size: 16px;
    padding-left: 20px
}

#filter ul.categories li:before {
    content: ""
}

#filter ul.categories li a {
    color: #333132;
    text-decoration: none;
    display: block
}

#filter ul.categories li a:hover {
    color: #939598
}

#filter ul.categories li.current a {
    color: #939598
}

body.single-project .container-main-content .block.bg-light {
    padding-top: 30px
}

body.single-project .container-main-content ul li {
    overflow: visible;
    padding-left: 15px;
    padding-bottom: 5px;
    position: relative
}

body.single-project .container-main-content ul li:before {
    font-family: "veldeman";
    content: "e";
    left: -3px;
    top: -2px;
    position: absolute;
    color: #333132;
    font-size: 16px
}

body.single-project .container-main-content ul li span {
    text-transform: lowercase
}

body.single-project .container-main-content ul li span:after {
    content: ', '
}

body.single-project .container-main-content ul li span:last-child:after {
    content: ''
}

.overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2
}

.overlay .container {
    background: #ffffff;
    margin-top: 150px;
    padding: 30px 30px 45px
}

.overlay .container a {
    text-decoration: none;
    color: #333132
}

.overlay .container a h4 {
    text-transform: uppercase;
    color: #a9218e
}

.overlay .container a p {
    margin: 0
}

.overlay .container a:hover {
    color: #333132 !important
}

.overlay .container a:hover .bg-light {
    background-color: #cfcfcf
}

.overlay#partner-overlay .container {
    padding: 40px 45px 45px
}

.overlay#partner-overlay .container h1 {
    text-align: center;
    color: #333132
}

.overlay#partner-overlay .container h1:after {
    margin: 3px auto 0;
    background-color: #333132
}

.overlay#partner-overlay .container .row.partners {
    margin-top: 10px
}

.overlay#partner-overlay .container .row.partners h4 {
    color: #333132
}

.overlay#image-overlay .container {
    background: transparent;
    padding: 0
}

.overlay#image-overlay .container .icon-next, .overlay#image-overlay .container .icon-prev {
    color: #939598;
    cursor: pointer;
    font-size: 35px;
    margin: 15px 5px 0;
    display: inline-block
}

.overlay#image-overlay .container .icon-next:hover, .overlay#image-overlay .container .icon-prev:hover {
    color: #ffffff
}

.overlay#ie8-overlay {
    display: none;
    background: #333132;
    color: #ffffff
}

.overlay#ie8-overlay .container {
    background: transparent;
    margin-top: 25px;
    padding-left: 25px
}

.overlay#ie8-overlay .container figure {
    margin-bottom: 10px
}

#cookie-notification {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    font-size: 14px;
    z-index: 1;
    background: #ebebeb;
    color: #333132
}

#cookie-notification div {
    padding: 15px 20px
}

#cookie-notification div p {
    display: inline-block;
    margin: 0 10px 0 0
}

#cookie-notification div button {
    background: #333132;
    color: #ffffff;
    border: none
}

#cookie-notification div button:hover {
    background: #939598;
    color: #ffffff
}

.clear {
    clear: both
}

.bordered {
    border: 2px solid #ebebeb
}

.padding {
    padding: 20px
}

.padding-big {
    padding: 30px
}

.margin-bt {
    margin-bottom: 30px
}

.margin-tp {
    margin-top: 30px
}

.bg-dark {
    background: #333132;
    color: #ffffff
}

.bg-light {
    background: #ebebeb
}

.bg-purple {
    background: #a9218e
}

.bg-blue {
    background: #009ddc
}

.bg-green {
    background: #54b948
}

.bg-white {
    background-color: #ffffff
}

.bg-black {
    background-color: #000000
}

.left {
    text-align: left
}

.right {
    text-align: right
}

.center {
    text-align: center
}

.center h1:after {
    margin: 3px auto 0
}

@media screen and (max-width: 767px) {
    .hidden-xs {
        display: none
    }

    .visible-xs {
        display: block
    }

    .col-xs-12 {
        margin-bottom: 15px
    }

    .col-xs-12.no-margin-bt-xs {
        margin-bottom: 0
    }

    .block, .padding-big {
        padding: 25px
    }

    .site-header-container .site-header, .mainHeader .site-header {
        width: 100%
    }

    .site-header-container .site-header .container-main-navigation nav#main-navigation, .mainHeader .site-header .container-main-navigation nav#main-navigation {
        width: 100%
    }

    .site-header-container .site-header-mobile, .mainHeader .site-header-mobile {
        display: block
    }

    .navigation-sites li.lang {
        display: inline-block !important;
        position: relative
    }

    .navigation-sites li.lang:before {
        content: '' !important
    }

    .navigation-sites li.lang span {
        line-height: 100%;
        display: inline-block;
        border-bottom: 1px solid #333132;
        padding-bottom: 0;
        margin-left: 7px
    }

    .navigation-sites li.lang a {
        border-bottom: none;
        padding-left: 7px
    }

    .slideshow-container {
        width: 100%
    }

    .slideshow-container .slideshow {
        height: 180px !important;
        width: 100%
    }

    .row.list .col-xs-12, .row.services .col-xs-12 {
        margin-bottom: 0
    }

    .row.related-projects h3 {
        font-weight: 700
    }

    .projects {
        text-align: center
    }

    .projects .project-overlay {
        display: none
    }

    .row.pictures .col-md-6 figure a {
        cursor: default
    }

    .row.pictures .col-md-6 figure:hover {
        opacity: 1
    }

    .row.project-row.multiple div.block, .row.project-row.multiple figure {
        margin-left: 15px
    }

    .row.project-row.multiple div.block:first-child, .row.project-row.multiple figure:first-child {
        margin-right: 15px;
        margin-bottom: 15px
    }

    .overlay#site-overlay {
        position: relative;
        background: #ebebeb
    }

    .overlay#site-overlay .container {
        background: transparent;
        padding: 15px 15px 0;
        margin-top: 0
    }

    .site-footer-container {
        margin-top: 45px;
        padding: 0
    }

    .site-footer-container .bg-dark .menu {
        margin-left: 0
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none
    }

    .row-eq-height-sm {
        display: flex !important;
        display: -webkit-flex !important;
        display: -moz-box;
        display: -ms-flexbox;
        display: -ms-inline-flexbox
    }

    .container-main-content .col-xs-12 {
        margin-bottom: 15px
    }

    .container-main-content .col-xs-12.no-margin-bt-xs {
        margin-bottom: 0
    }

    body.home .site-header-container, body.home .mainHeader, body.service .site-header-container, body.service .mainHeader {
        background: #333132;
        /*margin-top: 20px*/
    }

    body.home .related-projects, body.service .related-projects {
        display: none
    }

    .site-header-container .site-header, .mainHeader .site-header {
        width: 100%
    }

    .site-header-container .site-header .container-main-navigation nav#main-navigation, .mainHeader .site-header .container-main-navigation nav#main-navigation {
        width: 100%
    }

    .site-header-container .site-header-mobile, .mainHeader .site-header-mobile {
        display: block
    }

    .site-header-container .site-header-mobile h1.site-logo, .mainHeader .site-header-mobile h1.site-logo {
        padding-bottom: 15px
    }

    .site-header-container .site-header-mobile .menuToggle, .mainHeader .site-header-mobile .menuToggle {
        width: 95px;
        text-transform: uppercase;
        font-weight: 500;
        font-size: 16px;
        margin-top: 38px
    }

    .site-header-container .site-header-mobile .menuToggle:before, .mainHeader .site-header-mobile .menuToggle:before {
        text-transform: none;
        top: -1px
    }

    .navigation-sites li.lang {
        display: inline-block !important;
        position: relative
    }

    .navigation-sites li.lang:before {
        content: '' !important
    }

    .navigation-sites li.lang span {
        line-height: 100%;
        display: inline-block;
        border-bottom: 1px solid #333132;
        padding-bottom: 0;
        margin-left: 7px
    }

    .navigation-sites li.lang a {
        border-bottom: none;
        padding-left: 7px
    }

    .slideshow-container {
        width: 100%
    }

    .slideshow-container .slideshow {
        height: 250px !important;
        width: 100%
    }

    .row.list .col-xs-12, .row.services .col-xs-12 {
        margin-bottom: 0
    }

    .row.services h3 {
        font-size: 17px
    }

    .row.related-projects h3 {
        font-weight: 700
    }

    .row.project-row.multiple div.block, .row.project-row.multiple figure {
        margin-left: 15px
    }

    .row.project-row.multiple div.block:first-child, .row.project-row.multiple figure:first-child {
        margin-right: 15px;
        margin-bottom: 15px
    }

    .row.pictures .col-md-6 figure a {
        cursor: default
    }

    .row.pictures .col-md-6 figure:hover {
        opacity: 1
    }

    .partners .col-sm-6 {
        margin-bottom: 20px
    }

    .site-footer-container {
        margin-top: 50px
    }

    .site-footer-container .bg-dark .menu {
        margin-left: 0
    }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none
    }

    .row-eq-height-md {
        display: flex !important;
        display: -webkit-flex !important;
        display: -moz-box;
        display: -ms-flexbox
    }

    body.home .site-header-container header.site-header, body.home .mainHeader header.site-header, body.service .site-header-container header.site-header, body.service .mainHeader header.site-header {
        margin-left: -470px;
        width: 940px
    }

    .site-header-container .site-header, .mainHeader .site-header {
        width: 970px
    }

    .site-header-container .site-header .container-main-navigation nav#main-navigation, .mainHeader .site-header .container-main-navigation nav#main-navigation {
        width: 970px
    }

    .row.services h3 {
        font-size: 17px
    }

    .overlay .container {
        margin-top: 50px
    }

    .site-footer-container .bg-dark .menu {
        margin-left: 0
    }
}

@media screen and (min-width: 1200px) {
    .hidden-lg {
        display: none
    }

    .row-eq-height-lg {
        display: flex !important;
        display: -webkit-flex !important;
        display: -moz-box;
        display: -ms-flexbox
    }

    .site-footer-container .col-lg-4 {
        padding-left: 30px
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .row.project-row.single figure {
        max-width: 100%
    }

    .row.project-row.multiple div.block, .row.project-row.multiple figure {
        width: 48%
    }
}

.header {
    background-color: #1a1a1a !important;
}