/*general*/




html, body {
    overflow-X:hidden;
    font-family: 'Rubik', sans-serif;

}

@media (max-width:576px) {
   

    h1, .title .h1 {
        font-size:24px !important;
        font-family: 'Rubik', sans-serif;
    }
}

/*Backgrounds*/

.background-white-1 {
     background-color:#FFFFFF;
 }

.background-white-2 {
    background-color:#FAFAFA;
}

.background-white-3 {
    background-color:#F0F0F0;
}

.background-grey {
    background-color:#00000026;
}

.background-darkblue {
    background-color:#0B104D;
}

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

.background-orange {
    background-color:#E95D15;
}

/*Colors*/

.color-white-1 {
    color:#FFFFFF;
}

.color-white-1 a{
    color:#FFFFFF !important;
    text-decoration: underline;
}

.color-white-2 {
    color:#FAFAFA;
}

.color-white-3 {
    color:#F0F0F0;
}

.color-grey {
    color:#00000026;
}

.color-darkblue {
    color:#0B104D;
}

.color-black {
    color:#000000;
}

.color-orange {
    color:#E95D15;
}

/*Buttons*/

.button {
    font-size:16px;
    font-family: 'Rubik', sans-serif;
    text-align:center;
    padding:5px 10px;
    transition:.3s ease;
    text-decoration:none;
    border-radius:5px;
}

.button:hover {
    text-decoration:none;
    transition:.3s ease;
}

.button-orange {
    background-color:#fff;
    color:#E95D15;
    border:2px solid #E95D15;
}

.button-orange:hover, .button-orange.active {
    background-color:#E95D15;
    color: #fff;
}

.button-darkblue {
    background-color:#fff;
    color:#0B104D;
    border:2px solid #0B104D;
}

.button-darkblue:hover, .button-darkblue.active {
    background-color:#0B104D;
    color: #fff;
}

.button-orange.invert {
    background-color:#E95D15;
    color:#fff;
    border:2px solid #E95D15;
}

.button-orange.invert:hover, .button-orange.invert.active {
    background-color:#fff;
    color:#E95D15;
}

.button-darkblue.invert {
    background-color:#0B104D;
    color:#fff;
    border:2px solid #fff;
}

.button-darkblue.invert:hover, .button-darkblue.invert.active {
    background-color:#fff;
    color:#0B104D;
}

/*Header*/

@media (max-width:767px) {
    .header {
        height:70px !important;
    }
    .menu.container-fluid {
        height:70px !important;
    }
}

.header {
    position:fixed;
    top:0;
    right:0;
    background-color:#E95D15;
    z-index:1001;
    height:70px;
    box-shadow: 0px 0px 5px #00000026;
    left:0;
}

@media (min-width:992px) {
    .header {
        left:calc(0vw + 140px);
        border-radius: 0px 0px 0px 10px;
    }
}

.menu.container-fluid {
    height:70px;
}

.menu-content ul, .branch-carousel ul {
    list-style: none;
}

.menu-item {
    position: relative;
    font-family: 'Rubik', sans-serif;
    font-size:14px;
    color:#fff;
    transition: .3s ease;
    display: block;
}

.menu-item.active {
    font-weight:bold !important;
    color:#fff;
}

.menu-item:hover {
    text-decoration:none;
    color:#fff;
}

.menu-item:hover:after {
    width:100%;
    transition:.3s ease;
}

.menu-item:after {
    width:0px;
    height:3px;
    background-color:#fff;
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    transition:.3s ease;
}



.information {
    position: fixed;
    top: 252px;
    right: 0;
    z-index: 120222;
    background-color: #0B104D;
    color: #fff;
    width: 40px;
    height: 220px;
    box-shadow: 0px 0px 5px #00000033;
    border-radius: 5px 0px 0px 5px;
    transition:.3s all ease !important;
}

.information-text {
    position:relative;
    width:100%;
    height:100%;
}

.information-text span {
    white-space: nowrap;
    transform: rotate(270deg);
    position: absolute;
    top: 105px;
    font-size:14px;
    left:-42px;
    font-family: 'Rubik', sans-serif;
}

.information-text span:before {
    color: #fff;
    font-family: "Font Awesome 5 Free";
    content: "\f35d";
    font-weight: 900;
    padding: 10px;
    transition:.3s all ease !important;
}

.header-crown-container {
    position:absolute;
    top:0px;
    height:70px;
    width:140px;
    background-color:transparent;
}

/*Hero*/
@media (max-width:1700px) {
    .hero-left h1 {
        font-size: 33px !important;
    }
}
@media (max-width:787px) {
    .hero-left h1 {
        font-size:30px !important;
        margin-bottom:10px;
    }
    .hero-left p {
    }
    .hero-left-content {
        margin-top:20px;
        padding-bottom:20px;
    }
    .hero-left-bg {
        background-size:cover;
        background-position:center;
        background-repeat:no-repeat;
        filter: blur(3px);
        -webkit-filter: blur(3px);
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        transform:scale(1.1)
    }

    .hero-left {
        overflow:hidden;
    }
}

@media (max-width:767px) {
    .hero {
        margin-top:calc(0vh + 70px) !important;
    }
}

.hero {
    margin-top:calc(0vh + 70px);
}

@media (min-width:1200px) {
    .hero {

    }
}

@media (min-width:992px) {

    .hero-left [class*="col-"] {
        margin-left: calc(0vw + 140px - 30px);
    }
    .hero-left .button {

    }
    .hero-left h1 {

    }

    .hero-left {
        height:50vh;
        background-color:#FAFAFA;
    }
    .hero-right .owl-stage-outer {
        height:50vh;
    }
}

@media (min-width:1200px) {
    .hero-left {
        height:90vh!important;
    }
    .hero-left-content {

    }
    .hero-right .owl-stage-outer {
        height:90vh;
    }
}

.hero-left {
    position:relative;
    z-index:90;
}



.hero-left h1 {
    font-size:50px;
    color: #0B104D;
    font-weight:bold;
    font-family: 'Rubik', sans-serif;
}

.hero-left p {
    font-size:24px;
    color: #E95D15;
    font-family: 'Rubik', sans-serif;
}

@media (min-width:992px) and (max-width:1199px) {
    .hero-right-content {
        height:50vh!important;
    }
}

.hero-right-content {
    background-size: cover;
    background-repeat:no-repeat;
    position:relative;
    z-index:89;
    height:100vh
}

.floating-cards {
    position: absolute;
    height: 100%;
    width:50vw;
    z-index: 100;
    background-size:cover;
    background-repeat:no-repeat;
    left: calc(50vw - (50vw / 2));
    background-position:center;
    pointer-events:none;
}

@media (max-width:1420px) {
    .floating-cards {
        height: 75%;
        width:35vw;
        left: calc(65vw - (65vw / 2));
        top:10%;
    }
}

.owl-dots {
    margin-top:-150px !important;
}

.owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    background: transparent;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
    border:1px solid #fff;
    position:relative;
    z-index:111002;
}

.owl-theme .owl-dots .owl-dot.active span {
    background: #fff;
    transition: opacity .2s ease;
}

/*kaarten*/
.kaarten {
    overflow-x:hidden !important;
}

.title p  {
    font-size:16px;
}

.title .h1 {
    font-size:32px;
    font-weight:bold;
}

.kaart {
    border: 2px solid #F0F0F0;
    border-radius: 10px;
    background-color:#fff;
}

.kaart h1 {
    font-size:32px;
}

.kaart p {
    font-size:16px;
    color:#0B104D;
}
@media (min-width:767px) {
    .kaart-title {

    }
}
@media only screen and (min-width:1920px) {
    .container {
        max-width:1600px;
    }
}

/*Waarom Klantkaart*/

.waarom-klantkaart {
    background-color:#E95D15;
    padding-top:300px;
    margin-top:-270px;
    padding-bottom:80px;
}

@media (max-width:1199px) {
    .waarom-klantkaart {
        padding-top:50px;
        margin-top:0px;
    }
}

.voordelen p {
    max-width:60%;
    margin:50px auto;
}

@media (max-width:576px) {
    .voordelen p {
        margin: 10px auto;
    }
}

/*Branches*/

.branch-description {
    border: 2px solid #F0F0F0;
    border-radius: 10px;
    background-color:#fff;
    text-align:center;
    padding:70px;
    position:relative;
    z-index:30;
    overflow:visible !important;
}

@media (max-width:576px) {
    .branch-description {
        padding:30px;
    }
}

.branch-image {
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    position:relative;
    z-index:20;
    border-radius: 10px;
}

@media (min-width:992px) {
    #prev-slide-branches {
        right:300px !important;
    }
    #next-slide-branches {
        right:160px !important;
    }
}

@media (max-width:991px) {
    .branch-image {
        position:absolute;
        width:100%;
        height:60%;
        border-radius:0px !important;
    }
    .branch-description {
        margin-top:100px;
    }
    .container.branch-carousel {
        max-width:100%;
    }
    #prev-slide-branches {
        bottom:-80px;
    }
    #next-slide-branches {
        bottom:-80px;
    }
}

@media (max-width:767px) {
    #next-slide-klanten img, #prev-slide-klanten img {
        max-width:70px;
        max-height:15px;
    }
    #next-slide-partners img, #prev-slide-partners img {
        max-width:70px;
        max-height:15px;
    }
    #next-slide-branches img, #prev-slide-branches img {
        max-width:70px;
        max-height:15px;
    }
    #prev-slide-branches {
        right:100px;
    }
    #next-slide-branches {
        right:30px;
    }
}

@media (min-width:768px) {
    #prev-slide-branches {
        right:200px;
    }
    #next-slide-branches {
        right:60px;
    }
}

@media (min-width:992px) {
    .branch-image {
        transform:translateX(-75px);
        margin-bottom:80px;
    }
    .branch-description {
        transform:translateX(75px);
        margin-top:80px;
    }
    #prev-slide-branches {
        bottom:10px;
    }
    #next-slide-branches {
        bottom:10px;
    }
}

@media only screen and (min-width:1920px) {
    .container.branch-carousel {
        max-width:1750px !important;
    }
}

#prev-slide-branches {
    position:absolute;
    z-index:40;
    cursor:pointer;
    user-select:none;
}

#next-slide-branches {
    position:absolute;
    z-index:40;
    cursor:pointer;
    user-select:none;
}

#prev-slide-kaarten {
    z-index:40;
    cursor:pointer;
    user-select:none;
}

#next-slide-kaarten {
    z-index:40;
    cursor:pointer;
    user-select:none;
}

/*Klanten*/

.klanten {
    background-color:#0B104D;
    overflow-x:hidden !important;
}

.owl-klanten .quote-box, .owl-cadeaukaarten .quote-box {
    flex-grow:1;
}

.quote-box {
    background-color:#fff;
    border-radius:10px;
    border: 2px solid #F0F0F0;
    text-align:center;
    padding:50px;
}

@media (max-width:767px) {
    .quote-box {
        padding:20px 10px !important;
    }
}

.reviews .quote-box {
    flex-grow:1;
}

.quote-box img {
    border-radius:50%;
    width:120px !important;
    height:120px;
    display:inline-block !important;
}

@media (min-width:576px) {
    .container-fluid.klant-carousel {
    margin-left:calc(0vw + 140px);
    }
}

.quote-box p {
    font-family: 'Rubik', sans-serif;
    font-size:16px;
}

@media (max-width:767px) {
    #prev-slide-klanten {
        right:100px !important;
    }
    #next-slide-klanten {
        right:30px !important;
    }
    #prev-slide-partners {
        right:100px !important;
    }
    #next-slide-partners {
        right:30px !important;
    }
}

#prev-slide-klanten, #prev-slide-partners {
    position:absolute;
    right:425px;
    bottom:-85px;
    z-index:40;
    cursor:pointer;
    user-select:none;
}

#next-slide-klanten, #next-slide-partners {
    position:absolute;
    right:275px;
    bottom:-85px;
    z-index:40;
    cursor:pointer;
    user-select:none;
}

@media (min-width:768px) {
    #next-slide-partners, #prev-slide-partners {
        bottom: -125px !important;
    }
}

/*Contact*/


    @media (min-width:1200px) {
        .contact .container {
            max-width:1140px;
        }

    }

    @media (min-width:1920px) {
        .contact .container {
            max-width:1400px;
        }
    }

.gmap_canvas {
    border-radius:10px;
}

.contact-right .box {
    box-shadow: 0px 0px 10px #00000026;
    border: 2px solid #F0F0F0;
    border-radius: 10px;
    background-color:#fff;
    padding:60px;
}

@media (max-width:576px) {
    .contact-right .box {
        padding:30px !important;
    }
}

.contact .background {
    background-color:#E95D15;
    height:50%;
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
}

/*Footer*/

.footer {
    background-color: #E95D15;
    padding-top:80px;
}

.footer a, .footer p {
    color: #fff;
    display:block;
    line-height:2;
    margin-bottom:0;
}

.footer-bottom p, .footer-bottom a {
    color:#E95D15;
    font-size:14px;
}

.footer-bottom i {
    display:inline!important;
}

@media (min-width:1500px) {
    .menu-item {

    }
}

@media only screen and (min-width:1400px) {
    .px-xxl-2 {
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }
}

@media only screen and (min-width:1512px) {
    .px-xxxl-3 {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    .px-xxxl-4 {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
    .pr-xxxl-5 {
        padding-right: 3rem !important;
    }

}

@media only screen and (min-width:1605px) {
    .px-xxxxl-3 {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    .px-xxxxl-4 {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
    .pr-xxxxl-5 {
        padding-right: 3rem !important;
    }

}





@media (min-width:576px) and (max-width:991px) {
    .container-fluid.kaarten-carousel {
        margin-left: calc(0vw + 140px);
    }
}

@media (min-width:991px) {
    .container-fluid.kaarten-carousel {
        max-width:960px;
    }
}

@media (min-width:1200px) {
    .container-fluid.kaarten-carousel {
        max-width:1140px;
    }
}

@media (min-width:1920px) {
    .container-fluid.kaarten-carousel {
        max-width:1600px;
    }
}

.kaarten .owl-carousel .owl-stage{display: flex;}
.kaarten .item {
    display: flex;
    flex: 1 0 auto;
    height: 100%;
}

.klanten .owl-carousel .owl-stage{display: flex;}
.klanten .item {
    display: flex;
    flex: 1 0 auto;
    height: 100%;
}

.static {
    height: 100%;
    overflow-y: hidden;
    position: relative;
}


.mobile-menu {
    background-color:#0B104D;
    color: #fff;
    text-align:center;
    left:100%;
    top:0;
    position:absolute;
    z-index:1001;
    width:100vw;
    height:100vh;
    transition:.3s ease;
}

@media (max-width:991px) {
    .mobile-menu.open {
        left: 0;
    }
}

@media (min-width:992px) {

    .mobile-menu.open {
        left: calc(0px - 140px);
    }
}


.mobile-menu ul {
    list-style: none;
    padding-left:0;
}

.button-close {
    right:50px;
    top:50px;
    color: #fff;
    position:absolute;
    z-index:2000;
    font-size:40px !important;
    background-color:transparent;
    border:0;
    -webkit-appearance: none;
    appearance: none;
    padding:0;
}

.button-open {
    color: #fff;
    right:0;
    position:absolute;
    font-size:40px !important;
    background-color:transparent;
    border:0;
    -webkit-appearance: none;
    appearance: none;
    padding:0;
}

/*Banner*/

@media (max-width:767px) {
    .banner {
        height:50vh!important;
    }
}

.banner {
    width:100%;
    height:70vh;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
}

.header-crown.alt {
    background-color:transparent;
}

.history-intro {
    border: 2px solid #F0F0F0;
    border-radius: 10px;
    background-color:#fff;
    position:relative;
}

@media (max-width:767px) {
    .history-intro {
        margin-top:-200px!important;
    }
}

.history-intro {
    margin-top:-300px;
}

.history-intro.alt {
    margin-top:50px !important;
}

.history-circle {
    width:60px;
    height:60px;
    border: 5px solid #0B104D;
    background-color:#fff;
    border-radius:50%;
    position:relative;
}

.history-circle.alt {
    top:30px;
}

.history-circle.alt-2 {
    top:-30px;
}

.history-items:after {
    bottom:-10%;
    width:3px;
    background-color:#0B104D;
    top:-10%;
    content:'';
    z-index:-10;
    position:absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.history-items:last-of-type:after {
    bottom:50%;
}

/*Samenwerken*/

@media only screen and (min-width:768px) {
    .samenwerken-right, .contact-form-left, .contact-form-right {
        padding:100px;
    }
}

.samenwerken-right, .contact-form-left, .contact-form-right {
    background-color:#0B104D;
}

.samenwerken-left, .contact-form-right {
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
}

.samenwerken-left {
    min-height:400px;
}

/*Contact locaties*/

@media (max-width:1199px) {
    .gmap.alt {
        overflow-x:hidden;
    }
}

.gmap {
    z-index:0;
}

.gmap_image {
    z-index:10;
}

.gmap_image img {
    border-radius: 10px;
}

.gmap_text ul {
    list-style:none;
    padding-left:0;
}

/*contact-form*/

.contact-form input {
    padding:15px 0 15px 30px;
    border-radius: 5px;
    border:0;
}

.contact-form-right {
    background-position:center;
    background-size:cover;
    backgroud-repeat:no-repeat;
}

.hero-blue {
    margin-top:200px;
}

.content-blue {
    border-radius:10px;
}


.image-right-image {
    min-height:400px;
    border-radius:10px;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

@media (max-width:768px) {
    .image-right-image {
        height:auto;
        min-height:300px;
        max-width:100%;
    }
}


@media (min-width:768px) {
    .image-right-text {
       /* padding: 100px;*/
    }
}

.loyaliteit {
    background-color:#E95D15;
}

@media (min-width:768px) {

.kaarten-combinatie {

}
}

.information:hover {
    background-color:#fff;
    color: #0B104D;
}

.information:hover .information-text span:before {
    color: #0B104D;
}

.loyaliteit ul {
    line-height:2;
    color:#fff;
    text-align:left;
    list-style-type:none;
    align-items:center;
    padding-left:35px;
}

.loyaliteit ul li {
    padding-bottom:20px;
}

.loyaliteit ul li:before {
    font-family: 'Font Awesome 5 Free';
    content:"\f00c";
    position:absolute;
    left:0;
    margin-top:4px;
    margin-left:16px;
    font-weight: 900;
    font-size: 24px;
    line-height: 1;
}
@media (min-width:768px) {
    .kaarten-combinatie {

    }
}

.banner-right img {
    border-radius:10px;
    max-height:400px;
}

.image-right ul, .branches-description ul {
    padding-left:20px;
    list-style:none;
}

.image-right ul li::before, .branches-description ul li::before {
    content: "\2022";
    color: #E95D15;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.owl-partners img {
    margin-bottom:0 !important;
    border-radius:0;
}

.branches-description img {
    border-radius:10px;
}

.branches-description i {
    padding:5px;
    font-size:20px;
    color:#0B104D;
}


.accordion .accordion-item:not(:last-child) {
    margin-bottom: 10px;
}

.accordion .accordion-item.open .accordion-handler {
    background-color: #fff;
}

.accordion .accordion-item.open .accordion-handler .arrow {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.accordion .accordion-item {
    overflow: hidden;
}

.accordion .accordion-item .accordion-handler {
    background-color: #fff;
    border-radius: 5px;
    color: #0B104D;
    display: block;
    font-family: "Open Sans", sans-serif;
    font-size: calc(21px - (2px * 3));
    font-weight: 600;
    padding: 12px 40px 12px 20px;
    position: relative;
    text-decoration: none;
    text-align: left;
    transition: background-color, ease 300ms;
    border: 2px solid #0B104D;
}

.accordion .accordion-item .accordion-handler .arrow {
    height: 20px;
    position: absolute;
    top: 14px;
    right: 12px;
    right: 12px;
    top: 14px;
    transition: all ease 300ms;
    width: 20px;
}

.accordion .accordion-item .accordion-handler .arrow:before,
.accordion .accordion-item .accordion-handler .arrow:after {
    background-color: #0B104D;
    border-radius: 2px;
    content: '';
    position: absolute;
    top: 3px;
    height: 14px;
    width: 4px;
}

.accordion .accordion-item .accordion-handler .arrow:before {
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    left: 4px;
}

.accordion .accordion-item .accordion-handler .arrow:after {
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    right: 4px;
}

.accordion .accordion-item .accordion-content {
    display: none;
    text-align: left;
}

.accordion .accordion-item .accordion-content .accordion-content-inner {
    padding: 20px;
}

@media only screen and (min-width: 768px) {
    .accordion .accordion-item .accordion-handler {
        font-size: calc(21px - (2px * 2));
    }

    .accordion .accordion-item .accordion-handler:hover {
        background-color: #fff;
    }
}
@media only screen and (min-width: 992px) {
    .accordion .accordion-item .accordion-handler {
        font-size: calc(21px - (2px * 1));
    }
}
@media only screen and (min-width: 1200px) {
    .accordion .accordion-item .accordion-handler {
        font-size: 21px;
    }
}


.article {
    border: 2px solid #F0F0F0;
    flex-grow: 1;
    border-radius: 10px;
}

.article.alt {
    border: 0;
    background-color:#E95D15;
}
.article img {
    width: calc(100% + 6rem);
    margin-left: -3rem;
    margin-top: -3rem;
    height: 300px;
    border-radius:10px 10px 0 0;
}

.blogs.branches .article img {
    margin-top: -1.5rem!important;
}

.blogs .article img {
    height:unset;
}

@media (min-width:768px) and (max-width:1199px) {
    .article img {
        width: calc(100% + 3rem);
        margin-left: -1.5rem;
        margin-top: -1.5rem;
    }
}

.blogs .image-alt {
    height:unset!important;
}




.article.alt img {
    height:unset;
    width:unset;
}

.image-alt {
    margin-top: 0 !important;
    margin-left:0 !important;
    width:100% !important;
}


@media (min-width:768px) {
    .image-alt {
        height: 500px !important;
        border-radius: 10px 0 0 10px !important;
    }
    .alt-3 {
        border-radius:0 10px 10px 0 !important;
    }
}

.quote-box.alt {
    padding:50px 10px !important;
    flex-grow:1;
}

.loyaliteit-background {
    background-color:#fff;
    height:200px;
    width:100%;
    position:absolute;
    bottom:0;
}

.folder {
    margin:0 auto;
    padding-top:50px;
    width: 100%;
    max-width: 500px;
}

@media (max-width:991px) {
    .folder {
        width:100%;
    }
}

.crown-white {
    width:45px!important;
    height:30px!important;
}

.footer-crown {
    transform:translateY(10px);
}

.image-right-text ul {
    font-size:16px !important;
}

.image-right-text a{
    color:#E95D15;
}

/* Hamburger */

.hamburger {
    display: flex;
    display: -webkit-flex;
    align-items:center;
    height: 60px;
    width: 60px;
    background-color: transparent;
    z-index: 20;
    right:0;
}

.hamburger-content:not(.active):hover .bar1 {
    margin-top:2px !important;
}
.hamburger-content:not(.active):hover .bar2 {
    margin-top:12px !important;
}

.hamburger-content:not(.active):hover .bar1, hamburger-content:not(.active):hover .bar2 {
    transition: transform .4s ease, opacity .4s ease, margin .2s ease;
}

.bar1, .bar2 {
    height: 6px;
    background-color: #fff;
    margin: 3px 0;
    -webkit-transition: transform .4s ease, opacity .4s ease, margin .2s ease;
    -moz-transition: transform .4s ease, opacity .4s ease, margin .2s ease;
    -o-transition: transform .4s ease, opacity .4s ease, margin .2s ease;
    transition: transform .4s ease, opacity .4s ease, margin .2s ease;
    border-radius:5px;
    opacity: 1;
}

.bar1 {
    width:40px;
}

.bar2 {
    width:30px;
    float:right;
}

@media (min-width:1350px) {
    .hamburger {
        display:none !important;
    }
}

@media (max-width:991px) {
    .hamburger {
        position:absolute;
    }
}

.history-description {
    position:relative;
    display:inline-block;
}

.history-description.active {

}

.detail img {
    text-align:center;
    margin: 0 auto;
    display:flex;
    max-width:100%;
    height:auto;
}

.quote-box.video {
    height:280px;
    width:100%;
    background-color:#000 !important;
    padding:0 !important;
}

.quote-box .video-thumbnail {
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    opacity:0.5;
    width:100%;
    height:100%;
    border-radius:10px;
}

.play-button {
    border:4px solid !important;
    text-align:center;
    width:80px;
    height:80px;
    padding-top:14px;
    padding-left:8px;
    border-radius:50%;
    color:#fff !important;
    background-color: rgba(0,0,0,0.5);
    font-size:20px;
    font-weight:bold;
    transition:.3s all ease;
    position:absolute;
    top:40%;
    left:42%;
    display:block;
}

.play-button:hover {
    background-color: rgba(0,0,0,0.8);
    box-shadow: 0 0 10px rgba(255,255,100,1);
    text-shadow: 0 0 10px rgba(255,255,100,1);
    cursor: pointer;
}

.header-crown {
    background-size:contain;
    background-repeat:no-repeat;
    width:60px;
    height:40px;
    margin:0 auto;
    transform:translateY(50%);
}

.midnightHeader.white .header-crown {
    background-image:url(../img/crown-white.svg);
}
.midnightHeader.default .header-crown {
    background-image:url(../img/header-crown.svg);
}
.midnightHeader.orange .header-crown {
    background-image:url(../img/header-crown.svg);
}
.midnightInner {
    overflow:visible!important;
}

.header-crown-container {
    z-index:100;
    position:relative;
}

.banner-background {
    height: 100%;
    width: 100%;
    background-position: center;
    position: absolute;
    top: 0;
}

.search-window{
    background-color: rgba(0,0,0,0.7);
    position: fixed;
    width: 100vw;
    top:0;
    height: 100vh;
    z-index: 9999;
    display: none;
}
.search-window .inner{
    position: relative;
    background-color: #FFF;
    border-radius: 10px;
    padding: 30px;
    max-width: 600px;
    width: 100%;
}
.search-window .inner .close-button{
    background-color: white;
    border-radius: 50%;
    height: 29px;
    width: 29px;
    position: absolute;
    z-index: 999999;
    right: -10px;
    font-size: 22px;
    top:-10px;
    cursor: pointer;
}

@media (max-width:767px) {
    .logoHeader {
        display:none;
    }
}
.floating-cards {
    z-index:1001;
}

.kaart {
    display:flex;
    flex-direction:column;
    flex-grow:1;
}

.fancybox-content{
    border-radius: 10px;
    overflow:hidden;
    background-color:transparent!important;
}

.inputs input, .inputs textarea {
    padding: 10px 0 10px 20px;
    border-radius: 5px;
    border: 1px #c0c0c0 solid;
}

.fancybox-button svg path {
    fill:#fff!important;
}

.menu-content li img {
    width:60%;
}

@media (min-width:1350px) {
    .d-xxl-block {
        display:block !important;
    }
}

@media (min-width:1656px) {
    .home-item {
        display:block !important;
    }
}

@media (min-width:1300px) {
    .footer-bottom .row {
        flex-wrap: nowrap !important;
    }
    .partner-item {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width:992px) and (max-width:1900px) {
    .footer-adres {
        max-width:50%;
    }
}

.blog-omschrijving {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.hero-nav{
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: 0px !important;
    display: flex;
    top:0px;

    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: flex-end;
    align-content: flex-end;
}

.hero-nav .click-element{
    position: absolute;
    width: 50%;
    height: 100%;
    left:0px;
    cursor: pointer;
}

@media (max-width:1200px) {
    .hero-nav{
        top:0px;
        height: calc(50vh + 80px);
    }
}
@media (max-width:990px) {
    .hero-nav .click-element{
        width: 100%;
    }
}
.nav-header-slider{
    border:1px solid white;
    display: inline-block;
    color:#FFF;
    width: 15px;
    margin-left: 4px;
    margin-right: 4px;
    height: 15px;
    text-decoration: none !important;
    border-radius: 50%;
}
.nav-header-slider.active{
    background-color: #FFF;
}
.nav-header-slider:hover{
    text-decoration: none !important;
}
.history-button {
    color:#E95D15!important;
}

.branch-description img {
    width:100%!important;
    max-width:160px!important;
    height:auto!important;
    margin:0 auto;
}

.detail p {
    font-size:16px!important;
}

.branch-description h1 {
    font-size: 2rem;
}

.intersolve {
    max-width:300px;
}

@media (max-width:787px) {
    .history-description-box {
        background-color: #FFF;
        padding-top: 20px;
        padding-bottom: 20px;
        border: 2px solid #F0F0F0;
        border-radius: 10px;
    }
}

.rounded {
    border-radius:10px!important;
}

.blogs h2 {
    font-size:1.6rem;
}


@media (min-width:1200px) and (max-width:1900px) {
    .contact-items .mapouter_2, .contact-items .gmap_canvas_2 {
        max-height:380px;
        max-width:560px;
    }
    .contact-items ul, .contact-items a {
        font-size:14px;
    }
}
.e-bookbutton{
    font-size: 14px;
    border:2px solid white !important;
}

img.icon{
    max-height: 38px;
}

.blog-item{
    color: #0B104D !important;
}

.blog-item h2{
    color: #0B104D;
    font-size: 24px;
    font-weight: bold;
}

.blog-item h3{
    color: #0B104D;
    font-size: 24px;
    font-weight: bold;
}

.blog-item ul {
    list-style: none; /* Remove default bullets */
}

.blog-item ul li::before {
    content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
    color:#E95D15!important;
    font-weight: bold; /* If you want it to be bold */
    display: inline-block; /* Needed to add space between the bullet and the text */
    width: 1em; /* Also needed for space (tweak if needed) */
    margin-left: -1em; /* Also needed for space (tweak if needed) */
}

@media (max-width:991px) {
    .header-crown-white {
        display:block!important;
    }
}

.loyaliteit ul a{
    color:#FFF !important;
    text-decoration: underline;
}

.branches-blogs-button {
    position:absolute;
    bottom:20px;
}

.kaart a, .account-description a {
    color:#E95D15;
}

.hero:before {
    content:'';
    position:absolute;
    top:-70px;
    left:0;
    background-color:#FAFAFA;
    width:140px;
    height:70px;
}

.direct-afsluiten button {
    border:2px solid #0B104D !important;
}

.circle-first {
    position:absolute!important;
    bottom:-30px;
    top:unset!important;
}

.image-right-text ul {
    color:#0B104D!important;
}

html {
    scroll-behavior: smooth;
}

/*Aanpassingen*/

.hero-blokken, .hero-blokken p {
    font-size: 20px !important;
    line-height: 1.25;
}
.hero-blokken span {
    font-size: 32px;
    font-weight: bold;
    display: block;
}
.hero-blok-btn {
    display: inline-grid !important;
}
.hero-blok-btn div {
    grid-area: 1 / 1;
    position: static !important;
    align-self: center;
    justify-self: center;
    transition: 150ms color ease, 150ms opacity ease;
}
.hero-blok-btn div:nth-child(1) {
    opacity: 1;
}
.hero-blok-btn div:nth-child(2) {
    opacity: 0;
}
.hero-blok-btn:hover {
    background-color: #0B104D !important;
    border-color: #0B104D;
}
.hero-blok-btn:hover div {
    color: #ffffff !important;
}
.hero-blok-btn:hover div:nth-child(1) {
    opacity: 0;
}
.hero-blok-btn:hover div:nth-child(2) {
    opacity: 1;
}

.kaarten.alt {
    background-color: #E95D15;
}

.kaarten.alt .kaart-title {
    font-weight: bold;
}

.aanvraagformulier {
    padding: 30px;
    background-color: #0B104D;
    color: #ffffff;
    border-radius: 15px;
}

.aanvraagformulier ul {
    list-style: none;
}

.aanvraagformulier ul li {
    position: relative;
}

.aanvraagformulier ul li::before {
    content: url(/assets/img/arrow-orange.svg);
    transform: scale(0.7);
    position: absolute;
    left: -40px;
}

.aanvraagformulier .tooltip-info {
    margin-left: 8px;
    color: #0B104D;
    background-color: #ffffff;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: relative;
}

.tooltip-info-content {
    position: absolute;
    background-color: #E95D15;
    color: #ffffff;
    padding: 8px;
    font-size: 14px;
    text-align: center;
    display: inline-block;
    left: calc(100% + 10px);
    width: 100px;
    line-height: 1.2;
    border-radius: 10px;
    top: -20px;
    visibility: hidden;
}

.tooltip-info-content::before {
    content: '';
    width: 12px;
    height: 20px;
    position: absolute;
    clip-path: polygon(100% 0, 0 50%, 100% 100%);
    background-color: #E95D15;
    display: inline-block;
    left: -8px;
    top: calc(50% - 10px);
}

.tooltip-info-content.visible {
    visibility: hidden;
}

.history-intro .aanvraagformulier ul, .history-intro .aanvraagformulier li {
    color: #ffffff !important;
}

.aanvraagformulier input {
    border-radius: 5px;
    border: none;
    padding: 15px;
    accent-color: #E95D15;
}

@media (min-width: 992px) {
    .banner-right.alt-2 {
        margin-top: -100px;
        margin-bottom: -100px;
    }
}

.navigation-item {
    position: relative;
}

@media (max-width: 991.98px) {
    .navigation-item.has-submenu {
        display: inline-block;
    }
}
.navigation-item.has-submenu .navigation-item-link, .navigation-item.has-submenu button[aria-controls] {
    z-index: 2;
}
@media (min-width: 992px) {
    .navigation-item.has-submenu:hover > .navigation-item-link, .navigation-item.has-submenu:hover button[aria-controls] {
        color: #fff;
    }
}
.navigation-item.has-submenu .submenu {
    list-style: none;
    margin-bottom: 0;
    padding-top: 1rem;
}
@media (max-width: 991.98px) {
    .navigation-item.has-submenu .submenu {
        display: block !important;
        opacity: 1 !important;
    }
}
.navigation-item.has-submenu .submenu li:not(:last-child) {
    margin-bottom: 0.5rem;
}
@media (min-width: 992px) {
    .navigation-item.has-submenu .submenu {
        background-color: #E95D15;
        padding: 2.5rem 1rem 1rem;
        position: absolute;
        white-space: nowrap;
        left: -1rem;
        min-width: calc(100% + 2rem);
        text-align: left;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        overflow: hidden;
    }
    .navigation-item.has-submenu .submenu::before {
        content: '';
        position: absolute;
        top: -5px;
        width: 100%;
        height: 25px;
        left: 0;
        box-shadow: 0px 0px 5px #00000026;
    }
    .navigation-item.has-submenu .submenu .menu-item {
        display: inline-block;
    }
}
.navigation-item.has-submenu .submenu .submenu-item {
    font-size: 1rem;
    text-decoration: none;
    transition: 150ms box-shadow ease;
    text-align: center;
    position: relative;
    display: inline-block;
    padding: 0.25rem;
    line-height: 1.25;
    color: #fff;
}

@media (min-width: 992px) {
    .navigation-item.has-submenu .submenu .submenu-item {
        color: #E95D15 !important;
    }
}
.navigation-item.has-submenu .submenu .submenu-item::before {
    display: block;
    content: attr(title);
    font-weight: bold;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
.navigation-item.has-submenu .submenu .submenu-item:hover, .navigation-item.has-submenu .submenu .submenu-item.active {
    font-weight: bold;
}
.navigation-item > button[aria-controls] {
    position: relative;
    line-height: 1;
    margin-left: -0.25em;
    background-color: transparent;
    border: none;
    color: white;
    font-size: 0.9em;
    padding: 0.2em;
    transition: 150ms box-shadow ease, 150ms color ease, 250ms transform ease;
}
@media (min-width: 992px) {
    .navigation-item > button[aria-controls] {
        right: 0;
    }
}
.navigation-item > button[aria-controls][aria-expanded='true'] {
    transform: rotate(180deg);
}
.navigation-item > .navigation-item-link {
    text-decoration: none;
    text-align: center;
    padding: 0.25rem;
    display: inline-block;
    position: relative;
    transition: 150ms color ease, 150ms box-shadow ease;
    color: #fff !important;
    font-family: 'Rubik', sans-serif;
    font-size: 14px;
}
.navigation-item > .navigation-item-link::before {
    display: block;
    content: attr(title);
    font-weight: bold;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
.navigation-item > .navigation-item-link[aria-current='page'], .navigation-item > .navigation-item-link.active {
    color: #E95D15;
    font-weight: bold;
}
[data-disclosure-content] {
    display: none;
}

.direct-aanvragen{
    background-color: #0B104D !important;
}
.direct-aanvragen:hover{
    color:#FFF !important;
}

.parallax-mirror {
    pointer-events: none;
}

.hero-blokken .button {
    white-space: nowrap;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .hero-left {
        height: unset !important;
    }
}