:root {
    --cassiopeia-color-primary: hsla(197deg, 85%, 24%, 1);
    --cassiopeia-color-link: hsla(200, 44%, 42%, 1);
    --cassiopeia-color-hover: hsla(200deg, 44%, 24%, 1);
    --cassiopeia-color-secondary: oklch(75% 0.10 193);
    --cassiopeia-color-secondary-hover: oklch(65% 0.10 193);
}

.container-below-top {
    gap: .5em;
}


.container-below-top > * + * {
    border-left: 1px solid currentColor;
}


.container-below-top > *:nth-child(even) {
    padding-inline-start: .5em
}

.container-below-top p {
    margin: unset;
}

.container-header .navbar-brand {
    margin-inline-start: auto;
    margin-inline-end: unset;
}

.container-header {
    background-color: var(--cassiopeia-color-primary);
    background-image: unset;
}

.navigation.container-header {
    background-color: var(--cassiopeia-color-hover);
    background-image: unset;
}


main > * {
    max-inline-size: 49.25rem;
    margin-inline: auto;
}

main > form.formResponsive {
    margin-inline: auto;
}

/**
 * Menu item _Aanmelden_ itemId = 1512
 */
@media (width < 992px) {
    .container-header .container-nav nav {
        width: 100%;
    }
    .container-header .mod-menu>li.item-1512 {
        position: absolute;
        top:-16px;
        right:-10px;
    }
}

@media (width >= 992px) {
    .item-1512 {
        margin-left: auto !important;
    }
}


.container-header .mod-menu>li.item-1512>a {
    color: var(--btn-color);
}

.btn-secondary.btn-secondary {
    --btn-color: var(--gray-800);
    --btn-bg: var(--cassiopeia-color-secondary);
    --btn-border-color: var(--cassiopeia-color-secondary);
    --btn-hover-color: var(--gray-800);
    --btn-hover-bg: var(--cassiopeia-color-secondary-hover);

    color: var(--btn-color);
    border-color: var(--btn-border-color);
    background-color: var(--btn-bg);

    &:hover {
        color: var(--btn-hover-color);
        background-color: var(--btn-hover-bg);
        border-color: var(--btn-hover-border-color);
    }
}

/**
 * Banner
 */

.container-banner .banner-overlay-clean {
    background-position: top, 50%;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
    height: clamp(10rem, 40vw, 24rem);
}

.container-banner .banner-overlay-clean .overlay {
    background-color: transparent
}

/**
 * Blocks
 */
@supports (display:grid) {
    .newsflash-horiz.newsflash-card {
        grid-template-columns: repeat(auto-fit, minmax(20em, 1fr))
    }
}

.newsflash-horiz.newsflash-card li {
    position: relative;
    padding-bottom: unset;
    max-width: 28em;
}

.newsflash-horiz.newsflash-card li figure {
    margin: 0 -1rem;
}

.newsflash-horiz.newsflash-card li figure > div {
    position: relative;
    aspect-ratio: 16 / 9;
}

.newsflash-horiz.newsflash-card li figure > div > img {
    inset: 0;
    inline-size: 100%;
    block-size: 100%;
    min-block-size: 100%;
    transform: none;
    object-fit: cover;
}

.newsflash-horiz.newsflash-card li figcaption {
    text-align: center;
}

.newsflash-horiz.newsflash-card li .newsflash-title {
    padding: .5em 0;
    margin-bottom: 0;
    font-size: 1.25rem;
    font-weight: 400;
}

.newsflash-horiz.newsflash-card li a::after {
    position: absolute;
    inset: 0;
    content: '';
}

/**
 * Agenda category
 */
:root {
    --agenda-bg: #e8f8f7;
}

.site-grid {
    overflow: hidden;
}

.content-category > * {
    padding: 1rem 0;
}

.content-category > div:nth-child(even) {
    background: var(--agenda-bg);
    position: relative;
}

.content-category > div:nth-child(even):before {
    position: absolute;
    top: 0;
    left: -100%;
    content: '';
    background: var(--agenda-bg);
    width: 100%;
    height: 100%;
}

.content-category > div:nth-child(even):after {
    position: absolute;
    top: 0;
    left: 100%;
    content: '';
    background: var(--agenda-bg);
    width: 100%;
    height: 100%;
}

.item-image {
  margin-block-end: 1em;
}

.item-image.left {
  margin-inline-end: 1em
}


.item-image.right {
  margin-inline-start: 1em
}
/**
 * Footer
 */
.footer .grid-child {
    align-items: flex-start;
    gap: 1em;
}

.footer .grid-child > .card {
    flex: 1;
}

.grecaptcha-badge {
    visibility: hidden;
}