#header{
    color:#fff;
}
#header p{
    opacity: 0.8;
    color: #FFFFFF;
    letter-spacing: -0.4px;
    line-height: 2;
    font-size: 1.115rem;
    font-weight: 500;
    transition: opacity 1s;
    max-width: 600px;
}
#header:hover p,#header p:last-of-type{
    opacity: 1;
}
#header .knop:before{
    background-color:#fff;
}
#header p:last-of-type{
    margin: 0;
}
.big_header_carousel .header_slider{
    position: relative;
    min-height: 500px;
}
.big_header_carousel:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(45deg, #00306B 0%, rgba(0,48,107,0.10) 100%);
    z-index: 2;
}
.carousel-control-prev,.carousel-control-next{
    z-index: 3; 
}

#header .header_slider{
    width: 100%;
    background-size: cover;
    background-position: center;
}
#header .header_slide_tekst{
    z-index: 5;
    position:relative;
}
#header .prograss-bar-holder{
    width: 100%;
    height: 2px;
    background: rgb(255 255 255 / 25%);
    position: absolute;
    bottom: 2em;
    z-index: 2;
    left: 0;
}
#header .progress-bar{
    width: 0%;
    height: 2px;
    background: #fff;
    position: absolute;
    left: 0;
}
#header .progress-bar.animation-on{
    animation: progressbar 5s infinite;
}
@keyframes progressbar {
    from {width: 0%}
    to {width: 100%}
}
#header .carousel-control-prev{
    z-index: 6;
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 2.5em;
    right: calc(45px + 2em);
    left: auto;
    position: absolute;
}
#header .carousel-control-next{
    z-index: 6;
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 2.5em;
    right: 2em;
    left: auto;
    position: absolute;
}
#header .carousel-control-next .carousel-control-next-icon{
    width: 40px;
    height: 40px;
    background-image:url(../../img/next.svg);
}
#header .carousel-control-prev .carousel-control-prev-icon{
    width: 40px;
    height: 40px;
    transform: rotate(180deg);
    background-image:url(../../img/next.svg);
}
#header .knop,#header a{
    color:#fff;
    display: block;
    margin-top: 1em;
}

@media (max-width: 992px) {
    #header{
        height: auto;
        min-height: 240px;
    }
    #header .carousel-item .header_slider{
        padding: 8em 0;
        min-height: 240px;
    }
    #header .big_header_carousel {
        min-height: auto;
    }
    #header .container-fluid{
        padding: 0;
    }
    #header p{
        font-size: .9rem;
        line-height: 1.25;
    }
    #header .carousel-control-prev .carousel-control-prev-icon,#header .carousel-control-next .carousel-control-next-icon{
        width: 30px;
        height: 30px;
    }
    #header h5{
        display:none;
    }
}