@charset "utf-8";
/* CSS Document */

ul.slick-dots {
    margin:1em 0 0 0;
    padding:0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
ul.slick-dots button {
    display: none
}
ul.slick-dots li {
    position: relative;
    cursor: pointer;
    width:24px;
    height:24px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    opacity: .6;
    transition: .3s ease;
}
ul.slick-dots li.slick-active, ul.slick-dots li:hover {
    opacity: 1;
}
ul.slick-dots li::before {
    content:'';
    display: block;
    width:8px;
    height:8px;
    background-color: white;
    border-radius: 100px;
}

.tag {
    display: inline-block;
    font-size:.8rem;
    padding:.1em .25em;
    margin-bottom:.25em;
    border:1px solid var(--main-color);
    border-radius: 4px;
    color:var(--main-color);
}
.tag a {
    text-decoration: none;
}

.video_wrap {
    position: relative;
    width:100%;
    height:0;
    padding-top:56.25%;
}
.video_wrap vidoe, .video_wrap iframe {
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit: contain;
    object-position: center;
}

.image-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: min(15px, 1vw);
    grid-row-gap: min(15px, 1vw);
    width:100%;
    aspect-ratio:2/1;
}
.grid-image {
    background-color: rgba(237,237,237,1.00);
    position: relative;
}
.grid-image img {
    position: absolute;
    display: block;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position: center;
}
.grid-image1 { grid-area: 1 / 1 / 3 / 3; }
.grid-image2 { grid-area: 1 / 3 / 2 / 4; }
.grid-image3 { grid-area: 2 / 3 / 3 / 4; }
.grid-image4 { grid-area: 1 / 4 / 3 / 5; }

.footer-cta {
    width:100%;
    position: relative;
}
.footer-cta img {
    width:100%;
    display: block;
    height:360px;
    object-fit: cover;
    object-position: center;
}
.footer-cta .cta-content {
    margin-bottom:-80px;
}
.cta-content a.button {
    background-color: white;
    color:var(--main-color);
    margin-bottom: 0;
}
@media screen and (max-width:768px) {
    .footer-cta img {
        height:320px;
    }
    .footer-cta .cta-content {
        margin-bottom: -50px;
    }
}


form {
    width:100%;
}
form input:not([type="checkbox"]):not([type="radio"]), textarea {
    width:100%;
    border-radius: 4px;
    font-size:1rem;
    font-family: inherit;
    resize:none;
    border:1px solid var(--main-color);
    padding:.25em .25em;
}
.forminator-row {
    margin-bottom:.5em;
}

footer {
    position: relative;
    width:100%;
    background-color:var(--main-color);
    color:white;
    padding:45px 0;
}
footer .footer-menu ul {
    margin:0;
    padding:0;
    list-style: none;
}
.footer-socials ul {
    margin:1rem 0;
    padding:0;
    list-style: none;
}
.footer-socials li {
    display: inline-block;
    margin-right:8px;
}
.footer-socials img {
    width:24px;
    height:24px;
    object-fit: contain;
    object-position: left center;
}

.footer-logo {
    position: absolute;
    bottom:0;
    right:0;
    /* Hoek van het logo is 21graden, gelijk aan 45 breed 17 hoog */
    width:450px;
    height:auto;
    aspect-ratio:45/17;
    background-color: white;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.footer-logo img {
    position: absolute;
    bottom:35px;
    right:35px;
    width:160px;
    max-width: calc(50% - 35px);
}
@media screen and (max-width:768px) {
    .footer-logo {
        width:260px;
    }
    .footer-logo img {
        width:90px;
        bottom:15px;
        right:15px;
    }
}
@media screen and (max-width:560px) {
    footer {
        padding-bottom:80px;
    }
}