/* Algemene stijlen */
.bodywadw {
    background: url('../images/background.jpg') no-repeat center center fixed;
    background-size: cover;
    color: #FFFFFF;
    display: grid;
    margin-left: auto;
    margin-right: auto;
    font-family: "Barlow";
    font-style: normal;
    font-weight: normal;
    font-size: 1rem;
    border: 0px;
}


/* Header */
header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    background-color: transparent;
    /* Header volledig transparant */
    border-bottom: none;
    /* Geen rand onder de header */
    position: relative;
    z-index: 1000;
    /* Zorg dat de header altijd boven de inhoud staat */
}

header .logo img {
    max-height: 60px;
    height: auto;
    display: block;
}

.logofront img {
    max-height: 200px;
    height: auto;
    align-items: center;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

footer {
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    background-color: transparent;
    /* Header volledig transparant */
    position: relative;
    color: white;
    text-align: center;
}

.reclamefrontend {
    color: white;
    padding: 10px 20px;
    background-color: #C81010;
    font-size: 20px;
    height: auto;
}

.koppenfrontend {
    color: white;
    padding: 10px 20px;
    background-color: #002633;
    font-size: 20px;
    height: auto;
}

/* general and responsive */

h1 {
    font-size: 30px;
    font-weight: bold;
}

h2 {
    font-size: 22.5px;
    font-weight: bold;
}

.menu {
    flex-direction: column;
    /* Menu verticaal maken */
    align-items: center;
}

.menu-item {
    margin: 10px 0;
}

.header {
    padding: 10px;
    text-align: center;
}

.background-transparent {
    background-color: transparent !important;
    color: #000000;
}

.background-white, .primary-color-white .background-primary {
    background-color: #fff !important;
    color: #000000;
}

.background-yellow, .primary-color-yellow .background-primary {
    background-color: #F1D529 !important;
}

.background-orange, .primary-color-orange .background-primary {
    background-color: #E4A600 !important;
}

.background-red, .primary-color-red .background-primary {
    background-color: #C81010 !important;
}

.background-pink, .primary-color-pink .background-primary {
    background-color: #DE1E5E !important;
}

.background-purple, .primary-color-purple .background-primary {
    background-color: #913fd9 !important;
}

.background-blue, .primary-color-blue .background-primary {
    background-color: #005881 !important;
}

.background-light-blue, .primary-color-light-blue .background-primary {
    background-color: #28a5df !important;
}

.background-aqua, .primary-color-aqua .background-primary {
    background-color: #00B5A6 !important;
}

.background-green, .primary-color-green .background-primary {
    background-color: #49BF4C !important;
}

.background-dark, .primary-color-dark .background-primary {
    background-color: #002633 !important;
}

.background-grey {
    background-color: #f5f5f5 !important;
}

.background-sand {
    background-color: #f9f2e2 !important;
}


/*PHP Code at https://gist.github.com/cdsaenz/d6d65294d79a0b71b95c55a4bbd47f7d*/
/*version 2: revised for responsive on mobile, dropdown menu will open on hover for now (avoids js) */
.navbar.navbar-expand-lg .dropdown .dropdown-menu .dropdown-submenu {
    /* dropdown sub menu positioning */
    margin: 0;
    left: 100%;
}

.dropdown-menu {
    padding: 0;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%);
}

.dropdown .dropdown-submenu {
    top: 0;
    left: 100%;
    margin-left: 0.125rem;
}

.navbar .dropdown-item {
    padding: 0.5rem 1.8rem;
    color: #000000;
    background-color: #FFFFFF;
}

.dropdown-item:hover,
.dropdown-item:focus {
    /* Item that could be selected now */
    background: #C81010 !important;
    color: white !important;
}

.dropdown-item.active,
.dropdown-item:active {
    /* Selected item (ie page now active) */
    background-color: #C81010;
    color: #FFFFFF;
    font-weight: 700;
}

.nav-item a {
    transition: none !important;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 14.4px;
    padding: 15px;
    text-transform: uppercase;
    border-left: 8px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
}

.nav-link.active,
.nav-link:active {
    background-color: #C81010;
    color: #FFFFFF !important;
    font-weight: 700;
    font-size: 14.4px;
    border-left: 8px solid rgba(200, 16, 16, 1);
    border-right: 8px solid rgba(200, 16, 16, 1);
}

.nav-link.hover,
.nav-link:hover {
    background-color: #C81010;
    color: #FFFFFF;
    font-size: 14.4px;
    border-left: 8px solid rgba(200, 16, 16, 1);
    border-right: 8px solid rgba(200, 16, 16, 1);
}

.navbar-nav li:hover>ul.dropdown-menu {
    /* controversial will open on hover */
    display: block;
}

.navbar-toggler-icon {
    background-color: white;


}

@media (min-width: 768px) {

    /* ONLY DESKTOP - Convert toggle to right > in deeper levels */
    .at_depth_1 .dropdown-toggle::after,
    .at_depth_2 .dropdown-toggle::after,
    .at_depth_3 .dropdown-toggle::after {
        display: inline-block;
        margin-left: 1.5em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
        left: 0;
        /* rotate right */
        -ms-transform: rotate(-90deg);
        /* IE 9 */
        -webkit-transform: rotate(-90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(-90deg);
    }
}

@media (max-width: 767px) {

    /* ONLY DESKTOP - Convert toggle to right > in deeper levels */
    .at_depth_1 .dropdown-toggle::after,
    .at_depth_2 .dropdown-toggle::after,
    .at_depth_3 .dropdown-toggle::after {
        display: inline-block;
        margin-left: 1.5em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
        left: 0;
        /* rotate right */
        -ms-transform: rotate(-90deg);
        /* IE 9 */
        -webkit-transform: rotate(-90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(-90deg);
    }
}

.margin-left-0 {
    margin-left: 0 !important;
}

.margin-left-10 {
    margin-left: 10px !important;
}

.margin-left-15 {
    margin-left: 15px !important;
}

.margin-left-20 {
    margin-left: 20px !important;
}

.margin-left-30 {
    margin-left: 30px !important;
}

.margin-left-40 {
    margin-left: 40px !important;
}

.margin-left-50 {
    margin-left: 50px !important;
}

.margin-left-60 {
    margin-left: 60px !important;
}

.margin-left-70 {
    margin-left: 70px !important;
}

.margin-left-80 {
    margin-left: 80px !important;
}

.margin-right-0 {
    margin-right: 0 !important;
}

.margin-right-10 {
    margin-right: 10px !important;
}

.margin-right-15 {
    margin-right: 15px !important;
}

.margin-right-20 {
    margin-right: 20px !important;
}

.margin-right-30 {
    margin-right: 30px !important;
}

.margin-right-40 {
    margin-right: 40px !important;
}

.margin-right-50 {
    margin-right: 50px !important;
}

.margin-right-60 {
    margin-right: 60px !important;
}

.margin-right-70 {
    margin-right: 70px !important;
}

.margin-right-80 {
    margin-right: 80px !important;
}

.margin-top-0 {
    margin-top: 0 !important;
}

.margin-top-10 {
    margin-top: 10px !important;
}

.margin-top-15 {
    margin-top: 15px !important;
}

.margin-top-20 {
    margin-top: 20px !important;
}

.margin-top-30 {
    margin-top: 30px !important;
}

.margin-top-40 {
    margin-top: 40px !important;
}

.margin-top-50 {
    margin-top: 50px !important;
}

.margin-top-60 {
    margin-top: 60px !important;
}

.margin-top-70 {
    margin-top: 70px !important;
}

.margin-top-80 {
    margin-top: 80px !important;
}

.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.margin-bottom-5 {
    margin-bottom: 5px !important;
}

.margin-bottom-10 {
    margin-bottom: 10px !important;
}

.margin-bottom-15 {
    margin-bottom: 15px !important;
}

.margin-bottom-20 {
    margin-bottom: 20px !important;
}

.margin-bottom-30 {
    margin-bottom: 30px !important;
}

.margin-bottom-40 {
    margin-bottom: 40px !important;
}

.margin-bottom-50 {
    margin-bottom: 50px !important;
}

.margin-bottom-60 {
    margin-bottom: 60px !important;
}

.margin-bottom-70 {
    margin-bottom: 70px !important;
}

.margin-bottom-80 {
    margin-bottom: 80px !important;
}

.text-size-15 {
    line-height: 1.4;
}

.text-size-15, .text-xxl-size-15 {
    font-size: 15px !important;
}

.text-size-20 {
    line-height: 1.4;
}

.text-size-20, .text-xxl-size-20 {
    font-size: 20px !important;
}

.text-size-25, .text-xxl-size-25 {
    font-size: 25px !important;
}

.text-size-30, .text-xxl-size-30 {
    font-size: 30px !important;
}

.text-size-40, .text-xxl-size-40 {
    font-size: 40px !important;
}

.text-size-50, .text-xxl-size-50 {
    font-size: 50px !important;
}

.text-size-60, .text-xxl-size-60 {
    font-size: 60px !important;
}

.text-size-70, .text-xxl-size-70 {
    font-size: 70px !important;
}

.text-size-80, .text-xxl-size-80 {
    font-size: 80px !important;
}

.text-size-90, .text-xxl-size-90 {
    font-size: 90px !important;
}

.text-size-100, .text-xxl-size-100 {
    font-size: 100px !important;
}

.text-extra-thin {
    font-weight: 100;
}

.text-thin {
    font-weight: 300;
}

b, strong, .text-strong {
    font-weight: 700;
}

.text-extra-strong {
    font-weight: 800;
}

.center {
    display: grid !important;
    text-align: center;
    align-items: center;
}

.row [class*="col-"] {
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}

.row {
    overflow: hidden;
}

.border-left {
    border-left: 8px solid rgba(0, 0, 0, 1);
}

.border-right {
    border-right: 8px solid rgba(0, 0, 0, 1);
}

.border-top {
    border-top: 8px solid rgba(0, 0, 0, 1);
}

.border-bottom {
    border-bottom: 8px solid rgba(0, 0, 0, 1);
}

.border-all {
    border-left: 8px solid rgba(0, 0, 0, 1);
    border-right: 8px solid rgba(0, 0, 0, 1);
    border-top: 8px solid rgba(0, 0, 0, 1);
    border-bottom: 8px solid rgba(0, 0, 0, 1);
}

.center-vertical {
    margin-top: 30%;
    align-items: center;
}

.p-class {
    font-weight: 300;
    font-family: "Barlow";
    font-size: 16px;
    margin-bottom: 0px;
}

h1 {
    font-family: "Barlow";
}

/* Buttons */
.button, a.button, a.button:link, a.button:visited {
    border: 0;
    color: white;
    display: inline-block;
    padding: 0.625rem 1.25rem;
    text-align: center;
}

.button-more {
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    padding: 9px 15px;
    display: inline-block;
    margin-left: 10px;
}

.button-contact {
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    padding: 9px;
    margin-top: 20px;
    margin-left: 80px;
    margin-bottom: 70px;
    margin-right: 80px;
}

.text-white, .text-white *, .primary-color-white .text-primary, .primary-color-white .text-primary * {
  color: #fff !important;
}
.text-yellow, .text-yellow *, .primary-color-yellow .text-primary, .primary-color-yellow .text-primary * {
  color: #F1D529 !important;
}
.text-orange, .text-orange *, .primary-color-orange .text-primary, .primary-color-orange .text-primary * {
  color: #E4A600 !important;
}
.text-red, .text-red *, .primary-color-red .text-primary, .primary-color-red .text-primary * {
  color: #C81010 !important;
}
.text-pink, .text-pink *, .primary-color-pink .text-primary, .primary-color-pink .text-primary * {
  color: #DE1E5E !important;
}
.text-purple, .text-purple *, .primary-color-purple .text-primary, .primary-color-purple .text-primary * {
  color: #913fd9 !important;
}
.text-blue, .text-blue *, .primary-color-blue .text-primary, .primary-color-blue .text-primary * {
  color: #005881 !important;
}
.text-light-blue, .text-light-blue *, .primary-color-light-blue .text-primary, .primary-color-light-blue .text-primary * {
  color: #28a5df !important;
}
.text-aqua, .text-aqua *, .primary-color-aqua .text-primary, .primary-color-aqua .text-primary * {
  color: #00B5A6 !important;
}
.text-green, .text-green *, .primary-color-green .text-primary, .primary-color-green .text-primary * {
  color: #49BF4C !important;
}
.text-grey, .text-green *, .primary-color-green .text-primary, .primary-color-green .text-primary * {
  color: #6b6e6b !important;
}
.text-dark, .text-dark *, .primary-color-dark .text-primary, .primary-color-dark .text-primary * {
  color: #002633 !important;
} 

.su-image-carousel-slides-style-default .su-image-carousel-item-content img {
    padding: 3px;
    border: 0px solid #ccc!important;
    background: transparent!important;
}

.deelnemerlinks {
    text-decoration: none;
    transition: none !important;
    color: #000000;
    font-family: Barlow;
    font-weight: 400;
}

.wadwdeelnemers {
    max-width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.wadwdeelnemerscaption {
    display: table-caption;
    padding-top: 10px;
    padding-bottom: 15px;
    background-color: #C81010;
    caption-side: bottom;
    font-size: clamp(1.5rem, calc(6vw + 1rem), 2rem);
}

.figure {
    display: table;
    margin: 0;
}

.figure img {
    max-width: 100%;
}

.figure-fotos {
    margin: 0;
}

.figure-fotos frame {
    max-width: 100%;
}

.figure-scholen {
    margin: 0;
    font-family: Barlow;
}

.figure-scholen iframe img {
    max-width: 100%;
}

.wadwdeelnemersmarginleft {
    font-family: Barlow;
    margin-left: min(5px, 4%);
    font-weight: 400;
}

#mail a, #link a {
    text-decoration: none;
    color: #FFF;
}

.wdawbutton {
    text-decoration: none;
}

.fotocard {
    max-width: 300px;
}

.float-left {
    float: left;
}

.rounded-square {
    border-radius: 10px;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%);
    margin: 10px;
    padding: 10px;
    text-align: center;
}

.upfp_row {
    width: 100%!important;
}

#upfp_container {
    width: 100%!important;
}