.p-0 {padding: 0;}
.p-20 {padding: 20px;}
.py-80 {padding: 80px 0;}
.pt-80 {padding: 80px 0 0}
.m-15 {margin: 15px;}
.mt-20 {margin-top: 20px;}
.mb-20 {margin-bottom: 20px;}
.mb-100 {margin-bottom: 100px;}
.mr-10 {margin-right: 10px;}
.ml-10 {margin-left: 10px;}
.my-20 {margin: 20px 0;}

.d-block {display: block;}
.d-flex {display: flex;}
.justify-content-center {justify-content: center;}
.justify-content-between {justify-content: space-between;}
.flex-column {flex-direction: column;}

.btn {border: 0; position: relative; font-weight: 600; line-height: 24px; white-space: inherit; transition: 250ms all;}
.btn:focus, .btn:active:focus, .btn.active:focus {outline: none !important;}

.btn-twitter::after   {content: '\f099'; font-family: 'Font Awesome 5 Brands';}
.btn-facebook::after  {content: '\f39e'; font-family: 'Font Awesome 5 Brands';}
.btn-linkedin::after  {content: '\f0e1'; font-family: 'Font Awesome 5 Brands';}
.btn-youtube::after   {content: '\f167'; font-family: 'Font Awesome 5 Brands';}
.btn-instagram::after {content: '\f16d'; font-family: 'Font Awesome 5 Brands';}

.title {font-weight: 700;}
.lead {font-family: 'Heebo', sans-serif; font-size: 36px; font-weight: 700; cursor: default;}

/* HEADER */
header .logo-wrapper {margin: 20px 0 20px;}
header .logo-wrapper img {max-width: 100%; padding: 0rem; border-radius: 0px;}
.contentWrapper {margin: 0;}
#contentTextBlock {margin: 0; width: 100%; line-height: 24px;}

/* NAV */

.pressed > .dropdown-menu {display: block; padding: 0;}

.dropdown-toggle::after {
    content: '\f0d7';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    opacity: .5;
    display: inline-block;
    margin: 0 0 0 4px;
}

/* SUBMENU */
.navbar .nav-link::before {display: none;}
.navbar .dropdown-item {display: flex; justify-content: space-between; white-space: normal; padding: 1rem 1.5rem; min-width: 20rem;}
.navbar .dropdown-item::before {display: none;}
.dropdown-submenu {position: relative;}
.dropdown-submenu:hover > .dropdown-menu {display:block;}
.dropdown-submenu > .dropdown-menu {top: 0; left: 100%; margin: 0 16px;}

/* SEARCH */
.btn-search {width: 37px; border-radius: 50%;}
.btn-search::after {content: '\f002'; font-family: 'Font Awesome 5 Free';}
.btn-search.clicked::after {content: '\f00d';}

.search-container {
    height: 65px;
    margin-top: -65px;
    width: 100%;
    -webkit-transition: margin-top 250ms;
    -moz-transition: margin-top 250ms;
    -o-transition: margin-top 250ms;
    transition: margin-top 250ms;
}

.search-container input[type=text] {
    margin: 15px 0;
    width: calc(100% - 35px);
    height: 35px;
    padding: 0 15px;
    line-height: 43px;
    float: left;
    border: none;
    border-radius: 0;
    transition: background-color ease 250ms;
}

.search-container input[type=text]:focus, .search-container a {outline: none;}
.search-container input::placeholder {opacity: 1;}
.searchOnsiteSubmitWrapper {display: inline-block;}
.search-container.clicked {margin-top: 0;}

.search-container .searchOnsiteSubmitWrapper a {
    position: relative;
    height: 35px;
    width: 35px;
    padding: 0 15px;
    float: left;
    line-height: 35px;
    margin: 15px 0;
}

.search-container .searchOnsiteSubmitWrapper a:before {
    content: "\f002";
    font-family: 'Font Awesome 5 Free';
    font-size: 20px;
    font-weight: 900;
    left: 8px;
    position: absolute;
}

/* SLIDER */
.slideshow-image {
    height: 490px;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
}

.slideshow-item-overlay {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.slideshow {position: relative; min-height: 180px; touch-action: manipulation;}
.slide {display: flex;}
.slideshow-item-image {width: 100%;}
.slide > .container {position: absolute; top: 0; bottom: 0; left: 0; right: 0;}

.slideshow .owl-dots {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.slideshow .owl-dots .owl-dot::after {content: "\2B24";}

/* MAIN */
.main-wrapper {position: relative; z-index: 2; overflow: hidden;}
.main-wrapper.extra-margin {margin-top: -165px;}

.quick-menu-item {
    display: block;
    flex: 1 1 auto; 
    flex-basis: 1px;
    border-radius: 8px;
    overflow: hidden;
    text-align: center;
    height: 290px;
    text-transform: uppercase;
    font-size: 28px;
    font-weight: 700;
    font-family: 'Heebo', sans-serif;
}

.quick-menu-item:hover {text-decoration: none;}
.quick-menu-item + .quick-menu-item {margin: 10px 0 0;}

.quick-menu-item-head {padding: 42px 0 37px;}
.quick-menu-item-image {width: 100%; height: 190px;}

/* NEWS */

.rectangle {
    height: 315px;
    width: 100%;
    overflow: hidden;
    position: relative;
    transition: 250ms all;
}

.square {
    height: 270px;
    width: 100%;
    overflow: hidden;
    position: relative;
    transition: 250ms all;
}

.square-lg {
    min-height: 585px;
    width: 100%;
    overflow: hidden;
    position: relative;
    transition: 250ms all;
}

.rectangle  .albumThumbImage {width: 100%; height: 315px; background-size: cover; background-position: center;}
.square     .albumThumbImage {width: 100%; height: 270px; background-size: cover; background-position: center;}
.square-lg  .albumThumbImage {width: 100%; height: 585px; background-size: cover; background-position: center;}
.btn-quaternary .albumThumbImage {opacity: 0.1;}

.newsOS {display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 20px;}

.newsOS .date {display: none;}
.newsOS .newsTitle a {font-size: 28px; line-height: 35px; padding-bottom: 35px; display: flex;}
.newsOS .readMore a {font-size: 18px; text-transform: uppercase;}
.newsOS .newsBlokTitle a, .newsOS .newsTitle a, .newsOS .readMore a {font-weight: 700; text-decoration: none;}
.newsOS .readMore a::after {content: '\f30b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; margin-left: 10px; display: inline-block;  transition: 250ms all;}
.newsOS .readMore a:hover::after {margin-left: 20px;}
.newsOS .newsBlokTitle a {font-size: 20px; text-transform: uppercase; display: none;}

.newsOS .newsItemImage {
    position: absolute;
    top: 0;
    border: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: .1;
}

.newsOS .newsBlokTitle,
.newsOS .dateTitle,
.newsOS .readMore {position: relative; z-index: 1;}

/* CALENDAR ITEM */
.calendarOS {text-align: center; display: flex; height: 100%; width: 100%; position: absolute;}
.calendarOS .dateDay {font-size: 50px; line-height: 60px; cursor: default;}
.calendarOS .dateMonth {font-size: 30px; text-transform: uppercase; cursor: default;}
.calendarOS .dateDay, .calendarOS .dateMonth, .calendarOS .calendarItemTitle {font-weight: 700; display: block;}
.calendarOS .calendarItemTitle {text-decoration: none; font-size: 20px;}

.calendarOS .calendarItem {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.calendarOS .calendarOSContent {width: 100%;}
.albumOs {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

/* MONTH CALENDAR */
.miniMonthHeader            {display: none;}

.miniMonthWrapper           {position: absolute; width: 100%; height: 100%; z-index: 1; display: flex; align-items: center; justify-content: center;}
.miniMonthWrapper a:hover, 
.miniMonthWrapper a:focus   {text-decoration: none !important;}
.miniMonthWrapper .topCalendar .monthName {text-transform: uppercase; font-size: 28px; font-family: 'Heebo', sans-serif; width: 100%; text-align: center; font-weight: 700;}
.miniMonthWrapper .topCalendar .nextMonth, .miniMonthWrapper .topCalendar .prevMonth {cursor: pointer; font-size: 0;}
.miniMonthWrapper .topCalendar .nextMonth::after {content: '\f054'; font-family: 'Font Awesome 5 Free'; display: inline-block; font-size: 28px; font-weight: 900;}
.miniMonthWrapper .topCalendar .prevMonth::after {content: '\f053'; font-family: 'Font Awesome 5 Free'; display: inline-block; font-size: 28px; font-weight: 900;}

.miniMonthWrapper .dayWrapper .dayHeaderItemMini {margin: 8px; padding: 8px; font-size: 1.8rem;}

.miniMonthWrapper .dayWrapper a {width: 100%; text-align: center;}
.miniMonthWrapper .dayWrapper a:hover {text-decoration: none;}

.miniMonthWrapper #miniMonthWrapper {width: 100%; max-width: 42rem; margin: 0 auto; overflow: hidden;}
.miniMonthWrapper .topCalendar {display: flex; padding: 1.2rem 1.4rem; align-items: center;}
.miniMonthWrapper .headerRowMiniCalendar {display: flex; flex-wrap: wrap;}
.miniMonthWrapper .miniHeaderItem {max-width: 14.28%; flex: 0 0 14.28%; flex-direction: column; font-weight: 600; text-align: center;}
.miniMonthWrapper .miniCalendarContent {display: flex; flex-wrap: wrap;}
.miniMonthWrapper .dayWrapper {display: flex; max-width: 14.28%; flex: 0 0 14.28%; flex-direction: column; align-items: center;}

/* EXTRA */
.quote-wrapper {Padding: 100px 0 0;}
.quote-wrapper > .container {position: relative;}

.head-wrapper {
    font-size: 32px;
    font-family: 'Caveat', cursive;
    padding: 10px 0 38px;
    max-width: 700px;
    width: 100%;
    margin: 0 auto;
}

.head-wrapper::after {
    content: '';
    width: 100px;
    height: 75px;
    position: absolute;
    bottom: 0;
    left: 0;
}

/* FOOTER */
footer .footer-top {padding: 25px 0;}
footer .footer-top .quick, footer .footer-top .social {display: inline-block;}
footer .footer-top .brand {width: 100%; height: 79px;}

footer .footer-bottom {font-size: 14px; text-align: center; padding: 10px 0;}

footer .logo-stichting img {width: 150px;}

@media only screen and (max-width: 767px) {
    .navbar-nav .pressed .dropdown-menu {position: static; float: none; width: auto; margin-top: 0; border: 0; box-shadow: none;}
}

@media (min-width: 768px) {
    .d-md-flex {display: flex !important;}
    .flex-md-row {flex-direction: row;}
    .justify-content-md-center {justify-content: center;}
    .w-100 {width: 100%}

    .navbar .nav-link::before {display: inline-flex; padding-right: .5rem; font-weight: 600;}
    .navbar-default .navbar-collapse {font-family: 'Heebo', sans-serif;}
    .navbar-default .navbar-nav > li > a {font-weight: 700; font-size: 20px; text-transform: uppercase;}
    .mainMenu {float: left; display: flex; align-items: center; height: 50px;}
    .dropdown-submenu > .dropdown-menu {margin: -1px 0 0 -1px}
    .navbar-nav li:hover > ul.dropdown-menu {display: block; border-radius: 0; padding: 0;}

    .quick-menu-item + .quick-menu-item {margin: 0 0 0 30px;}
    .head-wrapper {font-size: 52px;} 
    .head-wrapper::after {width: 269px;height: 245px;}
}
 
.navbar-toggle .icon-bar { transform: rotate(0deg) translate(0px, 0px); transition: ease all .2s; }
.icon-bar:nth-child(2) { width: 16px; transition: ease all .2s; }
.navbar-toggle:hover > .icon-bar:nth-child(2) { width: 22px; transition: ease all .2s; }
.navbar-toggle:active > .icon-bar:nth-child(2) { width: 22px; transition: ease all .2s; }

.navbar-toggle:not(.collapsed) .icon-bar:nth-child(1) { transform: rotate(45deg) translate(5px, 4px); transition: ease all .2s; }
.navbar-toggle:not(.collapsed) .icon-bar:nth-child(2) { opacity: 0; transition: ease all .2s; }
.navbar-toggle:not(.collapsed) .icon-bar:nth-child(3) { transform: rotate(-45deg) translate(4px, -4px); transition: ease all .2s; }