﻿/* CSS reset */
	ol, ul 							{ list-style: none; }

/* =========================== trigger ============================== */

/*	.standaard						{ display: none; }  */  
	.test							{ display: none; }  
	.executie						{ display: none; }  
	.inschrijven					{ display: none; }  
	
	.joker							{ display: none; } 
	.riddle							{ display: none; }  
	.opgeven						{ display: none; }      	/* Dit is alleen voor het opgeven voor het volgende seizoen */
	.kluis							{ display: none; }			/* Uitsluitend tbv Kraak de Kluis */
/*	.contrakluis					{ display: none; }	*/			/* disablen als .kluis enabled is */
	
/* ---------------- INLOGGEN -------------------------- */
	
/*	.inloggen						{ display: none; }  */
	
/* ------------------ MENU ---------------------------- */

	.speloverzicht					{ display: none; }
/*	.forum							{ display: none; }  */
	.deelnemers						{ display: none; }
/*	.kandidaten						{ display: none; }  */
	.spelregels						{ display: none; }
	.onsspel						{ display: none; }
/*	.statistiek						{ display: none; }  */

/* ---------- NEDERLANDS OF VLAAMS -------------------- */

/*	.nlmol							{ display: none; }  */
	.bemol							{ display: none; }  
	
/* ================================================================== */

/*	body 							{ background-image: url(../images/widm/background_green_finger.jpg); background-repeat: no-repeat; center; cover; background-attachment: fixed; }	*/
	
	body:before 					{ content: ""; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -10; background: url(../images/widm/background.png) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	
}

	body::after						{ content: ""; display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-image: url("../images/widm/misc/pattern-grid-dots.png"); z-index: -5; }

	p								{ font-family: 'Roboto', sans-serif; font-size: 17px; margin: 0 0 20px 0; color : #7F7F7F; }
	h1								{ font-family: 'Rajdhani', sans-serif; font-size: 46px; font-weight: bold; margin: 0 0 10px 0; color: #FFF; letter-spacing: 1px; text-transform: uppercase; }
	h2								{ font-family: 'Rajdhani', sans-serif; font-size: 46px; font-weight: bold; margin: 0 0 10px 0; color: #FFF; letter-spacing: 1px; }	
	h3								{ font-family: 'Rajdhani', sans-serif; margin: 0 0 10px 0; font-size: 25px; color: #FFF; }
	h5								{ font-family: 'Rajdhani', sans-serif; margin: 0 0 0 0; font-size: 17px; color: #FFF; }
	h6								{ font-family: 'Roboto', sans-serif; margin: 4px 0 20px 0; font-size: 15px; color: #7F7F7F; font-style: italic; }  /* Onderschrift foto's */
	
	.klok							{ font-family: 'Nunito', sans-serif; font-size: 46px; font-weight: bold; color: #FFF; letter-spacing: 1px; }
	
	.widm							{ text-transform: capitalize; }
	
	div.fixed 						{ position: fixed; top: 10px ; left: 10px ; z-index: 9998; }
									@media screen and (max-width: 992px) {div.fixed {display: none; } }  

	div.fixed2						{ position: fixed; top: 10px ; right: 30px ; z-index: 9999; }
	
	div.fixed3						{ position: fixed; top: 30px ; right: 30px ; z-index: 9999; }

	div.fixed4						{ position: fixed; top: 30px ; right: 30px ; z-index: 9999; }
									@media screen and (max-width: 992px) {div.fixed4 {display: none; } }
									
	div.fixed5						{ position: fixed; top: 65px ; right: 45px ; z-index: 9999; }									
									
	#my_centered_buttons 			{ display: flex; justify-content: center; }
	
	.fade_text 						{ opacity: 0; }
	.fade_text2						{ opacity: 0; }	
	.fade_image						{ opacity: 0; }
	.fade_image2					{ opacity: 0; }
	.fade_fingerprint				{ opacity: 0; }
	.fade_font						{ opacity: 0; }
	.fade_1							{ opacity: 0; }
	.fade_2							{ opacity: 0; }
	.fade_3							{ opacity: 0; }
		
	ul.b							{ margin: 0 0 20px 0; list-style-type: circle; list-style-position: outside; font-family: 'Roboto', sans-serif; font-size: 17px; color: #7F7F7F; font-weight: normal; line-height: 140%; }
	
	
/* Horizontal Rule */										
										
	hr								{ margin-top: 15px; margin-bottom: 15px; border: 0; border-top: 1px solid #4dbc85; }
	
	/* Voor images on images */
	.parent							{ position: relative; display: inline-block; }										
	.over-img						{ position: absolute; top: 4%; left: 4%; }
	.over-img2						{ position: absolute; top: 57%; left: 78%; }	
	.over-img3						{ position: absolute; top: 65%; left: 81%; }	/* tbv logo vlaamse mol */
	.over-img4						{ position: absolute; top: -7%; left: 43%; }
	.over-img5						{ position: absolute; top: 0.0%; left: 0.0%; opacity: 0.7; }  /* tbv counter op Tijd voor de Test */
	.over-img6						{ position: absolute; top: 5.0%; left: 0.0%; }	/* tbv tekst over foto's deelnemers */
	.over-img7						{ position: absolute; top: 80.0%; left: 0.0%; }	/* tbv tekst over foto's onder */
	.over-img8						{ position: absolute; top: 0.0%; left: 0.0%; }	/* tbv tekst over foto's boven */
	.over-img9						{ position: absolute; top: 65%; left: 87%; }	/* tbv logo over googlemap locatie */
	.over-img10						{ position: absolute; top: 13.0%; left: 88.0%; }	/* tbv vlag over googlemap locatie */		
	.over-img11						{ position: absolute; top: 86.5%; left: 88.8%; opacity: 0.8; }	/* tbv vlag over kandidatenfoto */
	.over-img12						{ position: absolute; top: 5.0%; left: 0.0%; }	/* tbv light over mollogo NL */	
	.badge-position					{ position: absolute; top: -36px; left: 4%; }
		
	.progress 						{ background: rgba(0, 0, 0, 0); margin: 0 0 5px 0;  } 
	.progress-bar-success			{ background: rgba(255, 0, 0, 1); }	

	#banner 						{ padding: 60px 0 50px 0;}	/* voorheen 70px top */
	
	.hyper:link						{ color: #4dbc85; text-decoration: none; }
	.hyper:hover					{ color: #14bc1a; text-decoration: none; }
	
	.nohyper:link					{ color: #7F7F7F; text-decoration: none; }
	.nohyper:hover					{ color: #7F7F7F; text-decoration: none; }
	
	.nohyperwhite:link				{ color: #FFF; text-decoration: none; }
	.nohyperwhite:hover				{ color: #FFF; text-decoration: none; }
	
	.nocursor						{ cursor: default;}
	.nodrop							{ cursor: no-drop;}
	
	.btnLink						{position:relative;overflow:hidden;color:#4dbc85;-webkit-transform:translateZ(0);
									transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-moz-osx-font-smoothing:grayscale}
	.btnLink:before					{position:absolute;bottom:0;right:0;left:0;z-index:-1;height:1px;background:#4dbc85;content:"";-webkit-transition-property:left,right;transition-property:left,right;
									-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}
	.btnLink:hover:before			{right:50%;left:50%;background:#14bc1a}
	.btnLink:hover					{color:#14bc1a; text-decoration: none; }
	
	pre								{ background-color: rgba(50, 207, 73, 0); border: 0px; }
							/*		@media screen and (max-width: 992px) {pre {display: none; } }   */
	
    /* Add a gray background color and some padding to the footer */
    #footer 						{ padding: 5px; color: #7F7F7F; margin-top: 70px; }

	body a:link 					{ color: #4dbc85; }
	body a:hover 					{ color: #14bc1a; }	
	body a:visited					{ color: #4dbc85; }
	body a:focus					{ color: #4dbc85; text-decoration: none; }   
	body a:active					{ color: #4dbc85; }   
	
/* footer */
	footer a:link					{ color: #4dbc85; text-decoration: none; }
	footer a:visited				{ color: #4dbc85; text-decoration: none; }
	footer a:active					{ color: #4dbc85; text-decoration: none; }
	footer a:hover					{ color: #14bc1a; text-decoration: none; }		
	footer a:focus					{ color: #4dbc85; text-decoration: none; }
	
	#footer ul 						{ margin: 0; padding: 0 0 10px 0; list-style-type: none;  }
	#footer ul li 					{ display: inline; }
	#footer ul li a 				{ text-decoration: none; padding: 10px 15px; }
	
	
/* Banner full width */	
	.no-gutter > [class*='col-'] 	{ padding-right:0; padding-left:0; }

/* Modal */	
	.modal-header, h4, .close 		{ background-color: #002712; color: #000 !important; text-align: center; letter-spacing: 5px; }

	.modal-body 					{ padding: 40px 50px; background-color: #002712; }
	.modal-header					{ padding: 20px 0px; }

	#myModal 						{ top: 10%; outline: none; }
	#myModal1						{ top: 10%; outline: none; }

/* Een beetje schaduw */
	.schaduw						{ box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }
	.schaduwred						{ box-shadow: 0 4px 8px 0 rgba(255, 0, 0, 0.4), 0 6px 20px 0 rgba(255, 0, 0, 0.5); }
	.schaduwgray					{ box-shadow: 0 4px 8px 0 rgba(127, 127, 127, 0.2), 0 6px 20px 0 rgba(127, 127, 127, 0.19); }
	.border							{ border: 1px solid #4dbc85; border-radius: 4px; padding: 2px; }
	.border2						{ border-top: 3px solid rgba( 255, 255, 255, 0.25 ); border-left: 3px solid rgba( 255, 255, 255, 0.25 ); border-right: 2px solid rgba( 255, 255, 255, 0.10 );
									  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	padding: 0; border-radius: 15px; box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5); }
	.border3						{ border-top: 3px solid rgba( 255, 255, 255, 0.25 ); border-left: 3px solid rgba( 255, 255, 255, 0.25 ); border-right: 2px solid rgba( 255, 255, 255, 0.10 );
									  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	padding: 0; border-radius: 15px; }
	.border4						{ border-top: 3px solid rgba( 255, 255, 255, 0 ); border-left: 3px solid rgba( 255, 255, 255, 0 ); border-right: 2px solid rgba( 255, 255, 255, 0 );
									  border-bottom: 2px solid rgba( 255, 255, 255, 0 ); padding: 0; border-radius: 15px; }
									  
	.bordercolorchange				{ border: 1px solid; border-radius: 4px; padding: 2px; animation: color-change-2 4s infinite; }
	@keyframes color-change-2 {
	  0% { color: #4dbc85; }
	  50% { color: red; }
	  100% { color: #4dbc85; }
	}
	
	.bordergray						{ border: 1px solid #7F7F7F; border-radius: 4px; padding: 2px; }
	.borderred						{ border: 1px solid red; border-radius: 4px; padding: 2px; }
	.gray							{ -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); }
	
	.winner							{ margin: 0 0 0 0; letter-spacing: 2px; font-weight: bold; color: #FFF;
								    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }
 
    .iframe							{ width: 100%; height: 100%; border: none ; margin: 0; padding: 0; }
		
	#footer p						{ font-family: Calibri, Verdana, Helvetica;	font-size: 12px; color: #C0C0C0; font-weight: normal; letter-spacing: 2px; }
	#footer ul li					{ font-family: Calibri, Verdana, Helvetica; font-size: 17px; color: #C0C0C0; font-weight: normal; letter-spacing: 2px; } 
	 
	#content h4 					{ font-family: Calibri, Verdana, Helvetica; color: #455560; font-weight: normal; }
	
	#content						{ padding: 0 0 70px 0; }
	
	#map							{ width: 424px; height: 220px; border: 1px #455560 solid; margin-top: 15px; }
	
	#googleMap 						{ width: 100%; height: 400px; -webkit-filter: grayscale(750%); filter: grayscale(75%); border-top: 1px #C0C0C0 solid; }
	
	/* Opmaak voor de tabel */	
	.table-hover	{ font-family: 'Roboto', sans-serif; font-size: 16px; margin: 0 0 20px 0; color : #4dbc85;}
	.table-hover th	{ font-family: 'Roboto', sans-serif; font-size: 16px; margin: 0 0 20px 0; color : #4dbc85;}
	
	input#address	 	{ display: none; }
	.showdiv			{ display: none; }
	.showdiv2			{ display: none; }
	.showdiv3			{ display: none; }
	.showdiv4			{ display: none; }
	.show-deelnemer		{ display: none; }
	.show-toeschouwer	{ display: none; }
	.hideblur			{ display: none; }
	div#preload 		{ display: none; }
	#operation1			{ display: none; }
	#operation2			{ display: none; }
	#operation3			{ display: none; }
	#operation4			{ display: none; }	
	#operation5			{ display: none; }
	.showtest			{ display: none; }
	.showtest2			{ display: none; }
			
	input:required:valid {
	  background-image: url(../images/overig/valid.png);
	  background-position: right top;
	  background-repeat: no-repeat; }
	  
	textarea:required:valid {
	  background-image: url(../images/overig/valid.png);
	  background-position: right top;
	  background-repeat: no-repeat; }
	  
	::-webkit-input-placeholder { /* Chrome */
	  color: #455560;
	  transition: opacity 250ms ease-in-out;
	}
	:focus::-webkit-input-placeholder {
	  opacity: 0.4;
	}
	:-ms-input-placeholder { /* IE 10+ */
	  color: #455560;
	  transition: opacity 250ms ease-in-out;
	}
	:focus:-ms-input-placeholder {
	  opacity: 0.4;
	}
	::-moz-placeholder { /* Firefox 19+ */
	  color: #7C888F;
	  opacity: 1;
	  transition: opacity 250ms ease-in-out;
	}
	:focus::-moz-placeholder {
	  opacity: 0.4;
	}
	:-moz-placeholder { /* Firefox 4 - 18 */
	  color: #455560;
	  opacity: 1;
	  transition: opacity 250ms ease-in-out;
	}
	:focus:-moz-placeholder {
	  opacity: 0.4;
	}    
  
	.form-group						{ font-family: Calibri, Verdana, Helvetica; font-size: 17px; color: #455560; font-weight: normal; border-radius: 3px; }
	.form-control					{ border-color: #4dbc85; border-width: 2px; }
	.form-control:focus				{ border-color: #14bc1a; box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }
	input[type=checkbox]:focus		{ border-color: #14bc1a; box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }

	form-control					{ font-family: Calibri, Verdana, Helvetica; font-size: 17px; color: #455560; font-weight: normal; } 
	
	label							{ font-family: 'Rajdhani', sans-serif; margin: 0 0 0 0; font-size: 17px; color: #FFF; font-weight: normal; }
	
	textarea						{ resize: none; }
	
	.btn-cls						{ padding: 1px 0 0 0; margin: 15px 0 30px 0; min-height: 40px; cursor: pointer; font-family: 'Rajdhani', sans-serif; font-size: 25px; color: #4dbc85;
										font-weight: bold; background-color: rgba(0, 0, 0, 0); border: 2px solid #4dbc85; text-decoration: none; backdrop-filter: blur(10px); border-radius: 10px; }
	
	.btn-cls:hover					{ color: #14bc1a; background-color: rgba(0, 0, 0, 0); border: 2px solid #14bc1a; box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }

	.hoverschaduw:hover				{ box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }
	.hoverschaduwgray:hover			{ box-shadow: 0 4px 8px 0 rgba(127, 127, 127, 0.2), 0 6px 20px 0 rgba(127, 127, 127, 0.19); }
	.hoverschaduwred:hover			{ box-shadow: 0 4px 8px 0 rgba(255, 0, 0, 0.4), 0 6px 20px 0 rgba(255, 0, 0, 0.5); }
	.hoverschaduw					{ transition: all 0.3s; }
	.hoverschaduwred				{ transition: all 0.3s; }
	
	.bright							{ filter: brightness(2.00); }
	
	.btn-block						{ transition: all 0.3s; }	
	
	.fa.fa-refresh					{ margin: 0 50px 0 0; }
	.fa.fa-music					{ margin: 0 10px 0 0; }
	.fa.fa-chevron-up				{ margin: 0; font-size: 50px; }
	.mw420							{ max-width: 420px; }
	.mw640							{ max-width: 640px; }
	.red							{ color: #FF0000; }
	.orange							{ color: #ff8c00; }
	.molgroen						{ color: #4dbc85; }
	.molgroen_nl					{ color: #4dbc85; }
	.molgroen_be					{ color: #1196A3; }
	.white							{ color: #FFFFFF; }
	.editie2020						{ color: #34A1A1; }
	.editie2021						{ color: #904F90; }
	.editie2022						{ color: #EF820D; }
	.editie2023						{ color: #58C29E; }
	.editie2023be					{ color: #F63E1A; }
	.editie2024be					{ color: #1E5BC6; }
	.editie2025be					{ color: #8E1938; }
	.widmwinnaar					{ color: #ffcc00; }	/* voorheen #EFAD25 */
	.widmsilver						{ color: #c0c0c0; }
	.widmbronze						{ color: #cd7f32; }
	.widmlead						{ color: #585857; }
	.widmquiz						{ color: #004d00; }
	
	.fa-stack 						{ font-size: 12px; }
	.fa-stack-text					{ font-family: 'Rajdhani', sans-serif; margin: 0 0 0 0; font-size: 17px; color: #FFF; }	

	.slideanim {visibility:hidden;}
	.slide1 {
    /* The name of the animation */
    animation-name: slide1;
    -webkit-animation-name: slide1;
    /* The duration of the animation */
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible;
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide1 {
    0% {
        opacity: 0;
        transform: translateY(90%);
    }
    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}
@-webkit-keyframes slide1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(90%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}										

/* css voor de navbar */	
.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 1);
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-family: 'Rajdhani', sans-serif; font-weight: bold;
  font-size: 28px;
  color: #4dbc85;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #14bc1a;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

@media screen and (max-height: 640px) {
  .overlay a {font-size: 18px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}	

/* CSS FOR CANDIDATE */

.teaser-candidate:hover {-webkit-animation:anim-brightnes .5s .01s ease;animation:anim-brightnes .5s .01s ease;
will-change:filter}@-webkit-keyframes anim-brightnes{0%{-webkit-filter:brightness(100%);filter:brightness(100%)}90%{-webkit-filter:brightness (200%);filter:brightness(200%)}100%{-webkit-filter:brightness(100%);
filter:brightness(100%)}}@keyframes anim-brightnes{0%{-webkit-filter:brightness(100%);filter:brightness(100%)}90%{-webkit-filter:brightness(200%);filter:brightness(200%)}100%{-webkit-filter:brightness(100%)
;filter:brightness(100%)}}

.teaser-button:hover { filter: brightness(2.00); }

/* CSS FOR BLINKING */

@keyframes blink {
    /**
     * At the start of the animation the dot
     * has an opacity of .2
     */
    0% {
      opacity: .2;
    }
    /**
     * At 20% the dot is fully visible and
     * then fades out slowly
     */
    20% {
      opacity: 1;
    }
    /**
     * Until it reaches an opacity of .2 and
     * the animation can start again
     */
    100% {
      opacity: .2;
    }
}

.saving span {
    /**
     * Use the blink animation, which is defined above
     */
    animation-name: blink;
    /**
     * The animation should take 1.4 seconds
     */
    animation-duration: 1.4s;
    /**
     * It will repeat itself forever
     */
    animation-iteration-count: infinite;
    /**
     * This makes sure that the starting style (opacity: .2)
     * of the animation is applied before the animation starts.
     * Otherwise we would see a short flash or would have
     * to set the default styling of the dots to the same
     * as the animation. Same applies for the ending styles.
     */
    animation-fill-mode: both;
}

.saving span:nth-child(2) {
    /**
     * Starts the animation of the third dot
     * with a delay of .2s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .2s;
}

.saving span:nth-child(3) {
    /**
     * Starts the animation of the third dot
     * with a delay of .4s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .4s;
}


/* VOOR iFRAME - in gebruik voor map alle locaties */
.embed-responsive-10by3 {
   padding-top: 41%;
}

/* LINE UNDER H1 */

.greenline:after {
    content: "";
    display: block;
    margin: 0 auto;
    width: 100px;
    padding-top: 15px;
    border-bottom: 1px solid #4dbc85; }
        
.greenline2:after {
    content: "";
    display: block;
    margin: 0 auto;
    width: 100px;
    padding-top: 10px;
    border-bottom: 1px solid #4dbc85;}
    @media screen and (max-width: 992px) {.greenline2:after {display: none; } }
    
.redline:after {
    content: "";
    display: block;
    margin: 0 auto;
    width: 100px;
    padding-top: 10px;
    border-bottom: 1px solid #FF0000;}
    @media screen and (max-width: 992px) {.redline:after {display: none; } }
    
    @media screen and (max-width: 992px) {.noshow {display: none; } }
    @media screen and (min-width: 992px) {.doshow {display: none; } }
    
/* ACHTUNG */

.achtung {
  animation: blur 1.00s ease-out infinite;
  text-shadow: 0px 0px 5px #fff, 0px 0px 7px #fff;
}

@keyframes blur {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff, 
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #7B96B8,
      0px 0px 150px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px -10px 100px #7B96B8,
      0px -10px 100px #7B96B8;
  }
}

/* ACHTUNG2 */

.achtung2 {
  animation: blur 1.00s ease-out;
}

@keyframes blur {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff, 
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #7B96B8,
      0px 0px 150px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px -10px 100px #7B96B8,
      0px -10px 100px #7B96B8;
  }
}

/* Typewriter */

.var-highlight		{ color: #C0AD60; }
.string-highlight	{ color: #4dbc85; }

#typewriter{
		font-size: 20px;
		margin: 0;
		font-family: "Courier New";
		color: #7F7F7F;

		&:after{
			content: "|";
			animation: blink 500ms linear infinite alternate;
		}
}

#typewriter2{
		font-size: 15px;
		margin: 0;
		font-family: "Courier New";
		color: #7F7F7F;

		&:after{
			content: "|";
			animation: blink 500ms linear infinite alternate;
		}
}

@-webkit-keyframes blink{
	0%{opacity: 0;}
	100%{opacity: 1;}
}

@-moz-keyframes blink{
	0%{opacity: 0;}
	100%{opacity: 1;}
}

@keyframes blink{
	0%{opacity: 0;}
	100%{opacity: 1;}
}

/*Cookie Consent Begin*/
#cookieConsent {
    background-color: rgba(0,51,24,0.5);
    backdrop-filter: blur(8px);
 	-webkit-backdrop-filter: blur(8px);
	border-top: 2px solid rgba(0, 0, 0, 0.3);
    min-height: 26px;
    font-size: 25px;
    color: #FFF;
    line-height: 26px;
    padding: 30px 30px 8px 30px;
    font-family: "Rajdhani",Helvetica,sans-serif;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    z-index: 9999;
}
#cookieConsent a {
    color: #4B8EE7;
    text-decoration: none;
}
#closeCookieConsent {
    float: right;
    display: inline-block;
    cursor: pointer;
    height: 20px;
    width: 20px;
    margin: 0 0 0 0;
    font-weight: bold;
}
#closeCookieConsent:hover {
    color: #FFF;
}
#cookieConsent a.cookieConsentOK {
    background-color: #4dbc85;
    color: #000;
    display: inline-block;
    border-radius: 5px;
    padding: 0 20px;
    cursor: pointer;
    float: right;
    margin: 0 60px 0 0px;
}
#cookieConsent a.cookieConsentOK:hover {
    background-color: #14BC1A;
    color: #FFF;
}
/*Cookie Consent End */

/* Effect van Wietse */

.effect-radius {
  border-radius: 15px;
}

.effect {
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.effect img {
  display: block;
}

.effect:hover img {
  -webkit-animation: filter-animation .6s 1;
}

.effect:hover:before {
  height: 3px;
  width: 100%;
  content: "";
  position: absolute;
  display: block; 
  background-color: #4dbc85;
  z-index: 10;
  -webkit-animation: line-move .4s 1;
  animation-fill-mode: forwards;
  transform: translateY(-4px);
}

@-webkit-keyframes line-move {
  0% {
    bottom: 0%;
  }
  100% {
    bottom: 99%;
  }
}

@-webkit-keyframes filter-animation {
  0% {
    -webkit-filter: brightness(100%);
  }
  70% {
    -webkit-filter: brightness(160%);
  }
}

/* End effect Wietse */

/* Effectred van Wietse */

.effectred {
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.effectred img {
  display: block;
}

.effectred:hover img {
  -webkit-animation: filter-animation .6s 1;
}

.effectred:hover:before {
  height: 3px;
  width: 100%;
  content: "";
  position: absolute;
  display: block; 
  background-color: red;
  z-index: 10;
  -webkit-animation: line-move .4s 1;
  animation-fill-mode: forwards;
  transform: translateY(-4px);
}

@-webkit-keyframes line-move {
  0% {
    bottom: 0%;
  }
  100% {
    bottom: 99%;
  }
}

@-webkit-keyframes filter-animation {
  0% {
    -webkit-filter: brightness(100%);
  }
  70% {
    -webkit-filter: brightness(160%);
  }
}

/* End effectred Wietse */

/* Effectgray van Wietse */

.effectgray {
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.effectgray img {
  display: block;
}

.effectgray:hover img {
  -webkit-animation: filter-animation .6s 1;
}

.effectgray:hover:before {
  height: 3px;
  width: 100%;
  content: "";
  position: absolute;
  display: block; 
  background-color: #7F7F7F;
  z-index: 10;
  -webkit-animation: line-move .4s 1;
  animation-fill-mode: forwards;
  transform: translateY(-4px);
}

@-webkit-keyframes line-move {
  0% {
    bottom: 0%;
  }
  100% {
    bottom: 99%;
  }
}

@-webkit-keyframes filter-animation {
  0% {
    -webkit-filter: brightness(100%);
  }
  70% {
    -webkit-filter: brightness(160%);
  }
}

/* End effectgray Wietse */

/* Effectscan van Wietse */

.effectscan {
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.effectscan img {
  display: block;
}

.effectscan img {
  -webkit-animation: filter-animation 2.2s 1;
}

.effectscan:before {
  height: 3px;
  width: 100%;
  content: "";
  position: absolute;
  display: block; 
  background-color: #4dbc85;
  z-index: 10;
  -webkit-animation: line-move 2s 1;
  animation-fill-mode: forwards;
  transform: translateY(-4px);
}

@-webkit-keyframes line-move {
  0% {
    bottom: 0%;
  }
  100% {
    bottom: 99%;
  }
}

@-webkit-keyframes filter-animation {
  0% {
    -webkit-filter: brightness(100%);
  }
  70% {
    -webkit-filter: brightness(160%);
  }
}

/* End effectscan Wietse */

.quiz-wrapper {
  border: 1px solid #4dbc85;
  padding: 0;
  border-radius: 5px;
  margin: 0 0 30px 0;
  box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19);
}

.quiz-header {
  min-height: 55px;	
  text-align: center;
  padding: 12px 12px 2px 12px;
  background: rgba(0,0,0, 0.5);
  opacity: 0,5;
  margin: 0 0 0 0;
}

.quiz-footer {
  min-height: 10px;	
  text-align: center;
  padding: 0px 0px 0px 0px;
  background: rgba(0,0,0, 0.5);
  opacity: 0,5;
  margin: 0;
}

/* Invoerveld tbv Executie */  

#invoerveld {
  border: 2px solid #4dbc85;
  padding: 12px 0 12px 24px;
  border-radius: 5px;
  background: white;
  max-width: 640px
}

#invoer {
  height: 45px;
  white-space: nowrap;
  overflow: hidden; 
  font-family: 'Source Code Pro', monospace;  
  font-size: 29px;
  color: #000;
  position: relative;
}

#border {
  border-bottom: solid 10px rgba(41,128,41,.75);
  position: absolute;
  right: -7px;
  width: 23px;
}

/* Animation */
#invoer {
  animation: animated-text 6s steps(15,end) 1s 1 normal both
}

#border {
   animation: animated-cursor 600ms steps(30,end) infinite;
}

/* text animation */

@keyframes animated-text{
  from{width: 0px;}
  to{width: 260px;}
}

@keyframes animated-cursor{
  from{border-bottom-color: rgba(41,128,41,.75);}
  to{border-bottom-color: transparent;}
}

/* txt on image */

.txtcontainer {
  position: relative;
  text-align: center;
  font-family: 'Roboto', sans-serif; font-size: 35px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase;
}

.txtcontainer2 {
  position: relative;
  text-align: right;
  font-family: 'Roboto', sans-serif;
}


.bottom-left {
  position: absolute;
  bottom: 0px;
  left: 16px;
}

.bottom-left2 {
  position: absolute;
  bottom: 0px;
  left: 15px;
}

.middle-left {
  position: absolute;
  bottom: 130px;
  left: 25px;
}

.winner2			{ margin: 0 0 0 0; letter-spacing: 2px; font-weight: bold; color: #14bc1a;
					text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }
				
.depot				{ margin: 0 0 0 0; letter-spacing: 2px; font-weight: bold; color: #FFF; font-size: 35px;
					text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }	

.depot2				{ margin: 0 0 0 0; font-weight: bold; color: #FFF; font-size: 28px;
					text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }	
					
.depot-small		{ margin: 0 0 0 0; letter-spacing: 2px; font-weight: bold; color: #FFF; font-size: 22px;
					text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }	
					
					
.countdowntimer		{ margin: 0 0 0 0; letter-spacing: 0px; font-weight: bold; color: #4dbc85;
					text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey; }	
					
@media screen and (min-width: 1200px) { div.countdowntimer { font-size: 50px; }}
@media screen and (max-width: 1200px) { div.countdowntimer { font-size: 45px; }}
@media screen and (max-width: 500px) { div.countdowntimer { font-size: 35px; }}
@media screen and (max-width: 380px) { div.countdowntimer { font-size: 25px; }}

					
/* colored scrollbars */

* {
  scrollbar-width: thin;
  scrollbar-color: #4dbc85 #00170A;
}
*::-webkit-scrollbar {
  width: 12px;
}
*::-webkit-scrollbar-track {
  background: #00170A;
}
*::-webkit-scrollbar-thumb {
  background-color: #4dbc85;
  border-radius: 10px;
  border: 3px solid #00170A;
}

/* color change voor Kerst */

.kerstcolorchange {
  animation: color-change 4s infinite;
}

@keyframes color-change {
  0% { color: #4dbc85; }
  50% { color: white; }
  100% { color: #4dbc85; }
}

/* color change grijs naar molgroen NL */

.colorchange-nl {
  animation: color-change-nl 4s infinite;
}

@keyframes color-change-nl {
  0% { color: #4dbc85; }
  50% { color: #7F7F7F; }
  100% { color: #4dbc85; }
}

/* color change grijs naar molgroen BE */

.colorchange-be {
  animation: color-change-be 5s infinite;
}

@keyframes color-change-be {
  0% { color: #1196A3; }
  50% { color: #7F7F7F; }
  100% { color: #1196A3; }
}

/* Timebar */

.round-time-bar {
  margin: 0;
  overflow: hidden;
}
.round-time-bar div {
  height: 10px;
  animation: roundtime calc(var(--duration) * 1s) steps(var(--duration))
    forwards;
  transform-origin: left center;
  background: linear-gradient(to bottom, green, #4dbc85);
}

.round-time-bar[data-style=smooth] div {
  animation: roundtime calc(var(--duration) * 1s) linear forwards;
}

@keyframes roundtime {
  to {
    /* More performant than `width` */
    transform: scaleX(0);
  }
}

/* Flip Image Horizontal */
.flip {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}

.rotate180 {
  -webkit-transform:rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* Moving progressbar */
.meter { 
    height: 22px;
    position: relative;
    overflow: hidden;
    margin: 0 0 5px 0 ;
    font-family: 'Rajdhani', sans-serif; font-size: 16px; color: #FFF;
}

.meter span {
    display: block;
    height: 100%;
}

.progress1 {
    background-color: #8e1938;
    -webkit-animation: progressBar 2s ease-in-out;
    -webkit-animation-fill-mode:both; 
    -moz-animation: progressBar 2s ease-in-out;
    -moz-animation-fill-mode:both;
	border-bottom-right-radius: 8px 8px;
}

@-webkit-keyframes progressBar {
  0% { width: 0; }
  100% { width: 100%; }
}

@-moz-keyframes progressBar {
  0% { width: 0; }
  100% { width: 100%; }
}

/* Change Image on Hover */

    .card {
        position: relative;
        display: inline-block;
    }
    .card .img-top {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
    }
    .card:hover .img-top {
        display: inline;
    }
    
    .card:hover .img-base {
	visibility:hidden;
}

/* Dropup */

.dropbtn {}

.dropup {
  position: relative;
  display: inline-block;
}

.dropup-content {
  display: none;
  position: absolute;
  bottom: 50px;
  background-color: #00170A; opacity: 0.95;
  min-width: 300px;
  z-index: 1;
  border: 1px solid #4dbc85; border-radius: 4px;  
}

.dropup-content a {
  display: block;
}

.dropup-content a:hover {background-color: #00170A}

.dropup:hover .dropup-content {
  display: block;
}

/* Modal overlay */

.modal-overlay {
  text-align: center; 
  font-family: 'Rajdhani', sans-serif; font-weight: bold;
  font-size: 25px;
  color: #7F7F7F; }

.modal-overlay a {
  text-decoration: none;
  font-family: 'Rajdhani', sans-serif; font-weight: bold;
  font-size: 25px;
  color: #4dbc85;
  display: block;
  transition: 0.3s; }
  
.table thead tr th, .table tbody tr td { border: none; }
.table-hover tbody tr:hover td  		{ background-color: #4dbc85; color: white; }
  
/* fish */

.fish {
  bottom: 15%;
  opacity: 1;  
  position: absolute;
  -webkit-animation: linear infinite;
  -webkit-animation-name: run;
  -webkit-animation-duration: 15s;
}
@-webkit-keyframes run {
  0% {
    left: 0;
  }
  48% {
    -webkit-transform: rotateY(0deg); 
  }
  50% { 
    left: calc(100% - 200px);
    -webkit-transform: rotateY(180deg); 
  }
  98% {
    -webkit-transform: rotateY(180deg); 
  }
  100% {
    left: 0;    
     -webkit-transform: rotateY(0deg);
  }
}  
  
/* carousel */    
  .carousel-inner img {
      /*width: 100%; /* Set width to 100% */
      margin: auto;
      -webkit-filter: grayscale(0%);
      /*min-height: 360px;*/
  }
  
/* Nederlandse en Vlaamse vlag */

	.grayflag {
	  filter: gray;
	  -webkit-filter: grayscale(0.4);
	  filter: grayscale(0.4);
	}
	
	.grayflag:hover {
	  -webkit-filter: grayscale(0);
	  filter: none;
	}
	
/* Animated Search Form */

.expand { width: 600px; box-sizing: border-box; border: 0; outline: 0; background: transparent; 
border-bottom: 5px solid #4dbc85; border-radius: 0; font-family: 'Roboto', sans-serif; font-size: 80px; color: #fff; font-weight: bold; }	

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  left: -10000px;
}

/* Submenu */

.submenu {
  position: fixed;
  transition: 0.6s;
  right: -165px;
  top: 29%;
  width: 220px;
  margin: -2.5em 0 0 0;
  z-index: 5;
  background: rgba( 255, 255, 255, 0.2 );
  backdrop-filter: blur( 4px );
  -webkit-backdrop-filter: blur( 4px );
  font-family: 'Rajdhani', sans-serif; font-weight: bold;
  font-size: 22px;
  color: #4dbc85;
  text-decoration: none;
  text-align: left;
  border-top: 3px solid rgba( 255, 255, 255, 0.25 );
  border-left: 3px solid rgba( 255, 255, 255, 0.25 );
  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
  border-radius: 15px 0 0 15px;
  padding: 0.5em 0.5em 0.5em 2.5em;
}

.submenu a {
	  text-decoration: none;
}

.submenu:hover {
	right: 0;
	transition: 0.3s;
}

ul.submenu li { list-style-type: square; }

	.sitemap a:link					{ color: #7F7F7F; text-decoration: none; border-bottom: 0px }
	.sitemap a:visited				{ color: #7F7F7F; text-decoration: none; border-bottom: 0px }
	.sitemap a:active				{ color: #7F7F7F; text-decoration: none; border-bottom: 0px }
	.sitemap a:hover				{ color: #14bc1a; text-decoration: none; border-bottom: 3px #14bc1a solid; }
	.sitemap a:focus				{ color: #7F7F7F; text-decoration: none; border-bottom: 0px }

.glass {
	background: rgba( 255, 255, 255, 0.2 );
	box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.10 );
	backdrop-filter: blur( 4px );
	-webkit-backdrop-filter: blur( 4px );
	border-radius: 15px;
	border-top: 3px solid rgba( 255, 255, 255, 0.25 );
	border-left: 3px solid rgba( 255, 255, 255, 0.25 );
	border-right: 2px solid rgba( 255, 255, 255, 0.10 );
	border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
	padding: 20px 20px 0px 20px;
	margin: 0 0 20px 0;
}

/* Highlight Div */

.highlightdiv {
	background: rgba( 255, 255, 255, 0.03 );
	box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
	border-radius: 15px;
	border-top: 3px solid rgba( 255, 255, 255, 0.25 );
	border-left: 3px solid rgba( 255, 255, 255, 0.25 );
	border-right: 2px solid rgba( 255, 255, 255, 0.10 );
	border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
	padding: 20px 20px 0px 20px;
	margin: 0 0 30px 0;
    backdrop-filter: blur(15px);
}

	.highlightdiv h3 { text-align: center; }
	.highlightdiv h6 { text-align: justify; }
	.highlightdiv p { text-align: justify; } 

.highlightdiv-header {
	background: rgba( 255, 255, 255, 0.03 );
	box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
	border-radius: 15px;
	border-top: 3px solid rgba( 255, 255, 255, 0.25 );
	border-left: 3px solid rgba( 255, 255, 255, 0.25 );
	border-right: 2px solid rgba( 255, 255, 255, 0.10 );
	border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
	text-align: center;
	padding: 12px 12px 0px 12px;
	margin: 0 0 30px 0;
    backdrop-filter: blur(15px);
}

.highlightdiv-header-fixed {
	background: rgba( 255, 255, 255, 0.03 );
	box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
	border-radius: 15px;
	min-height: 90px;	
	border-top: 3px solid rgba( 255, 255, 255, 0.25 );
	border-left: 3px solid rgba( 255, 255, 255, 0.25 );
	border-right: 2px solid rgba( 255, 255, 255, 0.10 );
	border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
	text-align: center;
	padding: 20px 20px 0px 20px;
	margin: 0 0 30px 0;
    backdrop-filter: blur(15px);
}

/* No print, no screen */

@media screen
{
    .noPrint{}
    .noScreen{display:none;}
}

@media print
{
    .noPrint{display:none;}
    .noScreen{}
}

/* Call-out */

.callout {
	position: fixed;
	bottom: 20px;
	right: 40px;
	max-width: 300px;
	background: rgba( 255, 255, 255, 0.03 );
	box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
	border-radius: 15px;
	border-top: 3px solid rgba( 255, 255, 255, 0.25 );
	border-left: 3px solid rgba( 255, 255, 255, 0.25 );
	border-right: 2px solid rgba( 255, 255, 255, 0.10 );
	border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
	z-index: 10000
}

.callout-header {
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	padding: 15px 15px 15px 15px;
	background: #003318;
	font-family: 'Rajdhani', sans-serif;
	font-size: 25px;
	font-weight: bold;
	color: #FFF;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.callout-container {
	background: rgba( 255, 255, 255, 0.2 );
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
	padding: 15px;
	backdrop-filter: blur( 4px );
	-webkit-backdrop-filter: blur( 4px );
	font-family: 'Roboto', sans-serif;
	font-size: 17px;
	color : #FFF;
	text-justify;
}

.closebtn2 {
	position: absolute;
	top: 5px;
	right: 15px;
	color: white;
	font-size: 30px;
	cursor: pointer;
}

.closebtn2:hover {
	color: #14bc1a;
}

/* TEN BEHOEVE VAN OVERLAY-BLUR */

.overlay-blur {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /*background: rgba( 255, 255, 255, 0.2 );*/
  background-color: rgba(0,0,0,0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 75;
}

.text-overlay-blur {
  position: absolute;
  top: 50%;
  left: 50%; 
  background-color: #003318;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  max-width: 640px;
}

.overons-wrapper {
  border-top: 3px solid rgba( 255, 255, 255, 0.25 );
  border-left: 3px solid rgba( 255, 255, 255, 0.25 );
  border-right: 2px solid rgba( 255, 255, 255, 0.10 );
  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
  padding: 0;
  border-radius: 15px;
  margin: 0 0 30px 0;
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(15px);
}

.overons-header {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 46px; 
  font-weight: bold; 
  color: #FFF; 
  letter-spacing: 1px; 
  text-transform: uppercase; 
  text-align: center;
  padding: 5px 5px 4px 5px;
  background: #003318;
  opacity: 0,5;
  margin: 0 0 0 0;
}

.overons-body {
  min-height: 400px;	
  text-align: center;
  padding: 12px 12px 12px 12px;
  margin: 0;
}

.overons-footer {
  min-height: 0px;	
  text-align: center;
  padding: 0px 12px 20px 12px;
  margin: 0;
}

/* Deelnemer divs */

.deelnemer-wrapper {
  border: 1px solid #4dbc85;
  padding: 0;
  border-radius: 5px;
  margin: 0 0 10px 0;
  backdrop-filter: blur(15px);
}

.deelnemer-wrapper-red {
  border: 1px solid red;
  padding: 0;
  border-radius: 5px;
  margin: 0 0 10px 0;
  backdrop-filter: blur(15px);
}

.deelnemer-header {
  font-family: 'Rajdhani', sans-serif; font-size: 44px; color: #fff; font-weight: bold; letter-spacing: 1px; text-transform: uppercase;
  border-bottom: 1px solid #4dbc85;
  text-align: center;
  padding: 4px 6px 0px 6px;
  background: rgba(0,0,0, 0.5);
  opacity: 0,5;
  margin: 0 0 0 0;
}

.deelnemer-body {
  padding: 12px 12px 8px 12px;
  margin: 0;	
}

.deelnemer-footer {
  min-height: 150px;	
  text-align: center;
  padding: 12px 12px 12px 12px;
  margin: 0;
}

.deelnemer-footer2 {
  min-height: 24px;	
  text-align: center;
  padding: 0px 12px 12px 12px;
  margin: 0;
}

/* TEN BEHOEVE VAN UNDERLAY */

#underlay {
  position: fixed;
  top: 50%;
  left: 50%; 
  background-color: #003318;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  z-index: 2;
}

  /* Style voor slider */
  .slider-wrapper {
  border-top: 3px solid rgba( 255, 255, 255, 0.25 );
  border-left: 3px solid rgba( 255, 255, 255, 0.25 );
  border-right: 2px solid rgba( 255, 255, 255, 0.10 );
  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
  padding: 0;
  border-radius: 15px;
  margin: 0 0 30px 0;
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
  min-height: 480px;
  backdrop-filter: blur(15px);
  }

  .slide-header {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 28px;
  font-weight: bold; 
  text-transform: uppercase; 
  color: #FFF; 
  text-align: center;
  padding: 15px 4px 13px 4px;
  background: #003318;
  opacity: 0,5;
  margin: 0 0 0 0;
  }

img[src*="widm_winnaar.png"] { transform: rotate(-8deg); }
.fixed.nlmol { filter: brightness(2.00); }
img[src*="logo_header_320.png"] { filter: brightness(1.30); }

  /* Style voor blockdiv */
  .blockdiv-wrapper {
  border-top: 3px solid rgba( 255, 255, 255, 0.25 );
  border-left: 3px solid rgba( 255, 255, 255, 0.25 );
  border-right: 2px solid rgba( 255, 255, 255, 0.10 );
  border-bottom: 2px solid rgba( 255, 255, 255, 0.10 );	
  padding: 0;
  border-radius: 15px;
  margin: 0 0 30px 0;
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(15px);
  }

  .blockdiv-header {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  border-bottom: 1px solid rgba( 255, 255, 255, 0.05 );
  font-family: 'Rajdhani', sans-serif;
  font-size: 25px;
  color: #FFF; 
  text-align: center;
  padding: 9px 20px 5px 20px;
  background: #003318;
  opacity: 0,5;
  margin: 0 0 0 0;
  }
  
  .blockdiv-header-middle {
  border-top: 1px solid rgba( 255, 255, 255, 0.05 );
  border-bottom: 1px solid rgba( 255, 255, 255, 0.05 );
  font-family: 'Rajdhani', sans-serif;
  font-size: 25px;
  color: #FFF; 
  text-align: center;
  padding: 9px 20px 5px 20px;
  background: #003318;
  opacity: 0,5;
  margin: 0 0 0 0;
  }
  
  .blockdiv-chapter {
  border-radius: 12px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 25px;
  color: #FFF; 
  text-align: center;
  padding: 9px 20px 5px 20px;
  background: #003318;
  opacity: 0,5;
  margin: 0 0 0 0;
  min-height: 50px;	
}
  
  .blockdiv-header-subtext {
  font-family: 'Roboto', sans-serif;
  padding: 0px 20px 0px 20px;
  font-size: 16px;
  color: #4dbc85;
  font-style: italic;
  min-height: 23px;
}
  
  .blockdiv-foto {
  }
  
  .blockdiv-bijschrift {
  font-family: 'Roboto', sans-serif;
  margin: 4px 20px 12px 20px;
  font-size: 15px;
  color: #7F7F7F;
  font-style: italic;
  text-align: justify;
  line-height: 16px;
}

  .blockdiv-text {
  font-family: 'Roboto', sans-serif;
  font-size: 17px;
  margin: 8px 20px 12px 20px;
  color : #7F7F7F;
  text-align: justify;
}

	/* Opmaak voor de tooltip */
	.tool + .tooltip > .tooltip-inner {
	  background-color: #002712;
	  color: #455560;
	  border: 2px solid #4dbc85;
	  border-radius: 10px;
	  padding: 15px;
	  font-family: 'Rajdhani', sans-serif; font-size: 20px; color : #FFF; 
	  box-shadow: 0 4px 8px 0 rgba(50, 207, 73, 0.2), 0 6px 20px 0 rgba(50, 207, 73, 0.19); }
	  
/* Tbv text-overlay */

.text-overlay {
  position: absolute;
  bottom: -0.2em;
  left: 15px;
  font-family: 'Rajdhani', sans-serif; font-size: 4vw; font-weight: bold; color: #FFF; letter-spacing: 0px;
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px grey;
}