/*-------------- BODY --------------*/
body{
    font-family: 'Karla', sans-serif;
    color:white;
}

/*-------------- FONT-FAMILY --------------*/
@font-face {
    font-family: 'LolaPeluza';
    font-style: normal;
    font-weight: normal;
    src: url("../Lettertypes/Lolapeluza Black.otf") format("opentype");
}

@font-face {
    font-family: 'LolaPeluza Regular';
    font-style: normal;
    font-weight: normal;
    src: url("../Lettertypes/Lolapeluza.otf") format("opentype");
}

@font-face {
	font-family: 'LolaPeluza Shadow';
	font-style: normal;
	font-weight: normal;
	src: url("../Lettertypes/Lolapeluza Shadow.otf") format("opentype");
}

/*-------------- DISPLAY HEADERS --------------*/
h1{
    font-family: 'LolaPeluza Regular';
    font-size:64px;
}

h2{
    font-family: 'LolaPeluza';
    font-size:48px;
    margin-bottom:50px;
}

h3{
    font-family: 'LolaPeluza';
    font-size:40px;
}

h4{
    font-family: 'LolaPeluza';
    font-size:30px;
}

h4.totale_prijs{
    font-family: 'Karla', sans-serif;
    font-size:30px;
}

h5{
    font-family: 'LolaPeluza';
    font-size:24px;
    color:#f9de69;
}

h6{
	font-family: 'LolaPeluza';
	font-size:32px;
	margin:50px 0px 20px 0px;
}

.BlokTitel{
	font-family: 'LolaPeluza';
	margin-bottom:20px;
}

a.white-link:link, a.white-link:active, a.white-link:visited{
	color:#f9de69;
	text-decoration:underline;
}

a.footer-link:link, a.footer-link:active, a.footer-link:visited{
	color:white;
	text-decoration:underline;
}

a.product-link:link, a.product-link:active, a.product-link:visited{
	
    text-decoration: none;
    cursor: pointer;
}

.yellow_text{
	color:#f9de69;
}

/*-------------- HEADER - Main Page --------------*/
.svg-container_main { 
	display: inline-block;
	position: relative;
	width: 100%;
	padding-bottom: 39.85416666666667%;
	vertical-align: middle;
}

/*-------------- HEADER --------------*/
.svg-container { 
	display: inline-block;
	position: relative;
	width: 100%;
	padding-bottom: 18.85416666666667%;
	vertical-align: middle;
	z-index: 0;
}

/*-------------- NAVIGATION --------------*/
.svg-content { 
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}

a.svg-link:link, a.svg-link:active, a.svg-link:visited{
	text-decoration:none !important;
	fill:#fff !important;
	z-index:1000 !important;
}

a.svg-link:hover{
	fill:#fce910 !important;
}

a.svg-link.link-active{
	fill:#fce910 !important;
}

a.active-link{
	text-decoration: none;
	color: #fce910 !important;
}

a.link-hover{
	text-decoration: none;
	color: white;
}

a.link-hover:hover{
	text-decoration: none;
	color: #fce910;
}

.navbar-collapse {
	max-height: 400px;
	overflow-y: auto;
}

.dynamicNavFirst{
	display: inline;
}

.dynamicNavRest{
	display: inline;
	margin-left: 0;
	padding-left: 2.5%;
}

a.Praktisch-Hover{
	border:2px solid white;
	border-radius:10px;
	padding:5px 10px;
}

a.Praktisch-Hover:hover{
	border:2px solid #fce910;
	border-radius:10px;
	padding:5px 10px;
}

a.Openingsuren{
	color:white;
	text-decoration:none;
	font-weight:bold;
}

a.Evenementen{
	color:white;
	text-decoration:none;
	font-weight:bold;
}

a.Coronamaatregelen{
	color:white;
	text-decoration:none;
	font-weight:bold;
}

a.Contact{
	color:white;
	text-decoration:none;
	font-weight:bold;
}

#font_openingsuren_tekst{
	font-weight:bold;
} 

.vertical-center {
	min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
	display: flex;
	align-items: center;
}

a.menu_link:link, a.menu_link:active, a.menu_link:visited{
	color:white;
	text-align:left;
	text-decoration: none;
	font-size:20px;
}

a.menu_link:hover{
	border-bottom:2px solid black;
	margin-bottom:-2px;
}

.menu_link_active{
	border-bottom:2px solid black;
	margin-bottom:-2px;
}

/*-------------- LIST --------------*/
ul.leaders {
      list-style-type: none;
      width: 100%;
      margin: auto;
      padding: 0;
}

ul.leaders li {
	font-size:20px;
}

.list {
	display: flex;
	line-height: 2.0em;
}

.price {
	text-align: left;
}

.spanformat {
	margin-right: 5px;
	flex: 1;
	display: flex;
}

.first {
	flex: 0.7;
	display: flex;
}

.first:after {
	content: '';
	/*border-bottom: dashed 1px lightgray;*/
	background-image: linear-gradient(to right, #fff 30%, rgba(255, 255, 255, 0) 0%);
	background-position: bottom;
	background-size: 10px 1px;
	background-repeat: repeat-x;
	margin-bottom: 5px;
	margin-left: 0.5em;
	flex:1;
}

/*-------------- CARD --------------*/
.card{
	background-color:transparent !important;
    border-radius:0 !important;
    border:0 !important;
}

/*-------------- BREADCRUMB --------------*/
.broodkruimel{
	margin-left:50px;
	color:#96cfc8;
	font-weight:bold;
}

.broodkruimel a{
	color:#96cfc8;
}

/*-------------- BUTTONS --------------*/
.btn-orange{
	background-color:#f39200 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-orange:hover{
	color:#fff !important;
	background-color:#af8e03 !important;
}

.btn-dorange{
	background-color:#f29200 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-dorange:hover{
	color:#fff !important;
	background-color:#cc7d04 !important;
} 

.btn-pink{
	background-color:#e3858c !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-pink:hover{
	color:#fff !important;
	background-color:#e36b74 !important;
}

.btn-yellow{
	background-color:#E1B600 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-yellow:hover{
	color:#fff !important;
	background-color:#af8e03 !important;
}

.btn-groen{
	background-color:#006633 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-groen:hover{
	color:#fff !important;
	background-color:#01a252 !important;
}

.btn-red{
	background-color:#e42a37 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-red:hover{
	color:#fff !important;
	background-color:#b8232d !important;
}

.btn-dored{
	background-color:#a72126 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-dored:hover{
	color:#fff !important;
	background-color:#c24146 !important;
}

.btn-blue{
	background-color:#1d71b8 !important;
	color:#fff !important;
	font-weight:bold !important;
}

.btn-blue:hover{
	color:#fff !important;
	background-color:#0b4a80 !important;
}

/*-------------- DATEPICKER --------------*/

td.disabled{
    color:#E50059 !important;
}

/*-------------- TABLES --------------*/

.left-space {
	padding-left:20px;
}

.table_blauw{
	border:none;
	border-collapse:collapse;
	border-spacing:0;
}

.table_blauw td{
	border:none;
	border-collapse:collapse;
	border-spacing:0;
}

.td_blauw{
	background-color:#36a9e0;
}

.td_groen{
	background-color:#6a953b;
}

.td_paars{
	background-color:#D1A5CF;
}

.td_blauwgroen{
	background-color:#00b1a7;
}

.td_roze{
	background-color:#F3A291;
}

.td_oranje{
	background-color:#F39200;
}

.td_donkerblauw{
	background-color:#1d71b9;
}

.tr_lolapeluza{
	font-family: 'LolaPeluza';
	font-size:24px;
}

.td_geel{
	background-color:#fedf60;
}

.td_rood{
	background-color:#cd171a;
}

.td_donkergeel{
	background-color:#E1B600;
}

.table_binnenspeeltuin td{
	padding:10px 0px;
}

.td_lichtgroen{
	background-color:#9fceaa;
}

.td_felgroen{
	background-color:#39A935;
}

.td_donkeroranje{
	background-color:#ef7917;
}

.td_goud{
	background-color:#ffbc22;
}

.td_purper{
	background-color:#be2568;
}

.td_lolapeluza{
	font-family: 'LolaPeluza';
	font-size:24px;
	padding-top:20px;
}

.tekst_bg_groen{
	background-color:#c5e8d4;
	color:#00662b;
}

.tekst_bg_blauw{
	background-color:#80d7ef;
	color:#242d83;
}

.menukaart_bg{
	background-color: rgba(0,102,52,1);
}

.table-menukaart td{
	padding:0px !important;
}

/*-------------- IMAGES --------------*/
.noselect { 
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	 user-select: none;
}

/*-------------- INPUT --------------*/

/*-------------- UPLOADS --------------*/
.custom-file-label::after{
	content: "Bladeren" !important;
}

/*-------------- MAIN --------------*/
.binnenspeeltuin_tekst{
	font-family: 'LolaPeluza';
	font-size:61px;
	transform: rotate(354.02deg);
}

.feestjes_tekst{
	font-family: 'LolaPeluza';
	font-size:61px;
	transform: rotate(15.42deg);
}

.brasserie_tekst{
	font-family: 'LolaPeluza';
	font-size:61px;
	transform: rotate(338.97deg);
}

.springkastelen_tekst{
	font-family: 'LolaPeluza';
	font-size:61px;
	transform: rotate(8deg);
}

.scholengroepen_tekst{
	font-family: 'LolaPeluza';
	font-size:61px;
	transform: rotate(350.38deg);
}

.homepage_top_main{
	background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_home.png");
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	padding-top:19.53125%;
	height:0;
	margin-bottom:-1px;
}

button:focus{
	outline: 1px;
	outline: 5px auto -webkit-focusring-color;
}

/*-------------- BINNENSPEELTUIN --------------*/
.homepage_top_binnenspeeltuin{
	background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_vulkaan.png");
	padding-top:39.58333333333333%;
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	height:0;
	margin-bottom:-1px;
}

ul.opsomming_ster{
	margin-left:10px;
	text-align:left;
	list-style-type:none;
	margin-bottom:30px;
}

ul.opsomming_ster li{
	background-image: url("../Afbeeldingen/layout/opsomming_ster.png");
	background-repeat: no-repeat;
	line-height: 41px;
	padding-left: 60px;
	margin-bottom:10px;
}

/*-------------- FEESTJES --------------*/
.homepage_top_feestjes{
	background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_feestjes.png");
	padding-top:43.22916666666667%;
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	height:0;
	margin-bottom:-1px;
}

/*-------------- BRASSERIE --------------*/
.restaurant_blauw{
	background-image: url("../Afbeeldingen/layout/achtergronden/rafenotje_walvis.jpg");
	background-size:contain;
	background-position:center center;
	background-repeat: no-repeat;
}

.restaurant_donkerblauw{
	background-image: url("../Afbeeldingen/layout/achtergronden/rafenotje_donkerblauw.jpg");
	background-size:contain;
	background-position:center center;
	background-repeat: no-repeat;
}

.homepage_top_brasserie {
	background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_brasserie.png");
	padding-top:42.96875%;
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	height:0;
	margin-bottom:-1px;
}

/*-------------- SCHOLEN & GROEPEN --------------*/
.scholen_groepen_tekst {
	padding:0px 10px;
	font-weight:bold;
}

.homepage_top_scholen {
    background-image:url("../Afbeeldingen/layout/achtergronden/scholen_groepen.png");
    padding-top:39.84375%;
    background-size:100%;
    background-repeat:no-repeat;
    width:100%;
    height:0;
    margin-bottom:-1px;
}

/*-------------- WEBSHOP --------------*/
.homepage_top_webshop{
    background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_webshop.png");
    padding-top:42.96875%;
    background-size:100%;
    background-repeat:no-repeat;
    width:100%;
    height:0;
    margin-bottom:-1px;
}

/*-------------- SPRINGKASTELEN --------------*/
.homepage_top_springkastelen{
    background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_springkastelen.png");
    padding-top:48.64583333333333%;
    background-size:100%;
    background-repeat:no-repeat;
    width:100%;
    height:0;
    margin-bottom:-1px;
}

input[type=checkbox]:checked + label > div.card{
    background-color: #00a1cf !important;
    color:white !important;
}

.LinkSpringKasteel{
    color:#2B317F;
}

.img_slider{
    display:block;
    min-width:100%;
    height:auto;
}

/*-------------- CONTACT --------------*/
.Filtering{
	display:none;
}

a.Praktisch-Hover-Contact{
	border:2px solid #fce910;
	border-radius:10px;
	padding:5px 10px;
}

a.Praktisch-Hover-Contact:hover{
	border:2px solid #fce910;
	border-radius:10px;
	padding:5px 10px;
}

.homepage_top_zeemeermin{
	background-image:url("../Afbeeldingen/layout/achtergronden/rafenotje_zeemeermin.png");
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	padding-top:19.53125%;
	height:0;
	margin-bottom:-1px;
}

.map-responsive{
	overflow:hidden;
	padding-bottom:50%;
	position:relative;
	height:0;
}

.map-responsive iframe{
	left:0;
	top:0;
	height:100%;
	width:100%;
	position:absolute;
}

/*-------------- EVENEMENTEN --------------*/
.modal-footer {
	border:none !important;
}

.modal-header {
	border:none !important;
}

.btn-custom-paars {
	color: #fff;
	background-color: #493556;
	border-color: #493556;
}

.btn-custom-paars:hover {
	color: #fff;
	background-color: #7b5a90;
	border-color: #7b5a90;
}

.bg-custom-paars {
	background-color: #d1a5cf;
}

.btn-custom-groen {
	color: #fff;
	background-color: #006354;
	border-color: #006354;
}

.btn-custom-groen:hover {
	color: #fff;
	background-color: #008a75;
	border-color: #008a75;
}

.bg-custom-groen {
	background-color: #6e9241;
}

.bg-custom-donkergroen {
	background-color: #00b1a7;
}

.btn-custom-roze {
	color: #fff;
	background-color: #d73343;
	border-color: #d73343;
}

.btn-custom-roze:hover {
	color: #fff;
	background-color: #fa4657;
	border-color: #fa4657;
}

.bg-custom-roze {
	background-color: #F3A291;
}

.btn-custom-oranje {
	color: #fff;
	background-color: #e94e1b;
	border-color: #e94e1b;
}

.btn-custom-oranje:hover {
	color: #fff;
	background-color: #ff6735;
	border-color: #ff6735;
}

.bg-custom-oranje {
	background-color: #ffbc22;
}

/*-------------- COOKIES --------------*/
#cookies { 
	width: 50%;
	bottom: 0;
	padding: 20px 5%;
	border-radius: 10px 10px 0px 0px;
	background: rgba(0,102,52,1);
	box-shadow: 1px 10px 70px 1px black;
	z-index: 2;
	position: fixed;
	font-size: 1.29999998vw;right: 25%;
	text-align:center;
}
  
#cookies p {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.35);
	text-align: center; 
	color: rgb(255,255,250);
	margin: 4px;
}

#cookies .cookie-accept {
	margin: auto;
	cursor: pointer;
	color: black;
}

#cookies_klein { 
	width: 100%;
	top: 0;
	padding: 20px 5%;
	background: rgba(0,102,52,1);
	box-shadow: 1px 10px 70px 1px black;
	z-index: 2;
	position: fixed;
	font-size: 1.29999998vw;
	text-align:center;
}
  
#cookies_klein p {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.35);
	text-align: center; 
	color: rgb(255,255,250);
	margin: 4px;
}

#cookies_klein .cookie-accept {
	margin: auto;
	cursor: pointer;
	color: black;
}

/*-------------- PRE-FOOTER --------------*/
.content_top{
	background-image:url("../Afbeeldingen/content_top.jpg");
	background-size:100%;
	background-repeat:no-repeat;
	width:100%;
	padding-top:12.91666666666667%;
	height:0;
	margin-bottom:-1px;
}

/*-------------- FOOTER --------------*/
.footer_top{
	background-image:url("../Afbeeldingen/footer_top.png");
	background-size:100%;
	background-repeat:no-repeat;
	background-color:#779346;
	width:100%;
	padding-top:13.02083333333333%;
	height:0;
	margin-bottom:-1px;
}

/*-------------- BLADWIJZER --------------*/
.bladwijzer{
	position:fixed;
	right:0;
	background-color:#b8232d;
	padding: 5px;
	z-index: 999;
}

/*------------- MENUKAART NAV -------------*/

 /* The Overlay (background) */
 .overlay {
	/* Height & width depends on how you want to reveal the overlay (see JS below) */   
	height: 100%;
	width: 0;
	position: fixed; /* Stay in place */
	z-index: 2; /* Sit on top */
	left: 0;
	top: 0;
	background-color: rgba(0,102,52,1); /* Black fallback color */
	background-color: rgba(0,102,52,1); /* Black w/opacity */
	overflow-x: hidden; /* Disable horizontal scroll */
	transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
  }
  
  /* Position the content inside the overlay */
  .overlay-content {
	position: relative;
	top: 10%; /* 25% from the top */
	width: 100%; /* 100% width */
	text-align: center; /* Centered text/links */
	margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
  }
  
  /* The navigation links inside the overlay */
  .overlay a {
	padding: 8px;
	text-decoration: none;
	font-size: 36px;
	color: #818181;
	display: block; /* Display block instead of inline */
	transition: 0.3s; /* Transition effects on hover (color) */
  }
  
  /* When you mouse over the navigation links, change their color */
  .overlay a:hover, .overlay a:focus {
	color: #f1f1f1;
  }
  
  /* Position the close button (top right corner) */
  .overlay .closebtn {
	position: absolute;
	top: 20px;
	right: 45px;
	font-size: 60px;
  }
  
  /* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
  @media screen and (max-height: 450px) {
	.overlay a {font-size: 20px}
	.overlay .closebtn {
	  font-size: 40px;
	  top: 15px;
	  right: 35px;
	}
  }

  .navigatie-knop{
	font-size:30px;
	cursor:pointer;
	background-color:#00662b;
  }

  .navigatie-div{
	z-index:1;
  }

/* h4 menukaart lijntjes links & rechts */
  h4.menu-cat {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'LolaPeluza';
	-webkit-text-fill-color: white; /* Will override color (regardless of order) */
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: black;
  }
  h4.menu-cat span {
	margin: 0 5px;
  }
  h4.menu-cat:before,
  h4.menu-cat:after {
	background: black;
	height: 2px;
	flex: 1;
	content: '';
  }
  h4.menu-cat.left:after {
	background: none;
  }
  h4.menu-cat.right:before {
	background: none;
  }

  .tabel_kasteel {
    font-size: 20px; 
    border-collapse: collapse !important; 
    border-spacing: 0 !important;
    width: 100% !important;
  }