/* GLOBAL */

html { overflow: auto;background: white;}

body { margin: 0;color: #103362;text-align: left;font: 16px Rubik;font-family: Rubik;}

textarea, input, select { font: 16px Rubik;}

a, a:hover { cursor: pointer;text-decoration: none;}

a:link, a:visited {
    color: inherit;
}

:focus { outline: none!important;}

img { max-width: 100%;}

.hidden { display: none !important;}
.blurred { color: transparent;text-shadow: 0 0 10px gray;}

tr.required .label:after { 
    color: red;content: " *";
}

.mobile a:link, a:visited {
    color: inherit;
}

.mobile .data, .mobile .sect0 .data { margin-left: 10px;max-width: calc(100vw - 42px);}
.mobile textarea { width: 100%;}

font[face^='sans-serif'] { font: 1em Rubik;font-family: Rubik;}
font[face^='verdana'] { font: 1em Rubik;font-family: Rubik;}
font[size^='1'] * { font-size: 12px;}
font[size^='2'] * { font-size: 16px;}
font[size^='3'] * { font-size: 20px;}
font[size^='4'] * { font-size: 24px;}
font[size^='5'] * { font-size: 30px;}
font[size^='6'] * { font-size: 36px;}
font[size^='7'] * { font-size: 50px;}

h2>font[face^='sans-serif'] { font-weight: bold;}

.header-width { margin: 0 auto;max-width: 75%;min-width: 360px;}

.h1, h1, h2, h3, h4 { font-family: Rubik;font-weight: bold;margin-top: 0.5em;margin-right: 2em;}
.h1, h1 { font-size: 1.7em;margin-bottom: 1em;}
h2 { font-size: 1.5em;margin-bottom: .5em;}
h3 { font-size: 1.1em;margin-bottom: .3em;}
h4 { font-size: 0.9em;margin-bottom: .2em;}

.gold { color: #FFC05A;}
.red { color: #C93042;}
.green { color: #007C00;}

p { font-family: Rubik;margin-top: 0.5em;}

.columnsize { width: 300px;}

/* Zoeken Home */

#vergrootglas { cursor: pointer;}

.mobile #vergrootglas { width: 24px;height: 24px;}

/* HAMBURGER MENU */

.hamburgermenu { display: inline-block;position: relative;} 
.hamburgermenu .clicky-menu { display: inline-block;} 
.hamburger { width: 40px;margin-right: 12px;}
.mobile .hamburger { padding-top: 0px;width: 24px;}

.Menu2018 { left: 20px;top: -900px;animation: slide .8s forwards;position: absolute;}

.BasicWebMenu.Menu2018 { 
    font-family: 'Rubik';font-weight:bold;
    font-size: 16px;
    color: #103362;
    background: White !important;
    z-index: 10;
}

.BasicWebMenu.Menu2018 .BasicWebMenuItem { padding: 6px!important;width: 250px;background: white;outline: 1px solid #eee;}

.BasicWebMenu.Menu2018 .login {
    padding-left: 32px !important;
    color: #C93042 !important;
    background: url(./image/inloggen.png) no-repeat;
    background-position: 8px center;
    background-size: 16px;
    background-origin: border-box;
    background-color: white;
    width: 224px;
}
.BasicWebMenu.Menu2018 .BasicWebMenuItem a { color: inherit;background: white;padding: 0;}
.BasicWebMenu.Menu2018 .TC2019 {
    color: #C93042 !important;
    background-position: 8px center;
    background-size: 16px;
    background-origin: border-box;
}

.BasicWebMenu.FooterMenu2018 { min-height: 2em;text-align: center;background-color: transparent;color: white;width: initial;max-width: initial;}
.BasicWebMenu.FooterMenu2018 .BasicWebMenuItem a { background: transparent;color: white;border-right: 1px solid white;margin-right: 2px;padding: 0px;}
.BasicWebMenu.FooterMenu2018 .BasicWebMenuItem.FooterLast a { border-right: 0px;}
.BasicWebMenu.FooterMenu2018 .BasicWebMenuItem a:hover { background: transparent !important;color: #C93042 !important;}

.BasicWebMenu.OverOnsMenu2018>div.BasicWebMenuItem>a { margin: 1vw;padding: 1vw;}

@keyframes slide { 
  100% { top: 59px;}
}

.dijitTreeExpando {
  display: none;
}

.dijitTreeNode .dijitTreeRow {
  background-color: white;
 border-bottom: 2px solid #E1E1F0;
}

.dijitTreeContent { 
  cursor: pointer;
 background-color: white;
}

.dijitTreeRowHover {
  background-image: none;
  background-color: white;
  color: #C93042;
}

/* HOME NIEUW ! */

.bg-grey { background-color: rgba(16, 51, 98, .05);}
.bg-darkgrey { background-color: rgba(16, 51, 98, .1);}
.bg-alert { background: #FFF1C6;}
.bg-alert .content { padding: 16px 0;}

.homepage { text-align: center;}
#logo { width: calc(100% - 100px);}
.mobile #logo { width: 170px;}
.homepage.logo { display: inline-block;}
.mobile .homepage.logo { display: inline;text-align: center;}
.homepage .content { margin: 0 auto;}
.homepage.unlockyourpotential-bg.lazy-bg-loaded { background: url(./image/Header-1280x320.webp);background-size: cover;background-repeat: no-repeat;min-height: 320px;}
.mobile .homepage.unlockyourpotential-bg { background-position: center;}
.unlock-tekst { width: 400px;margin: 0 auto;}
.mobile .unlock-tekst { width: 250px;}
.homepage .unlockyourpotential { text-align: center;padding: 2em 0;color: white;}
.homepage .unlockyourpotential b { font-family: rubik;font-size: 32px;}
.homepage .unlockyourpotential p { font-size: 16px;line-height: 24px;}
.covid-banner { text-align: center;font-size: 14px;line-height: 20px;}

.homepage .snel-naar3 { color: #103362;font-size: 1em;display: grid;grid-template-columns: 1fr 1fr 1fr;padding-bottom: 1em;grid-gap: 20px;}
.homepage .snel-naar2 { color: #103362;font-size: 1em;display: grid;grid-template-columns: 1fr 1fr;padding-bottom: 1em;grid-gap: 20px;width: 620px;margin: 0 auto;}
.homepage .snel-naar-blok, .homepage .buddy-blok, .homepage .leverancier-blok, .homepage .referentie-blok { background-color:white;border: 2px solid white;border-radius: 10px;color: #103362;margin: 0 0 1em;padding: 1em;box-shadow: 4px 8px 6px #eee;}

.mobile .homepage .snel-naar-blok a { display: grid;grid-template-columns: 1fr 8fr;}
.mobile .homepage .snel-naar3 { grid-template-columns: 1fr;}
.mobile .homepage .snel-naar2 { overflow-x: scroll;-webkit-overflow-scrolling: touch;width: unset;grid-template-columns: 1fr;}
.mobile .snel-naar3.portfolio, .mobile .snel-naar2.portfolio { grid-template-columns: 1fr 1fr;}

.homepage .title { padding: 0 0 1em 0;color: #103362;font-weight: bold;font-size: 1.5em;}

.homepage .usps { color: #103362;font-size: 1em;display: grid;grid-template-columns: 1fr 1fr;padding-bottom: 1em;}
.mobile .homepage .usps { grid-template-columns: 1fr ;}
.homepage .usp { color: #103362;margin: 0 1em 1em;padding: 1em;display: grid;grid-template-columns: 1fr 6fr;text-align: left;}
.homepage .usp img { margin: 0 6px 0 0;}
.homepage .usp>div { padding: 0 0 0 16px;margin-block: auto;}

.vragen { color: #103362;font-size: 1em;display: grid;grid-template-columns: 1fr 1fr;padding-top: 1em;padding-bottom: 1em;grid-gap: 24px;}
.mobile .vragen { grid-template-columns: 1fr;}

.homepage .footer { color: white;}
.homepage .footer.menu { font-size: .8em;}

.populair { text-align: center;font-size: 1.0em;color: #103362;}
.populair .titel { margin: 36px;}

.BasicWebView.vPopulair, .BasicWebView.vNieuws { grid-template-rows: unset;grid-template-columns: unset;}
.vPopulair .header, .vPopulair .filters, .vPopulair .filterSummary, .vNieuws .header, .vNieuws .filters, .vNieuws .filterSummary { display: none;}
.vPopulair .BasicWebViewTable { display: block;}
.mobile .vPopulair .BasicWebViewTable { overflow-x: scroll;-webkit-overflow-scrolling: touch;}
.vPopulair .BasicWebViewTable .BasicWebViewRows { display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;grid-column-gap: 20px;width: 960px;}
.mobile .vPopulair .BasicWebViewTable .BasicWebViewRows { padding: 0 10px;}
.vPopulair .BasicWebViewTable .BasicWebViewRow { display: block;}
.vPopulair .BasicWebViewCell {	display: block;padding: 2px 0;}
.filter td { padding: 0;}
.filter table { border-collapse: collapse;}

.search { float: right;display: flex;}
.search .BasicWebSearch { display: inline;vertical-align: top;}
.search input { height: 36px;margin: 0;}

.mobile .search .BasicWebSearch { display: none;}

.MobileSearch { text-align: center;margin-top: 10px;} 


.header-bg { color: white;background: url(./Image/Header-1280x320.webp);background-size: cover;background-repeat: no-repeat;}

.ta-button { font: 16px Rubik;font-weight: bold;display: inline-block;color: #103362;height: unset;padding: 8px 1em;min-width: 15em;border: 2px solid #103362;border-radius: 40px;text-align: center;margin-top: 1em;}
.ta-button.bg-yellow { background-color: #FFB200;box-shadow: 0 2px 0 0 #D19200;border: none;}
.ta-button.bg-yellow.inactive { color: grey;cursor: not-allowed;}
.ta-button.bg-blue { color: white;}
.ta-button.yellow { color: #FFB200;border: 2px solid #FFB200;}
.ta-button.bg-yellow.short { min-width: initial;float: right;}
a[href] .ta-button:after { content: " \279C";}
.pijltje:after { content: " \279C";}

.mobile .ta-button, .mobile .BasicWebForm button { display: block;margin-left: auto;margin-right: auto;width: min-content;}

button { font: 16px Rubik;font-weight: bold;display: inline-block;color: #103362;background-color: white;height: unset;padding: 8px 1em;min-width: 15em;border: 2px solid #103362;border-radius: 40px;text-align: center;margin-top: 1em;}
button:hover { color: #C93042;border-color: #C93042;}
button { background-color: #FFB200;box-shadow: 0 2px 0 0 #D19200;border: none;}
button.inactive { color: grey;cursor: not-allowed;}



/* BREADCRUMB */

.breadcrumbs { font-size: .9em;margin: 1em 0;color: white;}
.page-training .breadcrumbs, .page-trainingen .breadcrumbs, .page-examen .breadcrumbs, .page-examens .breadcrumbs, .page-aanmelden_training .breadcrumbs, .page-aanmelden_examen .breadcrumbs, .page-aanmelden_examen_lg .breadcrumbs, .page-aanmelden_elearning .breadcrumbs, .page-aanmelden_proefexamen .breadcrumbs { color: rgba(16, 51, 98, 0.4);}

.separator, .breadcrumb {
    display: inline-block;
}

/* PAGE */

.homepage-usp { 
   padding: 2vw;
   text-align: center;
   color: #12203D ;
   font-size: 1em;
}

.body-2column { display:grid;grid-template-columns:1fr 1fr;text-align: left;grid-gap: 12px;}
.mobile .body-2column { grid-template-columns:1fr;}
.body-2column>div { margin-block: auto;}
.mobile .bg-grey .body-2column > div:nth-child(2n+1) { order: 1;}

.mobile .buddy-tekst { text-align: center;}
.mobile .buddy-tekst img { margin-top: 30px;}

.centreer { text-align: center;}

.page-body {
   background-color: white;
   color: #103362;
   margin: 0 auto;
   max-width: 75%;
   min-width: 360px;
 }

.pagetitle {
   margin-top: 1.2vw;
   color: #DC911B;
}

.center {
   text-align: center;
}

.bg-black { background-color: black;color: white;}
.bg-blue { background-color: #103362;}
.bg-red {
   background-color: #C93042;
}

.bg-white {
   background-color: white;
}
.bg-white-left {
   background-color: white;
}
.bg-white-right {
   background-color: white;
}

@media (min-width: 540px) {
  .text {
     min-width: 300px;
  }
}
.image {
    margin: auto auto;
    text-align: center;
    min-width: 300px;
}
.image-left {
    margin: auto auto;
    text-align: left;
    min-width: 300px;
}
.image-right {
    margin: auto auto;
    text-align: right;
    min-width: 300px;
}

.bg-changecell .image-changecell {
     margin: auto auto;
     text-align: center;
     order: 0;
}
.bg-changecell .text-changecell {
     order: 1;
}

.bedankt-tekst {
    color: white;
    padding-left: 50vw;
    padding-right: 20vw;
}

.formulier {
   color: white;
   padding-left: 3vw;
}

.ta-button:hover {
    color: #C93042;
    border-color: #C93042;
}

.ta-button.inschrijvenM {
width: 10em;
}

robot {
 width: 100px;
}

.Field.Comment {
   color: #103362;
}

/* TRAINING*/

.training { display: grid;grid-template-columns: 620fr 300fr;grid-column-gap: 20px;}
.mobile .training { grid-template-columns: 1fr;}
.training .tekst {}
.training .tekst.vervolg { order: 3;}
.training .info { grid-row-end: span 2;}
.training .info img { width: 24px;}
.training .info .floater { position: sticky;top: 2em;box-shadow: 2px 2px 11px 0 rgba(16,51,98,.1);padding: 12px;background: white;border-radius: 4px;}
.mobile .training .info .floater { margin-top: 30px;}
#goedkoopste { background: rgba(204,226,255,0.4);text-align: center;padding: 12px;}
#goedkoopste .prijs { text-align: center;margin-right: 0;}
#ookvirtueel { margin-top: 12px;}

.training .partner img { width: 100%;}

.voordelen { display: grid;grid-template-columns: repeat(4, 1fr);height: 102px;}
.mobile .voordelen { grid-template-columns: repeat(2, 1fr);height: unset;font-size: 14px;grid-gap: 6px;margin-top: 10px;}
.voordeel { text-align: center;vertical-align: middle;font-weight: bold;}
.mobile .voordeel { padding: 20px;box-shadow: 2px 2px 8px 2px rgba(16,51,98,.2);}
.voordeel img { width: 48px;display: block;margin: 0 auto;}
.video { height: 348px;width: 620px;margin: 10px;max-width: calc(100vw - 36px);margin: 10px auto;}
.video-frame { width: 100%;height: 100%;border: 0;box-shadow: 2px 2px 9px 6px rgba(16,51,98,.2);}
.leervormen, .subsidies { display: grid;grid-template-columns: 1fr 1fr;grid-gap: 12px;}
.mobile .leervormen, .mobile .subsidies { display: block;}
.training-leervorm, .subsidie { height: 76px;border: 2px solid rgba(16, 51, 98, 0.1);border-radius: 10px;box-shadow: 2px 2px 11px 0px rgba(16,51,98,0.1);font-weight: bold;cursor: pointer;display: flex;align-items: center;}
.training-leervorm img, .subsidie img { width: 60px;padding: 10px;}
.mobile .training-leervorm { margin: 8px 0;}
.locatie, .periode { border: 2px solid rgba(16, 51, 98, 0.1);border-radius: 10px;margin: 4px;padding: 12px;box-shadow: 2px 2px 11px 0px rgba(16,51,98,0.1);cursor: pointer;display: inline-block;}
.locatie, .prijs {font-weight: bold;}
.prijs.van {text-decoration: 2px red line-through;opacity: .7;}
.subsidie.selected, .training-leervorm.selected, .locatie.selected, .periode.selected { border: 2px solid rgba(16, 51, 98, 0.3);background-color: rgba(0,109,255,0.2);}
.periodes { display: grid;grid-template-columns: 1fr;}
.periode { display: grid;grid-template-columns: 4fr 1fr;}
.mobile .periode { display: block;}
.periode img { width: 24px;}
.periode .field { }
.prijs { text-align: right;margin-right: 1em;}
.opmerking { display: inline-block;margin-right: 8px;}

.keuze-wrapper, .niet-ingepland>div { display: grid;grid-template-columns: 4fr 1fr;grid-gap: 6px;background-color: rgba(204,226,255,0.4);padding: 28px 12px;margin-top: 32px;text-align: center;}
.mobile .keuze-wrapper { display: block;}
.keuze h3 { margin-top: 0;}
.keuze>div { margin: 18px;}
.keuze.prijs { font-size: 24px;margin-top: .5em;}
.keuze1 img { width: 22px;}
.jouw-keuze { text-align: right;margin-top: .5em;}
.jouw-keuze .keuze.prijs { margin-top: 0;text-align: right;margin-right: 0;text-wrap: nowrap;}
.mobile .jouw-keuze, .mobile .jouw-keuze .keuze.prijs, .mobile .keuze.afdrukken { text-align: center;}
.mobile .keuze, .mobile .print-offerte { text-align: center;}
.mobile .keuze-selectie { font-size: 85% }
#startgarantie{ border-top: 1px solid rgba(16,51,98,0.2);margin-top: 12px;}
#startgarantie, #eerste { border-bottom: 1px solid rgba(16,51,98,0.2);padding: 12px 0px;}
#eerste { margin-bottom: 12px;}

#buttons h3 { margin-top: 1.5em;}
.secties { box-shadow: 0 4px 8px 0 rgba(0,0,0,0.1);border-radius: 10px;display: block;margin-top: 18px;}
.sectie { border: 1px solid rgba(16,51,98,.1);padding: 12px;position: relative;}
.BasicWebToggle { font: 24px Rubik;font-weight: bold;padding: 0 0 20px 30px;cursor: pointer;position: absolute;right: 14px;top: 14px;}
.sectie .open, .sectie.closed { cursor: pointer;}
.BasicWebToggle.open::before { content: "-";}
.BasicWebToggle.closed::before { content: "+";}

.bg-training {
    padding: 1vw 2vw;
    text-align: left;
    vertical-align: top;
    
}
.bg-training > div {
    padding: 1em;
    border-radius: 5px;
    margin-bottom: 10px;
}

.TrainingInfo .left {
    padding: 1em;
    vertical-align: top;
    width: 30%;
}
.TrainingInfo .right {
    padding: 1em 0 1em 1em;
    vertical-align: top;
    width: 70%;
}

.lesmethode {
   color:  #C93042;
   margin-top: 1em;
}

.KlapOpen {
   float: left;
  margin-left: -40px;
}

.ToggleDIV { margin-top: 12px;padding: 10px;border-radius: 5px;}
.moreless { overflow: hidden;position: relative;height: 0;padding-bottom: 80px;}
.moreless.more { height: 6em;}
.moreless.less { height: inherit;}
.moreless .switch { position: absolute;bottom: 36px;z-index: 3;cursor: pointer;left: 50%;transform: translate(-50%, 0);font-size: 14px;text-decoration: underline;}
.moreless .fader { position: absolute;top:0;left:0;width:100%;height:100%;z-index:2;background-image: linear-gradient(to top, #F2F4F7 5em, rgba(241, 244, 247, 0) 120px);}

/* FOOTER */

.mobile .referenties { display: grid;grid-template-columns: 1fr 1fr;}

#social-media-icon {
 width: 3em;
}
.mobile #social-media-icon {
 width: 20px;
}
.mobile a>img {
    min-width: 40px;
}

#social-media-icon-ref {
 width: 6em;
}
.mobile #social-media-icon-ref {
 width: 80%;
}

.mobile .footer-contact {
   padding: 2vw;
   color: white;
   font-size: 14px;
   margin: 0 auto;
   background-color: #103362;
   display: inline-block;
}

.footer-referenties {
   padding: 2vw;
   color: #12203D;
   text-align: center;
   background-color: #EDEDED;
   margin: auto auto;
}

.mobile .footer-referenties {
   padding: 2vw;
   color: #12203D;
   font-size: 16px;
   text-align: center;
   background-color: #EDEDED;
   margin: auto auto;
}

.footermenu {
  background-color: #12203D;
  padding: 1em;
}

.BasicWebMenu._Evaluaties { display: inline-block!important;}

/* MENU */

.InlineMenu {
   padding: 1em 0 0 0;
   text-align: left;
   margin: 0 auto;
  min-width: 360px;
}

.InlineMenu .BasicWebMenu {
   background-color: white;

width: inherit;max-width: inherit;
}

.InlineMenu .BasicWebMenuItem {
   margin-bottom: 1.5em;
}

.BasicWebMenu .BasicWebMenuItem a {
   background: #E1EAF0;
   color: #103362;
}
.InlineMenu .BasicWebMenuItem.selected a {
   background: #C93042 !important;
   color: white !important;
}

.BasicWebMenu .BasicWebMenuItem a:hover {
   background: #C93042 !important;
   color: white !important;
}

.InlineMenu .BasicWebMenu>div.BasicWebMenuItem>a {
   margin: 8px;
   padding: 16px;
}

/* Examen pages */

.Exa2008.BasicWebColumn._70 {
   margin: 1vw;
   padding: 1vw;
   background-color: #E1EAF0;
   color: #103362;
   font-size: 16px;
}
Exa2008.BasicWebColumn.Examencode0 {
   margin: 1vw;
   padding: 1vw;
   background-color: #E1EAF0;
   color: #103362;
   font-size: 16px;
   font-weight: bold;
}

/* AJAX */

.hourglass {
    position: fixed;
    top: 50%;
    left: 50%;
    margin:-55px 0 0 -55px;
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg);} }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg);} }
@keyframes spin { 100% { -webkit-transform: rotate(360deg);transform:rotate(360deg);} }


/* AANBOD */

.BasicWebView { display: grid;grid-template-columns: 290px auto;grid-template-rows: 21px minmax(63px, max-content) auto;}
.mobile .BasicWebView { grid-template-columns: 1fr;grid-template-rows: unset;}
.BasicWebView .BasicWebViewRows { display: block;}
.BasicWebView .BasicWebViewRow { display: block;}
.BasicWebView .BasicWebViewCell { display: block;}
.BasicWebView .filters { max-width: 280px;grid-row: span 3;}
.mobile .BasicWebView .filters { margin-bottom: 20px;max-width: 100%;}

.BasicWebView .summary {
    display: inline-block;
    padding: 6px;
    margin: 2px 4px;
    cursor: pointer;
    background: rgba(16,51,98,.2);
    border: inherit;
}
.BasicWebView .summary span::after { content: "\2A02";margin: 0 6px 0 18px;font-size: 1em;font-variant-position: super;font-weight: 900;}
.BasicWebView .filterSummary { margin: 1em 0;}
.BasicWebView .filter.open {
    cursor: pointer;
}
.BasicWebView .filter.closed fieldset * {
    display: none;
}
.BasicWebView.vWebsite .header {
   padding: 0em 0em 1em 0em;
}
.BasicWebView.vExamen .header {
   padding: 0em 0em 1em 0em;
}
.BasicWebView.vWebsite .BasicWebViewRow:hover {
   background-color: rgba(16, 51, 98, .05);
}  

/* Sjef */
.filters-header { font-size: 1.5em;display: inline-block;height: 2em;}
.mobile .BasicWebToggle { display: inline-block;float: right;}

.CurriculumWrapper {
  border: 1px solid white;
  border-radius: 5px;
  background: white;
  box-shadow: 0 2px 2px 0px grey;
  margin: 4px 0;
  padding: 15px;
 min-height: 95px;
  cursor: pointer;
}
.CurriculumWrapper:hover { box-shadow: 0 2px 2px 4px #444;}
.CurriculumWrapper .title { font-size: 1.3em;}
.CurriculumWrapper .info { display: inline-block;font-size: .9em;margin-right: 12px;}
.CurriculumWrapper .CurriculumCode {
  font-size: 1.2em;
  color: rgb(201,48,66);
  padding: 3px 20px;
}
.CurriculumWrapper .CursusWrapper {}
.CurriculumWrapper .Cursus {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 0.3fr 1fr;
  grid-gap: 12px
}
.CurriculumWrapper .tag { display: inline-block;background: #eee;margin: 2px;padding: 2px 4px;border: 2px solid #ddd;font-size: .8em;}
.tag.leverancier { background: #eef;border: 2px solid #ddf;}
.tag.niveau { background: #efe;border: 2px solid #dfd;}

.Workshop .CurriculumWrapper { background-color: #efe}
.Promo .CurriculumWrapper { background-color: #fbeea8}

.page-zoekresultatenpagina .vAanbod, .page-zoekresultatenpagina .vExamen, .page-zoekresultatenpagina .vWebsite { display: block;}


/* er kan nog meer curriculumwrapper weg */


/* IFRAME YOUTUBE */

.video-container {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.video-container::after {
    padding-top: 56.25%;
    display: block;
    content: '';
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 90%;
    height: 90%;
}

/* NIEUWS */

.vNieuws .BasicWebViewCell a {
    text-decoration: none !important;
}
.vNieuws .BasicWebViewRow {
    margin-top:3em;
}
.mobile .vNieuws .BasicWebViewRow { display: grid;grid-template-columns: 1fr;}
.vNieuws .BasicWebViewRow >div {
    vertical-align:top;
    padding-top:1.5em;
    padding-bottom:1.5em;
}
.vNieuws .title {
    font-size: 2em;
}
.vNieuws .author {
    color: gray;
    font-size: .8em;
}
.vNieuws .info {
    margin-left: 1em;
    margin-bottom: 1em;
}
.vNieuws .date {
    color: gray;
    font-size: .8em;
    margin-left: 1em;
}

/* POPUP */

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
  z-index: 1;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}
.popup {
  margin: 20vh auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
}

.popup h2 {
  margin-top: 0;
  color: #333;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}

/* SCHERM SPECIFIEK */

@media only screen and (max-width:1024px) {
   font[size^='1'] { font-size: 12px;}
   font[size^='2'] { font-size: 14px;}
   font[size^='3'] { font-size: 17px;}
   font[size^='4'] { font-size: 20px;}
   font[size^='5'] { font-size: 23px;}
   font[size^='6'] { font-size: 27px;}

   .bg_changecell {
        flex-wrap: wrap;
    } 
   .text-changecell {
        order: 0 !important;
    }
    .image-changecell {
        order: 1 !important;
   }
    .CurriculumWrapper .Cursus {
       grid-template-columns: 1fr 1fr;
       margin-top: 6px;
   }
   .page-body {
       max-width: 100%;
   }
}
@media only screen and (max-width:700px) {

.breadcrumbs {
    margin: 10px auto 0 0;
   max-width: 75%;
}
     .hamburger {
          left: 6px;
          top: 6px;
          width: 36px;
     }
   .pagebody {
       max-width: 100%;
    }
   .BasicWebView .filters {
      float: inherit;
   }
   .bg-training {
      padding: 0;
   }
   .KlapOpen {
       margin-left: -20px;
   }
}

/* N I E U W E   W E B S I T E   ! ! */

/* HomePage */

ul.bullet {
    text-align: center;
    list-style-position: inside;
}

.row { width: 100%;max-width: 1280px;margin: 0 auto;}
.content { width: 100%;max-width: 940px;margin: 0 auto;padding: 2em 0;}
.content.single { max-width: 620px;}
.mobile .content { margin: 0 10px;width: calc(100% - 20px);}
.mobile .content.full-width { margin: 0;width: 100%;}
.mobile .content.header { display: grid;grid-template-columns: 30px auto 30px;padding: 1em 0;}

/* Pager */

.BasicWebPager{ text-align: center;display: table;width: 100%;}

.PageGroup span { font-size: 0;}

.PageGroup span span, .PreviousPage, .NextPage {	
	display: inline-block;
	color: #103362;
	background: white;
	border: 1px solid white;
	border-radius: 100px;
	padding: 9px;
	margin: 6px;
	width: 20px;
         height: 20px;
	text-align: center;
         line-height: 20px;
         font-size: 16px;
}

.PreviousPage, .NextPage { border: 3px solid #103362;}

.PageGroup span span a, .PageGroup span span a:visited { color: #103362;}
.PageGroup span span:hover a { color: white;}

.PageGroup span span.CurrentPage, .PageGroup span span:hover { color: white;background-color: #103362;border: 1px solid #103362;}

.webtekst { display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;font-size: .9em;overflow: hidden;margin-top: 12px;}

.kobe { margin-bottom: 1.2em;}
.labe {}
.training .labe a { display: none;}

.kaart {
   height: 200px;
	border: 1px dotted #eee;
	border-radius: 10px;
	box-shadow: 4px 8px 6px #eee;
	text-align: left;
}

.kaart .afb {
	min-height: 151px;
	background-color: rgba(112, 133, 161,1);
   background-size: cover;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-family: Rubik;
    font-weight: bold;
	color: white;
	display: flex;
	padding: 0 5px 9px;
}

.kaart .afb span {
	align-self: flex-end;
}

.kaart .tekst { padding: 9px;line-height: 1.5em;font-size: 14px;display: none;}