/* cmsms stylesheet: buddy013_v1.0.1-vars modified: maandag 26 oktober 2026 09:56:25 */
:root {
  font-size: 16px;
}

@charset "utf-8";
/* ==================================================
  Main vars CSS Document - CMS Template Buddy
  Template No.: 013
  Version 1.0.1 / for CMSMS 2.2.10+
  
  www.cmstemplatebuddy.com
================================================== */
:root {--color1-hex-color: #ffa726;--color1-rgb-color: 255, 167, 38;--color2-hex-color: #469fd5;--color2-rgb-color: 70, 159, 213;--pink-hex-color:   #e3004f;--orange-hex-color: #ffa726;--red-hex-color:    #fa2f20;--blue-hex-color:   #469fd5;--lgreen-hex-color: #2ffb1e;--dgreen-hex-color: #4db6ac;--dgreen-rgb-color: 77, 182, 172;--lgrey-hex-color:  #f6f6f6;--dgrey-hex-color:  #8a8a8a;--lgreen-bg-color:     #edf7f6;--lgreen-bg-rgb-color: 237, 247, 246;--lorange-bg-color:    #fff6e8;--lorange-bg-rgb-color: 255, 246, 232;--lgrey-bg-color:      #f6f6f6;--gradient--green-to-transparent: -180deg, #469fd5 25%, #469fd590 50%, #469fd520 65%, #469fd500 85%;--gradient--white-to-transparent: 0deg, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, .6) 50%, rgba(255, 255, 255, .3) 65%, rgba(255, 255, 255, 0) 85%;--gradient--transparent-to-gray: 0deg, rgba(242,242,242,0) 40%, rgba(242,242,242,.5) 70%, rgba(242,242,242,1) 100%;--gradient--transparent-to-white: 0deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.5) 70%, rgba(255,255,255,1) 100%;--gradient--transparent-to-black: 0deg, rgba(255,255,255,.4) 0%, rgba(255,255,255,.4) 30%, rgba(0,0,0,.4) 50%;}
/* cmsms stylesheet: buddy013_v1.0.1-main modified: zondag 8 november 2026 09:18:47 */
@charset "utf-8";
/* ==================================================
  Main CSS Document - CMS Template Buddy
  Template No.: 013
  Version 1.0.1 / for CMSMS 2.2.10+ 
  www.cmstemplatebuddy.com
  See our Copyrights page
================================================== */
/* DEFINE MAIN COLOR HERE *//* Common================================================== */span.accesskey {text-decoration: none;}.accessibility {position: absolute;top: -999em;left: -999em;}dfn {position: absolute;left: -1000px;top: -1000px;width: 0;height: 0;overflow: hidden;display: inline;}dl, dt, dd, ol, ul {margin: 0;padding: 0 0 0 1rem;}ol li, ul:not(.awesome) li {margin: 0;padding: 0;}::selection {background: var(--color2-hex-color);color: #FFF;text-shadow: none;}::-moz-selection {background: var(--color2-hex-color); /* Firefox */color: #FFF;text-shadow: none;}::-webkit-selection {background: var(--color2-hex-color); /* Safari */color: #FFF;text-shadow: none;}:active,:focus { outline: none !important; }/* Typography================================================== */body {font-size: 1rem;font-weight: 400;line-height: 160%;font-family: 'Source Sans 3', Arial, Helvetica, sans-serif;-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */-webkit-text-size-adjust: 100%;text-size-adjust: 100%;color: #333;}.home-title {margin-bottom: 60px;text-align: center;}.home-title:after {display: block;height: 2px;width: 50px;content: '';margin: 30px auto 0;background-color: var(--color2-hex-color);}p,pre,ul,ol,dl,dd,blockquote,address,table,fieldset,form { margin-bottom: 30px; }small { font-family: 'Source Sans 3', sans-serif; }p {overflow-wrap: break-word;word-wrap: break-word;}a {text-decoration: none !important;color: var(--color2-hex-color);}a:hover { color: var(--color2-hex-color); }a img { border: none; }img { max-width: 100%; }iframe { border: none !important; }.error_message { color: red; }.textCenter { text-align: center; }.noScroll { overflow: hidden; }.subtitle {display: block;margin: 16px 0 6px 0;text-transform: initial;font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;font-style: italic;font-weight: 400;color: #8a8a8a;letter-spacing: 0;line-height: 120%;}.overflow-x-auto {overflow-x: auto !important;}/* Layout================================================== */.wrapper {position: relative;float: none;width: 100%;margin: 0;background-color: #FFF;}header {width: 100%;z-index: 1000;height: 60px;position: fixed;top: 0;left: 0;background-color: tranparent;border-bottom: 1px solid rgba(0,0,0,.1);-webkit-transition: all .3s ease;-ms-transition: all 0.3s ease;-o-transition: all .3s ease;transition: all .3s ease;}header .container-fluid { padding: 0 15px; }/* .content-wrapper { padding: 40px 0; } */section.content { padding: 30px 0; }section.grey { background-color: #f6f6f6; }/* Header smaller (page scroll) */header.header-smaller {height: 60px;box-shadow: 0 0 10px rgba(0,0,0,0.12);background-color: #FFF;}.header-smaller .logo {top: 20px;/* background-color: rgba(255,255,255, 1); */}.header-smaller .logo a img {height: 60px;}.header-smaller .logo .logo-stras { padding: .3rem;}.header-smaller .main-title {margin-top: 60px;}.header-smaller .search-trigger {height: 100px;}.header-smaller .search-trigger i {top: 37px;}.header-smaller .search-input form {height: 60px;}.home-heading {padding-bottom: 20px;margin-bottom: 40px;position: relative;}.home-heading:after {display: block;height: 2px;width: 50px;content: '';bottom: 0px;position: absolute;margin-left: -25px;left: 50%;background-color: var(--color2-hex-color);}.home-heading span {display: block;text-align: center;font-weight: 300;color: #777;font-size: 1.4rem;margin-bottom: 20px;}.main-menu {margin-right: 50px;opacity: 1;}.main-title {position: relative;padding: 25px 0;background-color: #F5F5F5;border-bottom: 1px solid #EEE;margin-top: 60px;-webkit-transition: all .3s ease;-ms-transition: all 0.3s;-o-transition: all .3s ease;transition: all .3s ease;}/*.main-title .topGradient {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,.2)}*/.main-title .main-subtitle {display: block;margin-top: 10px;font-weight: 700;color: rgb(68, 68, 68)!important;font-size: 1.3rem;font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;text-shadow: 0 0 5px #fff;}.main-title.parallax {background-repeat: no-repeat;background-position: 50% 0;background-size: cover;padding: 40px 0;transition: 0s linear;transition-property: background-position;}@media (min-width: 768px) {.main-title .main-subtitle {font-size: 1.4rem;}.main-title.parallax {padding: 120px 0;}}.main-title--dark h1,.main-title--dark span,.main-title--dark .main-subtitle,.main-title--dark .breadcrumbs,.main-title--dark .breadcrumb,.dark, .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6, .dark p,.dark .video-caption h2, .dark .video-caption h3, .dark .scroll-down-arrow, .scroll-down-arrow.dark {color: rgba(255,255,255,0.9);}.dark .home-title:after {background-color: rgba(255,255,255,.9);}.main-title.margin-smaller {margin-top: 60px;}/* Footer */footer {background-color: #ECECEC;line-height: 1.8;font-size: 0.9rem;}footer a {color: #bdbdbd;border-bottom: 1px dotted #666;}footer a:hover {color: #eee;border-bottom: 1px dotted #eee;}.footer-big {padding: 40px 0;}.footer-small {border-top: 4px solid rgba(0,0,0,0.2);padding: 40px 0;background-color: #DCDCDC;}footer.dark {background-color: #333;color: #CCC;}footer.dark .footer-small {border-top-color: rgba(0,0,0,0.2);background-color: rgba(0,0,0,0.2);color: rgba(255,255,255,0.3);text-shadow: 1px 1px 1px rgba(0,0,0,0.2);}footer.light {background-color: var(--lgreen-bg-color);color: #333;}footer.light .footer-small {background-color: #fff;text-shadow: none;border-top-color: #42b0db;}footer.light a,footer.light a:hover,footer.light .footer-small p a {color: #666 !important;}.feater-icon {width: 70px;height: 70px;border-radius: 50%;-moz-border-radius: 50%;-webkit-border-radius: 50%;margin-bottom: 25px;}.feature-icon i {font-size: 2.8rem;color: var(--color2-hex-color);}.feature-content, .feature-content p {line-height: 1.8;}.footer__contact-item {display: -webkit-box;display: -ms-flexbox;display: flex;height: 100%;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-flow: column;flex-flow: column;text-align: center;gap: 15px;}.footer__contact-item a,.footer__contact-item span {font-size: 1.1rem;}.footer__contact-item .icon {display: flex;justify-content: center;align-items: end;min-height: 42px;}.footer__contact-nav ul {font-size: 1.1rem;float: right;padding: 2rem 0 0;}/* Logo */.logo {position: relative;display: block;float: left;top: 1.5rem;}.logo img {display: inline-block;max-width: 100%;height: 60px;-webkit-transition: all .3s ease;-ms-transition: all 0.3s;-o-transition: all .3s ease;/* transition: all .3s ease; */transition: width .5s ease, height .5s ease;}.logo .logo-asvz { margin-right: 0; }.logo .logo-stras { padding: .5rem; }/* Breadcrumbs */.breadcrumbs	{display: inline-block;margin: -19px 0 0 0 !important;background-color: transparent !important;padding: 0 !important;font-size: 0.8rem;}.breadcrumb {margin-bottom: 0;background-color: transparent;padding: 8px 10px;display: inline-block;}.breadcrumb-text {font-size: 0.8rem;margin-left: 6px;}.home-parallax {background-repeat: no-repeat;background-position: 50% 0;background-size: cover;min-height: 500px;position: relative;text-align: center;display: flex;align-items: center;}.home-parallax h3 {font-size: 2rem;}/* Search */.search-wrapper {position: absolute;top: 0;right: 70px;}.search-trigger {position: relative;display: block;width: 70px;height: 60px;color: #333;z-index: 10;text-align: center;-webkit-transition: all .3s ease;-ms-transition: all 0.3s ease;-o-transition: all .3s ease;transition: all .3s ease;}.search-trigger:hover {color: #666;}.search-trigger i {position: absolute;top: 37%;right: 40%;text-shadow: none;}.search-input form {opacity: 0;position: fixed;top: 0;left: 0;width: 100%;height: 60px;padding: 0 15px;margin: 0;z-index: -2;-webkit-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}.search-input form input {box-shadow: none !important;pointer-events: none;border-radius: 0;border: 0;outline: 0 !important;font-size: 1.5rem;padding: 10px 80px 10px 0;width: 100%;height: 100%;background-color: transparent;color: #333;font-weight: 700;margin-top: 0 !important;font-family: 'Roboto Slab', sans-serif;letter-spacing: 1px;}.search-trigger i.fa-times,.show-search i.fa-search,.show-search .logo,.show-search .main-menu,.show-search .mobile-nav-trigger { opacity: 0; }.show-search i.fa-times,.show-search .search-input form { opacity: 1; }.show-search .search-input form { z-index: 9; }.show-search i.fa-times { z-index: 11; }.show-search .search-input form input {pointer-events: auto;}.show-search .search-wrapper {right: 0;}/* To top link, shows on scroll */.totoplink a	{display: none;z-index: 999;position: fixed;right: 20px;bottom: 20px;-moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;width: 40px;height: 40px;line-height: 40px;text-align: center;background-color: rgba(0,0,0,.3);-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-ms-transition: all 0.2s;-o-transition: all 0.2s;transition: all 0.2s;}.totoplink i {font-size: 1.3rem;color: white;}.totoplink a:hover	{background-color: var(--color2-hex-color);}/** Swiper 4.5.0* Most modern mobile touch slider and framework with hardware accelerated transitions* http://www.idangero.us/swiper/** Copyright 2014-2019 Vladimir Kharlampidi** Released under the MIT License** Released on: February 22, 2019================================================== */.slider {position: relative;/* margin-top: 60px; */-webkit-transition: all .3s ease;-ms-transition: all 0.3s;-o-transition: all .3s ease;transition: all .3s ease;}.slider.margin-smaller {/* margin-top: 60px; */}.slider .error_message {/* margin-top: 150px; */text-align: center;}.swiper-container {width: 100%;height: 410px;overflow: hidden;/* margin-top: 100px; */}.swiper-slide::after {content: "";display: block;position: absolute;right: 0;top: 0;width: 100%;height: 100%;}/*.swiper-slide::after {-webkit-transition: all .2s linear;-o-transition: all .2s linear;transition: all .2s linear;background: linear-gradient(var(--gradient--transparent-to-black)) !important;background: -moz-linear-gradient(var(--gradient--transparent-to-black)) !important;background: -webkit-linear-gradient(var(--gradient--transparent-to-black)) !important;}*/@media (min-width: 1200px) {.content {position: relative;z-index: 0;}.content:before, .content:after {content: "";display: block;position: absolute;top: -60px;height: 100%;/* max-height: 600px; */width: 50%;background-repeat: repeat-y;z-index: -1;}.content:before {background-image: url(/uploads/Buddy013/images/cubes-left.svg);background-position: top left;left: 0;}.content:after {background-image: url(/uploads/Buddy013/images/cubes-right.svg);background-position: top right;right: 0;}}.slider-fullscreen .slider {height: 100vh;margin-top: 0;}.slider-fullscreen .video-container video {margin-top: 0;}.slider-fullscreen .swiper-container {height: 100%;}.slider-fullscreen header {background-color: transparent;}.slider-fullscreen header.header-smaller {background-color: #FFF;}.slider-fullscreen header.dark {border-bottom: 1px solid rgba(255,255,255,.25);}.slider-fullscreen header.dark:not(.header-smaller) .search-trigger {border-left: 1px solid rgba(255,255,255,.25);color: white;}.slider-fullscreen header.dark:not(.header-smaller) .logo {border-right: 1px solid rgba(255,255,255,.25);}.slider-fullscreen header.dark:not(.header-smaller) .search-input form input,.slider-fullscreen header.dark:not(.header-smaller) .search-input form input::placeholder {color: white;}.swiper-slide {text-align: center;font-size: 1.5rem;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;position: relative;margin: 0;background: #f2f2f2;background-position-x: center;background-position-y: 0 !important;background-repeat: no-repeat;background-size: cover;overflow: hidden;z-index: 9;/*  filter: brightness(70%); */}.slider-caption,.video-caption {font-weight: 300;line-height: 1.4;opacity: 1;}.slider-caption h3,.video-caption h3 {display: none;-webkit-animation-delay: .5s;-moz-animation-delay: .5s;animation-delay: .5s;text-shadow: 0 0 15px rgba(0,0,0,.5);}.slider-caption h3 {font-weight: 700;font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;z-index: 1;position: relative;color: #eee;-webkit-text-stroke-width: 1px;-webkit-text-stroke-color: #333;text-shadow: 0px 0px 20px #000;letter-spacing: 2px;}.swiper-next, .swiper-prev {position: absolute;top: 50%;left: 0;cursor: pointer;z-index: 10;margin-top: -26px;background-color: rgba(0,0,0,0.15);width: 52px;height: 52px;border: 0;border-radius: 0 3px 3px 0;-webkit-transition: background-color .25s ease-in-out;-o-transition: background-color .25s ease-in-out;transition: background-color .25s ease-in-out;}.swiper-next {left: auto;right: 0;border-radius: 3px 0 0 3px;}.swiper-next:hover, .swiper-prev:hover {background-color: rgba(0,0,0,0.45);}.swiper-next i, .swiper-prev i {line-height: 50px;width: 34px;height: 52px;color: #DDD;color: rgba(255,255,255,0.6);text-shadow: 1px 1px 1px rgba(0,0,0,0.1);font-size: 2.1rem;text-align: center;margin-left: 7px;-webkit-transition: color .25s ease-in-out;-o-transition: color .25s ease-in-out;transition: color .25s ease-in-out;}.swiper-next:hover i, .swiper-prev:hover i {color: #F6F6F6;color: rgba(255,255,255,.95);}.swiper-next i {margin-left: 12px;}.btn-slider {display: none;text-transform: uppercase;font-size: 0.9rem;font-weight: 500;padding: 10px 20px;border-radius: 2px;border: none;opacity: 1;box-shadow: inset 0 -2px 0 rgba(0,0,0,0.4);background-color: var(--color2-hex-color);color: white;-webkit-transition: opacity .15s ease-in-out;-o-transition: opacity .15s ease-in-out;transition: opacity .15s ease-in-out;-webkit-animation-delay: .7s;-moz-animation-delay: .7s;animation-delay: .7s;}.btn-slider:hover,.btn-slider:focus {color: white;opacity: 0.4;}.btn-slider:active {box-shadow: inset 0 2px 0 rgba(0,0,0,0.4);}/* Portfolio detail swiper gallery */.swiper-detail-container {width: 100%;height: 300px;margin: 0 auto;position: relative;overflow: hidden;list-style: none;padding: 0;z-index: 1;}.gallery-top .swiper-slide {background-size: cover;background-position: center;}.gallery-top {height: 300px;width: 100%;}.gallery-thumbs {height: 100px;box-sizing: border-box;padding: 10px 0;}.gallery-thumbs .swiper-slide {width: 25%;height: 100%;opacity: 0.4;}.gallery-thumbs .swiper-slide-thumb-active {opacity: 1;}/** jQuery Superfish Menu Plugin* Copyright (c) 2013 Joel Birch** Dual licensed under the MIT and GPL licenses:*  http://www.opensource.org/licenses/mit-license.php*  http://www.gnu.org/licenses/gpl.html================================================== *//*** ESSENTIAL STYLES ***/.sf-menu, .sf-menu * {margin: 0;padding: 0;list-style: none;}.sf-menu li {position: relative;}.sf-menu ul {position: absolute;display: none;top: 100%;left: 0;width: 170px;background-color: #FFF;box-shadow: 0px 13px 42px 11px rgba(0, 0, 0, 0.05);border-top: 4px solid var(--color2-hex-color);height: auto;z-index: 199;margin: 0;}.sf-menu > li {float: left;}.sf-menu li:hover > ul,.sf-menu li.sfHover > ul {display: block;}.sf-menu a {display: block;position: relative;}.sf-menu ul ul {top: -4px !important;left: 100%;}/*** Menu link ***/.sf-menu a {padding: 10px 15px;text-decoration: none;zoom: 1; /* IE7 */color: #666;font-size: 0.8rem;letter-spacing: 0;font-weight: 600;text-transform: uppercase;font-family: 'Source Sans 3', sans-serif;-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-ms-transition: all 0.2s;-o-transition: all 0.2s;transition: all 0.2s;text-shadow: none;}.sf-menu a.menuactive {color: var(--color2-hex-color) !important;font-weight: bold;}.sf-menu a:hover,.sf-menu .sfHover > a {color: var(--color2-hex-color) !important;}.sf-menu li li a:not([href]):not([tabindex]),.sf-menu li li li a:not([href]):not([tabindex]) {color: #666;}/*** first level ***/.sf-menu > li > a {font-size: 1rem;font-weight: bold;font-family: 'Roboto Slab', sans-serif;letter-spacing: 1px;text-transform: uppercase;padding: 35px 16px;line-height: 22px;color: #444;}.header-smaller .sf-menu > li > a {padding: 35px 16px;color: #444;}#page-home .sf-menu > li > a {color: #fff;}#page-home .header-smaller .sf-menu > li > a {color: #444;}/*#page-home header:not(.header-smaller) {background: linear-gradient(var(--gradient--transparent-to-gray)) !important;background: -moz-linear-gradient(var(--gradient--transparent-to-gray)) !important;background: -webkit-linear-gradient(var(--gradient--transparent-to-gray)) !important;}*/.header-smaller .sf-menu > li > a:hover {color: var(--color2-hex-color);}.header-smaller.dark .sf-menu > li > a {color: #444;}/*** dark background ***/.dark .sf-menu > li > a {color: white;}.dark .sf-menu > li > a:hover {color: var(--color2-hex-color);}.sf-menu ul li {background-color: rgba(255,255,255,.97);}.sf-menu ul li:first-child {border-top: none;}.sf-menu ul ul li {background-color: rgba(255,255,255,.97);}.sf-menu li:hover,.sf-menu li.sfHover {/* only transition out, not in */-webkit-transition: none;transition: none;}.sf-menu li.sectionheader > a,.sf-menu .sectionheader {cursor: default;}.sf-menu li.separator hr {border-top: 1px solid #777;}/*** arrows (for all except IE7) **/.sf-arrows .sf-with-ul {padding-right: 2.2em !important;*padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */}/* styling for both css and generated arrows */.sf-arrows .sf-with-ul:after {content: "\f107";position: absolute;top: 50%;right: 1em;margin-top: -3px;width: 32px;font-size: 0.9rem;display: inline-block;text-align: right;font: normal 14px/.5 FontAwesome;}/* styling for right-facing arrows */.sf-arrows ul .sf-with-ul:after {content: "\f105" !important;}.sf-arrows > li > .sf-with-ul:focus:after,.sf-arrows > li:hover > .sf-with-ul:after,.sf-arrows > .sfHover > .sf-with-ul:after {border-top-color: #333; /* IE8 fallback colour */}.sf-arrows ul li > .sf-with-ul:focus:after,.sf-arrows ul li:hover > .sf-with-ul:after,.sf-arrows ul .sfHover > .sf-with-ul:after {border-left-color: #333;}@media screen and (max-width: 1280px) {.sf-menu > li:last-child ul ul {left: -100%;}}/*** Mobile navigation ***/section.mobile-navigation {position: fixed;padding: 0;top: 60px;bottom: 0;overflow-y: auto;z-index: 10000;width: 100%;display: none;}.mobile-nav {display: block;list-style: none;margin: 0;padding: 50px 6px;background-color: #6c757d;width: 100%;}.mobile-nav li {margin: 0;padding: 0;float: none;}.mobile-nav li a {width: 100%;font-size: 0.9rem;font-weight: 600;text-transform: uppercase;font-family: 'Source Sans 3', sans-serif;padding: 7px 10px;display: block;color: #fff;}.mobile-nav li a.menuactive {color: var(--color2-hex-color);}.mobile-nav li a:hover {text-decoration: none;background-color: #2c3e50;}.mobile-nav li a .sectionheader {color: #aaa;}/* second level */.mobile-nav ul {list-style: none;margin: 0;padding: 0;}.mobile-nav ul li a {padding-left: 30px;}/* third level */.mobile-nav ul ul {list-style: none;}.mobile-nav ul ul li a {padding-left: 60px;}/*** Footer navigation ***/.footerNav {list-style: none;padding-left: 0;}.footerNav a {color: #aaa;border: none;}.footerNav a:hover {color: #eee;border: none;}.footerNav .activeparent,.footerNav .currentpage {color: white !important;}.footerNav .sectionheader {color: #808080;}.footerNav li .fa {margin-right: 10px;}/*** Google map fix ***/[id^="cggm_map_"] {width: 100% !important;margin: 0;}[id^="cggm_map_"] img {max-width: none;}/*** Form ***/.form-group {margin: 1rem 0;}.form-group label {font-family: 'Roboto Slab', sans-serif;font-size: 0.8rem;font-weight: 700;text-transform: uppercase;letter-spacing: 1px;}/*** Bootstrap overwrites ***/.btn {border-radius: 0.125rem;text-transform: uppercase;font-size: 0.9rem;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, opacity 0.15s ease-in-out;}.btn-default {color: var(--color2-hex-color);}.btn-light {background-color: #DCDCDC;}.btn-primary, .btn-primary:hover, .btn-primary:not(:disabled):not(.disabled):active {background-color: var(--color2-hex-color);border-color: var(--color2-hex-color);}.btn-primary:hover {opacity: 0.85;}.form-group .btn + .btn {margin-left: 8px;}/*** CG Calendar ***/.fc table {margin: 0;}.fc-event {border-radius: 2px !important;cursor: pointer;}.fc-state-default.fc-corner-left {border-top-left-radius: 2px !important;border-bottom-left-radius: 2px !important;}.fc-state-default.fc-corner-right {border-top-right-radius: 2px !important;border-bottom-right-radius: 2px !important;}.fc-state-default {background-color: #f5f5f5;background-image: none !important;background-repeat: no-repeat !important;}.fc-state-active, .fc-state-down {background-color: #6c757d !important;border-color: rgba(0,0,0,.5) #6c757d #6c757d #6c757d !important;color: white !important;text-shadow: none !important;box-shadow: inset 0 1px 0px rgba(0,0,0,.5) !important;}.fc-state-disabled {cursor: default !important;}.fc-basic-view .fc-body .fc-row {min-height: 8rem !important;}.fc-basic-view .fc-day-number {font-size: 1.5rem;}.calendar-event {background-color: white;margin-bottom: 30px;padding: 20px;border-radius: 1px;display: flex;}.calendar-event.detail {background-color: rgba(255,255,255,.8);}.calendar-list-nav {margin-bottom: 20px;}.calendar-list .calendar-event {box-shadow: inset 0 -2px 0 rgba(0,0,0,.1);}.calendar-details {margin: 20px 0;}.calendar-details-title,.calendar-summary-title {font-weight: 600;}.calendar-cur {margin: 0 10px;}.calendar-date-from {font-size: 0.9rem;font-family: 'Crete Round', serif;color: #aaa;}.calendar-event.detail .calendar-date-from {color: #888;}.calendar-event h1 a,.calendar-event h2 a,.calendar-event h3 a,.calendar-event h4 a,.calendar-event h5 a,.calendar-event h6 a {color: #333;}.calendar-event h1 a:hover,.calendar-event h2 a:hover,.calendar-event h3 a:hover,.calendar-event h4 a:hover,.calendar-event h5 a:hover,.calendar-event h6 a:hover {color: var(--color2-hex-color);}.calendar-fields {max-width: 200px;width: 100%;margin-right: 20px;}.calendar-fields--detail {max-width: 360px;}.calendar-with-image .fc h1,.calendar-with-image .fc h2,.calendar-with-image .fc h3,.calendar-with-image .fc h4,.calendar-with-image .fc h5,.calendar-with-image .fc h6,.calendar-with-image .fc th,.calendar-with-image .fc td,.calendar-with-image .fc-day-number {color: white !important;}.calendar-with-image .fc th,.calendar-with-image .fc td {background-color: rgba(255,255,255,.06);}.calendar-with-image .fc-state-highlight .fc-day-number {color: black !important;}/*** Mobile navigation trigger ***/.mobile-nav-trigger {position: absolute;top: 0;right: 0;width: 70px;height: 60px;text-indent: -9999px;border-left: rgba(0,0,0,.1) solid 1px;overflow: hidden;}.mobile-nav-trigger span {position: relative;display: block;}.mobile-nav-trigger span:before {content: "";position: absolute;left: 16px;top: 24px;width: 20px;height: 3px;background: #505050;box-shadow: 0 6px 0 0 #505050, 0 12px 0 0 #505050;}.mobile-nav-trigger.active {background-color: #6c757d;border-right: none;height: 60px;}.mobile-nav-trigger.active span:before {background: #fff;box-shadow: 0 6px 0 0 #fff, 0 12px 0 0 #fff;}.dark:not(.header-smaller) .mobile-nav-trigger {border-left: rgba(255,255,255,.25) solid 1px;}.dark:not(.header-smaller) .mobile-nav-trigger span:before {background: #fff;box-shadow: 0 6px 0 0 #fff, 0 12px 0 0 #fff;}.grid-list {display: grid;grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));grid-gap: 20px;margin: 0;max-width: 90%;margin: 0 auto 20px;}.grid-list__item {position: relative;z-index: 1;}/* FAQs - Toggle - Tabs================================================== *//* FAQs */.faqs .toggle {border-bottom: 1px solid #EEE;padding-bottom: 12px;margin-bottom: 12px;}.faqs .toggle .toggle__tab,.faqs .toggle .toggle__tab--active,.faqs .toggle .toggle__content {font-size: 0.9rem;}.faqs .toggle .toggle__tab i {top: 1px;font-size: 0.9rem;}.faqs .toggle .toggle__content {padding-bottom: 4px;}/* Toggle */.toggle {display: block;position: relative;margin: 0 0 20px 0;}.toggle .toggle__tab,.toggle .toggle__tab--active {display: block;position: relative;line-height: 24px;padding: 0 0 0 24px;margin: 0;font-size: 1rem;font-weight: 700;color: #444;cursor: pointer;}.toggle .toggle__tab i {position: absolute;top: 0;left: 0;width: 16px;text-align: center;font-size: 1rem;line-height: 24px;}.toggle .toggle__tab {font-weight: 600;}.toggle .toggle__tab.no-icon {padding: 0;}.toggle .toggle__tab i.toggle--open,.toggle .toggle__tab--active i.toggle--closed {display: none;}.toggle .toggle__tab--active i.toggle--open {display: block;}.toggle .toggle__content {display: block;position: relative;padding: 10px 0 0 24px;}.toggle .toggle__content p {margin-bottom: 10px;}/* Tabs */.tabs-filter {position: relative;margin: 0 0 20px 0;list-style: none;border: 1px solid rgba(0,0,0,0.07);border-radius: 4px;display: inline-flex;align-items: center;justify-content: flex-start;}.tabs-filter li a {display: block;position: relative;padding: 12px 18px;font-size: 0.8rem;line-height: 15px;color: #666;border-left: 1px solid rgba(0,0,0,0.08);}.tabs-filter li:first-child a {border-left: none;border-radius: 4px 0 0 4px;}.tabs-filter li:last-child a {border-radius: 0 4px 4px 0;}.tabs-filter li.active a {color: #FFF !important;background-color: var(--color2-hex-color);margin: -1px 0;padding: 13px 18px;font-weight: 600;}.tabs-filter li a:hover {color: var(--color2-hex-color);}/*** 404 page not found================================================== */.error-404 {display: block;font-size: 15rem;font-weight: 700;color: #DDD;line-height: 1;letter-spacing: 4px;}/*** Captcha================================================== */.captchapict {margin: 10px 0;}.cgbf_input_captcha {display: inline-block;width: 200px;padding: .375rem .75rem;font-size: 1rem;line-height: 1.5;color: #495057;background-color: #fff;background-clip: padding-box;border: 1px solid #ced4da;border-radius: .25rem;transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;margin: 10px 0;}.cgbf_input_captcha:focus {color: #495057;background-color: #fff;border-color: #80bdff;outline: 0;box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);}/*** Video home page================================================== */.video-wrapper {position: relative;overflow:hidden;height: 100vh;}.video-container video {position: absolute;top: 50%;left: 50%;min-width: 100%;min-height: 100%;width: auto;height: auto;z-index: 1;transform: translateX(-50%) translateY(-50%);margin-top: 60px;filter: brightness(70%);}.video-caption {display: flex;flex-direction: column;min-height:calc(100vh + 50px);justify-content:center;align-items:center;text-align:center;z-index: 2;position: relative;width: 80%;margin-left: auto;margin-right: auto;}.video-caption h2 {font-size: 3.4rem;line-height: 120%;animation-delay: .3s;display: none;}.video-caption h3 {animation-delay: .5s;display: none;margin: 0 auto 30px;}.scroll-down-arrow {width: 32px;height: 60px;font-size: 2rem;text-align: center;color: #222;display: inline-block;padding-top: 30px;margin-top: 50px;}/*** Media Queries================================================== *//* Extra small devices (portrait phones, less than 576px)No media query for `xs` since this is the default in Bootstrap  *//* sm : Small devices (landscape phones, 576px and up) */@media (min-width: 576px) {.video-caption {width: 70%;}}/* md : Medium devices (tablets, 768px and up)*/@media (min-width: 768px) {.grid-list {grid-gap: 0;max-width: 1200px;grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));margin: 0 auto 40px;}/*.content-wrapper {padding: 80px 0;} */}/* lg : Large devices (desktops, 992px and up) */@media (min-width: 992px) {header .container-fluid {padding: 0 30px;}.search-wrapper {right: 0;}.search-trigger,header,.logo a img,.search-input form,.mobile-nav-trigger {height: 90px;}.slider {margin-top: 0;}.main-title {margin-top: 100px;}.main-title {padding: 55px 0;}.search-trigger i {top: 37px;}section.content {padding: 60px 0;}.footer-big {padding: 80px 0;}.video-container video {margin-top: 100px;}}/* xl : Extra large devices (large desktops, 1200px and up) */@media (min-width: 1200px) {.error-404 {font-size: 18.8rem;}}/* Retina CSS */@mediaonly screen and (-webkit-min-device-pixel-ratio: 2),only screen and (   min--moz-device-pixel-ratio: 2),only screen and (     -o-min-device-pixel-ratio: 2/1),only screen and (        min-device-pixel-ratio: 2),only screen and (                min-resolution: 192dpi),only screen and (                min-resolution: 2dppx) {.logo a.standard-logo { display: none; }.logo a.retina-logo { display: block; }}

/* Smoother variant of Animate.css's fadeInUp for the homepage parallax
   title/text: shorter travel distance, eased-out timing, and a slight
   stagger between title and text instead of both animating at once. */
@keyframes smoothFadeInUp {
  from { opacity: 0; transform: translate3d(0, 24px, 0); }
  to { opacity: 1; transform: none; }
}
.smoothFadeInUp {
  animation-name: smoothFadeInUp;
  animation-duration: 1.1s;
  animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  animation-fill-mode: both;
}
.smoothFadeInUp-delay {
  animation-delay: .15s;
}

/* Subtle dark tint over the homepage slider photos, so the caption text
   and the transparent top menu (which overlaps the same image) both stay
   readable regardless of how bright the photo is. The slide already had
   this ::after layer reserved (position/size), just no background. */
.swiper-slide::after { background: linear-gradient(to bottom, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 20%, rgba(0,0,0,.28) 100%); z-index: -1; }

.slider-caption { margin-top: 30px; }

/* Decorative cube accent along the right edge of page-header photos,
   reusing the theme's own cubes-right.svg (already used elsewhere on
   .content) - the same idea as the cube motif on asvz.nl's hero images. */
.main-title.parallax::after {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(/uploads/Buddy013/images/cubes-right-header.svg);
  background-repeat: repeat-y;
  background-position: center right;
  background-size: max(15%, 80px) auto;
  z-index: 0;
  pointer-events: none;
}
.main-title .container {
  z-index: 1;
}
/* cmsms stylesheet: buddy013_v1.0.1-custom modified: zondag 8 november 2026 09:40:05 */

/* Font Awesome 5: the v4-shims map "FontAwesome" to the regular set (few icons);
   point it at the solid set so the old FontAwesome font-family rules keep working. */
@font-face {
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/webfonts/fa-solid-900.woff2") format("woff2"),
       url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/webfonts/fa-solid-900.woff") format("woff");
}
@charset "utf-8";
/* ==================================================
  Custom CSS Document - CMS Template Buddy
  Template No.: 013
  Version 1.0.1 / for CMSMS 2.2.10+
  www.cmstemplatebuddy.com
  See our Copyrights page
================================================== */
.online-modules .btn-primary {background-color: #ffa726;border-color: #ffa726;color: #fff;}.online-modules .card {border:0;border-radius: 0;}.online-modules .card-image {height: 180px;}.online-modules .card-image img {max-height: 100%;}.alert .badge {font-size: 100%;color: inherit;padding: .5em 1em;}.alert .badge.head {font-size: 120%;position: absolute;top: 22px;}.alert .badge.large {font-size: 120%;}#page-home .cms_form {background-color: rgba(255,255,255,.7);}.home-subtitle {display: block;font-weight: 300;color: #777;font-size: 1.4rem;margin-bottom: 20px;}.badge-primary {background-color: var(--color2-hex-color);color: #fff;}hr {padding: 0;border: 0 none;color: var(--color2-hex-color);background: var(--color2-hex-color);background-image: linear-gradient(to right, #eee, var(--color2-hex-color), #eee);width: 100%;height: 1px;text-align: center;margin: 30px 0;overflow: visible;}hr.separator {color: var(--color2-hex-color);background: var(--color2-hex-color);background-image: linear-gradient(to right, #eee, var(--color2-hex-color), #eee);}hr.separator:after {font-family: "FontAwesome";content: "\f107";display: inline-block;position: relative;top: -.75rem;font-size: 1.8rem;padding: 0 0.5rem;background: white;}hr.divider {color: transparent;background: transparent;background-image: none;position: relative;}hr.divider:after {display: block;height: 2px;width: 50px;content: '';bottom: 0px;position: absolute;margin-left: -25px;left: 50%;background-color: #42b0db;}.relative {position: relative;}.vertical-center {display: flex;align-items: center;justify-content: center;}.gradient-background {position: absolute;top: 0;left: 0;bottom: 0;right: 0;z-index: 1;opacity: 0.5;}.green-to-transparent-gradient-background {background: linear-gradient(var(--gradient--green-to-transparent)) !important;background: -moz-linear-gradient(var(--gradient--green-to-transparent)) !important;background: -webkit-linear-gradient(var(--gradient--green-to-transparent)) !important;opacity: 1;}.orange-to-transparent-gradient-background {background: linear-gradient(var(--gradient--orange-to-transparent)) !important;opacity: 1;}.bg1 {//background: #D40055 url(/images/bg1.jpg) left top repeat-y;background: rgb(0,160,222);background: linear-gradient(90deg, rgba(0,160,222,1) 0%, rgba(239,228,42,1) 100%);}.bg2 {//background: #EFE42A url(/images/bg2.jpg) left top repeat-y;background: rgb(34,41,131);background: linear-gradient(90deg, rgba(34,41,131,1) 0%, rgba(212,0,85,1) 100%);}.bg3 {//background: #EB6B82 url(/images/bg3.jpg) left top repeat-y;background: rgb(255,235,4);background: linear-gradient(90deg, rgba(255,235,4,1) 0%, rgba(235,107,130,1) 100%);}.bg4 {//background: #019BD1 url(/images/bg4.jpg) left top repeat-y;background: rgb(224,8,81);background: linear-gradient(90deg, rgba(224,8,81,1) 0%, rgba(1,155,209,1) 100%);}/* Typography ================================================== */body {font-size: 1.1rem;color: #444;}.feature-content h3 {margin: 10px 0 0;}.text--orange, .txt--orange { color: var(--orange-hex-color); }.text--red,    .txt--red    { color: var(--red-hex-color); }.text--blue,   .txt--blue   { color: var(--blue-hex-color); }.text--lgreen, .txt--lgreen { color: var(--lgreen-hex-color); }.text--dgreen, .txt--dgreen { color: var(--dgreen-hex-color); }.text--lgrey,  .txt--lgrey  { color: var(--lgrey-hex-color); }.text--dgrey,  .txt--dgrey  { color: var(--dgrey-hex-color); }.bg--lgreen  { background-color: var(--lgreen-bg-color); }.bg--lgrey   { background-color: var(--lgrey-bg-color); }.bg--lorange { background-color: var(--lorange-bg-color); }.bg--gradient {background: rgb(var(--lgreen-bg-rgb-color));background: -moz-linear-gradient(0deg, rgba(var(--lgreen-bg-rgb-color),1) 0%, rgba(var(--lgreen-bg-rgb-color),0.5019141445640756) 35%, rgba(var(--lgreen-bg-rgb-color),0) 100%);background: -webkit-linear-gradient(0deg, rgba(var(--lgreen-bg-rgb-color),1) 0%, rgba(var(--lgreen-bg-rgb-color),0.5019141445640756) 35%, rgba(var(--lgreen-bg-rgb-color),0) 100%);background: linear-gradient(0deg, rgba(var(--lgreen-bg-rgb-color),1) 0%, rgba(var(--lgreen-bg-rgb-color),0.5019141445640756) 35%, rgba(var(--lgreen-bg-rgb-color),0) 100%);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--lgreen-bg-color)",endColorstr="var(--lgreen-bg-color)",GradientType=1);}.home-title {margin: 60px 0 0;}.dark .home-title::after {background-color: var(--color1-hex-color);}p.intro {font-size: 1.4rem;line-height: 2.5rem;}p,pre,ul,ol,dl,dd,blockquote,address,table,fieldset,form { margin-bottom: 1rem; }.subtitle {display: inline-block;margin-left: .5rem;}/* Layout ================================================== */header {border-bottom: 1px solid transparent; /* rgba(0,0,0,.1); */}#page-opdrachten section.content { background-color: rgb(210, 226, 232);}section.grey { background-color: var(--lgrey-bg-color); }div.green, section.green { background-color: var(--lgreen-bg-color); }.home-parallax::before {position: absolute;content: " ";width: 100%;height: 100%;top: 0;left: 0;background: linear-gradient(var(--gradient--green-to-transparent)) !important;background: -moz-linear-gradient(var(--gradient--green-to-transparent)) !important;background: -webkit-linear-gradient(var(--gradient--green-to-transparent)) !important;}/* Header smaller (page scroll) ================================================== */header.header-smaller {height: 90px;}/*.search-wrapper {display: none;}.main-menu {margin-right: 0;}*/.main-title {background-color: transparent ;border-bottom: 0px solid #EEE;}.feature-icon i {font-size: 4.1rem;}.feature-content p {line-height: 1.8;margin-bottom: .5rem;}.feature-content div {border-top: 1px solid var(--color1-hex-color);padding-top: 20px;margin-top: 20px;}.feature-content div p {font-size: 0.9rem;font-weight: 200;}/* Search ================================================== */#page-home .search-trigger {color: #fff;border-color: transparent;}#page-home header.header-smaller .search-trigger {color: #444;}#page-home header {background-color: transparent;}#page-home header.header-smaller {background-color: #fff; /* var(--color2-hex-color); */}/* CUSTOM ================================================== */#myModal .col-404 {display: none;}section.mobile-navigation {bottom: unset;z-index: 2;}.content li {/*  margin-left: 20px; */}.btn-item {background-color: orange;padding: .5rem 1rem;color: #fff;border-radius: 0.125rem;}.btn-item:hover {color: #444;}.btn-item-outline {background-color: transparent;border: 1px solid #444;padding: .5rem 1rem;color: inherit;border-radius: 0.125rem;}form {margin-bottom: 0;}.input-group > .input-group-append:not(:last-child) > .input-group-text {border-top-right-radius: .25rem;border-bottom-right-radius: .25rem;}.last {margin-bottom: 0;}.control-label.req {position: relative;}.control-label.req::after {bottom: -1px;color: #e74c3c;content: "*";font-size: 2.5em;font-weight: 600;padding-left: 3px;position: absolute;}.feature-icon .subtitle,.feature-icon h5 {margin-left: 3rem;margin-top: 0;}.feature-icon h1 {font-size: 3.8rem;color: #E6AE48;font-weight: 700;height: 3rem;padding: .5rem 0;line-height: unset;}.text-link {-webkit-transition: color 0.3s ease;transition: color 0.3s ease;}.text-link::after {content: "\f105";font-family: 'FontAwesome';-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-style: normal;font-variant: normal;font-weight: normal;text-decoration: none;text-transform: none;text-rendering: auto;color: inherit;font-size: 1rem;margin-left: 5px;-webkit-transition: margin-left 0.3s ease-out;transition: margin-left 0.3s ease-out;}.text-link:hover::after {margin-left: 10px;}.no-break {margin: 0;-webkit-column-break-inside: avoid;        /* Chrome, Safari */page-break-inside: avoid;        /* Theoretically FF 20+ */break-inside: avoid-column; /* IE 11 */display: table;                            /* Actually FF 20+ */}input.form-control::-webkit-input-placeholder,textarea.form-control::-webkit-input-placeholder,.fake-input::-webkit-input-placeholder {color:#acacac}input.form-control:-moz-placeholder,textarea.form-control:-moz-placeholder,.fake-input:-moz-placeholder{color:#acacac}input.form-control::-moz-placeholder,textarea.form-control::-moz-placeholder,.fake-input::-moz-placeholder{color:#acacac}input.form-control:-ms-input-placeholder,textarea.form-control:-ms-input-placeholder,.fake-input:-ms-input-placeholder{color:#acacac}#aanmelden .block-large {padding: 1.5rem;}#aanmelden .block {background-color: inherit;}#aanmelden .right-border {border-right: 0;border-bottom: 1px solid #ddd;padding-bottom: 1rem;}#aanmelden .left-border {border-left: 0;border-top: 1px solid #ddd;padding-top: 1.5rem;}.grey-box-light {background-color: var(--grey-box-light);}.green-box-light {background-color: var(--green-box-light);}.blue-box-light {background-color: var(--blue-box-light);}.orange-box-light {background-color: var(--orange-box-light);}abbr {min-width: 1.5rem;line-height: 2rem;display: inline-block;text-align: center;}/* Alerts */.bs-callout, .quote, .alert {margin: 5px 0;border: 0 solid #eee;border-left-color: #cbdb2a; /* rgb(238, 238, 238); */border-left-width: 5px;border-radius: 0;color: #333;}div.alert.alert-default {color: #383d41;background-color: #e2e3e5;border-color: #ccc;}div.alert {position: relative;}div.alert.alert-success {background-color: #dff0d8;border-color: #d0e9c6;color: #3c763d;}div.alert.alert-success hr {border-top-color: #c1e2b3;}div.alert.alert-success div.alert.alert-link {color: #2b542c;}div.alert.alert-info {background-color: #d9edf7;border-color: #bcdff1;color: #31708f;}div.alert.alert-info hr {border-top-color: #a6d5ec;}div.alert.alert-info div.alert.alert-link {color: #245269;}div.alert.alert-warning {background-color: #fcf8e3;border-color: #f7ecb5;color: #8a6d3b;}div.alert.alert-warning hr {border-top-color: #f7ecb5;}div.alert.alert-warning div.alert.alert-link {color: #66512c;}div.alert.alert-danger {background-color: #f2dede;border-color: #ebcccc;color: #a94442;}div.alert.alert-danger hr {border-top-color: #e4b9b9;}div.alert.alert-danger div.alert.alert-link {color: #843534;}div.alert.alert-success, .bs-callout-success {border-left-color: #94c826;background-color: #eaf4d4;}/*div.alert.alert-success::before {color: #94c826;content: "\f00c";}*/div.alert.alert-info, .bs-callout-info {border-left-color: #51b4d3;background-color: #d9ecf3;}/*div.alert.alert-info::before {color: #51b4d3;content: "\f129";}*/div.alert.alert-warning, .bs-callout-warning {border-left-color: #f5a417;background-color: #fdedd1;}/*div.alert.alert-warning::before {color: #f5a417;content: "\f071";}*/div.alert.alert-danger, .bs-callout-danger {border-left-color: #e74c3c;background-color: #fce0e7;}/*div.alert.alert-danger::before {color: #e74c3c;content: "\f06a";}*/div.alert .close,div.alert .close {position: absolute;top: 10px;right: 15px;}div.alert .close:hover,div.alert .close:focus {color: #333;opacity: 1;}/* ??#readspeaker_button1 {position: unset;}*/#page-cursussen .readspeaker-wrapper {background-color: var(--lgreen-bg-color);}/*  THEMES GRID */.theme-description {padding: 15px 5px 10px;}.theme-description .theme-title {text-transform: initial;font-size: 1.2rem;font-weight: 600;line-height: 120%;letter-spacing: 0;margin: 0;}.theme-description p {font-size: 0.9rem;color: #777;min-height: 3rem;line-height: 1.5;margin: 0;}.xt_message {background-color: var(--lgreen-bg-color);padding: 2rem;max-width: 80%;}.xt_message .xt_msgtitle {font-size: 1.3rem;font-weight: 600;margin-bottom: .5rem;font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;line-height: 150%;text-transform: uppercase;color: #333;letter-spacing: 1px;}@font-face {font-family: 'default';src: url('/player/css/fonts/default.eot?c38q6t');src: url('/player/css/fonts/default.eot?c38q6t#iefix') format('embedded-opentype'), url('/player/css/fonts/default.ttf?c38q6t') format('truetype'), url('/player/cssfonts/default.woff?c38q6t') format('woff'), url('/player/cssfonts/default.svg?c38q6t#default') format('svg');font-weight: normal;font-style: normal;font-display: block;}.feature-icon {position: relative;}.ev-icon {/* use !important to prevent issues with browser extensions that change fonts */font-family: 'default' !important;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;/* Better Font Rendering =========== */-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}.feature-icon .ev-icon {position: absolute;margin-left: -1rem;margin-top: -.5rem;}.feature-icon .ev-icon span {position: absolute;font-weight: 700;font-family: Arial, Helvetica, sans-serif;left: 27px;top: 9px;font-size: 1.3rem;}.ev-icon-medal-empty:before {content: "\e6dd";}.icon-finger-tap::before {content: "\e9c4";}.footer-small p {color: #666;}.footer-small p a {color: #aaa;}.footerNav .activeparent, .footerNav .currentpage {color: #ffa726 !important;}@media (max-width: 769px) {/* Tap targets mobile */.footerNav a {padding: 4px 10px;margin: 1px;}}section.mobile-navigation {z-index: 999;}#page-privacyverklaring .content-wrapper li {margin-left: 1.3rem;padding-left: .7rem;}/* Unsorted List (UL) Icons */ul.awesome {--icon-space: 1.5em;list-style: none;padding: 0;margin: 0;}ul.awesome li {line-height: 150%;padding-left: var(--icon-space);margin-bottom: calc( var(--icon-space) / 2.5 );}ul.awesome li:before {font-family: FontAwesome;display: inline-block;margin-left: calc( var(--icon-space) * -1 );width: var(--icon-space);}ul.awesome.check li::before {content: "\f00c";color: #28a745;}ul.awesome.pink li::before {color: var(--pink-hex-color);}ul.awesome.blue li::before {color: var(--blue-hex-color);}ul.awesome.arrow li::before {content: "\f061";}ul.awesome.chevron li::before {content: "\f054";}ul.awesome.angle li::before {content: "\f105";padding-left: .5rem;}ul.awesome.angle li ul li::before {padding-left: -0.5rem;}ul.awesome.angle-double li::before {content: "\f101";}ul.awesome.pdf li::before {content: "\f1c1";}/* Link rows (e.g. sidebar legal links): like the FAQ bars, dark blue text */ul.awesome.rows li {display: flex;align-items: center;padding-left: 0;margin-bottom: .5rem;background-color: var(--lgreen-bg-color);border-radius: 5px;transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;}ul.awesome.rows li::before {font-family: "Font Awesome 5 Free";font-weight: 900;margin-left: 0;width: auto;padding: 0 0 0 .9rem;font-size: 1.4rem;color: var(--blue-hex-color);}ul.awesome.rows li a {flex: 1;padding: .7rem .9rem;font-size: 1rem;font-weight: 600;color: var(--heading-primary);text-decoration: none;}ul.awesome.rows li:hover {background-color: #dcefed;box-shadow: 0 2px 8px rgba(10, 57, 112, .15);}ul.awesome.rows li:hover a {color: var(--blue-hex-color);}ul.awesome.rows.shield li::before {content: "\f3ed";}ul.awesome.rows li.cookie::before {content: "\f563";font-family: "Font Awesome 5 Free";font-weight: 900;}ul.awesome.doc li::before {content: "\f1c2";}ul.awesome.check li::before {content: "\f00c";}ul.awesome.check.success li::before {color: #94c826;}ul.awesome.xmark li::before {content: "\f00d";}ul.awesome.xmark.error li::before {color: "#e74c3c";}ul.awesome ul {list-style: none;margin-top: .5em;padding: 0;}ul.awesome.list-group li {padding-left: 1rem;width: 100%;}.fa.pink {color: var(--pink-hex-color);}.fa.blue {color: var(--blue-hex-color);}/* === Multi column  === */.multi-column-2 {-webkit-column-count: 1; /* Chrome, Safari, Opera */-moz-column-count: 1; /* Firefox */column-count: 1;-webkit-column-gap: 0;   /* Chrome, Safari, Opera */-moz-column-gap: 0;   /* Firefox */column-gap: 0;}.multi-column-2 li {-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */page-break-inside: avoid; /* Firefox */break-inside: avoid; /* IE 10+ */}@media all and (max-width: 768px) {header {border-bottom: rgba(0,0,0,.1) solid 1px;}.logo {top: 20px;}.logo .logo-stras {padding: .3rem;}.home-title::after {content: none;}#readspeaker_button1 {position: absolute;top: -14px;left: unset;right: 20px;}#page-opdrachten #readspeaker_button1 {top: 80px;right: 20px;}}@media (min-width: 769px) {.home-parallax {clip-path: ellipse(150% 100% at 50% 0);}#aanmelden .block-large {padding: 2rem;}#aanmelden .block {padding: 0 2rem;}#aanmelden .right-border {border-right: 1px solid #ddd;border-bottom: 0;padding-bottom: 0;}#aanmelden .left-border {border-left: 1px solid #ddd;border-top: 0;padding-top: 0;}.multi-column-2 {-webkit-column-count: 2; /* Chrome, Safari, Opera */-moz-column-count: 2; /* Firefox */column-count: 2;-webkit-column-gap: 30px; /* Chrome, Safari, Opera */-moz-column-gap: 30px; /* Firefox */column-gap: 30px;}}.panel {margin-bottom: 20px;background-color: #fff;border: 1px solid transparent;border-radius: 4px;-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);box-shadow: 0 1px 1px rgba(0,0,0,.05);}.panel-default {border-color: #ddd;}.panel-heading {padding: 10px 15px;border-bottom: 1px solid transparent;border-bottom-color: transparent;border-top-left-radius: 3px;border-top-right-radius: 3px;}.panel-default > .panel-heading {color: #333;background-color: #f5f5f5;border-color: #ddd;}.panel-body {padding: 15px;}img.border {border: 1px solid #eee;padding: 1rem;box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);}@media (min-width: 992px) {.footer-big {padding: 80px 0 50px;}section.content {padding: 40px 0 60px;}}

/* Swiper 14: its css sets .swiper-slide to display:block; keep the theme's centred flex slides */
.swiper-container.swiper .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

/* Cards (cursus overview): .theme-item and its image get 5px rounded corners */
.theme-item,
.theme-image {
  border-radius: 5px;
}

/* /cursussen: the course cards are Bootstrap cards (.card, .card-img-top, .card-body), 4 per row.
   Rounded corners 5px, hover shadow and the image overlay (the theme's rules used .theme-item:hover). */
.portfolio-gallery .card {
  --bs-card-border-radius: 5px;
  --bs-card-inner-border-radius: 4px;
  transition: box-shadow ease-in 0.2s;
}
.portfolio-gallery .card:hover {
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .16);
}
.portfolio-gallery .card .theme-image {
  padding: 15px 15px 0;
}
/* Same 15px side padding as the image, so the text never touches the card edge */
.portfolio-gallery .card .card-body {
  padding: 25px 15px 20px;
  border-radius: 0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius);
}
.portfolio-gallery .card .theme-image img {
  border-radius: 3px;
  width: 100%;
  aspect-ratio: 472 / 391; /* the course images are all 472x391 */
  object-fit: cover;
  margin: 0;
}
/* Overlay: only over the image (inside the padding), blue tint, white round icon that scales in */
.portfolio-gallery .card .theme-image .image-overlay {
  inset: 15px 15px 0 15px;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  background-color: rgba(10, 57, 112, 0);
}
.portfolio-gallery .card .theme-image .image-overlay .overlay-icon {
  position: static;
  width: 56px;
  height: 56px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  transform: scale(.6);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
.portfolio-gallery .card .theme-image .image-overlay .overlay-icon i {
  margin: 0;
  font-size: 22px;
  color: #0a3970;
}
.portfolio-gallery .card:hover .theme-image .image-overlay {
  opacity: 1;
  background-color: rgba(10, 57, 112, .55);
}
.portfolio-gallery .card:hover .theme-image .image-overlay .overlay-icon {
  opacity: 1;
  top: auto;
  margin: 0;
  transform: scale(1);
}
.portfolio-gallery .card .theme-title {
  font-size: 1.1rem;
}

/* .pull-left / .pull-right used to come from Font Awesome 4 (removed in FA 5); the theme markup still uses them (e.g. nav.main-menu.pull-right) */
.pull-right { float: right !important; }
.pull-left { float: left !important; }

/* Maximum page width (very wide screens).
   Photo blocks (slider, parallax, page-header photo) and the header content stay at most 1920px wide and
   centred, with small rounded corners once the screen is wider than that. Everything else (coloured
   section backgrounds, footer) stays full width, so there is no hard side edge there. */
:root {
  --page-max-width: 1920px;
}
header .container-fluid {
  max-width: var(--page-max-width);
  margin-left: auto;
  margin-right: auto;
}
.slider,
.home-parallax,
.main-title.parallax {
  max-width: var(--page-max-width);
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 1921px) {
  .home-parallax,
  .main-title.parallax {
    border-radius: 10px;
  }
  /* the slider starts at the top of the screen: only the bottom corners are rounded */
  .slider {
    border-radius: 0 0 10px 10px;
  }
  /* clip the photos on the inner swiper, so the side cubes below (outside the 1920px slider) are not cut off */
  .slider .swiper-container {
    border-radius: inherit;
    overflow: hidden;
  }
  .wrapper {
    overflow-x: clip;
  }
  /* cube pattern left and right of the slider, as the theme does along the sides of .content */
  .slider::before,
  .slider::after {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;
    width: calc((100vw - var(--page-max-width)) / 2);
    background-repeat: repeat-y;
    background-size: auto;
    pointer-events: none;
  }
  .slider::before {
    right: 100%;
    background-image: url(/uploads/Buddy013/images/cubes-left.svg);
    background-position: left top;
  }
  .slider::after {
    left: 100%;
    background-image: url(/uploads/Buddy013/images/cubes-right.svg);
    background-position: right top;
  }
  /* Page-header photo (.main-title.parallax): its ::after is already the right-hand cube accent, so one ::before spans the whole
     viewport (both cube images) and a mask hides the middle 1920px. */
  .main-title.parallax::before {
    content: "";
    position: absolute;
    top: 0;
    left: calc(50% - 50vw);
    width: 100vw;
    height: 100%;
    background-image: url(/uploads/Buddy013/images/cubes-left.svg), url(/uploads/Buddy013/images/cubes-right.svg);
    background-position: left top, right top;
    background-repeat: repeat-y;
    background-size: auto;
    -webkit-mask-image: linear-gradient(to right, #000 calc((100vw - var(--page-max-width)) / 2), transparent calc((100vw - var(--page-max-width)) / 2), transparent calc(100vw - (100vw - var(--page-max-width)) / 2), #000 calc(100vw - (100vw - var(--page-max-width)) / 2));
    mask-image: linear-gradient(to right, #000 calc((100vw - var(--page-max-width)) / 2), transparent calc((100vw - var(--page-max-width)) / 2), transparent calc(100vw - (100vw - var(--page-max-width)) / 2), #000 calc(100vw - (100vw - var(--page-max-width)) / 2));
    pointer-events: none;
  }
  /* Home parallax (.home-parallax sits in its own full-width section / block): the same cubes beside it */
  section:has(> .home-parallax),
  ._container:has(> .home-parallax) {
    position: relative;
  }
  section:has(> .home-parallax)::before,
  section:has(> .home-parallax)::after,
  ._container:has(> .home-parallax)::before,
  ._container:has(> .home-parallax)::after {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;
    width: calc((100% - var(--page-max-width)) / 2);
    background-repeat: repeat-y;
    background-size: auto;
    pointer-events: none;
  }
  section:has(> .home-parallax)::before,
  ._container:has(> .home-parallax)::before {
    left: 0;
    background-image: url(/uploads/Buddy013/images/cubes-left.svg);
    background-position: left top;
  }
  section:has(> .home-parallax)::after,
  ._container:has(> .home-parallax)::after {
    right: 0;
    background-image: url(/uploads/Buddy013/images/cubes-right.svg);
    background-position: right top;
  }
  /* Headings on very wide screens: Bootstrap caps them at 1200px, so step up once more */
  .h1, h1 {
    font-size: 3rem;
  }
  .h2, h2 {
    font-size: 2.25rem;
  }
  .display-6 {
    font-size: 2.75rem;
  }
  .h3, h3 {
    font-size: 2rem;
  }
  .h4, h4 {
    font-size: 1.75rem;
  }
  .h5, h5 {
    font-size: 1.375rem;
  }
  .h6, h6 {
    font-size: 1.125rem;
  }
  /* Body text on very wide screens */
  p,
  li {
    font-size: 1.125rem;
  }
  /* Open search bar on very wide screens: the white bar stays full width, but the input and the close button line up with the 1920px page */
  .search-input form {
    padding-left: calc((100% - var(--page-max-width)) / 2 + 15px);
  }
  .show-search .search-wrapper {
    right: calc((100% - var(--page-max-width)) / 2);
  }
  /* "Lees voor" button: left under the slider, in line with the 1920px page, not with the 1320px text column */
  .readspeaker-wrapper .container {
    max-width: var(--page-max-width);
  }
  /* the search button is absolutely positioned against the full-width header: keep it inside the 1920px area */
  header .search-wrapper {
    right: calc(50% - var(--page-max-width) / 2);
  }
}

/* Read-aloud (ReadSpeaker) button: inside the content container instead of against the screen edge */
.readspeaker-wrapper {
  left: 0;
  width: 100%;
  pointer-events: none;
}
.readspeaker-wrapper .rsbtn {
  display: inline-block;
  vertical-align: top;
}
.readspeaker-wrapper .rsbtn a,
.readspeaker-wrapper .rsbtn button {
  pointer-events: auto;
}

/* To top button, as on dare-is.nl: round white button with a progress ring around the chevron */
div.totoplink a {
  right: 1.25rem;
  bottom: 1.25rem;
  width: 52px;
  height: 52px;
  line-height: 1;
  border-radius: 999px;
  background-color: #fff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
  animation: scrollHint 1.8s ease-in-out infinite;
}
div.totoplink a:hover {
  background-color: #fff;
}
div.totoplink .progress-ring {
  position: absolute;
  inset: 0;
  transform: rotate(-90deg);
}
div.totoplink .ring-bg {
  fill: none;
  stroke: #e5e7eb;
  stroke-width: 4;
}
div.totoplink .ring-progress {
  fill: none;
  stroke: var(--color2-hex-color);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-dasharray: 138;
  stroke-dashoffset: 138;
  transition: stroke-dashoffset .15s linear;
}
div.totoplink a:hover .ring-progress {
  stroke: var(--heading-primary);
}
div.totoplink .icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: var(--color2-hex-color);
  line-height: 1;
}
div.totoplink i {
  font-size: inherit;
  color: inherit;
}
div.totoplink a:hover .icon {
  color: var(--heading-primary);
}
@keyframes scrollHint {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-6px) scale(1.03); }
}

/* Text links in content: stay blue on hover, with a blue bottom border */
section.content p a:not(.btn):hover,
section.content li a:not(.btn):hover,
section.content td a:not(.btn):hover {
  color: var(--color2-hex-color);
  border-bottom: 1px solid var(--color2-hex-color);
}

/* Primary button hover: a clearly darker shade instead of a slight fade */
.btn.btn-primary:hover,
.btn.btn-primary:focus-visible {
  background-color: var(--heading-primary);
  border-color: var(--heading-primary);
  color: #fff;
  opacity: 1;
  box-shadow: 0 4px 10px rgba(10, 57, 112, .3);
}
.online-modules .btn.btn-primary:hover,
.online-modules .btn.btn-primary:focus-visible {
  background-color: #d97f00;
  border-color: #d97f00;
  color: #fff;
  opacity: 1;
  box-shadow: 0 4px 10px rgba(217, 127, 0, .35);
}

/* header-container-width: on desktop the logo and the menu line up with the Bootstrap .container (the text column),
   not with the screen edge. Widths are the Bootstrap container widths; the search button keeps its offset from the menu. */
@media (min-width: 992px) {
  :root { --header-container-width: 960px; }
  header .container-fluid {
    max-width: var(--header-container-width);
    padding: 0 12px;
  }
  /* flex row: logo left, menu pushed right, search button (relative, in the flow) at the end of the container */
  header .container-fluid {
    display: flex;
    align-items: flex-start;
  }
  header nav.main-menu {
    margin-left: auto;
    margin-right: 0;
  }
  header .search-wrapper,
  .show-search .search-wrapper {
    position: relative;
    top: 0;
    right: auto;
    flex: 0 0 auto;
  }
  /* the open search bar: white bar full width, input and close button stay inside the container */
  .search-input form {
    padding-left: calc((100% - var(--header-container-width)) / 2 + 12px);
    padding-right: calc((100% - var(--header-container-width)) / 2 + 12px);
  }
}
@media (min-width: 1200px) {
  :root { --header-container-width: 1140px; }
}
@media (min-width: 1400px) {
  :root { --header-container-width: 1320px; }
}

/* header-mobile-90: below 992px the header is 90px high, also after scrolling (header-smaller). The icons are
   positioned in px so they do not move while the header changes. */
@media (max-width: 991.98px) {
  header,
  header.header-smaller,
  .search-trigger,
  .header-smaller .search-trigger,
  .search-input form,
  .header-smaller .search-input form,
  .mobile-nav-trigger,
  .mobile-nav-trigger.active {
    height: 90px;
  }
  .search-trigger i,
  .header-smaller .search-trigger i {
    top: 37px;
  }
  .mobile-nav-trigger span:before {
    top: 39px;
  }
  /* the open mobile menu and the content start below the 90px header */
  section.mobile-navigation {
    top: 90px;
  }
  .main-title,
  .header-smaller .main-title,
  .main-title.margin-smaller {
    margin-top: 90px;
  }
}

/* header-mobile-noborder: no vertical lines next to the search and menu buttons on mobile */
@media (max-width: 991.98px) {
  .search-trigger,
  .mobile-nav-trigger,
  .dark:not(.header-smaller) .mobile-nav-trigger,
  .slider-fullscreen header.dark:not(.header-smaller) .search-trigger {
    border: 0;
  }
}

/* header-mobile-white: no line under the header on mobile; on the home page the menu icon is white like the search icon
   (dark again once the header turns white after scrolling) */
@media (max-width: 991.98px) {
  header,
  header.header-smaller {
    border-bottom: 0;
  }
  #page-home header:not(.header-smaller) .mobile-nav-trigger span:before {
    background: #fff;
    box-shadow: 0 6px 0 0 #fff, 0 12px 0 0 #fff;
  }
}

/* main-title-mobile: the page-header title (h1 in .main-title) is smaller on phones, and the cube accent
   (.main-title.parallax::after) is desktop only */
body .main-title h1 {
  font-size: clamp(1.75rem, 0.75rem + 5vw, 3.125rem);
}
@media (max-width: 991.98px) {
  .main-title.parallax::after {
    content: none;
    display: none;
  }
}


/* header-blur: the scrolled header is a translucent white with blur instead of solid white (all screen sizes) */
header.header-smaller,
.slider-fullscreen header.header-smaller,
#page-home header.header-smaller {
  background-color: transparent;
}
.header-smaller::before {
  content: "";
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  z-index: -1;
  background-color: #ffffffd9;
  display: block;
  position: absolute;
  inset: 0;
}

/* logo-home-white: on the home page the STRAS logo is white at the start (transparent header) and the regular one after scrolling (header-smaller); all screen sizes */
#page-home header:not(.header-smaller) .logo-stras {
  content: url(/uploads/Buddy013/images/logo/logo-STRAS_bgw_white.svg);
}

/* awesome-no-hover-border: link lists (ul.awesome) get no bottom border on hover (overrides the content-link hover border) */
ul.awesome li a:hover,
section.content ul.awesome li a:not(.btn):hover {
  border-bottom: 0;
}
/* cmsms stylesheet: buddy013_v1.0.1-headings modified: zondag 8 november 2026 08:15:26 */
/* buddy013_v1.0.1-headings */
/* All h1-h6 (and tightly-coupled .lato/legend/h1.intro) typography,
   extracted out of buddy013_v1.0.1-main and buddy013_v1.0.1-custom
   so heading styles live in one place. Mixed selectors that style a
   heading alongside unrelated elements (e.g. .main-title--dark h1,
   .dark h1..h6) were left where they were, to avoid fragmenting a
   shared declaration across two files.

   Layering:
   1. Bootstrap (4.6.2, loaded from the CDN) is leading for the font
      sizes of h1-h6 (2.5 / 2 / 1.75 / 1.5 / 1.25 / 1rem). No font-size
      is set here for headings in the text, so they follow Bootstrap.
   2. Custom styling taken from asvz.nl (asvz-headings.html) is added on
      top: font family, weight, colour, spans. */

:root {
  --heading-primary: #0a3970; /* --color-primary in asvz-headings.html */
}

h1,
h2,
h3,
h4,
h5,
h6,
legend {
  font-weight: 700;
  font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;
  line-height: 125%;
  text-transform: none;
  color: var(--heading-primary);
  letter-spacing: normal;
}

h1.lato,
h2.lato,
h3.lato,
h4.lato,
h5.lato,
h6.lato,
txt.lato {
  font-family: 'Source Sans 3', Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color: inherit;
}

.feature-content h3 {
  margin: 14px 0;
}
.subtitle + h3 {
  margin: 0 0 14px 0;
}

/* A span in a heading gets the low weight (Roboto Slab 300); the heading
   itself keeps the base weight above. */
h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span {
  font-weight: 300;
}

h4 { font-weight: 600; }

h5 { font-weight: 600; }

h6 { font-weight: 600; }

.home-heading h1 {
  text-align: center;
  margin: 20px 0;
  text-transform: none;
}

.home-heading h1,
.home-heading h2 {
  text-align: center;
  margin: 20px 0;
  text-transform: none;
}

h1.intro {
  font-size: 3.1rem;
  text-shadow: 0px 0px 8px #4d4f53;
  margin-bottm: 1rem;
}

/* ================================================================
   Page / hero titles: .main-title h1 and the slider/video caption h2
   (asvz.nl: h1.hero__title). Size is 3.125rem (50px) at every width, as in
   asvz-headings.html.
   ================================================================ */

.main-title h1 {
  padding: 0;
  margin: 0;
  line-height: 1.25;
  text-shadow: 0 0 15px rgba(0,0,0,.5);
}

.slider-caption h2,
.video-caption h2 {
  display: none;
  text-shadow: 0 0 15px rgba(0,0,0,.5);
  color: #fff;
  line-height: 1.25;
  margin-top: 0;
  -webkit-animation-delay: .3s;
  -moz-animation-delay: .3s;
  animation-delay: .3s;
  z-index: 1;
  position: relative;
}

.main-title h1,
.slider-caption h2,
.video-caption h2 {
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size: 3.125rem; /* 50px, as h1.hero__title in asvz-headings.html */
  font-style: normal;
  letter-spacing: normal;
  text-transform: none;
  text-align: start;
  -webkit-text-stroke-width: 0;
}

/* slider-h2-mobile: smaller title on phones, 50px from tablet up */
.slider-caption h2,
.video-caption h2 {
  font-size: clamp(1.75rem, 0.75rem + 5vw, 3.125rem);
}

/* The bold first word on its own line (asvz: <span> inside h1.hero__title)
   needs that word wrapped in a span in the template/slider content. */
.main-title h1 span,
.slider-caption h2 span,
.video-caption h2 span {
  display: block;
}

/* ================================================================
   Headings in the text (asvz.nl: h2.content__title and h3).
   No font-size here: Bootstrap leads (h2 2rem, h3 1.75rem).
   ================================================================ */

section.content h2 {
  margin-bottom: 25px;
  font-family: 'Roboto Slab', Arial, sans-serif;
  text-transform: none;
  letter-spacing: normal;
}

section.content h3 {
  font-family: 'Roboto Slab', Arial, sans-serif;
  text-transform: none;
  letter-spacing: normal;
}

/* Lead text next to the hero title (asvz: .c-entry). */
.main-subtitle,
.slider-caption h3,
.video-caption h3 {
  font-family: 'Source Sans 3', Arial, sans-serif;
  font-weight: 700;
}

/* ================================================================
   Slider (.swiper-slide): everything centred horizontally and
   vertically, no text-stroke, shadow as the hero title in
   asvz-headings.html (0 0 15px rgba(0,0,0,.5)).
   The slide itself is already a flex box (justify/align: center).
   ================================================================ */

.swiper-slide .slider-caption,
.swiper-slide .video-caption {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.swiper-slide .slider-caption h2,
.swiper-slide .slider-caption h3,
.swiper-slide .video-caption h2,
.swiper-slide .video-caption h3 {
  text-align: center;
  -webkit-text-stroke: 0;
  text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}

/* the h2 / p stay hidden until _init.js shows them with jQuery .show(),
   which sets display:block inline: keep them centred as blocks */
.swiper-slide .slider-caption h2,
.swiper-slide .slider-caption h3 {
  width: 100%;
}

/* Slider subtitle (the p under the title, {$gallery_subtitle}): styled like
   h3.hero__header in asvz-headings.html (Roboto Slab 1.25rem / 300),
   in white because it sits on a photo. */
.swiper-slide .slider-caption h3,
.swiper-slide .video-caption h3 {
  margin: 15px 0 0;
  font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;
  font-weight: 300;
  line-height: 1.25;
  letter-spacing: normal;
  color: #fff;
}
