@font-face { font-family: Metaplus; src: url("MEPBR___.eot") /* EOT file for IE */ }
@font-face {  font-family: Metaplus; src: url("MEPBR___.ttf") }
@font-face { font-family: 'FontAwesomeBrands'; src: url(/_fonts/FontAwesome/fa-brands-400.ttf) format('truetype'); font-weight: normal; font-style: normal; }
/* *donkerblauw: #002e55; donkergrijsblauw: #406380; lichtgroen: #ced558; */
html, body { margin: 0; padding: 0; }
body { font-family: Verdana, Arial, Helvetica, SunSans-Regular; background-color: #fff; color: #406380; font-size: 12px; margin: 0px; overflow: scroll; overflow-x: hidden; }
a, a:active, a:focus { outline: none; }
a img { border: 0px }
.logo a {position: absolute; left: 25px; top: 25px; z-index: 20; width: 250px;  height: 250px; display: block;  }
.bg { position: absolute; left: 0; top: 0; width: 100%; height: 280px; z-index: 2; background: url(../img/bgTop.gif) no-repeat left top; background-size:cover }
.lijnlinkerkant { position: fixed; z-index: 1; height: 100%; left: 139px; top: 0%; width: 1px; border-left: solid 1px #ccd64b; }
.plaatjeslinkerkant { position: absolute; top: 320px; left: 70px; width: 138px; }
.plaatjeslinkerkant img { width: 100%; border: solid 1px #ccd64b; margin-bottom: 138px; }
 .mobiel { display: none; }
.menu { position: relative; width: 1000px; height: 280px; z-index: 10; }
.menu li { list-style: none; background-image: url(../img/pijl.png); background-repeat: no-repeat; background-position: left center; padding-left: 25px; width: 180px; }
#hierbenik { color: #ced558;}
.menu a { font-family: "Metaplus"; font-size: 1.4em; font-weight: bold; color: #fff; text-shadow: 0px 0px 3px #002e55; text-decoration: none; }
.menu a:hover { color: #ced558; text-decoration: none; }
.menu li:first-of-type { position: absolute; left: 282px; top: 26px; }
.menu li:nth-of-type(2) { position: absolute; left: 750px; top: 26px; }
.menu li:nth-of-type(3) { position: absolute; left: 430px; top: 68px; }
.menu li:nth-of-type(4) { position: absolute; left: 600px; top: 114px; }
.menu li:nth-of-type(5) { position: absolute; left: 480px; top: 158px; }
.menu li:nth-of-type(6) { position: absolute; left: 750px; top: 158px; }
.menu li:nth-of-type(7) { position: absolute; left: 330px; top: 192px; }
.menu li:nth-of-type(8) { position: absolute; left: 540px; top: 222px; }
.container { position: relative; margin-left: 260px; max-width: 680px; }
.wepContent { line-height: 30px; }
.wepContent_foto { position: relative; z-index: 2; float: left; margin-left: -190px; display: block; }
.wepContent_foto img { width: 250px; }
.wepContent h1 { font-family: Metaplus; font-size: 2em; background-image: url(../img/pijlgroot.png); background-repeat: no-repeat; background-position: 40px top; padding-left: 90px; margin-top: 20px; }
.wepContent h2 { font-family: Metaplus; font-size: 1.5em; background-image: url(../img/pijl.png); background-repeat: no-repeat; background-position: 40px 6px; padding-left: 90px; margin-top: 0px; }
.wepContent p { font-weight: normal; font-size: 1.2em; padding-left: 40px; padding-right: 40px;}
.wepContent a { color: #002f55; text-decoration: underline; }
.wepContent a:hover { text-decoration: none }
.wepContent ul { padding-left: 60px; padding-right: 20px; }
.wepContent li { padding-left: 15px; padding-right: 20px; }

.bdhome .wepContent:first-of-type {margin-bottom: 40px;padding-bottom: 20px; border-bottom: solid 1px #ced558;;}

/*Nieuws / Colums*/
.wepContent h3.nieuws_titel_lijst { font-family: Metaplus; font-size: 1.5em; padding-left: 40px; margin-top: 0px; }
.nieuws_categorie {color: #ced558;  }
.nieuws_datum { color: #ced558; }
.nieuws_terugOverzicht { }
.soortNieuws { color: #ced558;}
.datum { color: #ced558; }

/*pagination*/
.pgNrs { display: block; clear: both; width: 100%; padding: 4px; overflow: hidden; }
a.pgNr { display: inline-block; border: 1px solid #406380; padding: 0 10px; margin: 2px; width: 30px; line-height: 40px; text-align: center; text-decoration: none; color: #406380; font-weight:bold}
a.pgNr:hover, #pgNrActive { background-color: #406380; color: #fff; border: 1px solid #406380; text-decoration: none; }
#pgNrsLeft, #pgNrsRight { font-size: 2.2em; text-decoration: none; color: #406380; }
a.pgJumpL {margin-right:30px }
a.pgJumpR {margin-left:30px }
@media screen and (max-width:600px) {
    a.pgTwoSteps {display: none; } /*verbergen indien mobiel*/
}
@media screen and (max-width:370px) {
    .pgNrs { display: block; clear: both; width: 100%; padding: 4px; overflow: hidden; }
    a.pgNr { display: inline-block; border: 1px solid #406380; padding: 0 6px; margin: 2px; width: 30px; line-height: 30px; text-align: center; text-decoration: none; color: #406380; }
    a.pgTwoSteps {display: none; }
}

/* social SHARE */
.socialmediaShare { margin-bottom: 100px; }
.social { width: 100%; text-align: left; margin-left: 40px; }
.social:before {content:'Deel dit bericht:';}
.social ul { display: inline; list-style: none; list-style-type: none !important; margin: 0; padding: 0; text-align: right; box-sizing: unset; }
.social ul li:before { display: normal; width: auto; height: auto; content: none; }
.social li { position: relative; z-index: 1; display: inline-block; color:#002e55; font-size: 2.1em !important; text-align: center; margin: 3px; padding: 0 !important; }
.social li:hover { color: #ced558; cursor: pointer; }
.social li#smTW:after { font-family: 'FontAwesomeBrands'; content: '\f099'; }
.social li#smLI:after { font-family: 'FontAwesomeBrands'; content: '\f08c'; }
.social li#smFB:after { font-family: 'FontAwesomeBrands'; content: '\f09a'; }
.social li#smWA:after { font-family: 'FontAwesomeBrands'; content: '\f232'; }
.social li#smINSTA:after { font-family: 'FontAwesomeBrands'; content: '\f16d'; }
.social li:before { display: none; }

/* social CHANNEL */
.socialChannels { position: absolute; z-index: 1000;  right: 0px; top: 240px; width: auto; margin: 0 20px; text-align: center; white-space:nowrap; }
.socialChannels ul { display: inline; list-style: none; list-style-type: none !important; margin: 0; padding: 0; text-align: center; box-sizing: unset; }
.socialChannels li { position: relative; z-index: 1; display: inline-block; color: #fff; font-size: 2em !important; text-align: center; margin: 0 5px; padding: 0 !important;cursor:pointer }
.socialChannels li:hover {color: #ced558}
.socialChannels li:before { display: none; }

.socialChannels li#smChTW:after { font-family: 'FontAwesomeBrands'; content: '\f099'; }
.socialChannels li#smChLI:after { font-family: 'FontAwesomeBrands'; content: '\f08c'; }
.socialChannels li#smChFB:after { font-family: 'FontAwesomeBrands'; content: '\f09a'; }
.socialChannels li#smChWA:after { font-family: 'FontAwesomeBrands'; content: '\f232'; }
.socialChannels li#smChINSTA:after { font-family: 'FontAwesomeBrands'; content: '\f16d'; }

/* cited work */
.wepContent cite {padding-left: 40px; padding-right: 40px;display: block; font-style: normal; }
.wepContent cite:before {content:  "» "; color:#ced558;  }
.wepContent cite:after {content: " «"; color:#ced558;  }

.nieuwsberichtBlok   {margin-top:15px}

.wepContent{ min-height:260px;margin-bottom:15px;}
.wepContent:first-of-type{ min-height:unset;margin-bottom:auto;background-color:unset}

@media screen and (min-width: 1150px) {
    .menu { margin: 0 auto; padding-right: 300px; }
    .container { margin: 0 auto; }
    .lijnlinkerkant { left: calc(50% - 460px); }
    .wepContent_foto { position: relative; z-index: 2; float: left; margin-left: -250px; display: block; }
    .wepContent_foto img { width: 250px; }
}
@media screen and (max-width: 980px) {
    .menu {width: auto;height: auto;}
    .menu li { position: relative!important; left: 260px!important; top: auto!important; line-height: 31px; }    
    .container { margin-left: 100px; }
    .lijnlinkerkant { left: 69px; }
    .wepContent_foto { margin-left: -65px; }
    .wepContent_foto img { width: 69px; }
}
@media screen and (max-width: 760px) {
    .container { margin: 300px 0 100px 35px; max-width: calc(100% - 75px); }
    .tekst {margin: 0; padding: 0;}
    .mobiel { display: block; }
    .icon { position: absolute; right: 6px; top: 0px; z-index: 13; border: 0; margin: 0; padding-left: 10px; height: 60px; width: 60px; border-radius: 50%; cursor: pointer; display: flex; justify-content: flex-start; outline: 0; }
    .icon span { height: 3px; width: 30px; background-color: #fff; border-radius: 0px; position: absolute; webkit-transition: -webkit-transform 0.3s; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .icon span:first-child { top: 18px; }
    .icon span:nth-child(2) { top: 28px; }
    .icon span:last-child { top: 38px; width: 24px; }
    .icon--active span:first-child { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 28px; }
    .icon--active span:last-child { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); position: absolute; top: 28px; width: 30px; }
    .icon--active span:nth-child(2) { opacity: 0; }
    .icon--button { border-radius: 0px; }
    .icon--square { border-radius: 0; }
    .icon--transparent { background-color: transparent; }
    .icon--transparent span { }
    .icon-transition { -webkit-transition: -webkit-transform 0.3s; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .menu { width: auto;height: auto; max-width: 90vw;}
    .menu li { left: -15px !important; line-height: 50px; white-space: nowrap; width: auto;}
    .menuContainer { position: absolute;  z-index: 10; left: -100vw; top: 281px; transition: all 600ms ease-in-out; padding: 0px; margin: 0; height: auto; width: 100%; background:#002e55; }
    .menuContainer.open { left: 0; }
     .lijnlinkerkant { left: 35px; }
    .wepContent_foto { margin-left: -30px; }
    .wepContent_foto img { width:60px; }  
    .wepContent h1 { font-size: 1.8em; background-position: -10px top; padding-left: 40px; padding-right: 0px;}
    .wepContent h2 {font-size: 1.5em; background-position: -10px 6px; padding-left: 40px; padding-right: 0px; margin-top: 0px; }
    .wepContent p { font-weight: normal; font-size: 1.2em; padding-left: 40px; padding-right: 0px; }
    .socialChannels { top: 250px;  }
    .socialChannels li { font-size: 1.9em !important; margin: 0 3px; }
}
