.initiatieven .container {
    margin-bottom: 20px;
}

.initiatieven .caroussel {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.initiatieven .caroussel a {
    background-color: var(--placeholder);
    color: var(--surface);
    text-decoration: none;
    box-shadow: var(--schaduw);
    transition-duration: 300ms;
    height: 340px;
    min-width: 304px;
    box-sizing: border-box;
    border-radius: var(--round);
    background-size: cover;
    background-position: center;
}

.initiatieven .caroussel a div {
    height: 100%;
    width: 100%;
    background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0, 0.3) 100%);
    padding: 20px;
    border-radius: var(--round);
    box-sizing: border-box;
    display: flex;
    align-items: end;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.14);
}

.initiatieven .caroussel a:hover {
    box-shadow: var(--drop-shadow);
}

@media screen and (min-width: 557px) {
    .initiatieven .caroussel {
        flex-direction: row;
        width: 150%;

    }

    .initiatieven .container {
        overflow-x: scroll;
    }

    .initiatieven .caroussel a {
        height: 45vw;
        width: 49%
    }
}

@media screen and (min-width: 992px) {
    .initiatieven .caroussel {
        width: 100%;
    }
    .initiatieven .caroussel a {
        height: 304px;
        width: 10%;
    }

    .initiatieven .container {
        overflow-x: initial;
    }
}

/* - - - NIEUWS - - - */

.nieuws .container {
    display:flex;
    flex-direction:column;
    margin-bottom: 20px;
}

.nieuwsbericht {
    display:flex;
    flex-direction: column;
}

.nieuwsbericht .subtitle {
    color: var(--subtle);
}

.nieuwsbericht .content {
    padding-top: 15px;
    padding-bottom: 15px;
}

.nieuwsbericht h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
}

.nieuwsbericht p {
    padding-bottom: 10px;
}

.nieuwsbericht .foto {
    background-color: var(--placeholder);
    border-radius: var(--round);
    height: 60vw;
    width: 100%;
}

.nieuwsbericht .foto img {
    width: 100%;
    height:100%;
    object-fit: cover;
    border-radius: var(--round);
    margin-left:0;
}

@media screen and (min-width: 557px) {
    .nieuws .container {
        flex-direction: row;
    }
    .nieuwsbericht {
        max-width: 49%;
    }
    .nieuwsbericht .foto {
        width: 100%;
        height: 30vw;
    }
}

@media screen and (min-width: 992px) {
    .nieuwsbericht {
        flex-direction: row;
        gap: 20px;
        max-width: 100%;
        border-bottom: var(--border-subtle)
    }
    .nieuwsbericht .foto {
        width: 310px;
        height: 200px;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .nieuwsbericht .content {
        width: 620px;
    }
    .nieuws .container {
        flex-direction: column;
    }
}

.meer-lezen {
    color: var(--primary);
    font-weight: 600;
}

.meer-lezen:hover {
    text-decoration: underline;
    color: var(--primary-hover);
}