/* Redesign November 2023 start */
/* TODO transition-behavior: allow-discrete; on items using display:none */
:root {
  --main_color: #ff6400;
  --dark_orange: #e85b00;
  --light_color: #ffffff;
  --darkblue: #001d49;
  --darkerblue: #05a0cf;
  --lightblue: #03b1e3;
  --light_gray: #f8f9fb;
  --dark_gray: #777777;
  --green: #8fb111;

  --offwhite: #f0f2f7;

  --body-fontsize: 14px;
  --button-shadow: 5px 5px 10px 0 rgba(207, 213, 232, 0.6);
  --box-shadow: 8px 8px 25px 0px rgb(182 175 175 / 45%);

  --desktop_vert_margin: 60px;
  --mobile_vert_margin: 24px;
}

* {
  font-family: "Open Sans", sans-serif;
}

body {
  background-color: #dce0eb;
}

body .row::before,
body .row::after {
  display: block;
}
body.detailPage.row::after,
body #visibleContent .row::after {
  display: inline-block;
}

div#visibleContent .row:last-child::after { display:block }

tabTitle,
tabEnd {
  display: none !important;
  background-color: red;
}

.pinky {
  background-color: pink !important;
}
.fold {
  background-color: #dce0eb !important;
  text-align: center;
  color: pink !important;
  line-height: 28px;
  height: 28px;
  font-weight: bold;
}

.desktop,
.mobile {
  display: none;
}

.accordeon__trigger,
.blockLinkCTA__title,
.sectionTitle__title {
  font-size: 18px;
  font-weight: 700;
}

.blockText__body ul li,
.blockContact__body ul li,
.text ul li,
.quote__body ul li,
.table ul li,
.accordeon__content ul li,
.blockAccreditation__list li {
  margin-bottom: 0px;
}

.card__text,
.blockText__body,
.blockContact__body,
.text,
.quote__body,
.table,
.accordeon__content,
.pageMenu__description,
.filter__collapseButton,
.filter__list,
.filter__listItem,
.mobileFilter__accordeonTrigger,
.mobileFilter__list,
.mobileFilter__listItem,
.pagination,
.contentFooter__body,
.blockCostCTA__description,
.blockCostCTA__extraInfo,
.blockFacts__list,
.blockAccreditation__list,
.blockTeachers__detailTeacherDescription,
.formSignUpSpecs__infoList,
.contactBanner__text,
.categorySummary__description,
.blockPartner__title,
.blockPerson__text,
.dateSwitch__button,
.card__eventListItem,
.introduction__body,
.imageBanner__caption,
.linkList__list,
.contentImage__caption,
.downloadsList__list,
.linksGallery__label,
.form__selectBoxLabel,
.form__fieldError,
.form__field,
.form__label,
.form__textAreaError,
.form__textArea,
.checkboxGroup__title,
.checkbox__label,
.radio__label,
.radioGroup__title   {
  font-size: 16px;
  line-height: 24px;
}

body main[role="main"] {
  box-sizing: border-box;
  max-width: 1480px;
  overflow-x: visible;
  background-color: #ffffff;
  margin-top: 0px;
}

body.detailPage main[role="main"]:has(.intro) {
  border-top: 64px solid #f0f2f7;
}

body .pageSubTitle__label { color:#001d49 }

body main[role="main"] > .intro {
  box-sizing: border-box;
  max-width: 1480px;
  padding-top: 0px;
  padding-left: 90px;
  background-color: #f0f2f7;
  padding-right: 90px;
  padding-bottom: 16px;
  color: #001d49;
  margin-bottom: 0px;
  width: 100%
}

body main[role="main"] > .vervolg {
  box-sizing: border-box;
  max-width: 1480px;
  padding-left: 90px;
  background-color: var(--light_color);
  padding-right: 480px;
  padding-top: 48px;
  padding-bottom: 48px;
}
.intro .introtekst .introText {
  padding-right: 340px;
  font-weight: 600;
  line-height: 24px;
}

/* gewone pagina's */
body:not(.detailPage) main[role="main"] {
  box-sizing: border-box;
  max-width: 1480px;
  padding-left: 90px;
  background-color: var(--light_gray);
  padding-right: 90px;
  padding-top: 48px;
  padding-bottom: 48px;
}

body.homepage main[role="main"] {
  padding: 0px;
}

body #page {
  margin-top: 70px;
}

body .sectionSubTitle__title {
  font-size: 16px;
  font-weight: 700;
}

body .blockAccreditation__listItem {
  border: 0px;
}
body .blockAccreditation__list li {
  padding-left: 0px;
  display: table-row;
}
body .blockAccreditation__list li .blockAccreditation__topic,
body .blockAccreditation__list li .blockAccreditation__status {
  display: table-cell;
  padding-bottom: 8px;
  padding-top: 8px;
  width: 50%;
}
body .blockAccreditation__list li:before {
  display: none;
}
body.articleDetail--interview .contentBlocks .col-lg-8,
body.articleDetail--podcast .contentBlocks .col-lg-8 {
  width: 90%;
}
body.articleDetail--interview .contentBlocks,
body.articleDetail--podcast .contentBlocks {
  width: 75%;
}

body.articleDetail--podcast .pageTitle {
  margin-bottom: 0px;
}

.blockLinkCTA {
  background-color: var(--light_color);
  border-radius: 6px;
  box-shadow: var(--box-shadow);
}

div.cb--blockLinkCTA a.blockLinkCTA__button {
  border-radius: 6px;
  font-size: 14px;
  white-space: nowrap;
  text-align: center;
  min-width: 220px;
  padding: 8px 8px;
}

body OPTION,
body .form__selectBox,
body .pagination {
  font-size: 16px;
}

body #page {
  margin-top: 115px;
}
.breadcrumbs_overlay,
.breadcrumbs {
  color: #ffffff;
  list-style: none;
  margin-top: 0;
  padding-left: 0px;
  height: 32px;
  background-color: #777777;
  background-size: cover;
  line-height: 32px;
  max-width: 1480px;
  margin: auto;
  padding-left: 22px;
  box-sizing: border-box;
  font-size: 14px;
}
.breadcrumbs_overlay {
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.25);
  margin-top: -32px;
}
ul.breadcrumbs li a {
  color: var(--light_color);
  font-size: 14px;
}
ul.breadcrumbs li.breadcrumbs__item.last {
  float: right;
  margin-right: 20px;
}
body .breadcrumbs__link:before {
  font-size: 12px;
}
.no-touch .breadcrumbs .breadcrumbs__link:hover,
.breadcrumbs a:hover {
  color: var(--light_color);
}


.teacherRow {
  display: grid;
  grid-template-columns: 180px auto;
  text-decoration: none;
  color: var(--darkblue);
  margin-bottom: 48px;
}
.teacherRow:last-child {
  margin-bottom: 0px;
}
.teacherRow .blockTeachers__teacherName {
  margin-top: 0px;
  padding-top: 0px;
  line-height: 24px;
  margin-bottom: 0px;
  color: var(--lightblue);
  text-decoration: none;
  min-height: 32px;
  font-weight: 700;
}
.teacherRow .blockTeachers__teacherFigure .blockTeachers__teacherImage,
.teacherRow .blockTeachers__teacherFigure {
  width: 125px;
  height: 125px;
  border: 0px;
  border-radius: 6px;
}

a.teacherRow:hover .teacherText div,
a.teacherRow .teacherText div {
  color: var(--darkblue);
  text-decoration: none;
}

.teacherText div a.plaintextButton {
  text-align: left;
  margin-top: 8px;
}

/* startdatum in lijstweergave */
body .card__statusCol {
  font-size: 16px;
}

/* bullets */
.blockText__body ul li:before,
.blockContact__body ul li:before,
.text ul li:before,
.quote__body ul li:before,
.table ul li:before,
.accordeon__content ul li:before,
.blockAccreditation__list li:before {
  background-color: var(--darkblue);
  height: 6px;
  width: 6px;
  top: 10px;
}

#permission {
  top: auto;
  bottom: 0px;
}

#permission div.ckLogo a #permission__logo {
  display: none;
}
#permission h3,
#permission p.ckText {
  margin-left: 30px;
  color: var(--darkblue);
}

#permission h3 {
  margin-bottom: 4px;
}
#permission p.ckText {
  margin-top: 4px;
}
#permission .genericButton {
  padding-left: 32px;
  padding-right: 32px;
}
#permission .genericButton::after {
  display: none;
}
/*
    Uitvoeringen
*/
body.detailPage .selecteer_uitvoering {
    font-size: 16px;
    font-weight: 700;
    color: var(--darkblue);
    margin-bottom: 23px;
    display: block;
}

.dateSwitch__container,
.uitvoeringen {
  width: 100%;
  display: block;
}
.dateSwitch__listItem {
  width: 100%;
  border-radius: 6px;
  background-color: #ffffff;
  box-shadow: var(--button-shadow);
}

.dateSwitch__listItem--active span {
  color: var(--lightblue);
}

.dateSwitch__listItem .datum {
  font-weight: 700;
  display: block;
}

.dateSwitch__listItem .dateSwitch__button {
  padding: 10px 4px;
}

.dateSwitch__listItem .dateSwitch__button:hover {
  background-color: #ffffff;
  color: var(--lightblue);
}

.dateSwitch__listItem .status {
  font-weight: 400;
  font-style: italic;
  display: block;
}

.dateSwitch__listItem:before {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: var(--darkblue);
  padding-right: 12px;
  padding-left: 12px;
  font-size: 22px;
  line-height: 50px;
  top: -6px;
  position: relative;
}

a:hover li.dateSwitch__listItem:before {
  color: var(--lightblue);
}
.dateSwitch__listItem span {
  background-color: #ffffff;
  font-size: 14px;
}

.blockCostCTA .USP {
  margin-top: 32px;
  margin-bottom: 32px;
}

.blockCostCTA #wishlist,
.blockCostCTA #belangstelling,
.blockCostCTA .USP .item {
  padding-left: 20px;
  padding-right: 20px;
  display: block;
  text-decoration:none;
  padding-bottom: 6px;
  padding-top: 6px;
  color: var(--darkblue);
  font-size: 14px;
  background-image: url("/assets/images/check-mark-icon groen.svg");
  background-position: 2px 9px;;
  background-repeat: no-repeat;
  background-size: 17px;
  padding-left: 30px;
}
.blockCostCTA #wishlist,
.blockCostCTA #belangstelling {
  background-size: 17px;
}
.blockCostCTA #belangstelling,
.blockCostCTA #wishlist {
  background-image: url(/assets/images/heart-blue_line.svg);
  font-weight: 700;
  cursor: pointer;
}
.blockCostCTA #belangstelling:hover,
.blockCostCTA #wishlist:hover {
  color: var(--lightblue);
}

.blockCostCTA #belangstelling {
  background-image: url(/assets/images/mail.svg);
}
.blockCostCTA #belangstelling:hover {
  background-image: url("/assets/images/mail hover.svg");
}
.blockCostCTA #wishlist:hover {
  background-image: url("/assets/images/heart-lightblue_line.svg");
}

.blockCostCTA .USP item:before {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: var(--green);
  padding-right: 12px;
  padding-left: 12px;
  font-size: 22px;
  line-height: 50px;
}

.blockCostCTA {
  background: linear-gradient(180deg, rgba(220, 224, 233, 1) 0%, rgba(240, 242, 247, 1) 100%);
}

.blockCostCTA p {
  color: var(--darkblue);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.blockCostCTA p a {
  color: var(--lightblue);
}
.blockCostCTA.opleidingen {
  width: 500px !important;
}

.blockCostCTA .genericButton {
  width: 100%;
  padding: 14px;
  font-size: 18px;
  background-color: var(--lightblue);
}

.blockCostCTA .genericButton:hover {
  background-color: var(--darkerblue);
}

.blockCostCTA__description,
.blockCostCTA__extraInfo {
  margin-top: 5px;
  font-style: normal;
  color: var(--darkblue) !important;
  display: block;
  font-size: 14px;
}
.blockCostCTA p.blockCostCTA__extraInfo,
.blockCostCTA p.blockCostCTA__description {
  font-size: 14px;
  text-align: center;
}

.blockCostCTA p.blockCostCTA__description {
  font-weight: 700;
}

/*
  Contentblocks issues
*/
div.text:has(> div div.text) {
  margin-bottom: 0px;
  padding-bottom: 0px;
}

.contentImage {
  margin-bottom: 20px;
}

body .row div.blockLinkCTA__button:before,
body .row div.blockLinkCTA__button:after {
  height: auto !important;
}

.sectionSubTitle__title {
  margin-top: 24px;
}

@media (max-width: 1024px) {
  .hero.mobile {
    display: block;
  }
}
@media (min-width: 1025px) {
  .hero.desktop {
    display: block;
  }
}

@media (max-width: 1240px) {
  .mobile {
    display: inherit;
  }
}

@media (min-width: 1241px) {
  .desktop {
    display: inherit;
  }

  hero.desktop {
    display: block;
  }

  body footer.pageFooter .criteria.mobile {
    display: none !important;
  }
}

body.homepage .card__statusCol {
  display: none;
}

body.homepage main#content a {
  text-decoration: none;
}
body.homepage main[role="main"] {
  margin-top: 116px;
}

body.homepage .payoff {
  position: absolute;
  top: 431px;
  color: #ffffff;
  text-decoration: none;
  font-size: 24px;
  z-index: 1;
  font-weight: 600;
  left: 9%;
}

body .pageTitle__label {
  font-weight: 700 !important;
}

body .categorySummary__description,
body .introduction__body,
body .cb--body,
body div.text,
body .card__body {
  line-height: 24px;
  font-size: 16px;
}

body .introduction__body {
  margin-bottom: 0px;
}

body .card__title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  transition: color 300ms;
}

body .card--calendar .card__title {
  font-size: 20px;
  font-weight: 700;
}

body .card__body {
  font-size: 16px;
}

.pageTitle__title h1.pageTitle__label {
  font-size: 24px;
  font-weight: 700;
  color: var(--darkblue);
  margin-bottom: 0px;
  padding-right: 280px;
  line-height: 32px;
  padding-bottom: 4px;
}

.pageTitle__subtitle h2.pageTitle__label {
  font-size: 20px !important;
  font-weight: normal !important;
  color: var(--darkblue);
  padding-right: 280px;
  line-height: 28px;
}

a.resetButton,
a.contentFooter__btn--CTA,
.buttonsShare .contentFooter__btn--CTA body button {
  border-radius: 6px;
}

.form__searchBoxSubmit {
  border-radius: 0 6px 6px 0;
  padding: 9px 0px;
}

.form__searchBoxField {
  border-radius: 6px 0 0 6px;
}

header nav.bottommenu .icon--search:before {
  position: relative;
}

.plaintextButton:hover {
  color: var(--darkerblue);
}

#visibleContent a:hover {
  color: var(--darkerblue);
}

.plaintextButton {
  font-weight: 700;
  text-align: center;
  display: inline-block;
  font-size: 14px;
  transition: color 300ms;
  text-decoration: none;
  color: var(--lightblue);
  width: 100%;
  margin-top: 24px;
}

.plaintextButton:hover {
  color: var(--darkerblue);
}

.plaintextButton::after {
  display: inline-block;
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  font-size: 10px;
  position: relative;
  width: 16px;
  color: inherit;
  top: 0px;
  text-align: center;
  line-height: 100%;
}

.plaintextButton.prevBtn::after { display:none }
.plaintextButton.prevBtn::before {
  display: inline-block;
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  font-size: 10px;
  position: relative;
  width: 16px;
  color: inherit;
  top: -2px;
  text-align: center;
  line-height: 100%;
  transform: rotate(180deg);
}

/*
    Blocks
*/

.card__label {
  background-color: var(--green);
}
.no-touch .card__label:hover { color: var(--lightblue) !important; }
.card--article .card__title,
blockquote.card__quote {
  font-size: 18px;
  font-weight: 700;
  color: var(--green);
  margin-top: 0px;
  position: relative;
  padding-top: 30px;
  margin-bottom: 8px;
  font-style: normal;
  text-align: left;
}

.card--article:hover h2.card__title,
.card:hover blockquote.card__quote {
  color: var(--lightblue);
}
.card__label:after {
  background-color: var(--green);
  transform: none;
}
.card__date {
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
}
.card__author {
  font-weight: 700;
  font-size: 16px;
  min-height: 40px;
  height: auto;
}
.card__quote::before {
  display: none;
}

#visibleContent a {
  color: var(--lightblue);
  text-decoration: none;
}
#visibleContent .card__title {
  color: var(--darkblue);
}

.formSignUpSpecs {
  background-color: transparent;
  margin-bottom: 24px;
}
.formSignUpSpecs__infoListItem {
  margin-bottom: 12px;
}
.kortingsinput {
  margin-bottom: 8px;
}
.blockXtraAttentie {
  border: 1px solid var(--darkerblue);
  padding: 6px;
  width: calc(100% - 18px);
  margin-bottom: 32px;
  padding-left: 64px;
  font-size: 16px;
  color:var(--darkblue);
  border-radius: 8px;
  background-color: #F0FBFF; line-height: 23px;
}
.blockXtraAttentie::before{
  position: absolute;
  display: inline-block;
  font-size: 21px;
  color: var(--darkerblue);
  content: "\f129";
  font-family: "FontAwesome";
  margin-left: -45px;
  margin-top: 11px;
  border-radius: 50%;
  border: 3px solid var(--darkerblue);
  height: 24px;
  width: 24px;
  text-align: center;
  line-height: 26px;
  font-weight: 100;
}
/*
    Header and menu
*/
header.pageHeader {
  display: grid;
  height: 115px;
  grid-template-columns: 228px auto;
  width: 100%;
  box-shadow: 0px 19px 34px -26px rgba(0, 0, 0, 0.8);
}

body nav.pageMenu {
  background-color: transparent;
  padding-left: 0px;
  padding-right: 0px;
}

header nav.topmenu {
  display: grid;
  height: 57px;
  overflow: hidden;
  width: 100%;
  background-color: var(--main_color) !important;
  color: #ffffff;
  grid-template-columns: auto 280px;
}

header nav.topmenu {
  display: grid;
  justify-items: center;
  align-items: center;
}

header nav.topmenu a {
  font-size: 14px;
  color: #ffffff;
  display: grid;
  text-align: center;
  text-decoration: none;
}

header nav.topmenu a.pageMenu__listItemLink__active {
  font-weight: 700;
}

.pageMenu__subTitle {
  width: 100%;
  display: block;
}

.pageMenu__spacer {
  height: 21px;
  width: 100%;
  display: block;
}

header nav .pageMenu__listItem {
  width: 100%;
  height: 100%;
}

header nav.bottommenu a.pageMenu__listItemLink__active.pageMenu__listItemLink {
  color: var(--lightblue);
  font-weight: 400;
}

/* ignore li-active state */
header nav.bottommenu .pageMenu__listItem--active .pageMenu__listItemLink {
  color: var(--darkblue);
  font-weight: 400;
}

header nav.topmenu a.pageMenu__listItemLink__active.pageMenu__listItemLink {
  color: var(--light_color);
  font-weight: 700;
}

header nav .pageMenu__listItem--active .pageMenu__listItemLink:before {
  display: none;
}

.no-touch header nav.topmenu .pageMenu__listItemLink:hover,
.no-touch header nav.topmenu .pageMenu__listItemLink:focus,
header nav.topmenu a:hover {
  font-weight: inherit;
  color: var(--darkblue);
}

header nav.bottommenu a.withsub::after {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1.3em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: inherit;
  width: 24px;
  font-size: 14px;
  text-align: center;
  transform: rotate(90deg);
  display: inline-block;
  box-sizing: border-box;
  position: relative;
}

header nav.bottommenu a.withsub:hover {
  margin-top: -5px;
}
header nav.bottommenu .pageMenu__listItem:hover .pageMenu__listItemLink.withsub:hover::after {
  transform: rotate(270deg);
  padding-top: 3px;
}

header nav.topmenu a.extern {
  display: flex;
  margin-left: 26px;
  padding-right: 0px;
}

header nav.topmenu a.extern::after {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: inherit;
  text-align: center;
  margin-top: 1px;
  width: 24px;
}

header nav.topmenu a#wensenlijst {
  content: " ";
  width: 32px;
  background-image: url(/assets/images/heart-white_line.svg);
  background-size: 35% 35%;
  background-position: center center;
  background-repeat: no-repeat;
  display: inline-block;
  cursor: pointer;
  height: 100%;
  line-height: 28px;
  display: grid;
}

header nav.topmenu a#wensenlijst:hover {
  background-image: url(/assets/images/heart-blue_line.svg);
}

header nav.topmenu .left {
  width: 966px;
}

header nav.bottommenu {
  display: grid;
  height: 58px;
  overflow: hidden;
  width: 100%;
  color: var(--main_color);
  background-color: #ffffff;
  grid-template-columns: auto 280px;
}

header nav.bottommenu a {
  color: var(--darkblue);
  font-size: 16px;
}

body nav.bottommenu:hover {
  background-color: #ffffff !important;
}

header nav.bottommenu a:hover {
  color: var(--lightblue) !important;
}

header nav.bottommenu .form__searchBoxField {
  font-size: var(--body-fontsize);
  color: var(--lightblue);
}

body div.optionDivSelected { color: var(--lightblue);}

header nav.bottommenu .form__searchBoxField::placeholder {
  font-style: italic;
  font-size: var(--body-fontsize);
}

header div.pageHeader_logo {
  display: grid;
  width: 228px;
  float: left;
}

header .pageMenu__list {
  height: 100%;
  display: grid;
  align-items: center;
}

header nav.topmenu .left.pageMenu__list {
  display: grid;
  grid-template-columns: 310px auto auto auto auto auto auto;
}

header nav.topmenu .right.pageMenu__list {
  display: grid;
  grid-template-columns: auto auto;
}

header nav.topmenu .right a {
  min-width: 80px;
}

header nav.bottommenu div.left .pageMenu__list {
  display: grid;
  grid-template-columns: 92px auto auto auto auto;
}

header nav .right .pageMenu__list {
  display: grid;
}

header nav .pageMenu__list::before,
header nav .pageMenu__list::after {
  display: none;
}

header nav.bottommenu .searchBox {
  display: grid;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 1px;
}

header nav.bottommenu .searchBox form {
  margin: 0px;
}

header nav.bottommenu .searchBox input {
  border: 1px solid var(--darkblue);
  border-right: 0px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  padding: 0px;
  padding-left: 4px;
  width: calc(100% - 26px);
  height: 26px;
}

header nav.bottommenu .searchBox .pageHeader__searchBoxTrigger {
  margin: 0px;
  height: 26px;
  width: 26px;
  line-height: 26px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

header nav.bottommenu .pageMenu__listItem .pageMenu__subNav {
  display: none;
}

header div.sep,
header div.left,
header div.right {
  display: grid;
}

header .sep {
  height: 22px;
  width: 2px;
  border-left: 2px solid #ffffff;
  position: absolute;
  left: 1200px;
  top: 18px;
}

header nav.bottommenu .sep {
  border-left: 2px solid var(--darkblue);
  top: 75px;
}

.menuActive .floaty {
  z-index: -1;
}

/*
    Submenu's
*/

header nav.bottommenu .pageMenu__listItem:hover .pageMenu__subNav {
  display: block;
  position: absolute;
  background-color: var(--darkblue);
  width: 1240px;
  margin-left: 120px;
  top: 115px;
  left: 0px;
  padding: 32px;
  min-height: 435px;
  height: auto;
  transition: all 300ms;
}

header nav.bottommenu .pageMenu__listItem .pageMenu__subNav a {
  color: #ffffff;
  font-weight: 100;
}
header nav.bottommenu .pageMenu__subNavGroup .pageMenu__description {
  font-size: 16px;
  font-weight: 100;
}
header nav.bottommenu .pageMenu__subNavGroup .pageMenu__description a {
  color: var(--lightblue);
}

header nav.bottommenu .pageMenu__subNavGroup > a.pageMenu__subLink,
header nav.bottommenu .pageMenu__subNavGroup > .pageMenu__subLink {
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--light_color);
}

.pageMenu__subLink::after {
  display: none;
}

.pageMenu__listItem {
  float: none;
  display: grid;
  justify-items: center;
  margin: 0px !important;
  align-items: center;
}

.pageMenu__subList + .pageMenu__subLink {
  margin-top: 45px;
}

.pageMenu__bannerGroup .banner {
  height: 300px;
}

.pageMenu__bannerGroup .pageMenu__description {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  height: 128px;
}

.pageMenu__bannerGroup .banner .pageMenu__ctaLink {
  margin-top: -60px;
}

.pageMenu__subListItem a::before {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  position: relative;
  font-size: 12px;
  width: 32px;
  height: 20px;
  margin-right: 10px;
}

.pageMenu__ctaLink {
  border-radius: 6px;
  color: var(--light_color);
  background-color: var(--main_color);
}

.pageMenu__ctaLink:before {
  background-color: var(--main_color);
}

.pageMenu__description {
  color: var(--light_color);
}

body .pageMenu nav.pageMenu__subNav > div {
  border: 0px;
}

/*
    Mobile menu
*/

.mobileMenu.isOpen {
  top: 150px;
}

/*
    Homepage stuff
*/

.card--calendar .card__inner {
  height: 100%;
}
.card--calendar .card__eventList {
  margin-bottom: 12px;
  height: calc(100% - 130px);
}

.card--calendar .card__eventListItem {
  margin-bottom: 0px;
}

.card--calendar .card__eventListItem .card__event {
  display: grid;
  width: 100%;
  height: 100%;
  align-items: center;
  align-content: center;
  padding-top: 12px;
  padding-bottom: 12px;
  grid-template-columns: 62px calc(100% - 62px);
}

.card--calendar .card__eventListItem .card__event .card__eventDate,
.card--calendar .card__eventListItem .card__event .card__eventDescription {
  display: grid;
  align-items: center;
  align-content: center;
  margin: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}
body.homepage .card__eventMonth {
  bottom: 4px;
}

body .pageFooter__listItem {
  margin-bottom: 0px;
  padding-bottom: 0px;
  line-height: 36px;
}

.modal {
  z-index: 999999 !important;
}

#modal-inschr .modal__contentWrapper,
#modal_inschr2 .modal__contentWrapper {
  top: 50px !important;
  margin: auto !important;
  left: auto !important;
  position: relative !important;
}

#modal-inschr p,
#modal-inschr h2,
#modal_inschr2 p,
#modal_inschr2 h2 {
  text-align: left;
  margin-left: 10px;
}

@media only screen and (max-width: 768px) {
  #modal-inschr div.buttonbar,
  #modal_inschr2 div.buttonbar {
    margin-bottom: 12px;
  }

  #modal-inschr div.buttonbar button,
  #modal-inschr a.blockCostCTA__cta,
  #modal_inschr2 div.buttonbar button,
  #modal_inschr2 a.blockCostCTA__cta {
    float: none !important;
    width: 95% !important;
    display: block !important;
  }

  #modal-inschr p,
  #modal-inschr h2,
  #modal_inschr2 p,
  #modal_inschr2 h2 {
    color: #001d49 !important;
  }
}

body.detailPage .blockCostCTA {
  padding: 20px;
  background-color: var(--darkblue);
  border-radius: 16px;
  color: white;
  margin-bottom: 30px;
  float: right;
  width: 263px;
  margin-left: 20px;
}

body.detailPage .blockCostCTA__title {
  color: var(--lightblue);
  font-size: 32px;
  text-align: center;
  padding-top: 36px;
  padding-bottom: 40px;
  font-weight: normal;
}

/*
    Tab row

*/
ul#tabrow {
  list-style: none;
  padding: 0px;
  border-bottom: 1.5px solid #dce0eb;
  width: 100%;

}

#tabrow li.tab,
#tabrow li.tab > a {
  display: inline-block;
}

#tabrow li.tab:has(div.tabContent:empty) {
  display: none;
}

#tabrow li.tab > a {
  line-height: 24px;
  padding-left: 28px;
  padding-right: 28px;
  padding-top: 0px;
  padding-bottom: 3px;
  cursor: pointer;
}

#tabrow li.tab div.tabContent {
  display: none;
}

#tabrow li.tab {
  border-bottom: 3px solid transparent;
}

#tabrow li.active {
  border-bottom: 3px solid var(--lightblue);
  transition: all 500ms;
  font-size: 16px;

  color: var(--darkblue);
}
#tabrow li > a {
  font-weight: 700;
}
#tabrow li > a:hover {
  color: var(--lightblue);
}
#tabrow li.active > a {
  color: var(--lightblue);
  transition: all 500ms;
  font-size: 16px;
}
/*
@media (max-width: 1260px) {
 Faking combobox for tabs
  #tabrow {
    background-color: #ffffff;
  }

  #tabrow li.tab {
    display: none;
  }

  #tabrow li.tab.active {
    display: block;
    border-bottom: 0px;
  }

  #tabrow li.tab a,
  #tabrow li.tab.active a {
    color: var(--darkblue);
    font-weight: 400;
    padding: 12px 20px 12px 20px;
    min-width: 100px;
  }

  #tabrow li.tab a:hover,
  #tabrow li.tab.active a:hover {
    color: var(--lightblue);
  }

  #tabrow li.tab.active:after {
    display: block;
    font-family: "icomoon" !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "";
    font-size: 12px;
    position: relative;
    right: 6px;
    width: 40px;
    color: var(--lightblue);
    float: right;
    top: 2px;
    line-height: inherit;
    box-sizing: inherit;
    text-align: right;
    transform: rotate(90deg);
  }
  #tabrow.clicked {
    position: absolute;
    z-index: 99998;
    box-shadow: var(--button-shadow);
  }
  #tabrow.clicked li.tab {
    position: relative;
    display: block;
  }

  #tabrow.clicked li.tab.active:after {
    color: #ffffff;
  }
   compensate for absolute positioning
  .intro:has(ul#tabrow.clicked) {
    padding-bottom: 97px;
  }
}
*/
#tabrow li.tab a .accordeon__triggerIconWrapper {
  display: none;
}
@media (max-width: 1260px) {
  #visibleContent {
    display: none !important;
  }
  #tabrow {  display: inline-block;}
  #tabrow li.tab {
    width: 100%;
    background-color: #ffffff;
    border-top: 1px solid #eff2f4;
    border-left: 1px solid #eff2f4;
    border-bottom: 0px;
    margin-bottom: 12px;
    height: 41px;
  }
  #tabrow li.tab > a {
    background-color: #ffffff;
    border-top: 1px solid #eff2f4;
    border-left: 1px solid #eff2f4;
    width: 100%;
    min-height: 40px;
    text-align: left;
    box-sizing: border-box;
    position: relative;
    color: #001d49;
    border: 0;
    padding: 10px 50px 10px 16px;
    overflow: hidden;
  }
  #tabrow li.tab a .accordeon__triggerIconWrapper {
    display: block;
  }

  #tabrow li.tab.active {
    height: auto;
  }
  #tabrow li.tab div.tabContent {
    display: none;
    transition: all 200ms ease-in-out;
  }
  #tabrow li.tab.active div.tabContent {
    display: block;
    padding: 16px;
  }
  #tabrow li.tab.active a .accordeon__triggerIconWrapper:before {
    display: none;
  }
}


/*
    Mobile menu on/off
*/

/* desktop */
@media (min-width: 1240px) {


  .introductionHeader__content {
    padding-top: 40px !important;
  }

  .pageMenu.topmenu,
  .pageMenu.bottommenu {
    display: block;
  }

  .mobileMenu.isOpen,
  .mobileMenu {
    display: none;
  }

  nav.menus nav.topmenu,
  nav.menus nav.bottommenu {
    display: grid;
  }
}

@media (max-width: 1024px) {
  body.detailPage .blockCostCTA {
    display: block;
    float: none;
    width: 100%;
    background-color: rgba(220, 224, 233, 1) !important;
    background: none;
    margin-bottom: 32px;
    margin-left: 0px;
    box-sizing: border-box;
  }
}

/* mobile */
@media (max-width: 1240px) {
  .pageMenu.topmenu,
  .pageMenu.bottommenu {
    display: none;
  }

   body.detailpage .breadcrumbs {
    display: block !important;
    width: 100%;
    margin-top: -22px;
  }
  .breadcrumbs_overlay, .breadcrumbs,
  body .breadcrumbs li.breadcrumbs__item { display:none }
  body.detailPage ul.breadcrumbs li.last { display:inline }
  body.detailPage .breadcrumbs, body.detailPage .breadcrumbs_overlay { display:block }

  body main[role="main"] {
    margin-top: 0px;
    padding: 0px;
  }
  body.detailPage main[role="main"]:has(.intro) {
    border-top: 0px;  margin-top: 0px;
  }

  header div.pageHeader_logo,
  header div.pageHeader_logo img {
    height: 80px;
  }

  .mobileMenu {
    display: none;
  }

  .mobileMenu.isOpen {
    display: block;
    background-color: var(--darkblue);
  }

  .mobileMenu .mobileMenu__link {
    color: var(--light_color);
  }

  .mobileMenu__listItem {
    color: #ffffff;
  }

  .mobileMenu .mobileMenu__link:hover,
  .mobileMenu li.mobileMenu__listItem:hover {
    color: var(--main_color);
  }

  .mobileMenu .mobileMenu__link,
  .mobileMenu a.mobileMenu__listItem {
    color: inherit;
    font-size: 20px;
    line-height: 28px;
  }

  .mobileMenu li.mobileMenu__listItem:after {
    display: block;
    font-family: "icomoon" !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "";
    font-size: 14px;
    position: relative;
    right: 3px;
    top: -24px;
    z-index: 999998;
    color: inherit;
    float: right;
  }

  .mobileMenu .mobileMenu__link:after {
    display: none;
  }

  header.pageHeader {
    height: 80px;
    background-color: var(--main_color);
  }

  .pageHeader__navToggle {
    line-height: 80px;
    height: 80px;
    color: var(--light_color);
    right: 15px;
    position: relative;
    float: right;
    display: block;
  }

  .pageHeader__navToggleIcon {
    border-radius: 8px;
    height: 40px;
    width: 40px;
    margin-top: 20px;
    background-color: transparent;
  }

  body.menuOpen .pageHeader__navToggleHamburger:before {
    transform: rotateZ(45deg) scaleX(0.45) translate(8px, 6px);
    -webkit-transform: rotateZ(45deg) scaleX(0.75) translate(8px, 6px);
  }

  body.menuOpen .pageHeader__navToggleHamburger:after {
    transform: rotateZ(-45deg) scaleX(0.45) translate(5px, -4px);
    -webkit-transform: rotateZ(-45deg) scaleX(0.75) translate(5px, -4px);
  }

  .pageHeader__navToggleOpenTxt,
  .pageHeader__navToggleClosedTxt {
    font-size: 20px;
  }

  button.mobileMenu__link.mobileMenu__main {
    width: 100%;
  }
  /* > weghalen bij submenu's */
  .mobileMenu li.mobileMenu__listItem--hasChildren:after {
    display: none;
  }
  /* weghalen bij submenu's */
  .mobileMenu li.mobileMenu__listItem--hasChildren > button:after,
  button.mobileMenu__link.mobileMenu__main:after {
    display: block;
    font-family: "icomoon" !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    right: -30px;
    z-index: 999998;
    color: inherit;
    float: right;
    content: "+";
    font-size: 24px;
    top: 2px;
    font-weight: 800;
  }

  .mobileMenu li.mobileMenu__listItem--hasChildren.isOpen button:after,
  li.mobileMenu__listItem--hasChildren.isOpen > button.mobileMenu__link.mobileMenu__main:after {
    content: "\2212";
  }

  .mobileMenu li.mobileMenu__listItem--hasChildren:not(.isOpen) button:after {
    content: "+" !important;
  }

  .mobileMenu__list {
    min-height: 0px !important;
  }

  .mobileMenu__link.mobileMenu__main {
    font-weight: 600;
    letter-spacing: 0.5px;
    color: inherit;
  }

  .mobileMenu__link {
    font-weight: 200;
  }

  .mobileMenu__list.isOpen {
    padding-top: 0px;
  }

  .mobileSearch {
    padding: 15px;
    display: block;
    z-index: 9998;
  }

  body.filterActive .mobileSearch {
    z-index: -1;
  }

  .mobileSearch__field {
    border: 1px solid var(--darkblue);
    border-right: 0px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
  }

  .mobileSearch__submit {
    background-color: var(--darkblue);
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }

  .mobileSearch__submit .icon--search:before {
    color: var(--light_color);
  }

  nav.menus nav.topmenu,
  nav.menus nav.topmenu {
    display: none;
  }

  .mobileMenu__listItem--goBack {
    display: none;
  }

  ul.mobileMenu__list,
  ul.mobileMenu__listItem {
    display: none;
  }

  ul.mobileMenu__list[data-depth="0"],
  ul.mobileMenu__list.isOpen,
  ul.mobileMenu__listItem.isOpen,
  nav.mobileMenu ul.mobileMenu__list[data-depth="0"] > .mobileMenu__listItem {
    display: block !important;
  }

  .mobileMenu .mobileMenu__listItem .mobileMenu__list .mobileMenu__list {
    width: calc(100% + 28px);
  }

  .mobileMenu .mobileMenu__listItem .mobileMenu__list .mobileMenu__link {
    width: calc(100% + 14px);
  }

  .mobileSearch {
    top: 80px;
    position: relative;
  }

  .mobileMenu__spacer {
    height: 32px;
  }

  .mobileMenu__link--goBack:before {
    top: 13px;
  }

  body #page {
    margin-top: 70px;
  }

  body.detailPage #page {
    margin-top:80px
  }

  body div.hero {
    width: 100%;
    margin-top: -36px;
  }

  body:not(.detailPage):not(.homepage)  main[role="main"] {
    padding: 15px;
  }
}

/*
  Menu changes for 1240px - 1492
*/
@media (min-width: 1240px) and (max-width: 1492px) {
  header nav.topmenu .left.pageMenu__list {
    grid-template-columns: 0px auto auto auto auto auto;
    height: 58px;
  }
  header nav.bottommenu div.left .pageMenu__list {
    grid-template-columns: 0px auto auto auto auto;
    height: 58px;
  }
  header nav.topmenu .left.pageMenu__list {
    width: calc(100% - 50px);
  }

  header nav.topmenu .sep {
    position: relative;
    left: 2px;
    top: -39px;
    margin-left: calc(100%);
  }

  header nav.bottommenu .sep {
    position: relative;
    left: 0px;
    top: -39px;
    margin-left: calc(100%);
  }

  header nav.bottommenu .searchBox {
    height: 58px;
  }
}

.homepageContent {
  margin-left: 110px;
  margin-right: 110px;
}

/* reviews */
.reviews > div {
  margin-bottom: 32px;
}
.review_intro {
  padding-bottom: 48px;
  color: var(--darkblue);
}
.review .quote {
  font-weight: 700;
  color: var(--darkblue);
}
.review .tekst {
  padding-bottom: 48px;
  color: var(--darkblue);
}
.review .stars {
  width: 150px;
  background-image: url(/assets/images/ster_grijs.svg);
  height: 30px;
  margin-bottom: 20px;
}

.review .stars .stars_given {
  display: block;
  background-image: url(/assets/images/ster_oranje.svg);
  height: 30px;
}

.reviews .card--interview--smaller {
  width: 100%;
  display: grid;
  grid-template-columns: 150px auto;
}

.reviews .card--interview--smaller .image {
  height: 150px;
  width: 150px;
  border-radius: 6px;
  overflow: hidden;
}

.reviews .card--interview--smaller .card__text {
  font-size: 16px;
}
.reviews .card--interview--smaller .card__label {
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  position: relative;
  margin-top: -150px;
}

.reviews .card--interview--smaller:before {
  position: relative;
}

.reviews .card--interview--smaller .card__label {
  background-color: var(--green);
}

.reviews .card--interview--smaller .card__label {
  position: relative !important;
  overflow: hidden;
  -webkit-transition: color 300ms ease-in-out;
  transition: color 300ms ease-in-out;
  z-index: 1;
  background-color: #03b1e3;
  text-transform: uppercase;
  position: absolute;
  color: white;
  padding: 6px 20px;
  top: 0;
  left: 0;
}
.reviews .card--interview--smaller .card__text {
  padding-left: 48px;
}
.reviews .card--interview--smaller .card__text,
.reviews .card--interview--smaller .card__text span {
  color: var(--darkblue);
}
.reviews .card--interview--smaller .card__text .titel {
  font-weight: 700;
  color: var(--darkblue);
}
.reviews .card--interview--smaller .card__text a {
  margin-top: 8px;
  text-align: left;
}

/*
  Snel naar
*/
.snelnaarContainer {
  margin-top: -45px !important;
  width: 100%;
  display: grid;
  grid-template-columns: 32% 32% 32%;
  gap: 2%;
  align-content: center;
  z-index: 2;
  position: relative;
  margin-bottom: 80px;
}

.snelnaarBlock {
  background-color: var(--light_color);
  padding: 24px;
  padding-left: 48px;
  padding-bottom: 32px;
  box-shadow: var(--box-shadow);
  border-radius: 8px;
  width: 100%;
  width: -webkit-fill-available;
}

.snelnaarTitle {
  font-size: 20px;
  font-weight: 700;
  color: var(--darkblue);
}

.snelnaarBlock a {
  color: var(--darkblue);
  font-size: 16px;
  text-decoration: none;
  display: block;
  line-height: 24px;
}

.snelnaarBlock a::before {
  display: block;
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  font-size: 12px;
  position: relative;
  right: -1px;
  width: 16px;
  color: inherit;
  float: left;
  top: 7px;
}

.snelnaarBlock a:hover {
  color: var(--lightblue);
}

/*
Last minutes
*/
.lastMinutesContainer {
  margin-top: 24px;
  display: grid;
  grid-template-columns: 32% 32% 32%;
  align-content: center;
  z-index: 99998;
  position: relative;
  gap: 2%;
  width: 100%;
}

.lastMinutesTitle {
  font-weight: 700;
  font-size: 32px;
  text-align: center;
  color: var(--darkblue);
}

.lastMinutesBlock {
  background-color: var(--lightblue);
  padding: 24px;
  padding-left: 48px;
  padding-right: 48px;
  padding-bottom: 32px;
  box-shadow: var(--box-shadow);
  border-radius: 8px;
  width: 100%;
  width: -webkit-fill-available;
  min-height: 100px;
  text-decoration: none;
}

.lastMinutesBlock:hover {
  background-color: var(--darkerblue);
}

.lastMinutesBlock a:hover {
  color: var(--light_color);
}

.lastMinutesitemDate {
  font-size: 16px;
  font-weight: 400;
  color: var(--light_color);
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  line-height: 24px;
}

.lastMinutesitemDate::before {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: inherit;
  margin-right: 7px;
}

.lastMinutesitemTitle {
  font-size: 18px;
  font-weight: 700;
  color: var(--light_color);
}

a.lastMinutesButton {
  margin-bottom: 24px;
}

/* Hero image */

div.hero {
  height: 580px;
  width: 100%;
  background-position: center center;
  background-size: cover;
  position: relative;
}

/*
    podcast
*/

.podcastContainer {
  height: 400px !important;
  overflow: hidden !important;
}

.podcastContainer .beeld {
  width: 735px;
  height: 400px;
  background-size: cover;
  display: block;
  position: relative;
}

.podcastContainer .text {
  background-color: var(--darkblue);
  padding: 24px;
  padding-top: 36px;
  color: var(--light_color);
  font-size: 16px;
  font-weight: normal;
  position: relative;
  top: -372px;
  width: 600px;
  height: 282px;
  float: right;
  border-radius: 6px;
  overflow: hidden;
}

.podcastContainer .text h3 {
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--main_color);
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 0px;
}

.podcastContainer .text .title {
  font-size: 20px;
  font-weight: 700;
}

.podcastContainer .text .intro {
  margin-top: 24px;
  margin-bottom: 24px;
  height: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.podcastContainer .text .genericButton {
  box-shadow: none;
}

.podcastContainer .text .genericButton:hover {
  color: var(--light_color);
}
/* search wizard
*/

body .werkveldenContainer {
  display: inline-table;
  padding: 0px;
  background-color: var(--offwhite) !important;
  box-sizing: border-box;
  text-align: center;
  padding-top: var(--desktop_vert_margin);
  padding-bottom: var(--desktop_vert_margin);
  padding-left: 15%;
  padding-right: 15%;
}

.homepage .werkveldenContainer h2 {
  font-size: 26px;
  color: var(--darkblue);
  font-weight: 700;
  text-align: center;
  text-transform: none;
  padding-top: 0px;
  margin-top: 0px;
}

.werkveldenContainer a {
  float: none;
}

.werkveldenContainer ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;

  padding-left: 0px;
}

.werkveldenContainer .tagsTheme__tags {
  text-align: center;
}

a.tags_showLessButton,
a.tags_showMoreButton {
  display: none;
}

.werkveldenContainer:has(.tagsTheme__tags--showAll) a.tags_showLessButton {
  display: block;
}

.werkveldenContainer:not(:has(.tagsTheme__tags--showAll)) a.tags_showMoreButton {
  display: block;
}

.tagsTheme__tags a.tagsTheme__tagButton,
.werkveldenContainer li a {
  background-color: var(--light_color) !important;
  font-size: 16px;
  border: 1px solid var(--darkblue) !important;
  color: var(--darkblue);
  line-height: 20px;
  border-radius: 12px;
  text-transform: uppercase;
  font-size: var(--body-fontsize);
  font-weight: 600;
  text-decoration: none;
  position: relative;
  text-transform: uppercase;
  color: #001d49;
  border-radius: 12px;
  opacity: 1;
  padding: 6px 14px 6px 14px;
  margin: 0 10px 20px 10px;
  transition: color 300ms ease-in-out, background-color 300ms ease-in-out, opacity 300ms 0.12s ease-in-out;
}

.werkveldenContainer li {
  display: inline-block;
}

.tagsTheme__tags a.tagsTheme__tagButton:hover,
.werkveldenContainer li a:hover {
  border: 1px solid var(--lightblue);
  color: var(--lightblue);
}

.werkveldenContainer a.genericButton {
  margin: auto;
  text-transform: none;
  text-align: center;
  position: relative;
  display: inline-block;
  border-radius: 6px;
  color: #ffffff;
  float: none;
}

.werkveldenContainer a.tagsTheme__tagButton {
  cursor: pointer;
  display: inline-block;
  background: none;
  outline: none;
  border: none;
  font-weight: 600;
}

/* diversenContainer */
.diversenContainer {
  margin-top: 24px;
  display: grid;
  grid-template-columns: 23% 23% 24% 24%;
  gap: 2%;
  position: relative;
  width: 100%;
  height: 435px;
}

.card--promo {
  border: 0px;
}

.card--promo .card__mediaImage {
  background-position: 24% center;
}

.card--promo .card__text {
  position: absolute;
  z-index: 2;
  color: white;
  top: 60%;
}

.card--promo .card__title {
  font-weight: 700;
  font-size: 24px;
}
.card--big,
.card--event,
.card--promo,
.card--video,
.card--podcast,
.card--keynote,
.card--interview,
.card--article,
.card--study {
  border-radius: 8px;
  box-shadow: var(--box-shadow);
  overflow: hidden;
}

.card--study:hover .card__label,
.card--study:hover .card__title {
  color: var(--lightblue);
}

.card--promo.card__text .CTA {
  font-size: 20px;
}

.card--promo:hover .CTA {
  color: var(--lightblue);
}

.card--study:hover .card__inner:hover {
  border-top: solid 5px #03b1e3 !important;
}

.card--promo .card__text .CTA:after {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: inherit;
  display: inline-block;
  margin-left: 8px;
}

div.card__label {
  font-size: 16px;
}

.diversenContainer > a,
.diversenContainer > div {
  border-radius: 8px;
  box-shadow: var(--box-shadow);
  overflow: hidden;
  width: 100%;
  height: auto;
  width: -webkit-fill-available;
}

.card--calendar .card__eventListItem {
  margin-bottom: 4px;
  display: grid;
  align-items: center;
  align-content: center;
}

.diversenContainer .card__event:hover .card__eventDescription {
  color: var(--lightblue);
}

.diversenContainer .card__eventDate {
  border-radius: 50%;
  position: revert-layer;
}

.diversenContainer .card__eventDate .card__eventDay {
  top: 5px;
}

.diversenContainer .card__eventDate span {
  font-size: 16px;
}

.diversenContainer .card__eventDescription {
  color: var(--darkblue);
  font-size: 16px;
  padding-left: 0px;
}

.kennisbankContainer .items {
  min-height: 446px;
}

.kennisbankContainer .items .card {
  min-height: 380px;
}

.kennisbankContainer {
  margin-top: 0px;
  display: grid;
  grid-template-columns: 24% 75%;
  gap: 2%;
  position: relative;
  width: 100%;
}

.kennisbankContainer .kennisbank .items {
  display: grid;
  grid-template-columns: 30.9% 30.9% 30.9%;
  gap: 3%;
  position: relative;
  width: 100%;
}
.kennisbankContainer .kennisbank,
.kennisbankContainer .nieuws {
  display: grid;
}

.kennisbankContainer .nieuws .items {
  display: grid;
  grid-template-rows: 152px 152px 152px; /* 33.3% 33.3% 33.3%; */
}

.kennisbankContainer .nieuws .item {
  display: grid;
  font-size: 18px;
  font-weight: 700;
  box-shadow: var(--box-shadow);
  border-radius: 8px;
  border-left: 5px solid var(--main_color);
  padding: 24px;
  padding-left: 12px;
  padding-right: 12px;
  color: var(--darkblue);
  margin-bottom: var(--mobile_vert_margin);
  transition: color 300ms;
  background-color: var(--light_color);
  height: 100%;
  box-sizing: border-box;
  gap: 24px;
  height: calc(100% - 24px); /* werkt niet: calc(100% - var(--mobile_vert_margin)); */
  min-height: 121px;
  align-items: center;
}

.kennisbankContainer .kennisbank a.card {
  border-radius: 6px;
  box-shadow: var(--box-shadow);
  border-collapse: separate;
  overflow: hidden;
}

.kennisbankContainer .nieuws a.item:hover {
  color: var(--lightblue);
}

.lastMinutesTitle,
.kennisbankContainer h2 {
  font-size: 26px;
  color: var(--darkblue);
  font-weight: 700;
  text-align: center;
  margin-top: 0px;
}

/* footer */
footer .pageFooter {
  background-color: var(--light_gray);
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  box-sizing: border-box;
}

.pageFooter__wrapper {
  background-color: var(--offwhite);
  padding: 0px;
}

.pageFooter__wrapper .contentFooter__text .orange {
  color: var(--main_color);
  font-weight: 700;
}

.pageFooter__wrapper .contentFooter__text {
  padding-bottom: 24px;
  font-size: var(--body-fontsize);
}

.pageFooter__wrapper .onderwijs .item a {
  line-height: 24px;
  text-decoration: none;
  color: var(--darkblue);
  transition: color 300ms;
}

.pageFooter__wrapper .onderwijs .item a:hover {
  color: var(--lightblue);
}

.pageFooter__wrapper .onderwijs .item a::before {
  display: block;
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  font-size: 12px;
  position: relative;
  right: -1px;
  width: 16px;
  color: inherit;
  float: left;
  top: 8px;
}

.pageFooter__wrapper .pageFooter__wrapper .buttonsShare {
  text-align: center;
}

body footer.pageFooter .criteria {
  width: 100%;
  background-color: var(--darkblue);
  display: grid;
  column-count: 6;
  grid-template-columns: 15% 18% 18% 18% 18% 15%;
  justify-items: center;
  align-content: center;
  height: 60px;
}

body footer.pageFooter .criteria .punt,
body footer.pageFooter .criteria .punt a {
  color: var(--light_color);
  text-decoration: none;
  font-size: var(--body-fontsize);
}

body footer.pageFooter .criteria .punt:before {
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: var(--green);
  text-align: center;
  margin-top: 5px;
  margin-right: 8px;
}

.pageFooter__wrapper .contentFooter__btn--CTA {
  color: var(--light_color);
  font-weight: 400;
}

.pageFooter__wrapper .contentFooter__btn--CTA:before {
  background-color: var(--main_color);
}

.pageFooter__wrapper .buttonsShare .buttonsShare__socialLink {
  background-color: transparent !important;
  border: 1px solid var(--darkblue);
  border-radius: 4px;
}

.buttonsShare__socialItem a {
  width: 36px;
  height: 36px;
  background-size: 100% 100%;
  display: inline-block;
}

.buttonsShare__socialItem .linkedin {
  background-image: url("/assets/images/Icoon linkedin.svg");
}

.buttonsShare__socialItem .linkedin:hover {
  background-image: url("/assets/images/Icoon linkedin hover.svg");
}

.buttonsShare__socialItem .facebook {
  background-image: url("/assets/images/Icoon facebook.svg");
}

.buttonsShare__socialItem .facebook:hover {
  background-image: url("/assets/images/Icoon facebook hover.svg");
}

.buttonsShare__socialItem .instagram {
  background-image: url("/assets/images/Icoon instagram.svg");
}

.buttonsShare__socialItem .instagram:hover {
  background-image: url("/assets/images/Icoon instagram hover.svg");
}

.buttonsShare__socialItem .twitterx {
  background-image: url("/assets/images/Icoon twitterx.svg");
}

.buttonsShare__socialItem .twitterx:hover {
  background-image: url("/assets/images/Icoon twitterx hover.svg");
}

.pageFooter {
  background-color: transparent;
}

.pageFooter__wrapper .buttonsShare .buttonsShare__socialItem .icon::before {
  color: var(--darkblue);
}

.pageFooter__list,
.pageFooter__wrapper {
  max-width: 1480px;
}

.pageFooter__wrapper .criteria {
  background-color: var(--darkblue);
  color: var(--light_color);
}

ul.pageFooter__list {
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #ffffff;
}

ul.pageFooter__list a {
  color: var(--dark_gray);
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  margin-left: 32px;
  margin-right: 32px;
}

/*
  select box
*/

.form__selectBox:hover + .form__selectBoxIcon:before {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.form__selectBoxInnerWrapper {
  border-radius: 6px;
}

.acc_menu .icon--search:before,
.form__selectBoxIcon:before,
.form__selectBoxIcon,
.acc_menu .icon--search {
  background-color: var(--light_color);
}

.form__selectBoxIcon:after {
  color: var(--lightblue);
}

.form__selectBoxIcon:hover:after {
  color: var(--darkerblue);
}
select.form__selectBox {
  border: 1px solid transparent;
}
select.form__selectBox:focus {
  border: 1px dashed var(--lightblue);
}

select.form__selectBox option {
  font-size: 14px;
  line-height: 24px;
}

.form__selectBoxIcon:before {
  transform: translateX(0%);
}

.acc_menu .icon--search:before,
.form__selectBoxIcon:before {
  display: none;
}

/*
  Content blocks
*/
#visibleContent .col-lg-8,
.contentBlocks .col-lg-8 {
  width: 100%;
}
.cb--acc_menu {
  border-radius: 6px;
}
.cb--acc_menu input {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.cb--acc_menu button {
  display: inline-block;
  margin: 0px;
  height: 40px;
  width: 40px;
  border: 0px;
  background-color: darkblue;
  color: #ffffff;
  font-size: 20px;
  text-align: center;
  border-bottom-right-radius: 6px;
  border-top-right-radius: 6px;
}
.cb--acc_menu button i {
  padding: 4px;
  border-left: 0px;
}

/* mobile footer */

.contentFooter {
  background-color: var(--light_gray);
  margin-top: 0px !important;
}

.pageFooter__wrapper .contentFooter__text {
  float: left;
  width: 22.9%;
  margin-top: 36px;
  padding-left: 2%;
}

.pageFooter .pageFooter__wrapper .buttonsShare {
  text-align: left;
}

.pageFooter__wrapper .buttonsShare__socialItem {
  margin-right: 4px;
}

.pageFooter__wrapper .social_icon {
  width: 36px;
  height: 36px;
  border: 0px;
}

body .blockLinkCTA__button,
body .contentFooter__btn--primary,
body .genericButton {
  border: none;
  background: none;
  position: relative;
  overflow: hidden;
  display: inline-block;
  box-sizing: border-box;
  text-decoration: none;
  text-align: center;
  padding: 8px 12px;
  color: var(--light_color) !important;
  background-color: var(--main_color);
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  transition: background-color 300ms;
  box-shadow: var(--button-shadow);
  line-height: 22px;
}
body form input.genericButton { padding-left:auto;  ; font-size:14px;   min-width: 200px;
  text-transform: uppercase; font-family: "Open Sans", sans-serif;     font-weight: bold;}

body .blockLinkCTA__button:after,
body .contentFooter__btn--primary:after,
body .form__nextBtn:after,
body .genericButton:after {
  display: block;
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  font-size: 12px;
  position: relative;
  right: 0px;
  width: 24px;
  color: inherit;
  float: right;
  top: 1px;
  line-height: inherit;
  box-sizing: inherit;
  transform: none !important;
  transition: none !important;
  perspective: 0px;
  opacity: 1;
  height: auto;
}
body .blockLinkCTA__button:before,
body .contentFooter__btn--primary:before,
body .blockLinkCTA__button:after,
body .contentFooter__btn--primary:after,
body .blockLinkCTA__button:hover:after,
body .contentFooter__btn--primary:hover:after {
  background-color: transparent;
}
body .blockLinkCTA__button:hover,
body .contentFooter__btn--primary:hover,
body .genericButton:hover {
  background-color: var(--dark_orange);
  color: var(--light_color);
  box-shadow: var(--box-shadow);
}

body .genericButton.lightblue {
  background-color: var(--lightblue);
}

body .genericButton.lightblue:hover {
  background-color: var(--darkerblue);
  border: 0px;
}

.contentFooter__body {
  min-height: 72px;
  font-size: var(--body-fontsize);
}

.contentFooter__title {
  margin-top: 0;
  margin-bottom: 0px;
  font-weight: 700;
  font-size: var(--body-fontsize);
}

.lastMinutesContainer,
.diversenContainer,
.snelnaarContainer,
.kennisbankContainer,
.werkveldenContainer,
.podcastContainer {
  margin-bottom: var(--desktop_vert_margin);
}

@media (max-width: 992px) {


  .lastMinutesContainer,
  .diversenContainer,
  .snelnaarContainer,
  .werkveldenContainer,
  .kennisbankContainer,
  .podcastContainer {
    margin-bottom: var(--mobile_vert_margin);
    height: auto;
  }

  .diversenContainer > a,
  .diversenContainer > div {
    margin-bottom: var(--mobile_vert_margin);
  }

  .homepage .werkveldenContainer {
    padding-top: var(--mobile_vert_margin);
    padding-bottom: var(--mobile_vert_margin);
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 480px) {
  .pageFooter__listItem {
    display: inline-block;
    margin-left: 0px;
  }
}


@media (max-width: 1240px) {


  ul#tabrow { width:100% }

  /* 2 column display */
  body .pageFooter__wrapper .contentFooter__text {
    width: 47%;
    box-sizing: border-box;
    padding-left: 24px;
    padding-right: 24px;
  }

  body footer.pageFooter .criteria {
    grid-template-columns: 0% 25% 25% 25% 25% 0%;
  }

  body footer.pageFooter .criteria.desktop {
    display: none !important;
  }

  .contentFooter__body {
    min-height: auto;
  }

  .homepageContent {
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
  }

  body.homepage .payoff {
    left: 2%;
    top: 388px;
  }

  body.articleDetail--interview .contentBlocks .col-lg-8,
  body.articleDetail--podcast .contentBlocks .col-lg-8,
  body.articleDetail--interview .contentBlocks,
  body.articleDetail--podcast .contentBlocks {
    width: 100%;
  }

  .blockPerson {
    float: none;
    margin-bottom: 0px;
  }
}

@media (min-width: 768px) {
  [role="main"] {
    padding: 0px;
  }
}

/* mobile footer */
@media (max-width: 1024px) {
  body .pageFooter__wrapper .contentFooter__text {
    display: block;
    float: none;
    width: 100%;
    margin-top: 0px;
    padding: 24px;
    box-sizing: border-box;
  }

  body .pageFooter__wrapper .contentFooter__text {
    padding-left: 15%;
    padding-right: 15%;
  }

  body .pageFooter__wrapper .contentFooter__text.contentFooter__CenteredText {
    text-align: center;
  }

  body .pageFooter__wrapper .contentFooter__text.contentFooter__CenteredText .genericButton {
    margin-top: 12px;
    margin-bottom: 36px;
    min-width: 270px;
  }

  body footer.pageFooter .criteria {
    width: auto;
    margin: auto;
    display: block !important;
    text-align: left;
    margin-top: 32px;
    margin-bottom: 32px;
    padding: 24px;
  }

  body footer.pageFooter .criteria .punt,
  body footer.pageFooter .criteria .punt a {
    width: 48%;
    display: inline-block;
    text-align: center;
    white-space: nowrap;
  }

  .pageFooter .pageFooter__wrapper .buttonsShare {
    text-align: center;
    margin-top: -16px;
  }

  body .pageFooter__wrapper .contentFooter__text {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .contentFooter__body {
    margin-bottom: 0px;
  }

  .homepageContent {
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
    box-sizing: border-box;
    margin: 0px;
  }

  .lastMinutesContainer {
    width: 100%;
    margin-right: 0px;
    margin-left: 0px;
  }

  body.homepage .payoff {
    top: 406px;
    left: 7%;
  }
}

@media (max-width: 992px) {
  a.plaintextButton {
    margin-top: 0px;
    margin-bottom: 24px;
  }

  body footer.pageFooter .criteria {
    grid-template-columns: 50%;
    column-count: 2;
  }

  body footer.pageFooter .criteria .punt {
    display: block;
    margin: auto;
    width: 100%;
  }

  body footer.pageFooter .criteria .punt a {
    width: auto;
    display: inline-block;
    line-height: 24px;
  }

  .snelnaarBlock {
    padding: 12px;
    padding-left: 24px;
    padding-bottom: 24px;
  }

  body.homepage .card--calendar h2.card__title {
    margin-bottom: 4px;
  }

  .card--promo {
    min-height: 300px;
  }

  .diversenContainer .card--promo .card__mediaImage {
    background-position: 49% center;
  }

  .lastMinutesContainer,
  .diversenContainer,
  .snelnaarContainer,
  .kennisbankContainer,
  .kennisbankContainer .kennisbank .items {
    grid-template-columns: 100%;
    column-count: 1;
    min-height: auto;
    gap: 0;
    margin-top: 0px;
    margin-bottom: 0px;
  }

  .card--article .card__title,
  blockquote.card__quote {
    margin-bottom: 24px;
  }

  .kennisbankContainer .items .card,
  .kennisbank .item,
  .diversenContainer > a,
  .diversenContainer > div,
  .kennisbankContainer .item,
  .snelnaarContainer .snelnaarBlock {
    margin-bottom: var(--mobile_vert_margin);
    margin-top: 0px;
  }

  .lastMinutesBlock {
    min-height: auto;
  }

  .lastMinutesContainer .lastMinutesBlock:nth-child(1),
  .lastMinutesContainer .lastMinutesBlock:nth-child(2) {
    margin-bottom: var(--mobile_vert_margin);
  }

  body .pageFooter__wrapper .contentFooter__text:first-child,
  body .pageFooter__wrapper .contentFooter__text:nth-child(2) {
    padding-left: 10%;
    padding-right: 10%;
  }

  body .pageFooter__wrapper .contentFooter__text:nth-child(2) {
    margin-bottom: 24px;
  }

  ul.pageFooter__list {
    padding: 0px !important;
    padding-top: 20px !important;
  }

  ul.pageFooter__list a {
    margin-right: 16px;
    margin-left: 16px;
  }

  .podcastContainer {
    height: auto !important;
    overflow: visible !important;
  }

  .podcastContainer .beeld {
    margin: auto;
    width: 100%;
    height: calc(100vw * 0.6);
  }

  .podcastContainer .text {
    height: auto;
    top: -70px;
    float: none;
    margin: auto;
    width: 70%;
  }

  .podcastContainer .text .title {
    margin-bottom: 24px;
  }

  .podcastContainer .text .intro {
    display: none;
  }
}

@media (max-width: 600px) {
  ul.pageFooter__list a {
    margin-right: 0px;
    margin-left: 0px;
  }
}

@media (max-width: 512px) {
  ul.pageFooter__list a {
    margin-right: 6px;
    margin-left: 6px;
  }

  body footer.pageFooter .criteria {
    column-count: 1;
    display: block !important;
    height: auto;
  }

  body.homepage .payoff {
    font-size: 18px;
  }

  .podcastContainer {
    height: 449px !important;
  }

  div.hero {
    background-position: -300px center;
  }
}

@media (max-width: 400px) {
  body.homepage .payoff {
    font-size: 17px;
  }

  body.homepage .payoff br {
    display: none;
  }

  .podcastContainer {
    height: 416px !important;
  }
}

.card--study .card__inner {
  padding-top: 35px;
}

.tagsTitle__title,
.cardsRelated__title {
  font-size: 26px;
  font-weight: 700;
  padding-top: 32px;
  margin-top: 0px;
}

body.detailPage .cardsRelated {
  background-color: var(--light_gray) !important;
}
.cardsRelated .card--podcast .card__inner {
  padding-top: 160px;
}

#form_mask #mask_overlay {
  display: none;
}

#form_mask.visible #mask_overlay {
  display: block;
}

#notification_top {
  background-color: var(--darkblue);
  top: 150px;
}

.formSignUpSpecs__infoListItem {
  font-size: 16px;
}

.pagination .pagination__item--current {
  border-radius: 5px;
}

/* Pagina detail */

body main[role="main"] > .intro:has(.opleidingen) {
  /* width: calc(100% - 320px) !important; */
  padding-right: 425px;
  }


/* page detail - mobile */
@media (max-width: 1240px) {
  body main[role="main"] > .intro,
  body main[role="main"] > .vervolg {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 32px;
  }

  .pageTitle__subtitle h2.pageTitle__label,
  .pageTitle__title h1.pageTitle__label {
    padding-right: 15px;
  }

  .intro .introtekst .introText {
    padding-right: 0px;
  }

  body.detailPage main[role="main"] > .intro:has(.opleidingen) {
    padding-right: 15px;
  }

  body.detailPage .blockCostCTA.opleidingen { width:auto !important }
}

@media (min-width: 990px) and (max-width: 1420px) {
  ul.card__eventList .card__eventListItem:nth-child(3) {
    display:none
  }

}

@media (max-width: 992px) {
    .teacherRow {
        display:block
    }

    .courses, .courses a {
        display: block
    }

}

@media (max-width: 600px) {
  body .blockAccreditation__list li .blockAccreditation__topic,
  body .blockAccreditation__list li .blockAccreditation__status {
    display: block;
    width: 100%;
  }

  body .blockAccreditation__list li .blockAccreditation__topic {
    padding-bottom: 0px;
  }
  body .blockAccreditation__list li .blockAccreditation__status {
    padding-top: 0px;
  }
}

body.homepage .card--calendar h2.card__title {
  margin-bottom: 0px;
}

body.homepage .card--calendar .genericButton {
  padding: 8px 10px;
}

@media (max-width: 991px) {
  body div.uitvoeringen,
  body div.uitvoeringen div.dateSwitch__container,
  body div.uitvoeringen div.dateSwitch__container ul.dateSwitch__list,
  body div.uitvoeringen div.dateSwitch__container ul.dateSwitch__list li.dateSwitch__listitem {
    display: block !important;
  }

  body.detailPage .breadcrumbs {
      display: block
  }
}

@media (min-width: 996px) {
  body.articleOverview h2.card__title {
      min-height: 86px;
  }
}


@media (min-width: 996px) {
  body.detailPage .blockCostCTA.opleidingen {
    width: 263px !important;
    margin-right: 20px;
    position: absolute;
    right: 40px;
    z-index: 2
  }
}

body.detailPage .blockCostCTA.opleidingen a {
  background-color: #ffffff;
  border-radius: 10px;
  min-height: 20px;
  color: var(--darkblue);
  padding: 12px;
  box-shadow: 4px 4px 8px 0 rgb(128 130 141 / 60%);
  font-weight: normal;
  padding-top:8px; padding-bottom:8px; font-size: 14px; letter-spacing:0px
}


body.detailPage .blockCostCTA.opleidingen a:hover {
color: var(--lightblue);
}

body.detailPage .blockCostCTA.opleidingen .sectionSubTitle__title { margin-top:24px }
body.detailPage .blockCostCTA.opleidingen .sectionSubTitle__title:first-child { margin-top:0px }

.courses:has(.card--blockStudy) {
  display: grid;
  column-gap: 1.95%;
  grid-template-columns: 32% 32% 32%;
}
.courses:has(.card--blockStudy) .courseList {display:none}
.courses {
  display:block     ;
}


.card--study .card__label {
  text-transform: none;
}
.card--blockStudy {display:grid; padding:0px !important; box-shadow: var(--box-shadow);background-color:transparant; border-radius:8px}
.card--blockStudy::after, .card--blockStudy::before {display:none}
.card--blockStudy .card__inner {padding:12px !important; padding-top:4px !important; border-radius: 8px;background-color:#ffffff}
.card--blockStudy  .card__date,
.card--blockStudy  span.icon--date::after{ color: #03b1e3 }

body .card--blockStudy  .card__date { font-size:14px !important }
body .card--blockStudy  .card__title { font-size:14px !important; line-height:20px !important; margin-top:0px !important; min-height:40px}
body .card--blockStudy  .card__body { font-size:14px  !important; line-height:20px !important; height:120px; overflow:hidden}
body .card--blockStudy  .card__text { height:300px }
body .card--blockStudy:hover  .card__title { color:  #03b1e3 }
body .card--blockStudy  .card__accred {font-size:14px !important; line-height:20px !important; margin-top:16px; min-height:40px; margin-bottom: 36px;}
body .card--blockStudy  .wishlist {
  background-image: url("/images/interface/heart-thin-icon lichtblauw.svg");
  top: -1px;
  right: -6px; }
body .card--blockStudy .wishlist:hover  {
  background-image: url("/images/interface/heart-thin-icon donkerblauw.svg");
}

body .card--blockStudy  .wishlist.added {
  background-image: url("/assets/images/heart_black.svg");
}
body .card--blockStudy  .wishlist.added:hover {
  background-image: url("/images/interface/heart-thin-icon lichtblauw.svg");
}
/* alternative approach : https://codepen.io/sudeepgumaste/pen/mdevOQq (google Ribbon) */
body .card--blockStudy .card__nieuw {
  --f: 5px;
  --r: 0px;
  right: calc(-1* var(--f));
  border-left: var(--r) solid #0000;
  position: absolute;
    padding-inline: 10px;
    background: var(--main_color);
    border-bottom: var(--f) solid #0005;
    color: #fff;
    line-height: 1.3em;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    margin-top:-5px;
    text-transform: uppercase;
    bottom:45px;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--f)), calc(100% - var(--f)) 100%, calc(100% - var(--f)) calc(100% - var(--f)), 0 calc(100% - var(--f)), var(--r) calc(50% - var(--f) / 2));
}

body .card--blockStudy:hover .card__inner {
  border-top: solid 5px #03b1e3 }

body .card--blockStudy .card__bottom {position: absolute;
    width: calc(100% - 24px);
    bottom: 8px;}

body .card--blockStudy .status { font-style: italic; font-size:14px; font-weight:200;      padding-top: 9px;
    display: inline-block; }
body .card--blockStudy .price { font-size: 24px; color: var(--lightblue); float:right }




@media (max-width: 1024px) {

  .courses  {
    display: grid;
    column-gap: 20px;
    grid-template-columns: 50% 50%;
   }

}


@media (max-width: 800px) {
    .courses  {
        display: block !important
    }
}



/*
        Thema en selectiepagina's

        body.selectie:not(:has(courses.show_all)) .pagination_container,
body.selectie:not(:has(courses.show_all)) .pagination_container .pagination,
*/

body.selectie .pagination_container .pagination {visibility: hidden }

body.selectie:not(:has(.courses.show_all)) .filter,
body.selectie:not(:has(.courses.show_all)) .pagination_container .col-md-3 { display: none }

body.selectie:not(:has(.courses.show_all)) .courseOverviewWrapper .pagination_container {
    width: 100%;
    display: grid
}

body.selectie:not(:has(.courses.show_all)) .courses {
    grid-template-columns: 23.5% 23.5% 23.5% 23.5%
}

body.selectie .courses a.card--blockStudy:not(:nth-child(-n + 13) ) {
    display: none !important
}
body.selectie .courses a.card--blockStudy:nth-child(-n + 13) { display: grid !important }


body.selectie .courseOverviewWrapper:has(.courses:not(.show_more)) a.show_all:not(.visible),
body.selectie .courseOverviewWrapper:has(.courses.show_more) a.show_more,
body.selectie .courseOverviewWrapper:has(.courses.show_all) a.show_all {
    display: none
}

body.selectie .courseOverviewWrapper a.show_more,
body.selectie .courseOverviewWrapper a.show_all.visible,
body.selectie .courseOverviewWrapper:has(.courses.show_more):not(:has(.courses__message)) a.show_all  {
    display: block;
    width: 100%;
    text-align: center
}

body.selectie .courses.show_more a.card--blockStudy,
body.selectie .courses.show_all a.card--blockStudy {
  display: grid !important
}


body a[title="Bekijk vacature"] .card__title {
  height: auto !important;

    max-height: 107px;
    overflow: hidden;
    display: block;
}

.card--study .card__inner, .card--big .card__inner, .card--event .card__inner {
    display:grid;   height: calc(100% - 48px) !important
}
.card__inner .bekijkoproep {
    color: #03b1e3;
    position: absolute;
    top: calc(100% - 37px);
    left: 19px;
}

.card--big .card__inner {
    min-height: 260px
}




/*    inschrijfformulier wijzigingen */
label.form__Label, .form__label, label.form__label {
  text-transform: uppercase;
  display: block;
  font-size: 13px;
  color: rgb(177, 181, 215);
  font-weight: 700;
  margin-bottom: 4px;
}

.accordeon__content--secondary {background-color: #ffffff}

body .form__field ,
body .form__fieldWrapper input.form__field,
body .form__fieldWrapper textarea.form__field,
body .form__fieldWrapper textarea.form__textArea {
  border: 1px solid rgb(215,215,215);
  border-radius: 3px;
  margin-bottom: 6px;
}

body .accordeon__trigger {
  background-color: #ffffff;
  border-top: 1px solid #eff2f4;
  border-left: 1px solid #ffffff;
}

body .cb--accordeon .accordeon .accordeon__content {
  padding: 20px;
}


/* --------------------------------------------------------------------------------------------------------------------------------------------------------- fine uploader */

body ul.qq-upload-list li { width:260px !important; border-radius:5px; font-size:14px}

body .qq-upload-file { padding-left: 0px !important; }
body form .fine-uploader { min-height:180px ; height:180px}
body form .form__fieldWrapper .fine-uploader:has(.qq-upload-list) { margin-bottom:80px }

body form .fine-uploader .qq-uploader .qq-upload-list

form .fine-uploader {width:100%; max-width:100%}
form .fine-uploader .qq-upload-drop-area span { font-size: 14px; top:40% }
form .fine-uploader .qq-uploader .qq-upload-drop-area {
	position: relative;
    font-family: "Open Sans", sans-serif;
    font-weight: normal;
    background-color: rgb(231, 250, 254);
    box-sizing: border-box;
    border-radius: 5px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(5, 176, 227);
    border-image: initial; width:100%;
	  max-width: 100%;
	  min-height:155px;
	  background-image: url(images/redesign/file.svg);
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center 20px;
}
form  .fine-uploader .qq-uploader { height:100%; min-height:100%; width:100% }
form  .fine-uploader .qq-upload-drop-area:hover  {
	border-style: dashed;
}
form  .fine-uploader .qq-uploader span.qq-drop-processing {
	position: relative;
    top: -120px;
    left: 0px;
    display: block;
}

form  .fine-uploader .qq-uploader span.qq-drop-processing span.qq-drop-processing-spinner { display:none }

form  .fine-uploader .qq-upload-drop-area span {
	    margin-top: -16px;
}
form  .fine-uploader .qq-uploader span.qq-drop-processing span {
	text-align:center; display:block;     line-height: 32px;
}

    form .fine-uploader .qq-uploader .qq-upload-button {
        display: inline-block;
        font-size: 12px;
        font-weight: 700;
        font-family: "Open Sans", sans-serif;
        line-height: 1;
        text-transform: uppercase;
        user-select: none;
        color: rgb(255, 255, 255) !important;
        background-color: rgb(5, 176, 227) !important;
        box-shadow: rgba(5, 176, 227, 0.5) -2px 3px 7px 0px;
        border: 0px;
		padding: 13px 60px;
		border-radius: 5px;
        transition: background-color 200ms ease 0s, color 200ms ease 0s;
        border-width: initial;
        border-style: none;
        border-color: initial;
        border-image: initial;
        position: absolute;
        margin: auto;
        left: 50%;
        width: 200px;
        margin-left: -130px;
        top: -60px;
        height: 17px;
		user-select: none;
		background-color: rgb(5, 176, 227);
		box-shadow: rgb(5 176 227 / 50%) -2px 3px 7px 0px;
		border: none;
		z-index:999	;
		text-align: center;
		width: auto;
    }
	form .fine-uploader .qq-uploader .qq-upload-button:hover {
		background-color: rgb(5, 160, 207) !important;
		color: rgb(255, 255, 255) !important;
	}
@media screen and (max-width: 512px) {
  form .fine-uploader .qq-uploader .qq-upload-button {
      padding: 13px 30px;
      margin-left: -100px;
  }
}

body form  .fine-uploader .qq-uploader .qq-upload-button div {
	color: #fff !important;
    padding-left: 0px;
    line-height: 15px;
}

body form  .fine-uploader .qq-uploader .qq-upload-list {
  display: block;
  position: relative;
  margin-top: -68px;
	width:100%;
	left:0px;
  
}

body form  .fine-uploader .qq-uploader .qq-upload-list li {
	display:block;
	margin-bottom: 8px;
	border:1px solid #EFF2F4;

}

body form li.qq-upload-success {
  background-image: url("data:image/svg+xml,%3Csvg fill='%2303bee3' height='16' width='16' aria-hidden='true' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EDownload attachment icon%3C/title%3E%3Cpath d='M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  text-align:left;
  background-position: 220px 13px;
  border: 1px solid rgb(215, 215, 215) !important;
  background-color: #ffffff !important;
  box-sizing: border-box  !important;
}

body form li.qq-upload-success a  {
  text-align:left
}

body form  .fine-uploader .qq-uploader .qq-upload-list li .qq-upload-size {
	display:none !important
}


body .fine-uploader ul.qq-upload-list li.qq-upload-success span.qq-upload-file { line-height:25px; background-color: transparent !important  }
body .fine-uploader ul.qq-upload-list li.qq-upload-success a.qq-upload-cancel {
	display:block !important;
	background-image: url(images/redesign/cross_blue.svg) !important;
    padding-left: 0px !important;
    background-size: 11px;
    background-position: 100% center;
    background-repeat: no-repeat;
	z-index:9998;
	visibility: visible !important;
	float: right;
    line-height: 24px;
	text-indent: -99999px;
    width: 32px;
    height: 40px;
}

body form  .fine-uploader .qq-upload-drop-area, .qq-upload-extra-drop-area {
	display:block !important; font-size:18px
}

body .fine-uploader .qq-uploader .qq-upload-button div::after {
    display: none
}

body form .fine-uploader .qq-uploader .qq-upload-button div {
    display: inline-block; width:auto; font-weight:700
}

body form .fine-uploader .qq-uploader .qq-upload-button-hover div {color:#ffffff !important}
body form .fine-uploader ul.qq-upload-list li a ,
body form .fine-uploader .qq-uploader .qq-upload-button div,
form .fine-uploader .qq-uploader .qq-upload-button input {
  font-weight: 600;
  font-size:14px;
  font-family: "Open Sans", sans-serif;
  text-transform: uppercase;
}
body form .fine-uploader ul.qq-upload-list li { width:231px  }
body form .fine-uploader ul.qq-upload-list li .qq-upload-file a { display: inline-block; width:100%;   text-align: left; }
body form .fine-uploader ul.qq-upload-list li .qq-upload-file a:hover {  text-decoration:underline }
body form .form__fieldWrapper:has(.fine-uploader .qq-upload-file a) { margin-bottom: 80px}


.form__nextBtn {
  display: inline-block;
  padding: 13px 60px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Open Sans", sans-serif;
  line-height: 1;
  text-transform: uppercase;
  border-radius: 5px;
  transition: background-color 200ms, color 200ms;
  user-select: none;
  color: rgb(255, 255, 255);
  background-color: rgb(5, 176, 227);
  box-shadow: rgba(5, 176, 227, 0.5) -2px 3px 7px 0px;
  border: none;
  text-decoration: none
}
.form__nextBtn:hover {
  background-color: 05A0CF
}

.accordeon__triggerIconWrapper,
.accordeon__triggerIconWrapper:hover {
    display: flex;
    place-content: center;
    -webkit-box-pack: center;
    flex-wrap: wrap;
    color: rgb(255, 255, 255);
    background-color: rgb(5, 176, 227);
    width: 30px;
    height: 30px;
    margin-top: 9px;
    border-radius: 4px;
    right: 12px
}

form#frmMain .accordeon > div {border-left:48px solid var(--light_gray);border-bottom:16px solid var(--light_gray)}
form#frmMain .accordeon > div::before { border-radius: 50%;
  background-color: #001d49;
  content: attr(data-number);
  display: block;
  width: 26px;
  height: 26px;
  float: left;
  margin-left: -48px;
  margin-top: 8px;
  font-size: 14px;
  color: #ffffff;
  font-weight:600;
  text-align: center;
  line-height: 26px;}

form#frmMain .accordeon > div:nth-child(1)::before { content: '1'}
form#frmMain .accordeon > div:nth-child(2)::before { content: '2'}
form#frmMain .accordeon > div:nth-child(3)::before { content: '3'}
form#frmMain .accordeon > div:nth-child(4)::before { content: '4'}
form#frmMain .accordeon > div:nth-child(5)::before { content: '5'}
form#frmMain .accordeon > div:nth-child(6)::before { content: '6'}

form#frmMain .col1 { width:48%; display:inline-block; vertical-align: top  }
form#frmMain .col2 {
    width: 48%;
    margin-left: 3.5%;
    display: inline-block;
    vertical-align: top
}
body .radio__input:checked + .radio__label {
  color: inherit !important
}
form#frmMain .qq-upload-list li.qq-upload-success {background-color:transparent} 

.accordeon__triggerIconWrapper, .accordeon__triggerIconWrapper:hover { width:26px; height:26px}
.accordeon__triggerIcon:after,
.accordeon__triggerIconWrapper:before {display:none}
.accordeon__triggerIconWrapper:after {
  content: "\203A";
  color:#ffffff;
  background-color:transparent;
  display: block;
  position: absolute;
  width: 26px;
  height: 26px;
  z-index: 1;
  top: 0;
  left: 2px;
  right: auto;
  text-align:center;
  -webkit-transition: none;
  transition: none;
  -webkit-transform: none;
  transform: none;
  font-size: 32px;
  font-weight: 100;
  line-height: 26px;
  transform: rotate(90deg)
}

.accordeon__trigger.isOpen .accordeon__triggerIconWrapper:after {
  transform: rotate(-90deg);   left:-3px;
}
.no-touch .accordeon__trigger:hover .accordeon__triggerIconWrapper:before, .no-touch .accordeon__trigger:hover .accordeon__triggerIconWrapper:after, .no-touch .accordeon__trigger:focus .accordeon__triggerIconWrapper:before, .no-touch .accordeon__trigger:focus .accordeon__triggerIconWrapper:after {
  background-color: transparent
}

.accordeon__triggerIcon { display:block}
.accordeon > div.disabled .accordeon__trigger {background-color:#dddddd; cursor: not-allowed;}
.accordeon > div.disabled .accordeon__triggerIconWrapper {background-color:#333333}

.accordeon div:has(.accordeon__content:empty) {
  display: none !important;
}


#dig_fact_email,
span.explain,
label.explain  { font-size:13px; text-transform:none; color:#001d49; font-weight:normal }

form .sectionSubTitle__title {margin-bottom:8px}

body.formPage #prive_faktuur_adres_container {
  padding-left: 24px;
  padding-top: 8px;
}

span.pwd_view { margin-top:0px }

div.inline_notificatie { border:1px solid #ffc703; background-color: #fffcea; color: #001d49; border-radius:5px; padding:6px ; padding-left:48px; font-size:15px}
div.inline_notificatie::before { position: absolute; display:inline-block; font-size:20px; color: #ffc703; content : "\f071"; font-family: "FontAwesome"; margin-left: -33px;
  margin-top: 2px;
}

body.formPage .accordeon__trigger { padding-left:20px}
body.formPage .form__selectBox {font-weight:normal; font-size:14px}

@media (max-width: 840px) {
  body form#frmMain .col1,
  body form#frmMain .col2 { width:100% ; display:block; margin:0px }
}


div.help_icon {
  content: " ";
  text-align: center;
  background-color: darkgrey;
  display: inline-block;
  width: 24px;
  height: 24px;
  z-index: 1;
  text-align: center;
  font-size: 21px;
  font-weight: 100;
  line-height: 24px;
  font-family: "FontAwesome";
  float: right;
  position: relative;
  border-radius:3px;
  transform: all 300ms;
}
div.help_icon:hover {
  background-color: var(--darkerblue);
}
div.help_icon::after {
  content: "\f129";
  color: #ffffff;
  text-align: center;
  display: inline-block;
  width: 24px;
  height: 24px;
  z-index: 1;
  text-align: center;
  font-size: 17px;
  font-weight: 100;
  line-height: 24px;
  font-family: "FontAwesome";
  position: relative;
}

.form__submitInnerWrapper:after,
.form__submitInnerWrapper:before { display: none }


.form__fieldWrapper[data-explain]:hover:after { position:absolute; background: #03b1e3;border-radius: 5px;color: #fff;content: attr(data-explain);padding: 5px 15px;position: absolute;z-index: 98;width: auto; margin-top:-70px;white-space: nowrap; left:20px; font-size:14px; text-align:left; box-shadow: rgba(128,128,128,.5) 3px 3px 3px; }
.form__fieldWrapper--hasError[data-explain]:hover:after {margin-top:-156px}

@media only screen and (max-device-width: 720px) {
 body form#frmMain .col1,
  body form#frmMain .col2 { width:100% ; margin:0px  }
}

a.lijn {text-decoration:underline !important}
.accordeon__content .formSignUpSpecs__infoList,
.accordeon__content .formSignUpSpecs__infoList li
{ text-indent:0px; list-style-type:none; margin:0px; padding:0px}
.accordeon__content ul.formSignUpSpecs__infoList li:before  { display:none }
span.formSignUpSpecs__infoTopic {padding-left:0px !important}

body .qq-upload-button {
  width: 40% }



/* prevent weird behaviour of EDGE when pre-filling fields */
#tab-2.disabled .accordeon__content,
#tab-3.disabled .accordeon__content {
    display: none !important;
}

@media (min-width: 768px) {
  body .card--blockStudy .card__statusCol  {display: block; width:100%}
}

body .pageMenu__subLink {font-size:16px !important} 
