@font-face {
    font-family: Avenir;
    font-weight: 700;
    src: url("../fonts/avenir/AvenirLTStd-Black.otf") format("opentype");
}

@font-face {
    font-family: Avenir;
    font-weight: 400;
    src: url("../fonts/avenir/AvenirLTStd-Roman.otf") format("opentype");
}

@font-face {
    font-family: Avenir;
    src: url("../fonts/avenir/AvenirLTStd-Roman.otf") format("opentype");
}

@font-face {
    font-family: Avenir;
    font-weight: 200;
    src: url("../fonts/avenir/AvenirLTStd-Light.otf") format("opentype");
}

body {
    font-family: Avenir, 'Source Sans Pro', sans-serif;
    color: #FFF;
    font-size: 18px;
    padding-top: 3rem;
    background-color: #004155;
}

footer {
    color: #3D3934;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

:focus {
    outline: none;
}

a {
    color: #71938A;
}

a:hover {
    color: #40534e;
}

.bg-emprover {
    background-color: #004155;
}

.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
    color: #ffffff;;
}

.my-btn-orange {
    background-color: #ed692b;
    color: #FFF;
}

.my-btn-orange:hover {
    background-color: #b74d1b;
    color: #FFF;
}

.my-btn {
    border-radius: 30px;
    padding: 7px 20px;
}

/* nav config */
.navbar-nav {
    margin-top: 10px;
}

.account {
    display: none;
}


#main-menu .has-submenu {
    background-image: url('../images/arrow-right.png');
    background-repeat: no-repeat;
    background-position: center right;
}

#main-menu .has-submenu.highlighted {
    background-image: url('../images/arrow-down.png');
}

.languagemenu {
    display: block;
    position: absolute;
    z-index: 1002;
    right: 60px;
    top: 13px;
}

.languagemenu a {
    color: #d2e0dc;
    font-size: 16px;
    margin-right: .5em;
    font-weight: 200;
}

.languagemenu a.active {
    text-decoration: underline;
    color: #FFF;
    font-size: 18px;
    font-weight: 400;
}

.accountmenu {
    display: block;
}

.navbar-light .navbar-brand {
    color: #ffffff;
    min-width: 140px;
    z-index: 9999;
    margin-right: 0px;
}

.navbar-brand img {
    height: 29px;
    vertical-align: top;
}

.nav-link {
    /* margin-left: 20px; */
    /* font-weight: 700; */
    color: #FFF !important;
    font-size: 17px;
}

.nav-link:hover {
    color: #FFF;
    text-decoration: underline;
}


.navbar-fixed-top {
    z-index: 1000;
}

.navbar-toggler {
    z-index: 1001;
}

/* banner */
.banner {
    /*background-image: url('../images/test/bg.jpg');*/
    height: 250px;
    image-rendering: -webkit-optimize-contrast;
    background-size: auto 250px;
    background-position: center top;
    text-align: center;
    margin-bottom: 4rem;
    background-repeat: no-repeat;
}

/*
.banner2 { background-image: url('../images/banner2.jpg'); }
.banner3 {
	background-image: url('../images/banner3.jpg');
	background-position: center bottom;
}
*/

.container-fluid.banner.banner3 {
}

.banner p {
    display: inline-block;
    background-color: #FFF;
    color: #3D3934;
    /* height:30px; */
    /*min-width: 431px;*/
    border-radius: 28px;
    line-height: 30px;
    padding: 14px 25px;
    margin-top: 252px;
    /* font-weight: 300; */
    font-size: 30px;
}

.banner p span {
    color: #004155;
}

/* home animation */
.bghome h1 {
    color: #004155;
    font-weight: 700;
    margin-bottom: 0;
    font-size: 40px;
    margin-top: 20px;
    line-height: 45px;
}

.bghome h2 {
    color: #3D3934;
    font-weight: 200;
    font-size: 35px;
    line-height: 42px;
}

@media (max-width: 768px) {
    .bghome h2 {
        font-size: 27px;
        line-height: 39px;
    }
}

.bghome .payoff {
    z-index: 5;
    padding-left: 15px;
}

.bghome .my-btn {
    font-size: 22px;
    padding: 8px 29px;
    /* margin-top: 8px; */
}

.bghome {
    background-color: #edf2ee;
    height: 340px;
    overflow: hidden;
}

.bganimationhome {
    background-position: center;
    position: absolute;
    height: 100%;
    width: 100%;
    background-image: url('../images/headerbg.png');
    overflow: hidden;
    background-size: auto 100%;
    z-index: 5;
    /* padding-top: 20px; */
}

.headerillustratie {
    z-index: 1000;
}

.headerillustratie img {
    position: absolute;
    bottom: 10%;
}

.bghome .mainimg {
    z-index: 3;
}

.bghome .animationelements {
    z-index: 1;
    /* top: 432px; */
    position: absolute;
    display: none;
}

.bghome .animationelements img {
    position: absolute;
    display: none;
    height: 40px;
    z-index: 10;
}

.bghome .animationelements img.active {
    display: block;
}

/* video block */
.video .headerlines {
    padding-top: 3rem;
    padding-bottom: 0rem;
}

/* the content version */
.video.content-ontwikkelinginbeeld .headerlines {
    padding-top: 2.75rem;
}

.video .headerlines h2 {
    margin-bottom: 0;
}

.video .headerlines h3 {
    color: #5A5B5B;
}

.video .videoimage {
    width: 100%;
    position: relative;
}

/* targets */
.targets {
    background-color: #edf1ee;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
    -moz-box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
    box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
}

.targets .block {
    padding-bottom: 50px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.targets .block:hover {
    background-color: #EFF2F5;
    padding-bottom: 50px;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(209, 209, 209, 1);
    -moz-box-shadow: 0px 2px 5px 0px rgba(209, 209, 209, 1);
    box-shadow: 0px 2px 5px 0px rgba(209, 209, 209, 1);
    transform: scale(1.02);
}

.targets img {
    width: 100px;
    /* margin-bottom: 10px; */
    margin-top: 10px;
}

.targets h4 {
    font-size: 29px;
}

.targets p {
    font-size: 18px;
    margin-bottom: 37px;
    width: 80%;
    margin-left: 10%;
}

/* functions */
.functions h4 {
    font-size: 39px;
    margin-bottom: 35px;
    /* margin-top: 100px; */
}

.functions p {
    font-size: 19px;
}

.functions .toggle {
    background-color: #FFF;
    text-align: center;
    font-size: 24px;
    margin-top: 30px;
    margin-bottom: 30px;
    border-radius: 21px;
    padding: 5px 28px;
    z-index: 5;
}

.functions .toggle a {
    padding: 0px 26px;
    opacity: 1;
}

.functions .toggle a.active, .functions .toggle a:hover {
    padding: 0px 26px;
    opacity: 1;
    color: #ed692b;
}

.functions .toggle a img {
    height: 21px;
}


/* text */

/*
.text { margin-bottom: 5rem;}
.text h2 {margin-bottom:5rem;font-size: 47px;}
.text h2 span {color:#004155;}
.text .text-center h2 {width: 100% !important; margin-bottom: 3rem;}
*/

.kc-content h2 {

    margin-bottom: 1.5rem;
    font-size: 47px;

    /*
    font-size: 33px;
    line-height: 34px;
    margin-bottom: 26px;
    margin-top: 50px;
    */
}

.kc-content h2 span {
    color: #71938A;
}

.kc-content .text-center h2 {
    width: 100% !important;
    margin-bottom: 1rem;
}

.kc-content-header h2 {
    margin-bottom: 1.5rem;
}

.kc-content h3 {
    font-size: 33px;
    line-height: 34px;
    margin-bottom: 1.25rem;
}

/* tarieven */
.tarief .inner {
    /* background-color: #f0f0f0; */
    /* border-radius: 4px; */
    /* border:1px solid #EEE; */
    padding: 2rem 1rem;
    padding-bottom: 2rem;
    /* -webkit-box-shadow: 0px 2px 5px 0px rgba(230,230,230,1); */
    -moz-box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
    /* box-shadow:0px 2px 5px 0px rgba(230,230,230,1); */
}

.tarief .inner h2 {
    width: 100%;
}

.tarief .inner p {
    margin-bottom: 16px;
}

.tarief .inner ul {
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
}

.tarief .inner ul li {
    line-height: 25px;
    border-bottom: 1px solid #EEE;
    padding: 10px 14px;
}

.tarief .inner ul li small {
}

.tarief .inner .my-btn {
    margin: 0 auto;
    margin-top: 20px;
}

.kc-block-content-faq h3 {
    font-size: 20px;
}

.kc-block-content-faq .sub-arrow {
    float: right;
    width: 10px;
    height: 16px;
    font: 17px/16px monospace !important;
    background: transparent;
}


.referencebtn {
    font-size: 14px;
    position: absolute;
    display: inline-block;
    padding: 5px 10px;
    left: 10px;
    bottom: 10px;
    background-color: #71938A;
    color: #FFF;
    border-radius: 5px;
}

.referencebtn.referencepdf {
    background-color: #C00000;
}

.referencebtn.referencevideo {
    background-color: #ed692b;
}

.owl-nav {
    position:absolute;
    top:0;
    width:100%;
}

.owl-nav .owl-prev {
    margin-top:150px !important;
    position:absolute !important;
    left:-30px !important;
    font-size:40px !important   ;
}

.owl-nav .owl-next {
    margin-top:150px !important;
    position:absolute !important;
    right:-30px !important;
    font-size:40px !important   ;
}

/* reviews */
.reviews {

    /* padding-bottom: 9rem!important; */
}

.reviews.kc-block-content-referentieslider {
    /*background-color: #f0f4f2;*/
    /*background-color: #eaefed;*/
}

.referenceappblock h2 {
    font-size: 16px;
    font-weight: bold;
    color: #FFF;
}

.referenceappblock .article-box {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    height:100%;
    padding-bottom:50px;
}

.referenceappblock .article-box p {
    color: #FFF;

}

.referenceappblock .article-box .footer img {
    position:absolute;;
    bottom:10px;
    right:10px;

    max-width: 150px;
    max-height: 80px;


}

.homeimage img {
    width: 100%;
}

.homeimage {
    position: absolute;
}

.homeimage.rhino {
    bottom: 2%;
    left: 50%;
    width: 14%;
}

.homeimage.oxpecker {
    bottom: 24%;
    left: 60%;
    width: 3%;
    opacity: 0;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.oxpecker img {
    animation-duration: 3s;
    animation-name: flyin;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

@keyframes flyin {
    from {

        margin-top: -80px;
        margin-left: 50px;
    }

    to {

        margin-top: 0;
        margin-left: 0;
    }
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 100;
    }
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.homeimage.sun img {
    animation-duration: 5s;
    animation-name: rotate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.homeimage.circle1 img, .homeimage.circle2 img, .homeimage.circle3 img, .homeimage.circle4 img, .homeimage.circle5 img, .homeimage.circle6 img, .homeimage.circle7 img, .homeimage.circle8 img, .homeimage.circle9 img {
    animation-duration: 4s;
    animation-name: rotate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.homeimage.circle1 img {
    animation-delay: 3s;
}

.homeimage.circle2 img, .homeimage.circle3 img {
    animation-delay: 3s;
}

.homeimage.circle4 img, .homeimage.circle5 img, .homeimage.circle6 img, .homeimage.circle7 img, .homeimage.circle8 img, .homeimage.circle9 img {
    animation-delay: 4s;
}

.homeimage.sun {
    top: 66px;
    right: 34%;
    width: 5%;
    opacity: 0;
    animation-delay: 6s;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.tree {
    bottom: 0px;
    left: 34%;
    width: 14%;
}

.homeimage.circle1 {
    bottom: 36%;
    left: 32%;
    width: 9%;
    opacity: 0;
    animation-delay: 2500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle2 {
    bottom: 50%;
    left: 27%;
    width: 7%;
    opacity: 0;
    animation-delay: 3500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle3 {
    bottom: 50%;
    left: 39%;
    width: 7%;
    opacity: 0;
    animation-delay: 3500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle4 {
    bottom: 63%;
    left: 24.5%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}


.homeimage.circle5 {
    bottom: 61%;
    left: 20%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle6 {
    bottom: 73%;
    left: 26%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle7 {
    bottom: 63%;
    left: 44.5%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}


.homeimage.circle8 {
    bottom: 61%;
    left: 49%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}

.homeimage.circle9 {
    bottom: 73%;
    left: 43%;
    width: 4%;
    opacity: 0;
    animation-delay: 4500ms;
    animation-duration: 3s;
    animation-name: fadein;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
}


.reviews .name {
    color: #7D9189;
    margin-bottom: 0;
}

.reviews .company {
    color: #3D3934;
}

.reviews .text {
    color: #3D3934;
}

.reviews .inner {
    padding: 20px 20px 20px 20px;
    color: #212529;
    font-size: 16px;
    line-height: 26px;
}

.tarieven {
    padding-bottom: 6rem;
    padding-top: 6rem;
    background-color: #eaefed;
    color: #3D3934;
}

.table td, .table th {
    border-top: 0;
}

.tarieven .container {

}

.homebanner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background-image: url('../images/homebanner.png');
    background-size: auto 500px;
    background-position: center;
    height: 500px;
}

.homebanner.mobileview {
    display: none;
    background-image: url('../images/homebannermobile.png');
}


@media (max-width: 1024px) {
    .homebanner.mobileview {
        display: block;
    }

    .homebanner.desktopview {
        display: none
    }


}


.homebanner .container {
    position: relative;
}

.homebanner img {
    width: 100%;
}

.homebanner .payoffs {
    position: absolute;
    top: 43px;
    right: 40px;
    width: 400px;
    font-size: 26px;
    color: #FFF;
    line-height: 53px;
    text-align: right;
}

@media (max-width: 768px) {
    .homebanner .payoffs {
        position: absolute;
        margin:0 auto;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        top: 100px;
        background-color: rgba(0, 65, 85, 0.8);
        border-radius:10px;
       
        width: 400px;
        border:1px solid white;
        font-size: 26px;
        color: #FFF;
        line-height: 53px;
        text-align: center;
    }
}

/* functionsgrid */
.functionsgrid {
    padding-bottom: 5rem;
    padding-top: 2rem;
    position: relative;
    z-index: 1;
}

.functionsgrid .selector a {
    text-align: center;
    display: block;
    color: #3D3934;
    font-size: 24px;
}

.functionsgrid .selector a:hover {
    text-decoration: none;
}

.functionsgrid .selector span {
    background-color: #FFF;
    width: 36px;
    height: 36px;
    cursor: pointer;
    border-radius: 18px;
    margin: 0 auto;
    display: block;
    z-index: 1;
    margin-top: 20px;
    border: 1px solid #CCC;
}

.functionsgrid .selector div {
    position: relative;
    cursor: pointer;
}

.functionsgrid .selector span:before {
    content: '';
    position: absolute;
    border-bottom: 1px solid #CCC;
    width: 100%;
    left: 0;
    margin-top: 14px;
    z-index: -1;
}

.functionsgrid .selector .active span:after, .functionsgrid .selector div:hover span:after {
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background-color: #71938A;
    z-index: 100;
    margin-left: 9px;
    margin-top: 9px;
    position: absolute;
}

.functionblock {
    /* background-color:#FFF; */
    margin-top: 20px;
    padding-right: 1rem;
    /* padding: 1rem; */
}

.functionblock p {
    margin-top: 10px;
    margin-bottom: 24px;
    line-height: 25px;
}

.functionblock img {
    height: 43px;
}

.functionblock a.moreinfo:link,
.functionblock a.moreinfo:visited,
.functionblock a.moreinfo:active,
.functionblock a.moreinfo {
    color: #71938A;
    /*background-image: url('../images/long-arrow-right.png');*/
    /*background-size: auto 10px;*/
    /*background-repeat: no-repeat;*/
    /*padding-right: 27px;*/
    /*background-position: right 9px;*/
    margin-right: 10px;
}

.functionblock a.moreinfo:hover {
    color: #40534e;
}

.functionblock h3 {
    margin-bottom: 0;
    font-size: 24px;
    margin-top: 4px;
    padding-left: 10px;
}

@media (min-width: 1200px) {
    .ontwikkelinginbeeld h2 {
        font-size: 2.5rem !important;
    }
}

.functionblock .inner {
    background-color: #FFF;
    p adding: 1rem;
    border-radius: 4px;
    padding: 1rem;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
    -moz-box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
    box-shadow: 0px 2px 5px 0px rgba(230, 230, 230, 1);
}

/* voordelen */
.voordelen {
    padding-top: 3rem;
    /* padding-bottom: 6rem; */
}

.voordeel p {
    font-size: 30px;
    width: 100%;
    text-align: center;
    padding: 20px 26px 0 26px;
    /* height: 60px; */
    /* position: relative; */
    position: absolute;
    line-height: 32px;
    min-height: 240px;
}

.voordeel .kc-outer {
    font-size: 25px;
    width: 100%;
    line-height: 32px;
    position: absolute;
    display: flex;
    line-height: 27px;
    min-height: 122px;
    justify-content: center;
    align-items: center;
    padding: 0 26px 0 26px;
}

.voordeel {
    margin-bottom: 44px;
    position: relative;
}

.voordeel .inner {
    position: relative;
}

.voordeel .my-btn {
    position: absolute;
    margin-top: -16px;
    left: 50%;
    margin-left: -41px;
    bottom: -19px;
}

/* statistieken */

/*
.stats { padding-bottom:5rem; }
.stats h2 {font-size: 33px;line-height: 34px;margin-bottom: 26px;margin-top: 50px;}
*/

/* footer */
footer {
    background-color: #004155;
    font-size: 17px;
}

.ctacontact {
    background: linear-gradient(to right bottom, #FFF 50%, transparent 50%);
    padding: 7rem 0;
    text-align: center;
}

.ctacontact .my-btn {
    padding: 10px 45px;
    border-radius: 25px;
    font-size: 20px;
}

footer .mid {
    padding-bottom: 5rem;
}

footer h4 {
    margin-bottom: 20px;
}

footer p {
    line-height: 28px;
    color: #FFF;
}

footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
    /* margin-top: -9px; */
}

footer ul li {
    list-style: none;
    padding: 0;
}

footer ul li a {
    color: #71938A;
    line-height: 28px;
}

footer .bottom {
    background-color: #004155;
    font-size: 12px;
    color: #FFF;
    position: relative;
    padding: 5px 0;
}

footer .bottom a {
    color: #FFF;
    text-decoration: none;
}


.account {
    position: absolute;
    z-index: 1001;
    color: #FFF;
    right: 13px;
    top: 13px;
    font-size: 30px;
    transition: all 0.2s ease;
}

.account:hover {
    transform: scale(1.12);
    text-decoration: none;
    color: #FFF;
}

.fixedheight1 {
    height: 63px;
}

.fixedheight2 {
    height: 107px;
    padding: 0 20px;
}

.tarief {
    border-left: 1px solid #CCC;
}

.tarief:first-child {
    border-left: 0;
}

@media (max-width: 320px) {
    .video .headerlines {
        position: relative;
    }
}

@media (min-width: 431px) {
    .banner p {
        min-width: 431px;
    }
}

@media (max-width: 576px) {
    .headerillustratie img {
        bottom: 1%;
    }
}

@media (max-width: 320px) {
    .headerillustratie img {
        display: none;
    }
}

@media (min-width: 768px) {
    .bganimationhome .mainimg {
        position: absolute;
    }

    .bghome .animationelements {
        display: block;
    }

    .bganimationhome .mainimg {
        margin-top: 0;
    }

    /*.video .headerlines { padding-bottom: 3rem; }*/
    .video .headerlines {
        position: absolute;
    }

    .bghome {
        height: 450px;
    }

    .voordeel p {
        font-size: 25px;
        line-height: 27px;
        padding: 10px 30px 0 30px;
    }
}


@media (max-width: 991px) {
    .languagemenu {
        display: none;
    }

    li.languagemenu2 {
        display: block;
    }
}

@media (min-width: 992px) {

    li.languagemenu2 {
        display: none;
    }

    .navbar-nav {
        margin-top: 0px;
    }

    .voordelen {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

    .video .videoimage {
        position: absolute;
        right: 0;
    }

    .functions h4 {
        margin-top: 50px;
    }

    .account {
        display: block;
    }

    .accountmenu {
        display: none;
    }

    .video .headerlines {
        padding-top: 9rem;
        padding-bottom: 9rem;
        position: relative;
    }

    .bghome .payoff {
        padding-left: 50px;
    }

    .bghome .my-btn {
        margin-top: 30px;
    }

    .bghome h1 {
        font-size: 50px;
        margin-top: 40px;
    }

    .bghome h2 {
        font-size: 50px;
        line-height: 62px;
    }

    .bghome {
        height: 640px;
    }

    .functions {
        position: relative;
        /* Old browsers */
        /* FF3.6-15 */
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to top, #eaefed 0%, #eaefed 125px, #FFF 125px, #FFF 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f8f9', endColorstr='#eaefed', GradientType=0);
        /* IE6-9 */
    }

    .functions .toggle {
        position: absolute;
        bottom: 100px;
        left: 50%;
        margin-left: -84px;
        margin-bottom: 0;
        margin-top: 0;
    }
}

@media (min-width: 1200px) {
    .bghome {
        height: 760px;
    }

    .functions h4 {
        margin-top: 100px;
    }
}

/**
 *
 */

li.accountmenu {
    display: none;
    visibility: hidden;
}

@media (max-width: 425px) {

}

@media (max-width: 768px) {
    li.accountmenu {
        display: block;
        visibility: visible;
    }
}

@media (max-width: 992px) {
    .bghome h1 {
        margin-top: 40px;
    }
}

/**
 *
 */
.fancybox-bg,
.modal-backdrop.show {
    opacity: 0.85 !important;
    background: #000 !important;
    background-color: #000 !important;
}

.modal {
    font-size: medium;
}

.modal .btn-sm {
    padding: 6px 20px;
    font-size: medium;
}

/**
 *
 */
.container-fluid.functions.mt-3 .container .toggle {
    display: block;
}

.container-fluid.functions.mt-3 .container {
    display: none;
}

.container-fluid.functions.mt-3 .container.active {
    display: block;
}

/**
 * Functies
 */
.kc-block-content-functies .inner {
    position: relative;
}

@media (min-width: 768px) {
    .kc-block-content-functies .inner {
        min-height: 250px;
    }
}

@media (min-width: 992px) {
    .kc-block-content-functies .inner {
        min-height: 273px;
    }
}

@media (min-width: 1200px) {
    .kc-block-content-functies .inner {
        min-height: 234px;
    }
}

.kc-block-content-functies .kc-block-content-functies-link {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.kc-block-content-functies .selector2 a,
.kc-block-content-functies .selector2 span {
    margin: 0px !important;
    padding: 0 !important;
}

.kc-block-content-functies .selector2 span {
    display: inline-block;
    width: 2em;
}

.kc-block-content-functies .selector2 a.selected {
    text-decoration: underline;
}

.kc-block-content-functies .icon-container {
    width: 32px;
    height: 32px;
    background-origin: content-box !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center center !important;
    background-attachment: scroll !important;
}

.kc-block-content-functies .selector2-sm > div {


}

.kc-block-content-functies .selector2-sm > div a {
    display: block;
    line-height: 2.5;
    border-bottom: 1px solid #71938A;
}

.referenceappblock {
    width: 30%;
    margin-right: 3%;
    margin-bottom: 33px;
}

@media (max-width: 900px) {
    .referenceappblock {
        width: 48%;
        margin-right: 2%;
    }
}


@media (max-width: 500px) {
    .referenceappblock {
        width: 100%;
        margin-right: 0%;
    }
}

/**
 *
 */

.kc-block-prijzen td p {
    color: #FFF;
    font-size: 16px;
    font-weight: normal;
}

.kc-block-prijzen table tr td {
    padding: 0;
    height: 1px;
}

.kc-block-prijzen table tr td {
    padding: 0 10px;
}

.kc-block-prijzen table tr td .innerbg {
    padding: 20px;
    height: 100%;
}


.kc-block-prijzen table tr td.active .innerbg {
    background-color: #033144;
}

.kc-block-prijzen table tr td.inactive .innerbg {
    background-color: #222a35;
}


.kc-block-prijzen table tr td.hidden {
    display: none;
}

.kc-block-prijzen table span.oi {
    color: #71938A;
}

.kc-block-prijzen table th {
    font-weight: 400;
}

.kc-block-prijzen table th small {
    color: #71938A;
}

.kc-block-prijzen img {
    max-height: 70px;
}

.kc-block-prijzen .arrows {
    position: absolute;
    width: 100%;
    padding-top: 3px;
    font-size: 40px;

}

.kc-block-prijzen .arrowleft {
    position: absolute;
    left: 0px;
}

.kc-block-prijzen .arrowleft:hover, .kc-block-prijzen .arrowright:hover {
    text-decoration: none;
}

.kc-block-prijzen .arrowright {
    position: absolute;
    right: 56px;

}

.kc-block-prijzen-first-row .text-right {
    color: #71938A;
}


tr.kc-block-prijzen-label {
    border-bottom: 1px solid #71938A;
}

tr.kc-block-prijzen-label h3 {
    color: #71938A;
}

tr.kc-block-prijzen-label td h1,
tr.kc-block-prijzen-label td h2,
tr.kc-block-prijzen-label td h3,
tr.kc-block-prijzen-label td h4,
tr.kc-block-prijzen-label td h5,
tr.kc-block-prijzen-label td h6 {
    line-height: 1.1em;
    margin: 0;
    padding: 0;
}

.kc-block-prijzen table tr.kc-block-prijzen-first-row th,
    /**
     * Modal
     */
.kc-emprover-modal .modal-dialog {
    /*width: 369px;*/
}

.kc-emprover-modal .modal-body,
.kc-emprover-modal .modal-footer {
    background-color: #ecf1f0;
}

.kc-emprover-modal .modal-body {
    padding: 0;
}

.kc-emprover-modal .kc-modal-inner {
    padding: 10px 20px 0 20px;
}

.kc-emprover-modal .kc-emprover-modal-header {
    width: 100%;
    height: calc(width / 100 * 37.12%);
    min-height: 147px;
    background-image: url("../images/login-screen2.png");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
}

.kc-emprover-modal .modal-content,
.kc-emprover-modal .modal-content .modal-body,
.kc-emprover-modal .modal-content .modal-footer {
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
}

.kc-emprover-modal .modal-content .modal-footer .my-btn {
    position: relative;
    margin-top: auto;
    left: auto;
    margin-left: auto;
    bottom: auto;
}

.kc-emprover-login-modal .modal-content {
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
}

/**
 * kc-block-desktop-mobile
 */
.kc-block-desktop-mobile .kc-block-desktop-mobile-content h4 {
    margin-top: 0;
}

.kc-block-desktop-mobile-img {
    height: 600px;
    width: auto;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

.kc-block-desktop-mobile-img .img-fluid {
    max-width: none;
    height: auto;
    height: 550px;
    width: auto;
}

.kc-block-desktop-mobile-content {

}

/**
 *
 */
.kc-modalform-response {
    padding: 0px 20px;
}

.kc-modalform-response.error {
    color: red;
}

.kc-modalform-response.success {
    color: green;
}

/**
 *
 */
.kc-block-content-referenties item {
    position: relative;
}

.kc-block-content-referenties img {
    z-index: 2000;
}

.kc-block-content-referenties .behavior {
    position: absolute;
    width: 48px;
    height: 48px;
    z-index: 2001;
    top: 188px;
    left: 9px;
    background-color: #004155;
    text-align: center;
    color: #ffffff;
    border-radius: 50%;
}

.kc-block-content-referenties .behavior a {
    color: #ffffff;
    padding: 10px;
}

.kc-block-content-referenties .behavior a .fas {
    line-height: 47px;
}


.targets .col-12 .col-12:nth-child(2) {
    min-height: 270px;
}

@media (max-width: 992px) {
    .targets .col-12 .col-12:nth-child(2) {
        min-height: 0;
    }
}


/**
 *
 */
.kc-block-prijzen td {
    position: relative;
}

.kc-block-prijzen .tag {
    position: absolute !important;
    display: inline-block;
    width: 100px;
    height: auto;
    background-color: #ed692b;
    /* This makes room for the triangle */
    margin-bottom: 42px;
    position: relative;
    color: white;
    font-weight: 400;
    font-size: 22px;
    line-height: 26px;
    padding: 0;
    padding-top: 5px;
    text-align: center;
    top: -60%;
    left: calc(50% - 50px);
}

/* Makes the triangle */
.kc-block-prijzen .tag:before {
    content: "";
    position: absolute;
    display: block;
    bottom: -45px;
    width: 0;
    height: 0;
    border-top: 45px solid #ed692b;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
}

@media (max-width: 768px) {
    .kc-block-prijzen .tag {
        display: none;
    }
}


.kc-content-logo-slider .owl-carousel .item {
    /*border: 1px solid #cccccc;*/
    border: 10px solid #ffffff;
}


.vacancies h2 {
    font-weight: bold;
}

/* New extra main - above block area */
div.kc-main-above {
    padding: 1rem 0 2rem 0;
    background-color: #e6ecea;
    margin-bottom: 2rem;
}

/**
 * News
 */
.kc-news .container > .row.green {
    background-color: #e6ecea;
}

.kc-news .card {
    border: none !important;
}

.kc-news .kc-img-container {
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-origin: content-box;
}

.kc-news .card-title {
    color: #FFF;
    font-weight: 700;
    font-size: 1.4rem;
}

.kc-news .card-published {
    color: #71938A;
}

.kc-news .card-text {
    color: #71938A;
}

.kc-news .btn {
    background-color: #71938A;
    border-color: #71938A;
}


@media (max-width: 576px) {
    .kc-news .kc-img-container {
        max-width: 382px !important;
        text-align: center;
    }
}

.kc-newsitem .kc-news-title {
    color: #FFF;
    font-weight: 700;
}

.kc-newsitem .kc-published {
    color: #FFF;
}

.kc-pagination .page-link {
    color: #3e5a66;
}

.kc-pagination .page-item.active .page-link {
    background-color: #3e5a66 !important;
    border: 1px solid #3e5a66;
}


.kc-flag-news {
    position: absolute;
    bottom: 10px;
    right: 0px;
    width: 150px;
    height: 150px;
    z-index: 100;
}

.kc-flag-news-navbar {
    position: absolute;
    right: 8px;
    top: 8px;
}

.kc-flag-news-card {
    position: relative;
    display: inline-block;
    top: -.9em;
    padding-left: .35rem;
}

.kc-flag-news-navbar img {
    width: 60%;
    margin-top: 12px;
}

.kc-flag-news-circle {
    width: 10px;
    height: 10px;
    background-color: #ed692b;
    border-radius: 50%;
    position: absolute;
    top: 0px;
    right: 0px;
    border: 1px solid #ffffff;
    animation-name: pulsate;
    animation-duration: 1s;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-out;
}

.kc-flag-news-ringring {
    border: 1px solid #ffffff;
    -webkit-border-radius: 30px;
    height: 18px;
    width: 18px;
    position: absolute;
    right: -4px;
    top: -4px;
    animation-name: pulsate;
    animation-duration: 1s;
    animation-delay: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-out;
    opacity: 0.0;
}

.kc-flag-news-ringring-green {
    border: 1px solid #004155;
}


@-webkit-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        opacity: 0.0;
    }
    50% {
        opacity: 1.0;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        opacity: 0.0;
    }
}

.owl-item .item a:hover {
    text-decoration: none !important;
}

/**
 * EMPWEB-47
 */
.kc-newslist .card {
    border-bottom: 1px solid #004155 !important;
    margin-bottom: 1rem;
    border-radius: 0px !important;
    width: 100%;
    color: #FFF;
    background-color: transparent;
}

.kc-newslist .kc-newslist-item-title {
    font-size: 1.1rem;
}

.kc-newslist .card a.card-link {
    background-color: #3e5a66;
    border-color: #3e5a66;
    color: #fff;
    padding: 6px 10px !important;
    border-radius: 0.2rem;
    line-height: 1.5;
}

.kc-news .kc-news-tag {
    color: #FFF !important;
    /*
    border: 1px solid #004155;
    padding: 3px 6px;
    border-radius: 0.2rem;
    */
}

.kc-newslist .pagination a.page-link {
    background-color: #fff;
    color: #004155;
}

.kc-newslist .pagination a.page-link.active {
    background-color: #004155;
    color: #fff;
}

/**
 * EMPWEB-44
 */

.account.btn.btn-primary.btn-sm {
    border-color: #3e5a66;
}


.kc-main.kc-support-main.support-track-bar {
    background-color: #114a61;
    padding-top: 10px;
    padding-bottom: 10px;
}

.kc-main.kc-support-main.support-track-bar a {
    text-decoration: none;
    color: #ffffff;
}

/* template areas */
.kc-main-above.kc-support-main-above {
    margin-bottom: 0px;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.kc-main.kc-support-main {
    background-color: #c9d8d3;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

/* blocks */
.kc-support-form {

}

.kc-support-tracks .track-col {
    padding-top: 3px;
    padding-bottom: 1px;
}

.kc-support-tracks .track-col .card-body {
    background-color: rgba(255, 255, 255, .5);
}

.kc-support-tracks .message {
    font-size: .85rem;
    color: #ed692b;
}

.kc-support-tracks .track-btn {
    border: none;
    color: #ffffff !important;
}

.kc-support-tracks .track-btn-0 {
    background-color: #9c9c9c;
}

.kc-support-tracks .track-btn-1 {
    background-color: #004155;
}

.kc-support-tracks .track-btn-2 {
    background-color: #f44c1d;
}

.kc-support-tracks .track-row.odd {
    background-color: rgba(255, 255, 255, .2) !important;
}

.track-col {
    outlineX: 1px solid rgba(255, 0, 0, .2);
}

.track-row {
    margin-bottom: .4rem;
}

.track-date {
    display: inline-block;
    width: 8.5rem;
}

.track-time {
    display: inline-block;
}


/* EMPWEB-50 */

.kc-block-content-klantervaringen-top .header span {
    color: #71938A;
    font-weight: 700;
}

.kc-block-content-klantervaringen .item .title {
    font-weight: bold;
    padding: 0;
    margin: 0;
}

.kc-content-header-pill span {
    background-color: #ed692b;
    color: #ffffff;
    font-size: 1.5rem;
    /*font-weight: 400;*/
}

/**

*/
.kc-content-klantenaanhetwoord .kc-img-container {
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-origin: content-box;
}

.kc-content-klantenaanhetwoord .title {
    font-weight: 400;
    font-size: 1.5rem;
    color: #3D3934;
}

.kc-block-content-referentieslider .title span,
.kc-content-klantenaanhetwoord .title span {
    font-weight: 700;
}

.kc-content-klantenaanhetwoord-bedrijven {
    background-color: #f0f4f2;
}

.kc-content-klantenaanhetwoord-adviesbureaus {
    background-color: #000000;
}

.kc-content-klantenaanhetwoord-overheden {
    background-color: #dce4e2;
}

.kc-content-klantenaanhetwoord .card {
    border: none !important;
}

.kc-content-klantenaanhetwoord .card .card-text {
    font-size: 1rem;
}


/* Bedrijven */
.kc-block-content-referenties.kc-block-content-referenties-v2.kc-block-content-referenties-v2-1 {
    background-color: #f0f4f2;
}

/* Adviesbureaus */
.kc-block-content-referenties.kc-block-content-referenties-v2.kc-block-content-referenties-v2-2 {
    background-color: #000000;
}

/* Overheden */
.kc-block-content-referenties.kc-block-content-referenties-v2.kc-block-content-referenties-v2-3 {
    background-color: #dce4e2;
}

.kc-block-content-referenties.kc-block-content-referenties-v2 .title span {
    font-weight: 700;
    font-size: 1.5rem;
    color: #3D3934;
}

/**
EMPWEB-57
*/
.content-videopresentatie-container {
    position: relative;
}

.content-videopresentatie-container,
.content-videopresentatie-video {
    /*aspect-ratio: 16 / 9;*/
    width: 100%;
}

.content-videopresentatie-textcontainer {
    position: absolute;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    /*background-color: rgba(0, 0, 0, .25);*/
    text-align: center;
}

.content-videopresentatie-textcontainer iframe {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    /*min-height: 400px !important;*/
}


.content-videopresentatie-container h1 {

}

.content-videopresentatie-container h1,
.content-videopresentatie-container h3 {
    text-align: center;
    color: #fff;
    padding: 0 5%;
    text-shadow: 1px 1px 10px #000, 2px 2px 20px #000;
}

.content-videopresentatie-container h1 {
    font-weight: bold;
    font-size: 42px;
    line-height: 43px;
}

.content-videopresentatie-container h3 {
    font-size: 28px;
    line-height: 29px;
}

@media (max-width: 1024px) {
    .content-videopresentatie-container h1 {
        font-size: 28px;
        line-height: 29px;
    }

    .content-videopresentatie-container h3 {
        font-size: 18px;
        line-height: 19px;
    }
}

@media (max-width: 768px) {
    .content-videopresentatie-container h1 {
        font-size: 18px;
        line-height: 19px;
    }

    .content-videopresentatie-container h3 {
        font-size: 14px;
        line-height: 15px;
    }
}