@import url(https://fonts.googleapis.com/css2?family=Quicksand:wght@400;700&display=swap);
@font-face { font-family: 'FontAwesomeRegular'; src: url(../fonts/fa-regular-400.ttf) format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'FontAwesomeSolid'; src: url(../fonts/fa-solid-900.ttf) format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'FontAwesomeBrands'; src: url(../fonts/fa-brands-400.ttf) format('truetype'); font-weight: normal; font-style: normal; }
/* donkerblauw: #27275c; lichtblauw: #d0e6ef; groen: #5eb887 (was #5fb787, evt. aanpassen) */

/* all pages basis */
html, body { height: 100%; min-height: 100%; }
body { margin: 0; padding: 0; font-family: 'Quicksand', sans-serif; color: #27275c; font-size: 18px; font-weight: 400; line-height: 1.75em; overflow-x: hidden; background: #fff;  }
* { box-sizing: border-box; margin: 0; padding: 0; }
a { outline: 0; }
a[href^="tel:"] { text-decoration: none; cursor: default; }
input { -webkit-appearance: none; -moz-appearance: none; appearance: none; }/* uitschakelen default apple button layout */ 

.outerWrapper { width: 100%; }
.innerWrapper { position: relative; max-width: 1240px; margin: 0 auto; padding: 0 20px; vertical-align: top;  }
section:first-of-type {margin-top: 20px;}

/* STANDAARD kolommen */
.kolommen {display: flex;}
.columnMain { position: relative;  margin: 0px 20px 20px 20px; width: calc(60% - 40px); }
.columnAside { width: calc(40% - 20px); margin-right: 20px;}

/* HEADER */
/* logo */
.logo {  text-align: center; }
.logo a img {  height: auto; max-width: 70%; max-height: 100%; margin: 10px; transition: all 0.8s ease-in-out; }
/* telefoonnummers */
.telefoonnummers {  text-align: right; text-transform: lowercase; font-variant: small-caps; margin: 0 20px 0 0; padding: 0; }
.telefoonnummers:before { display: inline-block; font-family: 'FontAwesomeSolid'; content: '\f095'; margin-right: 10px;  
    -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); -ms-filter: fliph; /*IE*/ filter: fliph; /*IE*/ }
.telefoonnummers a { color: #27275c; }
/* all pages MENU */
nav {  width: 100%; width: 100%; min-height: 35px; margin: 0 0 20px 0; padding: 0; }
.mobiel { display: none; }
.menuMain { position: relative;background: #27275c;  }
.menuMain ul { display: flex; justify-content:space-around; list-style: none; margin: 0; padding: 0; }
.menuMain li { position: relative; z-index: 10; margin: 0; padding: 0; }
.menuMain li a { position: relative; color: #fff; text-decoration: none; line-height: 35px; margin: 0 10px; white-space: nowrap;text-transform: uppercase; }
.menuMain li a:hover { color: #5eb887; }
.menuMain li a.current:after { position: absolute; left: calc(50% - 5px); top: 9px; font-family: 'FontAwesomeSolid'; content: '\f0d8'; font-size: 17px; color:#5eb887; }
.menuMain li:last-of-type a {padding: 3px 10px; border-radius: 3px; background:#74bdd3;}
.menuMain li:last-of-type a:hover {color: #fff; background:#5eb887;}

.subMenu {position: relative; width: 100%; height: auto; margin-bottom: 20px; background: #5eb887; }
.subMenu ul {display: flex; justify-content:center; flex-wrap: wrap; list-style: none; margin: 0; padding: 0;}
.subMenu li { margin: 0 10px;}
.subMenu li a { position: relative; color: #fff; text-decoration: none; white-space: nowrap; line-height: 35px;text-transform: none; }
.subMenu li a:hover { color: #27275c; }
.subMenu li a.current:after { position: absolute; left: calc(50% - 5px); top: 9px; font-family: 'FontAwesomeSolid'; content: '\f0d8';font-size: 17px; color:#fff; }

header.scrolled { position: fixed; z-index: 1010; width: 100%; height: 80px; top: 0; background: #fff }
.logo.scrolled { position: fixed; height: 50px; }
.telefoonnummers.scrolled { position: fixed; top: 30px; right:calc(50% - 580px); }
nav.scrolled { position: fixed; z-index: 1010; top: 70px; }
.spacer.scrolled { display: block; height: 170px; width: 100%; background:#fff; }

/* extra menu */
/* .menuVankinderwenstotnieuwleven { text-align: center; color: #27275c; width: 100%; }
.menuVankinderwenstotnieuwleven h1 { font-size: 2.2em; line-height: 1em;  font-weight: bold; margin: 20px; }
.menuVankinderwenstotnieuwleven ul { display: flex; justify-content:center; list-style: none; flex-wrap: wrap; margin: 10px; padding: 0; }
.menuVankinderwenstotnieuwleven li { position: relative; z-index: 10; margin: 20px 5px; padding: 0; }
.menuVankinderwenstotnieuwleven li a { position: relative; color: #27275c; text-decoration: none; padding: 20px 50px 20px 20px; margin: 0; border-radius: 10px; background-color: #5eb887; }
.menuVankinderwenstotnieuwleven li a:hover { color: #fff; background-color: #27275c;}
.menuVankinderwenstotnieuwleven li#anticonceptie a { background-image: url(../img/menuVkwtnl-anticonceptie.svg); background-repeat:no-repeat; background-position: calc(100% - 5px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#anticonceptie a:hover { background-image: url(../img/menuVkwtnl-anticonceptie-white.svg); }
.menuVankinderwenstotnieuwleven li#kinderwens a { background-image: url(../img/menuVkwtnl-kinderwens.svg); background-repeat:no-repeat; background-position: calc(100% - 5px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#kinderwens a:hover { background-image: url(../img/menuVkwtnl-kinderwens-white.svg); }
.menuVankinderwenstotnieuwleven li#zwangerschap a { background-image: url(../img/menuVkwtnl-zwangerschap.svg); background-repeat:no-repeat; background-position: calc(100% - 5px);  background-size: 20px; }
.menuVankinderwenstotnieuwleven li#zwangerschap a:hover { background-image: url(../img/menuVkwtnl-zwangerschap-white.svg); }
.menuVankinderwenstotnieuwleven li#bevalling a { background-image: url(../img/menuVkwtnl-bevalling.svg); background-repeat:no-repeat; background-position: calc(100% - 5px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#bevalling a:hover { background-image: url(../img/menuVkwtnl-bevalling-white.svg); }
.menuVankinderwenstotnieuwleven li#kraamtijd a { background-image: url(../img/menuVkwtnl-kraamtijd.svg); background-repeat:no-repeat; background-position: calc(100% - 5px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#kraamtijd a:hover { background-image: url(../img/menuVkwtnl-kraamtijd-white.svg); }
*/
/* extra menu nieuwe variant*/
.menuVankinderwenstotnieuwleven { text-align: center; color: #27275c; width: 100%;  padding: 20px; background-color: #5eb887; }
.menuVankinderwenstotnieuwleven h1 { font-size: 2.2em; line-height: 1em;  font-weight: bold; margin: 20px; }
.menuVankinderwenstotnieuwleven ul { display: flex; justify-content:center; list-style: none; flex-wrap: wrap; margin: 10px; padding: 0; }
.menuVankinderwenstotnieuwleven li { position: relative; z-index: 10; margin: 20px 5px; padding: 0;}
.menuVankinderwenstotnieuwleven li a { position: relative; color: #27275c; text-decoration: none; width: 220px; display: inline-block;  padding: 20px 50px 20px 20px; margin: 0; border-radius: 10px; background-color: #fff; }
.menuVankinderwenstotnieuwleven li a:hover { color: #fff; background-color: #27275c;}
.menuVankinderwenstotnieuwleven li#anticonceptie a { background-image: url(../img/menuVkwtnl-anticonceptie.svg); background-repeat:no-repeat; background-position: calc(100% - 15px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#anticonceptie a:hover { background-image: url(../img/menuVkwtnl-anticonceptie-white.svg); }
.menuVankinderwenstotnieuwleven li#kinderwens a { background-image: url(../img/menuVkwtnl-kinderwens.svg); background-repeat:no-repeat; background-position: calc(100% - 15px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#kinderwens a:hover { background-image: url(../img/menuVkwtnl-kinderwens-white.svg); }
.menuVankinderwenstotnieuwleven li#zwangerschap a { background-image: url(../img/menuVkwtnl-zwangerschap.svg); background-repeat:no-repeat; background-position: calc(100% - 15px);  background-size: 20px; }
.menuVankinderwenstotnieuwleven li#zwangerschap a:hover { background-image: url(../img/menuVkwtnl-zwangerschap-white.svg); }
.menuVankinderwenstotnieuwleven li#bevalling a { background-image: url(../img/menuVkwtnl-bevalling.svg); background-repeat:no-repeat; background-position: calc(100% - 15px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#bevalling a:hover { background-image: url(../img/menuVkwtnl-bevalling-white.svg); }
.menuVankinderwenstotnieuwleven li#kraamtijd a { background-image: url(../img/menuVkwtnl-kraamtijd.svg); background-repeat:no-repeat; background-position: calc(100% - 15px);  background-size: 30px; }
.menuVankinderwenstotnieuwleven li#kraamtijd a:hover { background-image: url(../img/menuVkwtnl-kraamtijd-white.svg); }

/* all pages TEKST */
.txt h1 { font-size: 2.2em; line-height: 1em;  font-weight: 700; margin: 20px 0 20px 0; }
.txt h2 { font-size: 1.4em; font-weight: 400; margin: 30px 0  2px 0; }
.txt h3 { font-size: 1.2em; font-weight: 400; }
.txt h4 { font-size: 1.1em; }
.txt p { font-size: 1em; margin: 0 0 15px 0; }
.txt p strong { font-weight: 700; }
.txt img { max-width: 100%; height: auto !important; border-radius: 12px;; }
.txt p img { max-width: calc(100% - 20px); height: auto !important; border-radius: 0; padding: 10px;}
.txt ul {margin: 0; padding: 0 0 0 20px; display: inline-block;}
.txt a { text-decoration: none; color: #009fe3;   }
.txt a:hover { text-decoration: none; color: #999; }
.txt table { border-collapse: collapse; max-width: 100%; }
.txt table td { padding: 0px 8px; vertical-align: top;}
.txt hr { border-top: solid 1px #42386e; color: transparent; }

/*Frames formulieren*/
iframe.frmForm{width: 100%;border:0;overflow: hidden !important;}
iframe#frmAanmelden{height: 2950px;}

a.wepButton {  position: relative; width: auto; display: inline-block; padding: 2px 14px 4px 14px; text-align: center; margin: 0px; background: #5eb887; color: #27275c; border: solid 0px #1E9CD8; font-weight: 400; font-size:1em; border-radius: 4px; text-decoration: none;  transition: all 600ms ease-in-out; }
a.wepButton::after { content:' >';  margin-left: 5px;  position: relative; display: inline-block; line-height: 17px; width: 20px; height: 20px;  background: rgba(255,255,255,0.5); border: solid 1px #fff; border-radius: 50%; }
a.wepButton:hover { color: #5eb887; background: #27275c; border: solid 0px #000; text-decoration: none; }
a.wepButton.centreer { transform: translateX(50%); }

/* links naar social media  */
.headerSocials ul.socialLinks {float: none; position: absolute; right:0; top: 0px;}
.headerSocials ul.socialLinks li a { text-decoration: none;  color: #5eb887; }

ul.socialLinks { float: right; display: flex; margin: 20px 0;  padding: 0px; list-style: none; list-style-type: none; }
ul.socialLinks:before {content: 'Volg ons:'; margin-right: 10px;}
ul.socialLinks li a { text-decoration: none;  color: #fff; font-size: 1.8em !important; margin: 0 10px 0 0px; padding: 0 !important; }
ul.socialLinks li a#smTW:before { font-family:  'FontAwesomeBrands'; content: '\f099'; }
ul.socialLinks li a#smLI:before { font-family: 'FontAwesomeBrands'; content: '\f08c'; }
ul.socialLinks li a#smFB:before { font-family: 'FontAwesomeBrands'; content: '\f09a'; }
ul.socialLinks li a#smWA:before { font-family: 'FontAwesomeBrands'; content: '\f232'; }
ul.socialLinks li a#smIn:before { font-family: 'FontAwesomeBrands'; content: '\f16d'; }
ul.socialLinks li a:hover { color: #5eb887; }

/* video */
.wepMovie { width: 100% !important; height: 100vh; object-fit: cover; background: #e0ddd7; }

/* all pages footer */
footer { position: relative; padding: 20px 0; margin-top: -2px; color: #fff; background: #27275c;  }
.footerContent {margin: 0 20px;}

footer .txt {text-align: left!important; margin-top: 20px;}
footer .txt a {color: #fff;}
footer a[href^="tel:"] {color: #fff;}

.sitemapMenu {height: 400px; font-size: 14px;}
.sitemapMenu .menuMain ul {display: flex; flex-direction: row; justify-content: flex-start; }
.sitemapMenu .menuMain li {position: relative; width: 150px;border-right: solid 1px #fff;}

.sitemapMenu .menuMain li a.current:after {content:'';}

.bdHome .sitemapMenu .subMenu  { display: flex; width: auto;  }
.sitemapMenu .menuMain ul > .subMenu ul {position: absolute; top: 30px; left: 0;  display: flex; flex-direction: column;flex-wrap: wrap;  }
.sitemapMenu .menuMain ul > .subMenu li { display: block; width: 150px; overflow: hidden; text-overflow: ellipsis; margin: 0px 40px 0 0; }
.sitemapMenu .menuMain ul > .subMenu li a:hover {color: #5eb887}

.contactButton { position: relative; display: inline-block; color: #fff; text-decoration: none; padding: 5px 10px; margin: 0; border-radius: 10px; background-color: #5eb887; margin: 0 10px 10px 0 }
.contactButton#dienstlijn {background-color: #74bdd3; }
.contactButton:before { display: inline-block; color: #fff; font-family: 'FontAwesomeSolid'; content: '\f095'; margin-right: 10px;  
    -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); -ms-filter: fliph; /*IE*/ filter: fliph; /*IE*/ }

.toTop { display: none; }
.toTop a { position: fixed; z-index: 10; right: 10px; bottom: 0px; width: 40px; height: 40px; text-decoration: none; color: #fff; }
.toTop a:after { position: absolute; top: 0px; left: 10px; font-family: 'FontAwesomeSolid'; content: '\f106'; font-size: 2em; }
.toTop a:hover:after { color: #1b5988; }

/* TEMPLATE HOME */
    .bdHome .menuMain li a.current:after {color: #fff;}
    .bdHome .subMenu  { display: none; }
    .bdHome .txt { text-align: center; }

    /* slideshows */
    .cycle-slideshow { position: relative; margin: 20px 0; }

    .slideVoorstellen .slideContent { display: flex!important; flex-direction: row; justify-content: space-between; margin: 0 20px; height: 450px;}
    .slideVoorstellen .slideContent .txt { width: calc(50% - 10px); background: #d0e6ef; border-radius: 10px; padding: 0px 20px 80px 20px; }
    .slideVoorstellen .slideContent .image { width: calc(50% - 10px); }
    .slideVoorstellen .slideContent img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
    .slideVoorstellen .cycle-prev { display: none; position: absolute; z-index: 1001;  bottom: 20px;  left: calc(25% - 30px); background: #fff; padding: 2px 15px 5px 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; cursor: pointer; font-size: 20px; }
    .slideVoorstellen .cycle-next { display: none; position: absolute; z-index: 1002;  bottom: 20px; left: calc(25% - 10px); background: #fff; padding: 2px 10px 5px 15px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; cursor: pointer;font-size: 20px; }

    .slideReferenties .slideContent { width: auto; height: auto; padding: 100px 20px 100px 20px;vertical-align: top;  }
    .slideReferenties .slideContent .txt { white-space: normal; text-align: center; }
    .slideReferenties .cycle-prev { position: absolute; z-index: 1001;  bottom: 20px;  left: calc(50% - 30px); background: #fff; padding: 2px 15px 5px 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; cursor: pointer; font-size: 20px; }
    .slideReferenties .cycle-next { position: absolute; z-index: 1002;  bottom: 20px; left: calc(50% - 10px); background: #fff; padding: 2px 10px 5px 15px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; cursor: pointer;font-size: 20px; }

    section#uitgelicht {  background: linear-gradient(to bottom, #fff 150px, #5eb887 150px); border-bottom: solid 1px #5eb887; }
    .uitgelicht {margin: 0 0 -1px 0; padding: 0 10px;}
    .slideUitgelicht .cycle-prev { position: absolute; z-index: 1001;  bottom: 10px;  left: calc(50% - 30px); background: #fff; padding: 2px 15px 5px 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; cursor: pointer; font-size: 20px; }
    .slideUitgelicht .cycle-next { position: absolute; z-index: 1002;  bottom: 10px; left: calc(50% - 10px); background: #fff; padding: 2px 10px 5px 15px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; cursor: pointer;font-size: 20px; }
    .slideUitgelicht .slideContent { width: 295px; height: auto; padding: 20px 10px 150px 10px;vertical-align: top; }
    .slideUitgelicht .slideContent img { width: 100%; height: 200px; object-fit: cover; margin-bottom: 10px; border-radius: 12px;box-shadow: 0px 0px 10px #468a65; }
    .slideUitgelicht .slideContent .txt { font-size: 15px; background: #fff; border-radius: 12px; white-space: normal; padding: 10px;box-shadow: 0px 0px 10px #468a65; }
    .slideUitgelicht .slideContent .txt h2 {margin: 0 0 20px 0;}

    section#snelnaar { background: #5eb887; }
    .snelnaar { text-align: center; } 
    .tekstblokSnelnaar { position: relative;  vertical-align: top; display: inline-block; width: 300px; height: 400px; margin: 20px; border-radius: 12px; box-shadow: 0px 0px 10px #468a65; background-color:#fff; background-repeat:no-repeat; background-size: auto 200px; background-position: center top; }
    /* .tekstblokSnelnaar:first-of-type { background-image: linear-gradient(to bottom, rgba(255,255,255,0) 50%, rgba(255,255,255,0.7) 50%), url(/wateringen/_siteFiles/img/layout/home/fotoSnelnaar1.jpg); background-size: cover; }
    .tekstblokSnelnaar:last-of-type { background-image: linear-gradient(to bottom, rgba(255,255,255,0) 50%, rgba(255,255,255,0.7) 50%), url(/wateringen/_siteFiles/img/layout/home/fotoSnelnaar2.jpg); background-size: cover; }*/

    .tekstblokSnelnaar .txt { text-align: left!important; border-bottom-left-radius: 12px;border-bottom-right-radius: 12px;}
    .tekstblokSnelnaar .txt h2 { padding: 175px 20px 0px 20px; text-transform: uppercase; color: #27275c; }
    .tekstblokSnelnaar .txt p {  color: #27275c; width: 100%; height:auto; margin: 0; padding: 0px 20px 50px 20px;  }
    .tekstblokSnelnaar a.wepButton { position: absolute; width: calc(100% - 40px); left: 20px; bottom: 20px; color: #fff;  background: #5eb887; text-align: left; }
    .tekstblokSnelnaar a.wepButton:hover { color: #fff; background: #27275c; border: solid 0px #000; text-decoration: none; }
    .tekstblokSnelnaar a.wepButton::after { background: none; border: 0; }

    section#referenties { background-image: url(../img/Wolken.svg), url(../img/Bijtje.svg); background-repeat:repeat-x, no-repeat; background-position: center center, center 20px; background-color: #d0e6ef; background-size: 120%, 50px; border-top: solid 1px #5eb887; border-bottom: solid 1px #5eb887; }

    .elearning { display: none; margin: 20px 20px 0 20px; padding: 20px; box-shadow: 0 0 10px #ccc; border-radius: 12px; }
    .elearning .txt h2 { font-size: 2.2em; line-height: 1em;  font-weight: 700; margin: 0; }


/* EXTRA TEMPLATE */  
    .bdextraTemplate .columnMain {order: 2; width: calc(100% - 360px); margin: 0px 20px 20px 20px;}
    .bdextraTemplate .columnAside {order: 1; width: auto; margin: 0; } 
    
    .bdextraTemplate .subMenu {background: none;}
    .bdextraTemplate .subMenu ul {width: 300px; margin: 20px; background: #27275c;border-radius: 12px;flex-direction: column; list-style: none; padding: 20px 20px; }
    .bdextraTemplate .subMenu li {display: block; width: calc(100% - 20px); margin: 5px 10px;}
    .bdextraTemplate .subMenu li a { line-height: 1.2em; color: #fff; white-space:normal;}
    .bdextraTemplate .subMenu li a:hover { color: #5eb887;}
    .bdextraTemplate .subMenu li a.current:after { position: absolute; left: -11px; top: 1px; font-family: 'FontAwesomeSolid'; content: '\f0da';font-size: 17px; color:#fff; }

    /* submenu 'van kinderwens tot nieuw leven' inkorten */
    .bdextraTemplate .subMenu li:nth-of-type(6) ~ li { display: none; }
    .bdextraTemplate .meerItems {display: none; color: #fff;padding: 10px; cursor: pointer;}
    .bdextraTemplate .meerItems:hover {color:#5eb887}
    .bdextraTemplate .meerItems:before {content:'+ meer '; }
    .bdextraTemplate .meerItems.showMore:before {content:'- minder '}
    .bdextraTemplate .subMenu.showMore li:nth-of-type(6) ~ li { display: inline-block; }

    .bdextraTemplate header { position: relative; z-index: 1010; width: 100%; height: auto; padding-bottom: 30px; background-image: url(../img/Wolken.svg), url(../img/Bijtje.svg), url(../img/Bijtje.svg); background-repeat:repeat-x, no-repeat, no-repeat; background-position: center center, 30% 80px, 40% 20px; background-color: #d0e6ef; background-size: 120%, 50px, 50px;}
    .bdextraTemplate header .innerWrapper {display: flex; justify-content: space-between;}
    .bdextraTemplate .logo { height:90px; }
    .bdextraTemplate .logo.scrolled { position: relative; height: auto; }

    .bdextraTemplate .topRegel {background:#5eb887; width: 100%; height: auto; padding: 5px; }
    .bdextraTemplate .topRegel h1 {font-size: 1.6em; line-height: 1em; font-weight: bold; color: #fff; margin: 0 20px; }
    .bdextraTemplate .topRegel a { font-size: 1.6em; line-height: 1em; font-weight: bold; color: #fff; text-decoration: none; }
    .bdextraTemplate .topRegel a:hover {color: #27275c}
    
    .bdextraTemplate .menuVankinderwenstotnieuwleven {background: transparent; padding: 0;}
    .bdextraTemplate .menuVankinderwenstotnieuwleven ul { display: flex; flex-direction:column; justify-content: flex-start; width: 150px; flex-wrap: wrap; list-style: none; text-align: left; margin: 10px 10px 10px 20px; padding: 0; background: none; }
    .bdextraTemplate .menuVankinderwenstotnieuwleven li { margin: 0px;}
    .bdextraTemplate .menuVankinderwenstotnieuwleven li a { position: relative; color: #27275c; font-weight: bold; text-decoration: none; padding: 5px; margin: 0; background: none; }
    .bdextraTemplate .menuVankinderwenstotnieuwleven li a:hover { color: #5eb887; }
    .bdextraTemplate .menuVankinderwenstotnieuwleven li a.current { color: #5eb887;}


/* FORMULIEREN */
form#rekenmodule select {border: solid 1px #27275c; padding: 4px 8px; border-radius: 3px; margin-bottom: 30px; text-transform: lowercase; }
form#rekenmodule input {border: solid 1px #27275c; padding: 4px 8px; border-radius: 3px; text-transform: lowercase;}
form#rekenmodule input[type="button"]  { font-family: 'Quicksand', sans-serif; color: #27275c; font-size: 14px; border: solid 1px #fff; padding: 4px; cursor: pointer;}


#compSearch { background: #fff url(../img/zoom.png) no-repeat 5px center; border: solid 1px #b5b4b4; width: 100%; max-width: 200px; margin-bottom: 15px;padding:10px 15px 10px 30px }

.wepForm { width:100%;max-width:800px;margin: 0 auto;font-family: 'Quicksand', sans-serif; color: #27275c; font-size: 14px; padding: 0; }

.txt .wepForm td{padding-bottom:5px !important;}
.wepForm input, .wepForm textarea { border-radius: 0; font-family: 'Quicksand', sans-serif; color: #27275c; font-size: 14px; border: 1px solid #404040; background: #fff;padding: 3px 5px; }
.wepForm input[type="text"],.wepForm input[type="password"],.wepForm textarea { padding: 8px; border: 1px #ccc solid; width: calc(100% - 10px); outline-style: none; }

.wepForm input[type=text]:focus, .wepForm select:focus, .wepForm textarea:focus { border-color:#5fb787; outline:#5fb787 solid 1px }

.wepForm input[type="checkbox"] { opacity: 0; width: 1px; height: 1px; margin: 0; }
.wepForm input[type="checkbox"] + label { font-size: 1.1em; }
.wepForm input[type="checkbox"] + label span { display: inline-block; width: 1.1em; height: 1.1em; margin: -1px 4px 10px 0; vertical-align: middle; cursor: pointer; background-color: #fff; border: solid 1px #ccc; margin-right: 10px; cursor: pointer; }
.wepForm input[type="checkbox"]:checked + label span { background-color: #1E9CD8; border: solid 1px #ccc; }
.wepForm input[type="checkbox"] + label span,  .wepForm input[type="checkbox"]:checked + label span { transition: background-color 0.4s linear; }

.wepForm p input[type="text"] { float:left; width: calc(50% - 10px)!important;margin: 0 10px 15px 0; }
.wepForm .button { cursor: pointer; padding: 5px 14px 7px 14px; border-radius: 0; border: 0px #404040 solid; width: auto; margin: 0 10px 0 0; background: #0196c1; color: #fff;font-weight: 700; text-transform: lowercase; font-variant: small-caps; }
.wepForm .button:hover { color: #fff; background: #000; }

#FormErrorMessage, .FormMsg{width:100%;height:auto;COLOR:#27275c;border:#5fb787 1px solid;padding:5px;}
.FormMsgErr{border: #e73243 1px solid;color: #e73243;}
#FormError { border: #e73243 1px solid; }
.wepForm .fieldAlert { border: #e73243 1px solid!important; }
.wepForm label.fieldAlert { padding: 10px }
.FormErrorMessage { background-color:#e73243;float:left;width: calc(100% - 50px);padding:5px 10px }

@media screen and (max-width: 1800px) { 
    /* 75% */
    body { font-size: 15px; }
    section#topContainer { height: 80px; }
    .logo { position: relative; height: 80px; margin: 10px 10px 20px 10px }
    .slideVoorstellen .slideContent { height: 360px;}
 }

@media screen and (max-width: 1280px) {
    .uitgelicht {margin: 0 auto; width: 900px;}
}

@media screen and (max-width: 1260px) {
    .sitemapMenu {display: none;}

 }

@media screen and (max-width: 1150px) {
    .slideVoorstellen .slideContent { height: auto;}
}

@media screen and (max-width: 1000px) {
    .telefoonnummers.scrolled { position: fixed; top: 20px; left: 0px; width: calc(100% - 40px); text-align: right;}
}

@media screen and (max-width: 960px) {
    .uitgelicht {margin: 0 auto; width: 600px;}
}

@media screen and (max-width: 840px) { 
    .headerSocials {display: none; }
    .telefoonnummers { display: none;}
    .spacer, .spacer.scrolled { display: none;}
    /* mobiel menu */
    .mobiel { display: block; }
	.icon { position: fixed; right: 14px; top: 6px; z-index: 10000; 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: 4px; width: 30px; background-color: #27275c; border-radius: 2px; position: absolute; transform: 0.3s; 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; }
	.icon--active span:first-child { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 28px; background-color:#fff;height: 2px;}
	.icon--active span:last-child { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); position: absolute; top: 28px; width: 30px; background-color:#fff; height: 2px;}
	.icon--active span:nth-child(2) { opacity: 0; }
	.icon--button { border-radius: 0px; }
	.icon--square { border-radius: 0; }
	.icon--transparent { background-color: transparent; }
	.icon-transition { -webkit-transition: -webkit-transform 0.3s; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    
    nav { display: flex;  flex-direction: column; justify-content: flex-start; z-index: 1001; position: absolute; padding: 0px; left: -101vw; top: 0px; background: #5eb887; transition: all 600ms ease-in-out;  }  
    nav.open { top: 0px; left: 0px; transition: all 600ms ease-in-out; }
    nav.scrolled { position: absolute; z-index: 10010; top: 0px; }
    .menuService ul { display: flex; flex-direction: column; justify-content: flex-start; transition: all 600ms ease-in-out; list-style: none; margin: 0; padding: 0; }
    .menuService li { margin: 0; padding: 0; }
    .menuService li a {  text-transform: lowercase; font-variant: small-caps; color: #000; text-decoration: none; margin: 0px; white-space: nowrap; }
    .menuService li a:hover { color: #999; }
    .menuService li a.open, .menu li a.current {  color: #999; }

    .menuMain ul { display: flex; flex-direction: column; justify-content: flex-start; transition: all 600ms ease-in-out; list-style: none; margin: 15px 0; padding: 0;  }
    .menuMain li { position: relative; z-index: 10; margin: 0; padding: 0;    }
    .menuMain li a { display: inline-block;  font-size: 1.1em; color: #fff; text-decoration: none; margin: 0px; white-space: nowrap;  }
    .menuMain li a:hover { color: #999; }
    .menuMain li a.current {  color: #5eb887; }
    .menuMain li a.current:after { position: absolute; left: -10px; top: 0px; font-family: 'FontAwesomeSolid'; content: '\f0da'; font-size: 1em; color:#5eb887 !important;  }
    .menuMain li:hover ul { position: relative; margin-top: 0px; padding: 20px 0;transition: all 600ms ease-in-out; }

    .subMenu ul {display: flex; flex-direction: column; justify-content: flex-start; list-style: none; margin: 15px 0; padding: 0;  }
    .subMenu li a { display: inline-block;  font-size: 1em; color: #fff; text-decoration: none; margin: 0px;  }
    .subMenu li a.current:after { position: absolute; left: -10px; top: 0px; font-family: 'FontAwesomeSolid'; content: '\f0da';font-size: 1em; color:#fff; }

    .columnMain { position: relative; margin: 0px 4% 20px 0; width: 64%; }
    .columnAside .txt h2 { font-size: 1.6em; }

    .logo { text-align: left; }

    .kolommen {display: flex; flex-direction: column; justify-content: flex-start;  }
    .columnMain { position: relative; margin: 0px 4% 20px 0;width: 100%;  }
    .columnAside { width:100%; }	

    /* home */
    .slideVoorstellen .slideContent { display: flex!important; flex-direction: column; justify-content: space-between;}
    .slideVoorstellen .slideContent .txt { width: 100%;  border-bottom-left-radius: 0; border-bottom-right-radius: 0;height: 400px}
    .slideVoorstellen .slideContent .image { width: 100%; height: 300px}
    .slideVoorstellen .slideContent img { border-top-left-radius: 0; border-top-right-radius: 0;}
    .slideVoorstellen .cycle-prev { left: calc(50% - 30px); }
    .slideVoorstellen .cycle-next { left: calc(50% - 10px); }

    /* extra template */
    .bdextraTemplate .logo { text-align: right;  width: 100%; }
    .bdextraTemplate .menuVankinderwenstotnieuwleven ul { margin: 10px 10px 10px 0px; }
    .bdextraTemplate .topRegel h1 { margin: 0; }
    .bdextraTemplate .columnMain {order: 1; width: 100%; margin: 0px 0px 20px 0;}
    .bdextraTemplate .columnAside {order: 2; width: 100%; margin: 0;}  

    .footerContent {margin: 0;}
}

@media screen and (max-width: 660px) {
    .uitgelicht {margin: 0 auto; width: 310px;}
}

@media screen and (max-width: 650px){
    .telefoonnummers:before {content:'';}
    .telefoonnummers.scrolled { display: none; }
    .telefoonnummers { text-align: center; }
    .txt p img { float: none!important}
}

@media screen and (max-width: 340px){
    .tekstblokSnelnaar { width: calc(100% - 40px);}
    .uitgelicht {margin: 0 auto; width: 100%;}
    .slideUitgelicht .slideContent { width: 260px; padding: 20px 5px 175px 5px; }
}