
/* GLOBAL */

html { overflow: auto;background: white;font: 16.5px Roboto;line-height: 25px;}
a:link { text-decoration: none;}
.content { width: 80%;margin: 0 auto;max-width: 1440px;}
.BasicWebMenu .mobileOnly { display: none;}
.mobile .BasicWebMenu .mobileOnly { display:inherit;}

.personal { opacity: 0;transition: 1s opacity;}
.personal.on { opacity: 1;ytansition: .1s opacity;}
.block.top { background: white url(image/homebg.png);background-size: cover;min-height: calc(100vh - 210px);color: white;}
.row.header { padding: 50px 0;background: #fffffff0;width: 100%;}
.block { position: relative;}
.block.top .row.header { position: fixed;top: 0;z-index: 10;transition: .5s;}
.block.top .row.header .content { display: grid;grid-template-columns: 1fr 100fr;}
.row.footer { padding: 50px 0;background: #fffffff0;font-family: Swiss721 BT;font-weight: 700;font-style: Bold Extended;font-size: 35px;leading-trim: NONE;line-height: 45px;letter-spacing: 0%;}

.calque { position: absolute;right: 0;bottom: 244px;z-index: 1;}
.calque img { width: 30vw;}

img.hamburger { height: 21px;margin: 7px 20px 18px 0;}
.hamburgermenu, .menus { display: inline-block;}
.menus { display: grid;grid-template-columns: 1fr 10fr 1fr;}
.menus .logo { width: 300px;}
.BasicWebMenu { width: inherit;max-width: inherit;margin: 0;}
.hamburgermenu .clicky-menu { display: inline-block;background: #F6FAFE;border: 1px solid #cccc;}
.Menu2026 { left: 20px;top: -900px;animation: slide .8s forwards;position: absolute;}
@keyframes slide { 100% { top: 59px;} }
.clicky-menu > li { flex: none;}
.BasicWebMenu.homemenu { display: inline-block;vertical-align: top;max-width: none;margin-top: -10px;}
.homemenu .menu { flex-wrap: nowrap;justify-content: space-evenly;}
.BasicWebMenu.homemenu .clicky-menu > li { flex: auto;}
.opdrachtgevers0 img { max-height: 4vw;}

.menu a { font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 16px;leading-trim: NONE;line-height: 22px;letter-spacing: 5%;text-align: center;color: #29275C;}
.button.big { font-family: Swiss721 BT;font-weight: 400;font-style: Black Extended;font-size: 18px;leading-trim: NONE;line-height: 24px;letter-spacing: 0%;text-align: center;}

.button a { padding: 12px 24px;border-radius: 50px;color: white;font-weight: bold;position: relative;margin-right: 20px;}
.button a:hover {box-shadow: 1px 1px 5px 2px #ccc;}
.button.big a { padding-right: 60px;}
.button.big a::before { content: '';background-image: url(image/arrow.png);position: absolute;pointer-events: none;width: 40px;height: 40px;background-size: cover;right: 4px;top: 3px;}
.button.blue.big a::before { background-image: url(image/arrowb.png);}
.button.big a:hover::before { transform: rotate(45deg);transition: .3s;}
.button.green a { background: #00A062;}
.button.blue a { background: #29275C;}
.button.lightgrey a span {background: #EBEBEB;}

.zoekmenu0 { display: inline-block;}
.zoekmenu0 img { width: 35px;margin-bottom: 11px;}
.intromenu { margin: 0;}
.intromenu .clicky-menu > li { flex: initial;}

.clicky-menu a:hover { background: none;}

h1 {font-family: Swiss721 BT;font-weight: 700;font-style: Bold Extended;font-size: 55px;leading-trim: NONE;line-height: 65px;letter-spacing: 0%;padding: 20px 0;margin: 0;}
h1.blue { background-image: linear-gradient(90deg, #29275C 19.18%, #9BB5DF 127.89%);background-clip: text;width: fit-content;color: transparent;}
h1.grey { background-image: linear-gradient(90deg, #29275C 0%, #9BB5DF 100%);background-clip: text;width: fit-content;color: transparent;}
h1.white { color: white;}
h2 {font-family: Swiss721 BT;font-weight: 700;font-style: Bold Extended;font-size: 35px;leading-trim: NONE;line-height: 65px;letter-spacing: 0%;position: relative;}
h2.blue { background-image: linear-gradient(90deg, #29275C 19.18%, #9BB5DF 127.89%);background-clip: text;width: fit-content;color: transparent;}
h2.extended { font-style: Extended;} 

h2 * { vertical-align: middle;display: inline-block;}
h2.metstreep:after { content: ' ';border-bottom: 7px solid #00A062;width: 35px;position: absolute;bottom: -20px;left: 0;overflow: auto;}
h2.metstreep.donker:after { ;border-bottom: 7px solid #008052;}

.p1 {font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 27px;leading-trim: NONE;line-height: 35px;letter-spacing: 0%;padding: 20px 0;margin: 0;}
.p2 {font-family: Roboto;font-weight: 400;font-style: Regular;font-size: 22px;leading-trim: NONE;line-height: 32px;letter-spacing: 2%;}
.intro { width: 40%;font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 27px;leading-trim: NONE;line-height: 35px;letter-spacing: 0%;}
.footer h2 { margin: 0 auto;}

.aibuddy { position: fixed;width: 384px;height;560px;right: 100px;bottom: 20px;z-index: 10;}

.leerlijnen { background: url(image/calque2.png),linear-gradient(360deg, #0F5E4F 5.28%, #009F62 63%);background-size: cover;min-height: calc(100vh - 210px);color: white;} 
.navLeerlijnen0 { text-align: left;display: grid;grid-template-columns: 1fr 1fr;gap: 20px;}
.leerlijnen img { width: 100%;}

.vLeerlijnen .BasicWebViewRows { display: flex;flex-wrap: wrap;gap: 20px;}
.vLeerlijnen .BasicWebViewRow { width: 400px;height: 300px;background: white;border-radius: 10px;box-shadow: 2px 2px 4px 2px grey;}
.vLeerlijnen .header { display: none;}


.vPopulair .BasicWebViewRows { display: flex;flex-wrap: wrap;gap: 20px;}
.vPopulair .BasicWebViewRow { width: 400px;height: 300px;background: white;border-radius: 10px;box-shadow: 2px 2px 4px 2px grey;}
.vPopulair .header { display: none;}
.vPopulair .BasicWebViewCell { display: block;height: 100%;}
.vPopulair .BasicWebViewCell a { display: block;height: calc(100% - 20px);padding: 10px;}
.vPopulair .BasicWebViewCell a > span { display: flex;flex-wrap: wrap;height: 100%;}
.vPopulair .BasicWebViewCell .footer { align-self: flex-end;border-top: 2px solid #cfcfcf;width: 100%;padding: 10px 0 0;}
.vPopulair .BasicWebViewCell .mark { display: inline-block;padding: 6px 12px;border-radius: 5px;margin: 8px;font: 13.5px Roboto;font-weight: 500;white-space: nowrap;}
.vPopulair .BasicWebViewCell .niveau { background: #9BB5DF50;color: #29275C;}
.vPopulair .BasicWebViewCell .duur { background: #CFCFCF50;color:: #29275C;}
.vPopulair .BasicWebViewCell .certif { background: #00A06250;color: #00A062;}
.vPopulair .BasicWebViewCell .naam { display: block;font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 27px;leading-trim: NONE;line-height: 35px;letter-spacing: 0%;}
.vPopulair .BasicWebViewCell .tekst { font-family: Roboto;font-weight: 500;font-style: Medium;font-size: 13.5px;leading-trim: NONE;line-height: 21px;letter-spacing: 0%;}
.vPopulair .BasicWebViewCell .prijs { font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 20px;leading-trim: NONE;line-height: 28px;letter-spacing: 0%;}
.block.strippenkaart { background: #00A062;background-size: cover;min-height: calc(100vh - 210px);color: white;position: relative;}
.container { display: flex;gap: 20px;}
.kolom { flex: 1;padding: 20px;}
.block.strippenkaart h2.metstreep::after { border-bottom: 7px solid #ffff;width: 35px;}
.pakket { background: url(image/pakket.png);background-size: contain;min-height: calc(50vh - 180px);color: white;position: relative;}
.pakket p { margin-left: 25px;margin-top: 20px;}


.block.incompany { background: white url(image/maninpak.png);background-size: cover;min-height: calc(100vh - 210px);color: white;position: relative;}
.block.opdrachtgevers { background: #9BB5DF;background-size: cover;min-height: 353px;color: white;}


.block.nieuwsbrief { background: #00A062;background-size: cover;min-height: 115px;color: white;}


.block.footer { background: #29275C;background-size: cover;color: white;}
.BasicWebMenu.FooterMenu2026 { margin: 0;}
.BasicWebMenu.FooterMenu2026 .clicky-menu a { color: #9BB5DF;}

/* trainingen */
.block.aanbod { background-color: #9BB5DF40;}
.block.trainingen.top { background: white url(image/trainingenbg.png);background-size: cover;min-height: calc(100vh - 210px);color: black;}

.vAanbod .BasicWebViewRows { display: flex;flex-wrap: wrap;gap: 20px;}
.vAanbod .BasicWebViewRow { width: 400px;height: 300px;background: white;border-radius: 10px;box-shadow: 2px 2px 4px 2px grey;}
.vAanbod .BasicWebViewCell { display: block;height: 100%;}
.vAanbod .BasicWebViewCell a { display: block;height: calc(100% - 20px);padding: 10px;}
.vAanbod .BasicWebViewCell a > span { display: flex;flex-wrap: wrap;height: 100%;}
.vAanbod .BasicWebViewCell .footer { align-self: flex-end;border-top: 2px solid #cfcfcf;width: 100%;padding: 10px 0 0;}
.vAanbod .BasicWebViewCell .mark { display: inline-block;padding: 6px 12px;border-radius: 5px;margin: 8px;font: 13.5px Roboto;font-weight: 500;white-space: nowrap;}
.vAanbod .BasicWebViewCell .niveau { background: #9BB5DF50;color: #29275C;}
.vAanbod .BasicWebViewCell .duur { background: #CFCFCF50;color: #29275C;}
.vAanbod .BasicWebViewCell .certif { background: #00A06250;color: #00A062;}
.vAanbod .BasicWebViewCell .naam { display: block;font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 27px;leading-trim: NONE;line-height: 35px;letter-spacing: 0%;}
.vAanbod .BasicWebViewCell .tekst { font-family: Roboto;font-weight: 500;font-style: Medium;font-size: 13.5px;leading-trim: NONE;line-height: 21px;letter-spacing: 0%;}
.vAanbod .BasicWebViewCell .prijs { font-family: Swiss721 BT;font-weight: 400;font-style: Extended;font-size: 20px;leading-trim: NONE;line-height: 28px;letter-spacing: 0%;}
.BasicWebView.vAanbod .filterBlock { border: 2px solid #EBEBEB;background: #fff;border-radius: 5px;padding: 20px;}
.BasicWebView.vAanbod .filters { float: none;display: flex;flex-wrap: wrap;width: 100%;}
.BasicWebView.vAanbod .filters .filter { order: 2;background: none;}
.BasicWebView.vAanbod .filter { position: relative;color: black;font: 12px Swiss721 BT;border: 1px solid #ddd;border-radius: 30px;margin-right: 20px;padding: 0 26px 0 0;}
.BasicWebView.vAanbod fieldset { width: max-content;top: 36px;left: 36px;border: 2px solid #ddd;border-radius: 10px;display: none;z-index: 2;max-height: 100px;overflow: auto;}
.BasicWebView .filter .header { display: block;line-height: 22px;padding: 9px;}
.BasicWebView .filter.zoekwoord .header { display: none;}
.vAanbod .filters .filter.zoekwoord { order: 1;width: 100%;font-size: 16.5px;border: 0;}
.vAanbod .filters .filter.zoekwoord input { padding: 16px;width: calc(100% - 64px);background: #d9d9d933;border: 2px solid #ccc;border-radius: 10px;font-size: 16.5px;}
.vAanbod .filterSummary { }
.vAanbod .BasicWebViewResult  .header { font: 22px Roboto;margin: 20px;}
.BasicWebView.vAanbod .filters .filter.pijltje::before { background-image: url(image/pijltje.png);width: 20px;content: '';height: 20px;background-size: cover;position: absolute;top: 10px;right: 6px;}
.BasicWebView.vAanbod .filters .filter:hover::before { transform: rotate(45deg);transition: .3s;}
.BasicWebView.vAanbod .filterSummary .summary {background-color: #d9d9d933;border-radius: 5px;}
.BasicWebView.vAanbod .filters .filter.pijltje.empty { display: none;}

/* training */
.block.training.top { background: white url(image/trainingbg.png);background-size: cover;min-height: calc(100vh - 610px);color: black;}
.block.inhoud { background: #9BB5DF40;}