/*
Theme Name: Bureau Schmidt
Theme URI: https://www.bureauschmidt.nl/
Description: <strong>Website Bureau Schmidt</strong>: Wordpress met volgende plugins: Advanced Custom Fields PRO, Classic Editor, Ninja Forms, Redirection, Simple Custom Post Order, Toolbar Publish Button, Yoast Duplicate Post, Yoast SEO. 
Author: Custard
Author URI: https://www.custard.nl/
Version: 1.0
paars #ac4587 rgba(172, 69, 135, 0.5)
grijs #404040 rgba(64, 64, 64, 0.5)
donker grijst #1b1b1b rgba(27, 27, 27, 1) 
*/
/*
paars #ac4587 rgba(172, 69, 135, 0.5)
grijs #404040 rgba(64, 64, 64, 0.5)
donker grijst #1b1b1b rgba(27, 27, 27, 1) 
*/
@keyframes FadeIn {
    0% {
    opacity:0;
    }
    100% {
    opacity:1;
    }
}
@keyframes eightSignDotAnimateEase {
    0% {
    offset-distance: 0%;
    opacity:0;
    }
    7.5% {
    opacity:0;
    }
    7.6% {
    opacity:1;
    }
    90% {
    opacity:1;
    }
    95% {
    opacity:0;
    }
    100% {
    offset-distance: 100%;
    opacity:0;
    }
}
@keyframes eightSignDotAnimate {
    0% {
    offset-distance: 0%;
    opacity:0;
    }
    1% {
    opacity:0;
    }
    1.2% {
    opacity:1;
    }
    98% {
    opacity:1;
    }
    98.5% {
    opacity:0;
    }
    100% {
    offset-distance: 100%;
    opacity:0;
    }
}
html {
    padding:0;margin:0;
    overflow-x:hidden;
}
body {
    padding:0;margin:0;
    font-family: 'Barlow', sans-serif;
    font-size:1.3em;
    color:#1b1b1b;
}
a {
    color:#ac4587;
    text-decoration:underline;
}
section {
    background-position:center center;
}
a:hover,
a:focus {
    color:#1b1b1b;
}
::placeholder {
    color:#999999;
    font-style:italic;
}
.mousePointer {
    cursor:pointer;
}
.galleryImg {
    display:block;
    width:100%;min-height:250px;
}
.nf-error-msg {
   font-weight:normal !important;
}
.nf-form-errors {
    background:rgba(255,0,0,0.1);
}
.nf-form-cont {
    min-height:500px;
}
.nf-cell,
.nf-form-content {
    padding:0 !important;margin:0 !important;
}
#nf-form-2-cont.nf-form-cont {
    min-height:100px !important;
    padding:0;margin:0;
}
.nf-error-msg {
    color:#e80000;
    font-size:0.8em;
}
.nf-error-field-errors {
    font-size:0.9em !important;
    padding:10px 20px !important;margin-bottom:30px;
    background:#ffffff !important;
}
.nf-form-fields-required {
    display:none;
    text-align:right;
    color:#e80000;
    font-size:0.8em;
}
.nf-field-label  label {
    font-size:0.9em !important;
    font-weight:bold !important;
    color:#ac4587;
    font-weight:bold;
}
.invalid {
    border: 1px solid #e80000;
    background:rgba(221,0,0,0.1);
}
.nf-error-msg.nf-error-field-errors {
    margin-top:-40px;
    padding-top:20px !important;
    padding-bottom:20px !important;
    color: #e80000 !important;
    font-size:1em !important;
    font-weight:bold;
    background:rgba(221,0,0,0.1) !important;
}
[type="checkbox"].invalid {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
    -moz-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
    box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
}
.nf-form-content {
   max-width:100% !important;
   padding:0;
   margin: 0 auto;
}
input[type="button"],
.nf-form-content input[type="submit"] {
    text-decoration:none;
    height:60px !important;
    border-radius:0;
    background-color:#000000;
    padding:20px 30px 20px 30px !important;
    color:#ffffff !important;
    font-size:1em !important;
    line-height:1em;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;

}
input[type="button"]:hover,
.nf-form-content input[type="submit"]:hover {
    background-color:#ac4587 !important;
    color:#ffffff !important;
}
.nf-after-form-content {
    display:block;
    margin-top:60px;
}
.pager {
    padding:0;margin:0;
    text-align:center;
}
.pager .nextprevButton,
.pager .page-numbers {
    display:inline-block;
    width:50px;height:50px;
    background:#ffffff;
    color:#ac4587;
    padding-top:8px;
    transition: all 0.2s linear;
    text-align:center;
    margin-right:1px;
    text-decoration:none;
}
.pager .nextprevButton:hover,
.pager .page-numbers:hover,
.pager .nav-next a:hover,
.pager .nav-previous a:hover {
    text-decoration:none;
    background:rgba(26, 36, 64, 0.1);
    color:#ac4587;
}
.pager .page-numbers.current {
    font-weight:bold;
    background:#ac4587;
    color:#ffffff;
    text-decoration:none;
}
h1,h2,h3,h4,h5 {
    font-family:'Viga', sans-serif;
    line-height:1.2em;
    color:#ac4587;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
h1,h2 {
    font-size:2em;
}
blockquote {
    border-left:2px solid rgba(27, 27, 27, 0.3);
    color:rgba(27, 27, 27, 0.3);
    padding-bottom:20px;
    margin-bottom:20px;
    font-style:italic;
}
ul.shareSocials {
    list-style:none;
    padding:0;margin:30px 0 0 0;
}
ul.shareSocials li {
    float:left;
    padding:0;margin:0;
}
ul.shareSocials li.textLabel {
    font-size:1em;
    font-weight:bold;
    padding:0;margin:3px 0 0 0;
    color:#ac4587;
}
ul.shareSocials li a {
    display:block;
    width:40px;height:40px;
    text-align:left;
    text-indent:-9999em;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:30px 30px;
}
ul.shareSocials li a.twitter {
    background-image:url('img/icon_purple_twitter.svg');
}
ul.shareSocials li a.mail {
    background-image:url('img/icon_purple_mail.svg');
}
ul.shareSocials li a.linkedin {
    background-image:url('img/icon_purple_linkedin.svg');
}
ul.shareSocials li a.facebook {
    background-image:url('img/icon_purple_facebook.svg');
}

.button {
    text-decoration:none;
    text-align:left;
    border-radius:0;
    background-color:#000000;
    padding:15px 20px 20px 20px;
    color:#ffffff !important;
    font-size:1.2em;
    line-height:1em;
}
.button:hover,
.button:focus {
    color:#ffffff;
    background-color:#ac4587;
}
.button.small {
    text-decoration:none;
    text-align:left;
    border-radius:0;
    background-color:#000000;
    padding:12px 17px 17px 17px;
    color:#ffffff !important;
    font-size:1em;
    line-height:1em;
}
.button.small:hover,
.button.small:focus {
    color:#ffffff;
    background-color:#ac4587;
}

.button.invert {
    color:#ffffff !important;
    background-color:#ac4587;
}
.button.invert:hover,
.button.invert:focus {
    color:#ffffff;
    background-color:#000000;
}
.related {
    display:block;
    float:left;
    font-family:'Viga', sans-serif;
    font-size:0.6em;
    line-height:1em;
    text-decoration:none;
    color:#ac4587;
    text-align:center;
    padding:62px 10px 0 10px;margin:0 10px 10px 0;
    width:110px;height:110px;
    outline:solid 1px rgba(27, 27, 27, 0.15);
    background-size:40px 40px;
    background-repeat:no-repeat;
    background-position:center top 18px;
    border-radius:55px;
    transition: all 0.25s ease-in-out;
        -webkit-transition: all 0.25s ease-in-out;
            -moz-transition: all 0.25s ease-in-out;
                -o-transition: all 0.25s ease-in-out;
}
.related.klimaat-adaptief-bouwen,
.related.klimaat-en-duurzaamheid,
.related.climat {
    background-image:url('img/icon_purple_climat.svg');
}
.related.bouwen-in-de-ondergrond,
.related.construct {
    background-image:url('img/icon_purple_construct.svg');
}
.related.gebiedsontwikkeling-en-groen,
.related.stedenbouw-en-groen,
.related.groen,
.related.green {
    background-image:url('img/icon_purple_green.svg');
}
.related.infrastructuur,
.related.infra {
    background-image:url('img/icon_purple_infra.svg');
}
.related.management {
    background-image:url('img/icon_purple_management.svg');
}
.related.verkeer-en-mobiliteit,
.related.mobility {
    background-image:url('img/icon_purple_mobility.svg');
}
.related.tijdelijke-expertise,
.related.tempexpert {
    background-image:url('img/icon_purple_tempexpert.svg');
}
.related.water {
    background-image:url('img/icon_purple_water.svg');
}
.related.stedenbouw {
    background-image:url('img/icon_purple_city.svg');
}

.related:hover {
    outline:solid 4px rgba(27, 27, 27, 0.15);
    color:#ac4587;
}
.relatedBig {
    display: table; 
    font-family:'Viga', sans-serif;
    font-size:1em;
    line-height:1em;
    text-decoration:none;
    color:#ac4587;
    text-align:center;
    width:100%;min-height:300px;
    padding:220px 10px 30px 10px;margin:0 10px 10px 0;
    background-size:120px 120px;
    background-repeat:no-repeat;
    background-position:center top 60px;
    transition: all 0.25s ease-in-out;
        -webkit-transition: all 0.25s ease-in-out;
            -moz-transition: all 0.25s ease-in-out;
                -o-transition: all 0.25s ease-in-out;
}
.relatedBig.klimaat-en-duurzaamheid,
.relatedBig.klimaat-adaptief-bouwen,
.relatedBig.climat {
    background-image:url('img/icon_purple_climat.svg');
}
.relatedBig.bouwen-in-de-ondergrond,
.relatedBig.construct {
    background-image:url('img/icon_purple_construct.svg');
}
.relatedBig.gebiedsontwikkeling-en-groen,
.relatedBig.stedenbouw-en-groen,
.relatedBig.groen,
.relatedBig.green {
    background-image:url('img/icon_purple_green.svg');
}
.relatedBig.infrastructuur,
.relatedBig.infra {
    background-image:url('img/icon_purple_infra.svg');
}
.relatedBig.management {
    background-image:url('img/icon_purple_management.svg');
}
.relatedBig.verkeer-en-mobiliteit,
.relatedBig.mobility {
    background-image:url('img/icon_purple_mobility.svg');
}
.relatedBig.tijdelijke-expertise,
.relatedBig.tempexpert {
    background-image:url('img/icon_purple_tempexpert.svg');
}
.relatedBig.water {
    background-image:url('img/icon_purple_water.svg');
}
.relatedBig.stedenbouw {
    background-image:url('img/icon_purple_city.svg');
}
.relatedBig:hover {
    background-color:rgba(27, 27, 27, 0.15);
    color:#ac4587;
}





#offCanvas {
    padding-top:95px;
    background:#ffffff;
    outline:0 !important;
    z-index:2000;
}
.js-off-canvas-overlay {
    background:rgba(172, 69, 135, 0.85) !important;
    z-index:200;
}
#offCanvas h3 {
    font-size:1.2em;
    padding:30px 0 20px 20px;margin:0;
}
#offCanvas ul {
    list-style:none;
    border-top:solid 1px rgba(0,0,0,0.1);
    padding:0;margin:0;
}
#offCanvas ul li {
    padding:0;margin:0;
}
#offCanvas ul li a {
    display:block;
    padding:12px 20px 10px 20px;margin:0;
    font-size:0.85em;
    color:#1b1b1b;
    background-color:rgba(255,255,255,0.1);
    border-bottom:solid 1px rgba(0,0,0,0.1);
    text-decoration:none;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
#offCanvas ul li.active a,
#offCanvas ul li.active a:hover,
#offCanvas ul li.active a:focus {
    background-color:#ffffff;
    color:#1b1b1b;
} 

#offCanvas ul li a:hover {
    background-color:rgba(172, 69, 135, 1);
    border-bottom:1px solid rgba(172, 69, 135, 1);
    color:#ffffff;
}
#offCanvas ul li ul {
    display:none;
    margin-top:0px;
}
#offCanvas ul li.active ul li a,
#offCanvas ul li ul li a {
    display:block;
    padding:10px 0px 8px 20px;margin:0;
    font-size:0.9em;
    font-weight:100;
    text-transform:none;
    color:#ffffff;
    background:none;
    text-transform:none;
}
#offCanvas ul li.active ul li a:hover,
#offCanvas ul li ul li a:hover {
    background: rgba(255,255,255,0.1);
    color:rgba(255,255,255,1);
}
button.closeMenu
{
    position:absolute;
    top:0px;right:0;
    display:block;
    width:100%;height:100px;
    background-color:#ac4587;
    background-image:url('img/icon_white_close.svg');
    background-size:24px 24px;
    background-position:top 36px right 36px;
    background-repeat:no-repeat;
    padding:0;margin:0;
    font-size:2em;
    line-height:0em;
    text-align:right;
    color:#ffffff;
    outline:0 !important;
    cursor:pointer;
    z-index:110;
}
button.openMenu
{
    display:none;
    position:absolute;
    width:70px;height:90px;
    background-image:url('img/icon_menu.svg');
    background-repeat:no-repeat;
    background-size:35px 35px;
    background-position:center top 20px;
    border-radius:35px 35px 0 0;
    top:10px;right:10px;
    z-index:1200;

    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
    cursor:pointer;
    z-index:100;
}
.cell {
    position:relative;
}
.tags {
    margin-top:-20px;
    margin-bottom:30px;
    font-weight:bold;
    line-height:1em;
}
.tagsTiny {
    margin-bottom:30px;
    font-weight:bold;
    line-height:1em;
}

section {
    margin-bottom:40px;
}
section.mapbg {
    background-image:url('img/bg_section_map.jpg');
    background-repeat:no-repeat;
    background-position: center center;
    min-height:574px;
}
.newsItem {
    min-height:175px;
    margin-bottom:20px;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    cursor:pointer;
}
.newsItem:hover {
    transform:scale(0.98);
    background-color:rgba(27, 27, 27, 0.1);
}
.newsItem:hover h4 {
    font-size:1em;
    font-family: 'Viga', sans-serif;
}
.newsItem .tags {
    margin:10px 0 5px 0;
    font-size:0.8em;
    line-height:1.1em;
}
.newsItem .contentPadding {
    padding:30px;
}
.newsItem .newsItemImage {
    width:100%;min-height:150px;
    margin-bottom:10px;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
        -moz-background-size:cover;
            -webkit-background-size:cover;
                -o-background-size:cover;

}
.newsItemSmall {
    font-size:0.9em;
    margin-bottom:40px;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    cursor:pointer;
}
.newsItemSmall:hover {
    transform:scale(0.9);
}
.vacItem {
    margin-bottom:20px;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    cursor:pointer;
    border-bottom:solid 1px rgba(64, 64, 64, 0.2);
}
.vacItem:hover {
    transform:scale(0.98);
}

.searchItem {
    margin-bottom:20px;
    padding-top:20px;
    padding-bottom:20px;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    cursor:pointer;
    border-bottom:solid 1px rgba(64, 64, 64, 0.2);
}
.searchItem:hover {
    transform:scale(0.98);
}
.searchItem h2 {
    font-size:1.6em;
    margin-bottom:10px !important;
}


.imageHolder {
    position:relative;
    width:100%;
    z-index:1;
    cursor:pointer;
    overflow:hidden;
}
.purpleHolder {
    position:absolute;
    width:100%;height:100%;min-height:100%;
    background-image:url('img/bg_purple.png');
    background-repeat:no-repeat;
    z-index:2;
    cursor:pointer;
    overflow:hidden;
}
.imageHolder img {
    position:relative;
    width:100%;
    z-index:1;
}
.imageHolderDescription {
    position:absolute;
    top:0;left:0;
    color:#ffffff;
    padding:30px;
    z-index:3;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
.imageHolder:hover .imageHolderDescription {
    padding:50px;
}
.imageHolder:hover .imageHolderDescription h2 {
    font-size:1.7em;
} 
.videoHolder {
    position:relative;
    margin-bottom:20px;
    z-index:1;
}
.videoHolderDescription {
    position:absolute;
    display:block;
    width:100%;height:100%;
    background-image:url('img/icon_play.svg');
    background-size:100px 100px;
    background-position:center top 30%;
    background-repeat:no-repeat;

    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:2;
    cursor:pointer;
}
.videoHolderDescription:hover {
    background-size:120px 120px;    
    background-position:center top 29%;
}
.imageHolderDescription h1,
.imageHolderDescription h2 {
    color:#ffffff;
}
.videoItem .tags {
    margin:10px 0 5px 0;
    font-size:0.8em;
    line-height:1.1em;
}
.videoItem {
    padding-top:20px;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
.videoItem:hover {
    background-color:rgba(172, 69, 135, 0.1);
}
.videoItem .videoHolder img {

    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;

}
.videoItem:hover .videoHolder img {
    transform:scale(0.95);
}
#headerOffset {
    display:block;
    width:100%;height:160px;
}
header {
    position:fixed;
    width:100%;height:160px;
    background-image:url('img/bg_header.png');
    background-repeat:no-repeat;
    background-position:top center;
    background-color:#ffffff;
    z-index:150;
}
.cell {
    position:relative;
}
#breadcrumbs {
    padding:30px 30px 0 30px;
}
#breadcrumbs {
    font-size:0.9em;
    color:#ac4587;
}
#breadcrumbs a {
    text-decoration:none;
}
#breadcrumbs strong,
#breadcrumbs .last {
    color:#1b1b1b;
    font-weight:normal;
}
.contentPadding {
    padding:60px 30px;
}
.contentPadding.firstContent {
    padding-top:30px;
}
.contentPadding:last-child {
    margin:0;
}
.contentPadding p {
    margin-bottom:30px;
}
.noPaddingTop {
    padding-top:0;
}
.noPaddingTopBottom {
    padding-top:0;
    padding-bottom:0;
}
.extraPaddingTop {
    padding-top:120px;
}
.contentPadding h1,
.contentPadding h2 {
    margin-bottom:30px;
}
.contentPadding p:last-child {
    margin:0;
}
.contentPadding ul {
    list-style:none;
    padding:0;margin:20px 0 60px 0;
}
.contentPadding ul li {
    list-style:none;
    padding:0 0 0 20px;margin:0 0 5px 0;
    font-size:1em;
    background-image:url('img/icon_purple_dot.svg');
    background-position:top 13px left 0;
    background-size: 7px 7px;
    background-repeat:no-repeat;
}
.subNavi ul,
ul.subNavi {
    list-style:none;
    padding:0;margin:20px 0 60px 0;
    background:none;
}
.subNavi ul li,
ul.subNavi li {
    list-style:none;
    padding:0;margin:0 0 1px 0;
    background:none;
}
.subNavi ul li a,
ul.subNavi li a {
    display:block;
    background:rgba(27, 27, 27, 0.08);
    padding:15px 20px 13px 20px;margin:0;
    font-family:'Viga', sans-serif;
    font-size:0.9em;
    text-decoration:none;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;    
}
.subNavi ul li.current_page_item a,
.subNavi ul li.current_page_item a:hover,
.subNavi ul li.current_page_item a:focus,
.subNavi ul li a.active,
.subNavi ul li a.active:hover,
.subNavi ul li a.active:focus,
ul.subNavi li a.active,
ul.subNavi li a.active:hover,
ul.subNavi li a.active:focus,
ul.subNavi li a:hover,
ul.subNavi li a:focus {
    background:#ac4587;
    color:#ffffff;
}
#mobileLogo {
    position:absolute;
    top:105px;left:170px;
    padding:0;margin:0;
    font-size:0.8em;
    opacity:0;
    text-align: center;
    z-index:21;
    transition: all 1s ease-in-out;
        -webkit-transition: all 1s ease-in-out;
            -moz-transition: all 1s ease-in-out;
                -o-transition: all 1s ease-in-out;
}
#mobileLogo h2 {
    padding:0;margin:0 0 -4px 0;
    line-height:1em;
} 
#mobileLogo span.payoff { 
    color:#ac4587;
    font-size:0.8em;
}
#logo {
    position:absolute;
    top:0;left:0;
    padding:0;margin:0;
    z-index:30;
}
#logo a {
    display:block;
    padding:0;margin:0;
    width:400px;height:200px;
    background-image:url('img/logo_bureauschmidt.svg');
    background-repeat:no-repeat;
    background-size:400px 200px;
    background-position:left center;
    text-indent:-9999em;
    text-align:left;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
#navi {
    position:absolute;
    top:10px;right:0;
    padding:0;margin:0;
}
#navi ul {
    list-style:none;
    padding:0;margin:0;
}
#navi ul li {
    float:left;display:inline;
    padding:0;margin:0 0 0 10px;
}
#navi ul li a {
    display:block;
    width:70px;height:90px;
    background-repeat:no-repeat;
    background-size:35px 35px;
    background-position:center top 20px;
    border-radius:35px 35px 0 0;
    text-indent:-9999em;
}
#navi ul li a:hover {
    animation: FadeIn 250ms linear;
    -webkit-animation: FadeIn 250ms linear;
        -o-animation: FadeIn 250ms linear;
            -ms-animation: FadeIn 250ms linear;
                -moz-animation: FadeIn 250ms linear;
}
#navi ul li a.search {
    background-image:url('img/icon_search.svg');
}
#navi ul li a.phone {
    background-image:url('img/icon_phone.svg');
}
#navi ul li a.mail {
    background-image:url('img/icon_mail.svg');
}
#navi ul li a.menu {
    background-image:url('img/icon_menu.svg');
}
#navi ul li a.search.active,
#navi ul li a.search:hover {
    background-image:url('img/icon_purple_search.svg');
    background-color:#ffffff;
}
#navi ul li a.phone.active,
#navi ul li a.phone:hover {
    background-image:url('img/icon_purple_phone.svg');
    background-color:#ffffff;
}
#navi ul li a.mail.active,
#navi ul li a.mail:hover {
    background-image:url('img/icon_purple_mail.svg');
    background-color:#ffffff;
}
#navi ul li a.menu.active,
#navi ul li a.menu:hover {
    background-image:url('img/icon_purple_menu.svg');
    background-color:#ffffff;
}
#mobiNavi {
    display:none;
    position:absolute;
    top:10px;left:0;
    padding:0;margin:0;
}
#mobiNavi ul {
    list-style:none;
    padding:0;margin:0;
}
#mobiNavi ul li {
    float:left;display:inline;
    padding:0;margin:0 0 0 10px;
}
#mobiNavi ul li a {
    display:block;
    width:40px;height:40px;
    background-repeat:no-repeat;
    background-size:30px 30px;
    background-position:center center;
    border-radius:0;
    text-indent:-9999em;
}
#mobiNavi ul li a.search {
    background-image:url('img/icon_purple_search.svg');
}
#mobiNavi ul li a.phone {
    background-image:url('img/icon_purple_phone.svg');
}
#mobiNavi ul li a.mail {
    background-image:url('img/icon_purple_mail.svg');
}
#mobiNavi ul li a.menu {
    background-image:url('img/icon_purple_menu.svg');
}


#naviOverlay {
    display:none;
    position:absolute;
    left:0;top:100px;
    width:100%;
    z-index:20;
}
#naviOverlay a {
    text-decoration:none;
    color:#1b1b1b;
}
#naviOverlay a:hover {
    color:#ac4587;
}
#searchOverlay {
    display:none;
    position:absolute;
    left:0;top:100px;
    width:100%;
    z-index:19;
}
#searchOverlay .grid-x {
    background-color:#ffffff;
    padding:115px 30px 30px 30px;
}
#closeSearchOverlay {
    position:absolute;
    top:-55px;right:-15px;
    display:block;
    width:40px;height:40px;
    background-image:url('img/icon_purple_close.svg');
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center center;
    text-indent:-9999em;
    z-index:20;
    cursor:pointer;
}
#closeNaviOverlay {
    position:absolute;
    top:-55px;right:-15px;
    display:block;
    width:40px;height:40px;
    background-image:url('img/icon_purple_close.svg');
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center center;
    text-indent:-9999em;
    z-index:20;
    cursor:pointer;
}
#closeWorkFields {
    position:absolute;
    top:-15px;right:-15px;
    display:block;
    width:40px;height:40px;
    background-image:url('img/icon_white_close.svg');
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center center;
    text-indent:-9999em;
    z-index:20;
    cursor:pointer;
}
#naviOverlay .grid-x {
    background-color:#ffffff;
    padding:115px 30px 60px 30px;
}
#naviOverlay .naviHolder {
    border-right:1px solid #dddddd;
}
#naviOverlay .naviHolder:last-child {
    border-right:none;
}
#naviOverlay .naviHolder .description {
    font-size:0.8em;
    padding:20px 0;
}
#naviOverlay .naviHolder h3 {
    font-size:1.4em;
    margin:0 0 10px 0;
}
#naviOverlay .naviHolder ul {
    list-style:none;
    padding:0;margin:0 0 20px 10px;
}
#naviOverlay .naviHolder ul li {
    position:relative;
    padding:0;margin:0;
}
#naviOverlay .naviHolder ul li :before {
    content: '\b7\a0';
    position:absolute;
    right:100%;
}
#naviOverlay .naviHolder ul li a {
    display:block;
    font-size:0.8em;
    padding:0;margin:0;
}
#slider {
    width:100%;height:630px;
    overflow:hidden;
    padding:0;margin:0;
}
#slider ul {
    width:100%;height:630px;
    padding:0;margin:0;
    list-style:none;
}
#slider ul li {
    position:relative;
    width:100%;height:630px;
    padding:0;margin:0;
    overflow:hidden;
}
#slider ul li .bgHolder {
    position:absolute;
    width:100%;height:630px;
    padding:0;margin:0;
    background-repeat:no-repeat;
    background-position:center center;
    background-color:#ffffff;
    opacity:0.9;
    filter:blur(10px);
        -webkit-filter: blur(10px);
            -moz-filter: blur(10px);
                -o-filter: blur(10px);
                    -ms-filter: blur(10px);
    transform:scale(1.5);
    z-index:1;
}
#slider ul li .fgHolder {
    position:relative;
    width:100%;height:630px;
    border-radius:0 315px 315px 0;
    z-index:2;
}
#slider ul li .fgTextHolder {
    position:absolute;
    top:0;left:0;
    width:50%;height:630px;
    border-radius:0 315px 315px 0;
    background:#ac4587;
    z-index:21;
}
#slider ul li .fgTextHolder .description {
    padding:100px 100px 30px 60px;
    color:#ffffff;
    font-size:0.9em;
}
#slider ul li .fgTextHolder .description h1,
#slider ul li .fgTextHolder .description h2 {
    color:#ffffff;
    font-size:2em;
    margin-bottom:20px;
}
#sliderInside {
    width:100%;height:300px;
    overflow:hidden;
    padding:0;margin:0 0 40px 0;
}
#sliderInside ul {
    width:100%;height:300px;
    padding:0;margin:0;
    list-style:none;
}
#sliderInside ul li {
    position:relative;
    width:100%;height:300px;
    padding:0;margin:0;
    overflow:hidden;
}
#sliderInside ul li .bgHolder {
    position:absolute;
    width:100%;height:300px;
    padding:0;margin:0;
    background-repeat:no-repeat;
    background-position:center center;
    background-color:#ffffff;
    opacity:0.9;
    filter:blur(10px);
        -webkit-filter: blur(10px);
            -moz-filter: blur(10px);
                -o-filter: blur(10px);
                    -ms-filter: blur(10px);
    transform: scale(1.5);
    z-index:1;
}
#sliderInside ul li .fgHolder {
    width:100%;height:300px;
    border-radius:0 150px 150px 0;
    background-position:center bottom -50px;
    z-index:2;
}
#videoFrame {
    display:block;
    width:100%;height:675px;
    padding:0;margin:0 auto;
    background-color:#ffffff;
    text-align:center;
    overflow:hidden;

}
#videoFrame .videoHolder {
    width:1200;height:675px;
    padding:0;margin:0;
    overflow:hidden;
}
#videoFrame .videoHolder video {
    width:1200;height:675px;
    padding:0;margin:0;
}
#eightSignDot {
    offset-path: path('M83.9,192.2C75.9,195.7-0.4,231,0,296.7c0.4,55.5,40.3,87.3,84.5,87.3c42.8,0,82.9-33.4,83.5-87.3 c0.8-69-83.5-104.8-83.5-104.8S-0.6,156.1,0,82.6C0.5,28.9,48.6,0.4,84.6,0c37.1-0.3,83.2,31.1,83.5,82.5 c0.4,71.3-73.9,105.2-82.6,109');
    position:absolute;
    top:5px;left:6px;
/*     animation:eightSignDotAnimate 6000ms infinite ease-in-out; */
    -webkit-animation:eightSignDotAnimate 6000ms infinite linear; 
        -o-animation:eightSignDotAnimate 6000ms infinite linear; 
            -ms-animation:eightSignDotAnimate 6000ms infinite linear; 
                -moz-animation: eightSignDotAnimate 6000ms infinite linear; 
    animation:eightSignDotAnimate 6000ms infinite linear; 
    width:10px;
    height:10px;
    border-radius:10px;
    background-color:#ffffff;
}
#eightSign .dotView {
    opacity:0;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
}
#eightSign:hover .dotView {
    opacity:1;
}
#eightSign {
    position:relative;
    display:block;
    width:180px;height:395px;
    padding:0;margin:40px auto 40px auto;
    text-align:center;
    background-repeat:no-repeat;
    background-size:180px 395px;
    background-position:center top;
    background-image:url('img/icon_infinity.svg');
    line-height:1em;
    color:#ac4587;
    cursor:pointer;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    user-select: none;
    -webkit-touch-callout: none;
        -webkit-user-select: none;
            -khtml-user-select: none;
                -moz-user-select: none;
                    -ms-user-select: none;

}
#eightSign h2 {
    font-size:4em;
    padding:40px 0 145px 0;margin:0;
}
#eightSign .arrowUp {
    position:absolute;
    top:25px;left:80px;
    display:block;
    width:20px;height:20px;
    padding:0;margin:0;
    background-image:url('img/icon_arrow_up.svg');
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    transform:rotate(180deg);
}
#eightSign.active h2 {
    font-size:4em;
    line-height:0.8em;
    padding:255px 0 0 0;margin:0;
}
#eightSign.active .arrowUp,
#eightSign.active:hover .arrowUp {
    top:80px;
    transform:rotate(0deg) scale(5);
} 
#eightSign:hover .arrowUp {
    transform:rotate(0deg) scale(1.5);
}
#workFields {
    position:relative;
    margin-top:-200px;
    z-index:32;
}
#workFields .grid-x {
    background:#ac4587;
    padding:30px 30px 50px 30px;
}
#workFields h2 {
    color:#ffffff;
    font-size:1.6em;
}
#workFields h4 {
    color:#ffffff;
    font-size:0.8em;
}
#workFields .workFieldItem {
    border-right:1px solid rgba(255,255,255,0.2);
    text-align:center;
    transition: all .1s ease-in-out;
        -webkit-transition: all .1s ease-in-out;
            -moz-transition: all .1s ease-in-out;
                -o-transition: all .1s ease-in-out;
    cursor:pointer;
}
#workFields .workFieldItem:last-child {
    border-right:none;
}
#workFields .workFieldItem:hover {
    transform:scale(1.2);
}
#workFields .icon {
    display:block;
    width:100px;height:100px;
    background-repeat:no-repeat;
    background-size:60px 60px;
    background-position:center center;
    margin:0 auto;
}
#workFields .icon.infra {
    background-image:url('img/icon_infra.svg');
}
#workFields .icon.mobil {
    background-image:url('img/icon_mobility.svg');
}
#workFields .icon.construct {
    background-image:url('img/icon_construct.svg');
}
#workFields .icon.green {
    background-image:url('img/icon_green.svg');
}
#workFields .icon.water {
    background-image:url('img/icon_water.svg');
}
#workFields .icon.stedenbouw {
    background-image:url('img/icon_city.svg');
}
#workFields .icon.management {
    background-image:url('img/icon_management.svg');
}
#workFields .icon.climat {
    background-image:url('img/icon_climat.svg');
}
#workFields .icon.tempexp {
    background-image:url('img/icon_tempexpert.svg');
}
.employHolder {
    position:relative;
    display:block;
    width:100%;
    height:500px;min-height:500px;
    padding:0;margin:0;
    overflow:hidden;
}
.employHolder .description a {
    color:#ffffff !important;
    text-decoration:none;
}
.employHolder .description a:hover,
.employHolder .description a:focus {
    color:#ffffff !important;
    text-decoration:underline;
}
.employHolder .description {
    position:absolute;
    width:100%;height:500px;
    background-color:rgba(172, 69, 135, 0.8);
    top:420px;left:0;
    padding:20px 40px 40px 40px;
    color:#ffffff;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:3;
}
.employHolder:hover .description {
   top:300px;left:0;
}
.employHolder .description h3 {
    color:#ffffff;
    font-size:1.3em;
    margin-bottom:20px;
}
.employHolder:hover  .description h3 {
    color:#ffffff;
    margin-bottom:0;
}
.employHolder .imageBack {
    display:block;
    position:absolute;
    width:100%;height:500px;
    background-position:center center;
    background-size:cover;
        -moz-background-size:cover;
            -webkit-background-size:cover;
                -o-background-size:cover;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:1;
}
.employHolder .imageFront {
    display:block;
    position:absolute;
    width:100%;height:500px;
    background-position:center center;
    background-size:cover;
        -moz-background-size:cover;
            -webkit-background-size:cover;
                -o-background-size:cover;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:2;
}
.employHolder:hover .imageFront {
    opacity:0;
    transform:scale(1.1);
}
.employHolder:hover .imageBack {
    transform:scale(1.1);
}


.employHolderSmall {
    position:relative;
    display:block;
    width:100%;
    height:400px;min-height:400px;
    padding:0;margin:0;
    overflow:hidden;
}
.employHolderSmall .description a {
    color:#ffffff !important;
    text-decoration:none;
}
.employHolderSmall .description a:hover,
.employHolderSmall .description a:focus {
    color:#ffffff !important;
    text-decoration:underline;
}
.employHolderSmall .description {
    position:absolute;
    width:100%;
    background-color:rgba(172, 69, 135, 0.8);
    bottom:0;left:0;
    padding:20px 40px 40px 40px;
    color:#ffffff;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:3;
}
.employHolderSmall .description h3 {
    color:#ffffff;
    font-size:1.3em;
    margin-bottom:0;
}
.employHolderSmall .imageBack {
    display:none;
    position:absolute;
    width:100%;height:500px;
    background-position:center center;
    background-size:cover;
        -moz-background-size:cover;
            -webkit-background-size:cover;
                -o-background-size:cover;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:1;
}
.employHolderSmall .imageFront {
    display:block;
    position:absolute;
    width:100%;height:500px;
    background-position:center center;
    background-size:cover;
        -moz-background-size:cover;
            -webkit-background-size:cover;
                -o-background-size:cover;
    transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
    z-index:2;
}



footer {
    min-height:515px;
    background-image:url('img/bg_footer.png');
    background-position:top center;
    background-repeat:no-repeat;
    color:#ffffff;
    font-size:0.8em;
}
footer .adress {
    padding-left:40px;
}
footer .adress a,
footer .adress a:hover,
footer .adress a:focus {
    color:#ffffff;
}
footer h5 {
    color:#ffffff;
    font-size:1.2em;
}
footer #footerLogo {
    float:right;
    padding:0;margin:60px 20px 60px 0;
}
#footerLogo a {
    display:block;
    padding:0;margin:0;
    width:300px;height:117px;
    background-image:url('img/logo_white_bureauschmidt.svg');
    background-repeat:no-repeat;
    background-size:300px 117px;
    background-position:left center;
    text-indent:-9999em;
    text-align:left;
}
footer #leerbedrijf {
    display:block;
    padding:0;margin:0;
    width:100px;height:100px;
    background-image:url('img/logo_erkend_leerbedrijf.png');
    background-repeat:no-repeat;
    background-size:100px 100px;
    background-position:center center;
    text-indent:-9999em;
}
footer #iso {
    display:block;
    padding:0;margin:0;
    width:100px;height:100px;
    background-image:url('img/logo_iso9001.png');
    background-repeat:no-repeat;
    background-size:100px 100px;
    background-position:center center;
    text-indent:-9999em;
}
footer #co2ladder {
    display:block;
    padding:0;margin:0;
    width:252px;height:151px;
    background-image:url('img/logo_co2_prestatieladder.png');
    background-repeat:no-repeat;
    background-size:252px 151px;
    background-position:center center;
    text-indent:-9999em;
}
footer ul.labels {
    list-style:none;
    padding:0;margin:200px 0 0 0;
    clear:both;
}
footer ul.labels li {
    float:left;display:inline;
    margin-right:40px;
}
footer ul.socials {
    float:right;
    list-style:none;
    padding:0;margin:30px 0 0 0;
    clear:both;
}
footer ul.socials li {
    float:left;display:inline;
}
footer ul.socials li a {
    display:block;
    width:60px;height:60px;
    background-repeat:no-repeat;
    background-size:40px 40px;
    background-position:center center;
    text-align:left;
    text-indent:-9999em;
}
footer ul.socials li:hover {
    opacity:0.6;
}
footer ul.socials li.linkedin a {
    background-image:url('img/icon_white_linkedin.svg');
}
footer ul.socials li.whatsapp a {
    background-image:url('img/icon_white_whatsapp.svg');
}
footer ul.socials li.twitter a {
    background-image:url('img/icon_white_twitter.svg');
}
footer ul.socials li.facebook  a {
    background-image:url('img/icon_white_facebook.svg');
}
footer ul.socials li.insta a {
    background-image:url('img/icon_white_instagram.svg');
}    
footer .copyright {
    padding:30px 0;
    color:#aaaaaa;
}
.video-container { 
    position: relative; 
    padding-bottom: 56.25%; 
    height: 0; 
    overflow: hidden;
    max-width: 1200px;
    margin: 0 auto 50px auto;
}
  
.video-container iframe, .video-container object, .video-container embed, .video-container video { 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0;
    width: 100%;
    height: 100%;
}

@media (min-width: 768px) and (max-width: 991px)
{
    #navi {
        display:none !important;
    }
    #mobiNavi,
    button.openMenu {
        display:block !important;
    }
    #logo {
        position:absolute;
        top:0;left:0;
        padding:0;margin:0;
        z-index:20;
    }
    #logo a {
        display:block;
        padding:0;margin:0;
        width:210px;height:240px;
        background-image:url('img/logo_bureauschmidt.svg');
        background-repeat:no-repeat;
        background-size:500px 213px;
        background-position:left center;
        text-indent:-9999em;
        text-align:left;
    }
    #workFields .workFieldItem {
        border-right:none;
    }
    #slider ul li .fgTextHolder {
        width:70%;height:630px;
    }
    #slider ul li .fgTextHolder .description {
        padding:80px 60px 60px 30px;
    }

    h1,h2 {
        font-size:1.4em;
    }
    .imageHolder {
        padding:0 10px 40px 10px;
    }
    .contentPadding {
        padding:30px;
    }
    .noPaddingTop {
        padding-top:0px;
    }
    section.mapbg {
        background:none;
        min-height:5px;
    }
    footer .adress {
        padding-bottom:40px;
        text-align:right;
    }
    footer h5 {
        color:#ffffff;
        font-size:1.1em;
        margin-bottom:0;
    }
    footer #footerLogo {
        float:right;
        display:block;
        width:107px;height:107px;
        padding:0;margin:30px 0 20px 0;
    }
    #footerLogo a {
        display:block;
        padding:0;margin:0;
        width:107px;height:107px;
        background-image:url('img/logo_white_bureauschmidt.svg');
        background-repeat:no-repeat;
        background-size:300px 107px;
        background-position:left center;
        text-indent:-9999em;
        text-align:left;
    }
    footer ul.labels {
        list-style:none;
        padding:0;margin:30px 0 0 0;
        clear:both;
    }
    #workFields {
        margin-top:-50px;
    }
    #videoFrame {
        display:block;
        width:100%;height:650px;
        overflow:hidden;
        padding:0;margin:0;
        overflow:hidden;
        background-color:#404040;
    }
    #videoFrame .videoHolder {
        width:100%;
        height:auto;
        min-height: 650px;
        min-width: 100%;
        overflow:hidden;
    }
    #videoFrame .videoHolder video {
        left:50%;
        min-height: 650px;
        min-width: 100%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
    }
}
@media (max-width: 767px)
{
    #navi {
        display:none !important;
    }
    #mobiNavi,
    button.openMenu {
        display:block !important;
    }
    #logo {
        top:60px;left:20px;
    }
    #logo a {
        display:block;
        padding:0;margin:0;
        width:149px;height:149px;
        background-image:url('img/logo_bureauschmidt.svg');
        background-repeat:no-repeat;
        background-size:354px 150px;
        background-position:left center;
        text-indent:-9999em;
        text-align:left;

    }
    #mobileLogo {
        opacity:1;
    }
    #workFields .workFieldItem {
        border-right:none;
        border-bottom:1px solid rgba(255,255,255,0.2);
        padding-bottom:40px;
    }
    h1,h2 {
        font-size:1.4em;
    }
    .newsItem {
        padding:30px 0 0 0;
        min-height:50px !important;
    }
    .newsItem:hover h4 {
        font-size:0.8em;
    }
    #slider ul li .fgTextHolder {
        width:100%;height:630px;
        border-radius:0;
    }
    #slider ul li .fgTextHolder .description {
        padding:80px 60px 60px 30px;
    }
    .imageHolder {
        padding:0 10px 40px 10px;
    }
    .contentPadding {
        padding:30px;
    }
    .noPaddingTop {
        padding-top:0px;
    }
    .imageHolder:hover .imageHolderDescription {
        padding:40px 50px 50px 50px;
        font-size:0.8em;
    }
    .imageHolder:hover .imageHolderDescription h2 {
        font-size:1.5em;
    } 
    section.mapbg {
        background:none;
        min-height:5px;
    }
    footer .adress {
        padding-bottom:20px;
        text-align:right;
    }
    footer h5 {
        color:#ffffff;
        font-size:1.1em;
        margin-bottom:0;
    }
    footer ul.socials {
        float:right;
        list-style:none;
        padding:0;margin:0 0 0 0;
        clear:both;
    }
    footer ul.socials li a {
        display:block;
        width:45px;height:45px;
        background-repeat:no-repeat;
        background-size:30px 30px;
        background-position:center center;
        text-align:left;
        text-indent:-9999em;
    }
    footer #footerLogo {
        float:right;
        display:block;
        width:107px;height:107px;
        padding:0;margin:30px 0 20px 0;
    }
    #footerLogo a {
        display:block;
        padding:0;margin:0;
        width:107px;height:107px;
        background-image:url('img/logo_white_bureauschmidt.svg');
        background-repeat:no-repeat;
        background-size:300px 107px;
        background-position:left center;
        text-indent:-9999em;
        text-align:left;
    }
    footer ul.labels {
        list-style:none;
        padding:0;margin:30px 0 0 0;
        clear:both;
    }
    #workFields {
        margin-top:-50px;
    }
    #videoFrame {
        display:block;
        width:100%;height:500px;
        overflow:hidden;
        padding:0;margin:0;
        overflow:hidden;
        background-color:#404040;
    }
    #videoFrame .videoHolder {
        width:100%;
        height:auto;
        min-height: 500px;
        min-width:  100%;
        overflow:hidden;
    }
    #videoFrame .videoHolder video {
        left:50%;
        min-height:  500px;
        min-width:  100%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    section {
        background-position:-9999em;
    }
}