* {
	margin: 0px;
	padding: 0px;
}

*:focus {outline:0;} 	/* remove black border in form elements*/

::-webkit-scrollbar {width: 8px;}						 								 /* width */
::-webkit-scrollbar-track {box-shadow: inset 0 0 5px #1D3A60; border-radius: 10px;}	/* Track */
::-webkit-scrollbar-thumb {background: #32557f; border-radius: 10px;}					/* Handle */
::-webkit-scrollbar-thumb:hover {background: #1D3A60;}									/* Handle on hover */

:root {
	--gold: #ffb338;
	--light-shadow: #77571d;
	--dark-shadow: #3e2904;
}

/*

body {
	padding: 16px 0px 10px;
	background: url('images/background.jpg') #5f92d2 repeat-x 0% 0%;
	color: #fff;
	font-family: tahoma, arial, sans-serif;
	font-size: 11px;
	text-align: center;
}

*/

body {
	background-color: #003366;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 800'%3E%3Cg %3E%3Ccircle fill='%23003366' cx='400' cy='400' r='600'/%3E%3Ccircle fill='%230d3a6b' cx='400' cy='400' r='500'/%3E%3Ccircle fill='%23184070' cx='400' cy='400' r='400'/%3E%3Ccircle fill='%23214775' cx='400' cy='400' r='300'/%3E%3Ccircle fill='%232a4e7a' cx='400' cy='400' r='200'/%3E%3Ccircle fill='%2332557F' cx='400' cy='400' r='100'/%3E%3C/g%3E%3C/svg%3E");
	background-attachment: fixed;
	background-size: cover;
	padding: 16px 0px 10px;
	color: #fff;
	font-family: tahoma, arial, sans-serif;
	font-size: 11px;
	text-align: center;
}

::selection {
    background: #cc0000;
    color: #ffff99;
    text-shadow: none;
}
::-moz-selection {
    background: #cc0000;
    color: #ffff99;
    text-shadow: none;
}
::-webkit-selection {
	background: #cc0000;
	color: #ffffff;
  }

a {color: #bfd8f6; text-decoration: none;}
a:hover {color: #ffb338;}
li {list-style: none; } /* Remove list bullets */
ul {list-style: none; } /* Remove list bullets */

p {
	margin: 10px 0px 5px;
	text-align: justify;
	line-height: 14px;
}

H2 {
	font-size: 14px;
	color: #b7caf3;
	text-shadow: 3px 0px 7px #233d5c, -3px 0px 7px #233d5c, 
	  0px 4px 7px #233d5c;
	padding-bottom: 10px;
}

H3 {
	font-size: 14px;
	color: #fff;
	text-shadow: 3px 3px 20px #233d5c,
    -2px 1px 30px #233d5c;
	padding-bottom: 6px;
}

.clearthis {
	margin : 0px;
	height : 1px;
	clear : both;
	float : none;
	font-size : 1px;
	line-height : 0px;
	overflow : hidden;
}

.blink {
	animation: blinker 3s linear infinite;
  }
  
  @keyframes blinker {
	50% {
	  opacity: 0;
	}
  }

/* Shake button  */

.wiggle {
	-webkit-animation: shake 2.5s infinite;
    -moz-animation: shake 2.5s infinite;
    -o-animation: shake 2.5s infinite;
    animation: shake 2.5s infinite;
}

.wiggle:hover {
	animation: none;
}

@keyframes shake {
	0%, 7%	{transform: rotateZ(0);}
	15%		{transform: rotateZ(-12deg);}
	20%		{transform: rotateZ(10deg);}
	25%		{transform: rotateZ(-10deg);}
	30%		{transform: rotateZ(6deg);}
	35%		{transform: rotateZ(-4deg);}
	40%, 100% {transform: rotateZ(0);}
}

/* END Shake button  */ 

iframe {
	width: 550px; 
	height: 450px; 
	border: 2px solid #fff;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	-moz-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
}

/* BEGIN FADE IN ID   */

#fade-in-content  {
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

/* END FADE IN ID   */

/* BEGIN FADE UP ID   */

#fade-up-content {
	animation: 1.5s fadeInUp;
}

@keyframes fadeInUp {
	0% {
	  transform: translateY(100%);
	  opacity: 0;
	}
	100% {
	  transform: translateY(0%);
	  opacity: 1;
	}
}

/* END FADE UP ID   */
/* BEGIN FADE IN TO RIGHT ID   */

#fade-into-right {
	animation: left-to-right-fade-in 1s ease-in;
	-webkit-mask-repeat: no-repeat;
  }
  
  @keyframes left-to-right-fade-in {
	0% {
	  -webkit-mask-size: 0%;
	  -webkit-mask-image: linear-gradient(
		to right,
		rgba(0, 0, 0, 1) 70%,
		rgba(0, 0, 0, 0)
	  );
	}
	100% {
	  -webkit-mask-size: 100%;
	  -webkit-mask-image: linear-gradient(
		to right,
		rgba(0, 0, 0, 1) 70%,
		rgba(0, 0, 0, 0)
	  );
	}
  }

  /* END FADE IN TO RIGHT ID   */
  
/*  STUDIO NOTUS heading-Name */

.wrapper {
	/*	background: radial-gradient(#272727, #1b1b1b); */
		display: grid;
		grid-template-areas: 'overlap';
		place-content: center;
		margin-top: -15px;
	/*	text-transform: uppercase; */
		height: 100%;
		word-spacing: -15px; 
		transition-duration: 3s;
	}
	
	.wrapper:hover {
		transform: scale(1.15);
		cursor: default;
	}
	
	.wrapper > div {
		background-clip: text;  
		-webkit-background-clip: text;
		color: #5f92d2;
		font-family: 'Poppins', sans-serif;
		font-weight: 900;
		font-size: clamp( 2em, 9vw, 4.5rem);
		grid-area: overlap;
		letter-spacing: 2px;
		-webkit-text-stroke: 4px transparent;
	}

	div.bg {
		background-image: repeating-linear-gradient( 105deg, 
		  var(--gold) 0% , 
		  var(--dark-shadow) 5%,
		  var(--gold) 12%);
		color: transparent;
		filter: drop-shadow(5px 15px 15px black);
		transform: scaleY(1.05);
		transform-origin: top;
	}
	  
	div.fg{
		background-image: repeating-linear-gradient( 5deg,  
		  var(--gold) 0% , 
		  var(--light-shadow) 23%, 
		  var(--gold) 31%);
		color: #214674;
		transform: scale(1);
	}
	
/*  Einde STUDIO NOTUS heading-Name */

div.table{float: Left; margin: 10px 0px 20px 10px;}
div.row {clear: both; padding: 0px;}

span.lid {
	background: #fff;
	color: #1D3A60;
	width: 330px;
}

label.rounded {
	float: left;
	border-left: 2px solid #e3ecf8;
	border-right: 2px solid #e3ecf8;
	background-color: #3d6290;
	color: #fff;
	font-size: 11px;
	padding: 1px 5px;
	margin-right: 10px;
	outline: 0;
	width: 110px;
	text-align: right;
	-webkit-appearance: none;
}

input.profiel {
	float: left;
	border: transparent;
	border-bottom: 1px dashed #3d6290;
	color: #3d6290;
	font-size: 11px;
	padding: 0px 10px;
	width: 300px;
	margin-left: 8px;
}

select.profiel {
	float: left;
	border: transparent;
	border-bottom: 1px dashed #3d6290;
	color: #3d6290;
	font-size: 11px;
	padding: 0px 10px;
	margin-left: 8px;
}

textarea.profiel {
	float: left;
	border: transparent;
	border-bottom: 1px dashed #3d6290;
	color: #3d6290;
	font-size: 11px;
	padding: 8px 10px;
	margin-left: 8px;
	width: 300px;
	height: 70px;
}

label.login {
	float: left;
	border-left: 2px solid #e3ecf8;
	border-right: 2px solid #e3ecf8;
	background-color: #3d6290;
	color: #fff;
	font-size: 10px;
	padding: 3px 5px 3px 5px;
	margin-left: 8px;
	width: 80px;
	text-align: right;
}

input.login {
	border: 0px;
	border-bottom: 1px dashed #3d6290;
	color: #3d6290;
	font-size: 10px;
	padding-top: 2px;
	padding-bottom: 2px;
	outline:0;
}

select.login {
	border: 0px;
	border-bottom: 1px dashed #3d6290;
	color: #3d6290;
	font-size: 10px;
	outline:0;
}



input.up	{margin-top: 10px;}
select.up	{margin-top: 10px;}
label.up 	{border-radius: 20px 0px 0px 0px; border-top: 2px solid #e3ecf8; padding-top: 10px; }
label.down	{border-radius: 0px 0px 0px 20px; border-bottom: 2px solid #e3ecf8; padding-bottom: 10px; }
label.surplus {height: 92px;}
label.boven {border-radius: 20px 0px 0px 0px; border-top: 2px solid #e3ecf8; padding-top: 6px; margin-top: 10px; }
label.onder	{border-radius: 0px 0px 0px 20px; border-bottom: 2px solid #e3ecf8; padding-bottom: 3px;  margin-bottom: 14px;}
/* label.rounded:hover {background:#4677b3;} */
input.profiel:hover {background:#eafcff;border:1px solid lightcoral;}
input.profiel:focus {background:#eafcff;border:1px solid lightcoral;}
input.profiel:active {background:#eafcff;border:1px solid lightcoral;}
select.login:hover {background:#eafcff;}
input.login:hover {background:#eafcff;border:1px solid lightcoral;}
select.profiel:hover {background:#eafcff;border:1px solid lightcoral;}
select.profiel:active {background:#eafcff;border:1px solid lightcoral;}
select.cijfer {width: 82px;}
select.midle {width: 140px;}
select.whole {width: 310px;}
textarea.profiel:focus {background:#eafcff;border:1px solid lightcoral;}

#leden {
	position: absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 350px;
	height: 186px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
	color: #EFE0C8;
}

#res2 {
	position: absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 350px;
	height: 50px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
	color: #EFE0C8;
}

#res3 {
	position: absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 340px;
	height: 199px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
	color: #EFE0C8;
}

#res3_bis {
	position: absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 350px;
	height: 215px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
	color: #EFE0C8;
}

#register {
	position: absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 350px;
	height: 155px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
	color: #EFE0C8;
}

#gastbk {
	position:absolute;
	z-index: -1;
	border: 2px solid #1D3A60;
	border-radius: 0px 20px 20px 0px;
	width: 350px;
	height: 176px;
	margin: 0px 100px 0px 128px;
	background-color: #fff;
}

label.error {
	float: left;
	background-color: tomato;
	border: 1px solid #e3ecf8;
	color: #fff;
	text-align: left;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 20px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 11px;
	padding: 5px 5px 5px 35px;
	margin: 10px 0px 10px 10px;
	outline: 0;
	width: 435px;
	-webkit-appearance: none;
}

label.melding {
	float: left;
	background-color:darkolivegreen;
	border: 1px solid yellowgreen;
	color:#fff;
	text-align: left;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 11px;
	padding: 10px 15px 10px 15px;
	margin: 10px 5px 25px 15px;
	outline: 0;
	width: 500px;
	-webkit-appearance: none;
}

#container {
	margin: 0px auto;
	width: 768px;
}

/* tabel Palmares */

table.palm {
	width: 100%;
	table-layout: fixed;	
	font-size: 11px;
}

td.palm1 {
	text-align: center; 
	width: 12%;
	-webkit-border-top-left-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-bottomleft: 15px;
	border-top-left-radius: 15px;
	border-bottom-left-radius: 15px;
	-webkit-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	-moz-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
}

td.palm2 {
	text-align: left; 
	width: 50%; 
	padding: 2px 0px 2px 5px;
	-webkit-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	-moz-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
}

td.palm3 {
	text-align: left; 
	width: 38%; 
	padding: 2px 0px 2px 5px;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-bottom-right-radius: 15px;
	-moz-border-radius-topright: 15px;
	-moz-border-radius-bottomright: 15px;
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
	-webkit-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	-moz-box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
	box-shadow: 10px 10px 34px 4px rgba(0,0,0,0.41);
}

tr.palm {
	color:#E4EFFF;
	background-color:#2e4a6c;
	caret-color: transparent; /* No blinking caret */
}

tr.palm_e {
	background-color: #E4EFFF;
	color: #292E41;
	cursor: pointer;
}

tr.palm_o {
	background-color: #C3CEEC;
	color: #292E41;
	cursor: pointer;
}

.palm_e:hover {background-color: #F9F7CE;}
.palm_o:hover {background-color: #F9F7CE;}

td.order1 {width: 15%;}
td.order2 {width: 20%;}
td.order3 {width: 65%;}

/* End tabel Palmares */

/*** Begin Pagination ***/

ul.paging {
	margin:0px;
	padding:0px;
	list-style:none;
	float: right;
}

ul.paging li {
	margin:0px;
	padding:0px;
	float:left;
}

ul.paging li a {
	float:left;
	padding:5px;
	margin-right:5px;
	border:solid 1px #292E41;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	-moz-box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	text-decoration:none;
	background:#E4EFFF;
	color:#292E41;
}

ul.paging li.paging-active a, ul.paging li a:hover {
	background:#2e4a6c;
	color:#FFFFFF;
	border:solid 1px #FFFFFF;
}

ul.paging li.paging-disabled a, ul.paging li.paging-disabled a:hover {
	cursor:default;
	background:#E4EFFF;
	border:solid 1px #BBBBBB;
	color:#BBBBBB;
}

ul.paging li.paging-current {
	padding:5px;
	margin-right:5px;
	border:solid 1px #292E41;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	-moz-box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	box-shadow: 10px 10px 29px 5px rgba(0,0,0,0.46);
	background:#E4EFFF;
	color:#292E41;
}

/*** Einde Pagination ***/

/* foto galerij */

.slider{
  height: 248px;
  width: 340px;
  margin: 0px 0px 20px 10px;
}
.slider .fotos{
  height: 100%;
  width: 100%;
}

.fotos img {
	height: 100%;
	width: 100%;
	/* border: 3px solid #FFF; */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
	-moz-box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
	box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
}

.speeldata {
	display: inline-block;
	align-content: center;
	text-align: center;
	margin-bottom: 20px;
	width: 600px;
}

.stuk-detail {
	display:inline-block;
	margin-right: 15px;
	margin-bottom: 20px;
	text-align: justify;
}

/* begin premiere countdown */

.time-counter {
	width: 210px;
	text-align: center;
	align-content: center;
	padding: 15px 5px;
	cursor: default;
	caret-color: transparent; /* No blinking caret */
	background-color: #2e4a6c;
	/* border: 1px solid #FFF; */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
	-moz-box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
	box-shadow: 10px 14px 77px 0px rgba(0,0,0,1);
}

.time-counter img {
	width: 95%;
	border: 1px solid #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin-top: 10px;
}

#clockdiv{
	font-family: sans-serif;
    /* color: #fff; */
    display: inline-block;
    font-weight: 100;
    text-align: center;
    font-size: 22px;
    padding-top: 5px;
    padding-bottom: 1px;
}

#clockdiv > div{
    padding: 4px;
    border-radius: 3px;
    display: inline-block;
}

#clockdiv div > span{
    padding: 5px 5px 5px 5px;
    border-radius: 3px;

    display: inline-block;
    box-shadow: 1px 1px 4px;
}

.smalltext{
    padding-top: 5px;
    font-size: 10px;
}

/* Form 

.form {margin:5px 2px 5px 2px;}
.form .text {border:solid 1px #384262; width: 180px; background: #B5BACC; padding:3px; font-size: 10px; color:#0e0973;}
.form label {float: left; width: 210px; text-align: right; margin-right: 5px; font-size: 10px; color: #fff;}
.form .text:hover{background:#cdd2e4; border: solid 1px #3d6290;}
.form .text:focus {background:#e5e6eb; border: solid 1px #3d6290;} 
.form .button       {border:solid 1px #dee8f5; background:#3d6290; color:#e3ecf8; padding: 2px 8px;}
.form .button:hover {border:solid 1px #dee8f5; background:#2e4a6c; color:#fff;}

*/

.reserve {
	-moz-box-shadow:inset 0px 0px 15px 3px #23395e;
	-webkit-box-shadow:inset 0px 0px 15px 3px #23395e;
	box-shadow:inset 0px 0px 15px 3px #23395e;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #2e466e), color-stop(1, #8da9e3));
	background:-moz-linear-gradient(top, #2e466e 5%, #8da9e3 100%);
	background:-webkit-linear-gradient(top, #2e466e 5%, #8da9e3 100%);
	background:-o-linear-gradient(top, #2e466e 5%, #8da9e3 100%);
	background:-ms-linear-gradient(top, #2e466e 5%, #8da9e3 100%);
	background:linear-gradient(to bottom, #2e466e 5%, #8da9e3 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2e466e', endColorstr='#8da9e3',GradientType=0);
	background-color:#2e466e;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	border:1px solid #e4ebf5;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:10px;
	font-weight:bold;
	padding:4px 13px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
}

.reserve:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #8da9e3), color-stop(1, #2e466e));
	background:-moz-linear-gradient(top, #8da9e3 5%, #2e466e 100%);
	background:-webkit-linear-gradient(top, #8da9e3 5%, #2e466e 100%);
	background:-o-linear-gradient(top, #8da9e3 5%, #2e466e 100%);
	background:-ms-linear-gradient(top, #8da9e3 5%, #2e466e 100%);
	background:linear-gradient(to bottom, #8da9e3 5%, #2e466e 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8da9e3', endColorstr='#2e466e',GradientType=0);
	background-color:#8da9e3;
}
.reserve:active {
	position:relative;
	top:1px;
}

.pdf {
	background: red;
	display: inline-block;
	color: #fff;
	border: 1px solid #fff; 
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	-moz-box-shadow:inset 0px 0px 10px 3px #23395e;
	-webkit-box-shadow:inset 0px 0px 10px 3px #23395e;
	box-shadow:inset 0px 0px 10px 3px #23395e;
	display:inline-block;
	cursor:pointer;
	font-family:Arial;
	font-size: 10px;
	font-weight:bold;
	padding:4px 12px;
	text-decoration:none;
}
.pdf:hover {background: #23395e; color: white;}

/* Glowing confirm button */

.confirm {
	-moz-box-shadow:inset 0px 0px 15px 3px #23395e;
	-webkit-box-shadow:inset 0px 0px 15px 3px #23395e;
	box-shadow:inset 0px 0px 15px 3px #23395e;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #316829), color-stop(1, #6DC019));
	background:-moz-linear-gradient(top, #316829 5%, #6DC019 100%);
	background:-webkit-linear-gradient(top, #316829 5%, #6DC019 100%);
	background:-o-linear-gradient(top, #316829 5%, #6DC019 100%);
	background:-ms-linear-gradient(top, #316829 5%, #6DC019 100%);
	background:linear-gradient(to bottom, #316829 5%, #6DC019 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#316829', endColorstr='#6DC019',GradientType=0);
	background-color:#316829;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	border:1px solid #e4ebf5;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:10px;
	font-weight:bold;
	text-transform: uppercase;
	padding:4px 13px;
	text-decoration:none;
}

.glow {
	-webkit-animation: glowing 1500ms infinite;
	-moz-animation: glowing 1500ms infinite;
	-o-animation: glowing 1500ms infinite;
	animation: glowing 1500ms infinite;
}

@-webkit-keyframes glowing {
	0% { background-color: #316829; -webkit-box-shadow: 0 0 3px #316829; }
	50% { background-color: #d8eb34; -webkit-box-shadow: 0 0 40px #d8eb34; }
	100% { background-color: #316829; -webkit-box-shadow: 0 0 3px #316829; }
  }
  
  @-moz-keyframes glowing {
	0% { background-color: #316829; -moz-box-shadow: 0 0 3px #316829; }
	50% { background-color: #d8eb34; -moz-box-shadow: 0 0 40px #d8eb34; }
	100% { background-color: #316829; -moz-box-shadow: 0 0 3px #316829; }
  }
  
  @-o-keyframes glowing {
	0% { background-color: #316829; box-shadow: 0 0 3px #316829; }
	50% { background-color: #d8eb34; box-shadow: 0 0 40px #d8eb34; }
	100% { background-color: #316829; box-shadow: 0 0 3px #316829; }
  }
  
  @keyframes glowing {
	0% { background-color: #316829; box-shadow: 0 0 3px #316829; }
	50% { background-color: #d8eb34; box-shadow: 0 0 40px #d8eb34; }
	100% { background-color: #316829; box-shadow: 0 0 3px #316829; }
  }

.confirm:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #6DC019), color-stop(1, #316829));
	background:-moz-linear-gradient(top, #6DC019 5%, #316829 100%);
	background:-webkit-linear-gradient(top, #6DC019 5%, #316829 100%);
	background:-o-linear-gradient(top, #6DC019 5%, #316829 100%);
	background:-ms-linear-gradient(top, #6DC019 5%, #316829 100%);
	background:linear-gradient(to bottom, #6DC019 5%, #316829 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8da9e3', endColorstr='#316829',GradientType=0);
	background-color:#6DC019;
}

/* Einde Glowing confirm button */

/* Gastenboek  */

div.boek {
	padding: 10px;
	margin-bottom: 20px;
	text-align: justify;
	background-image: linear-gradient(to bottom, #233d5c, #4971a1);
	border: 1px solid #fff;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}

div.boek table {margin-bottom: 10px; font-size: 9px;}
div.boek a {color: #2e466e; text-decoration: none;}
div.gast_write {
	color: #fff;
	background-color: #663300;
	width: 220px;
	text-align: center;
	margin: 5px 0px 10px 150px;
	padding: 5px;
	border: 1px solid #fff;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}
div.gast_write a {color: #fff; text-decoration: none;}
div.gast_write:hover {background-color: #2e466e;}
td.zone1 {
	padding: 3px 10px 3px 10px;
	width: 70px; 
	color: #fff; 
	font-family: tahoma;
	background-color: #2e466e; 
	border: 1px solid #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: default;
}

td.zone2 {
	padding: 3px 10px 3px 10px;
	width: 400px;
	font-family: tahoma; 
	color: #2e466e; 
	background-color: #fff; 
	border: 1px solid #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: default;
}

/* END Gastenboek  */

/* Page Header */

#header_container {
	margin-bottom: 12px;
	border: 1px solid #fff;
	background: url('images/header_background.jpg') repeat-x 0px 0px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}



#page_header {
    width: 766px;
    height: 187px;
    position: relative; /* Nodig om de achtergrondlaag te positioneren */
    border-radius: 10px;
    overflow: hidden; /* Zorgt dat de vervaging binnen de hoeken blijft */
	z-index: 1;
}

/* Dit maakt een aparte laag aan voor de achtergrond */
#page_header::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url('images/header_image.jpg');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    filter: blur(3px); 
    transform: scale(1.1); 
    z-index: -1; /* Zorgt dat de afbeelding achter de tekst staat */
}

#page_header * {
    position: relative;
    z-index: 2;
}

/* Page Header : Welcome Note */

#header_welcome {
	padding-left: 130px;
	float: left;
	text-align: justify;
}

#header_welcome p {margin-top: 7px;}

#header_welcome #welcome_text {
	width: 430px;
	color: #00144d;
	font-weight: bold;
}

/* Page Header : Menu */

#header_menu {
	padding-top: 10px;
	padding-right: 20px;
	float: right;
}

#header_menu li {
	margin-bottom: 2px;
	width: 116px;
	border: 1px solid #dee8f5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-align: left;
	clear: both;
	float: none;
}

#header_menu li a {
	display: block;
	width: 116px;
	height: 20px;
	color: #e3ecf8;
	background-color: #3d6290;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-decoration: none;
	font-weight: bold;
	overflow: hidden;
	line-height: 10px;
}

#header_menu li a span {
	display: block;
	padding-top: 4px;
	padding-left: 20px;
}

#header_menu li a:hover {
	color: #fff;
	background-color: #2e4a6c;
}

/* Left Sidebar */

#left_sidebar {
	width: 178px;
	float: left;
}

#left_sidebar .box_container {
	margin-bottom: 11px;
	border: 1px solid #fff;
	background-image: linear-gradient(to bottom, #233d5c, #4971a1);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}

/* Left Sidebar : User Login */

#userlogin {
	Display: flex;
	flex-direction: column; 
	align-items: center; 
	text-align: center;"
	padding: 7px 8px 11px 12px;
	color: #f1f5f9;
	font-weight: bold;
	
}

/* Left Sidebar : Tweets */

#news {
	padding: 10px 17px 10px 12px;
	text-align: left;
}

#news h4 {
	padding-top: 6px;
	font-size: 10px;	
	font-weight: bold;
}

#news p {
	margin-top: 5px;
	margin-bottom: 6px;
	line-height: 12px;
}

/* Main Content */

#maincontent_container {
	border-top : 1px solid #d5dfec;
	border-left : 1px solid #d5dfec;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	float: right;
	text-align: left;
}

#maincontent {
	margin: 7px 0px 0px 16px;
	width: 561px;
}

#maincontent_top {
	margin-bottom: 11px;
	width: 561px;
	background: url('images/maincontent_verticaldiv.gif') repeat-y 310px 5px;
}

#maincontent_top2 {
	margin-bottom: 25px;
	width: 550px;
}

/* Started - welkom */

#started_container {
	width: 313px;
	float: left;
}

#started {
	padding-top: 2px;
	width: 294px;
}

#started2 {
	padding-top: 2px;
	width: 550px;
}

#started_count {
	padding-top: 2px;
	width: 500px;
}

#started2 object {border: 2px solid #fff;}

#right_container {
	width: 247px;
	float: left;
	text-align: left;
}

/* gradient-border */

.gradient-border {
	--border-width: 3px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	/* text-transform: uppercase; */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
  
	&::after {
	  position: absolute;
	  content: "";
	  top: calc(-1 * var(--border-width));
	  left: calc(-1 * var(--border-width));
	  z-index: -1;
	  width: calc(100% + var(--border-width) * 2);
	  height: calc(100% + var(--border-width) * 2);
	  background: linear-gradient(
		60deg,
		hsl(224, 85%, 66%),
		hsl(269, 85%, 66%),
		hsl(314, 85%, 66%),
		hsl(359, 85%, 66%),
		hsl(44, 85%, 66%),
		hsl(89, 85%, 66%),
		hsl(134, 85%, 66%),
		hsl(179, 85%, 66%),
		hsl(0, 0%, 100%)
	  );
	  background-size: 300% 300%;
	  background-position: 0 50%;
	  border-radius: 10px;
	  animation: moveGradient 4s alternate infinite;
	}
  }
  
  @keyframes moveGradient {
	50% {
	  background-position: 100% 50%;
	}
  }

/* END gradient-border */

/* Nieuwsbrief */

#nieuwsbrief_container {
	text-align: center;
	border: 1px solid #fff; 
	background-image: linear-gradient(to bottom, #233d5c, #4971a1);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}

#nieuwsbrief {
	margin: 10px 1px 20px 1px;
	width: 150px;
}

#nieuwsbrief p {
	margin-top: 1px;
	font-size: 10px;
}

/* Klant Aangemeld  */

#klant_online {
	text-align: center;
	border: 1px solid #fff;
	color: #fff;
	font-size: 12px;
	padding: 5px;
	background-image: linear-gradient(to bottom, #694c25, #dd9433);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
}

/* Verwacht Banner main Page */

.verwacht_container {
	margin-top: 15px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	border: 1px solid #ffffff;
	background: rgb(204,51,0);
	background: -moz-linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	background: linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cc3300",endColorstr="#cc3300",GradientType=1);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	color: #FFCCCC;
	float: right;
	transition-duration: 1s;
}

.verwacht_container:hover {transform: scale(1.1);}
.verwacht_container p {padding-top: 10px;}

.verwacht_container img {
	width: 100%;
	justify-content: center;
	border: 1px solid #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin-top: 15px;
	margin-left: 3px;
}

.verwacht {
	margin: 5px 17px 4px 10px;
	width: 210px;
}

.verwacht p {
	margin-top: 1px;
	font-size: 10px;
}

.verwacht:hover {color: #FFF;}

/* ANTISPAM BANNER */

#antispam_container {
	margin-top: 20px;
	padding: 10px;
	border: 1px solid #ffffff;
	background: rgb(204,51,0);
	background: -moz-linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	background: linear-gradient(90deg, rgba(204,51,0,1) 0%, rgba(119,34,5,1) 50%, rgba(204,51,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cc3300",endColorstr="#cc3300",GradientType=1);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	color: #FFCCCC;
	font-weight: bold;
	transition-duration: 1s;
}

#antispam_container:hover {transform: scale(1.1);}
#antispam:hover {color: #FFF;}

/* Vorige Producties Overzicht */

#featured_container {
	border: 1px solid #fff;
	background-color: #3d6290;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	-moz-box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	box-shadow: 10px 10px 63px -1px rgba(0,0,0,0.6);
	float: left;
}

#featured {
	margin: 9px 15px;
	width: 525px;
}

#featured_products ul {
	width: 520px;
}

#featured_products li {
	margin: 4px 2px 4px 2px;
	float: left;
}

#featured_products li.end {
	margin-right: 0px;
}

#featured_products li a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#featured_products li img {
	display: block;
	margin: 2px;
	/* position: relative; /* for the overlay later */
	text-align: center;
	margin-bottom: 2px;
	border: 2px solid #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	filter: none;
    -webkit-filter: grayscale(0);
}

.slide-custom {
	position: relative;
	-webkit-animation: slideIn 2s forwards;
	animation: slideIn 2s forwards;
}
    
  @keyframes slideIn {
	0% {
	  transform: scaleX(0);
	}
	100% {
	  transform: scaleX(1);
	}
  }

#featured_products li img:hover {
	filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
    filter: gray; /* IE5+ */
    -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
    -webkit-transition: all .3s ease-in-out;
	border-color: #ffb338;
}

.image {
	overflow: hidden;
}

.image span {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #888;
	background: rgba(0,0,0,.5);
	color: #fff;
	padding: 3em 1em 0;
 }

.image:hover span {
	display: block;
}

#featured_products li h4 {
	padding-top: 3px;
	text-align: center;
	font-size: 10px;
}

.featured_nav {
	padding-left: 3px;
	padding-right: 9px;
	float: left;
	font-weight: bold;
}

.featured_nav a {text-decoration: none;}

/* Page Footer */

#page_footer {
	margin: 8px;
	margin-top: 20px;
	width: 567px;
	float: right;
	text-align: center;
	font-size: 9px;
	text-shadow: 3px 3px 20px #233d5c,
}

.pagging { height:20px; padding:8px 10px; line-height:19px; color:#949494; }
.pagging a{ background:url(images/pagging.gif) repeat-x 0 0; height:20px; float:left; padding:0 8px; border:solid 1px #d5d5d5; text-decoration: none; color:#949494; margin-left:5px;  }
.pagging a:hover { border-color:#8c3521; background:#ba4c32; color:#fff; }
.pagging span{ float:left; margin-left:5px; padding-top:2px; }

.gdpr {
	-moz-box-shadow: 0px 1px 0px 0px #fff6af;
	-webkit-box-shadow: 0px 1px 0px 0px #fff6af;
	box-shadow: 0px 1px 0px 0px #fff6af;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffab23));
	background:-moz-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-o-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-ms-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23',GradientType=0);
	background-color:#ffec64;
	-moz-border-radius:18px;
	-webkit-border-radius:18px;
	border-radius:18px;
	border:1px solid #ffaa22;
	display:inline-block;
	cursor:pointer;
	color:#333333;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:8px 37px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffee66;
}
.gdpr:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #ffec64));
	background:-moz-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-o-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-ms-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64',GradientType=0);
	background-color:#ffab23;
}
.gdpr:active {
	position:relative;
	top:1px;
}

.no_clk {cursor: not-allowed; opacity: 30%;}

/* Tooltip info */

.tooltip {position: relative; display: inline-block; font-size: 12px; 
/*  border-bottom: 1px dotted black; */
}

.tooltip_txt {color: yellow;}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 270px;
  font-size: 11px;
  background-color: #ffff99;
  color: #86863b;
  text-align: left;
  border-radius: 8px;
  padding: 4px 6px;
  padding-left: 10px;
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {visibility: visible;}

/* Hidden text */

.readmore__content {
	max-width: 45rem;
	width: 100%;
	display: flex;
	text-align: justify;
  }
  
  button.readmore__toggle {
	display: flex;
	float: right;
	font-size: 11px;
	background: transparent;
	border: none;
	color: orange;
	cursor: pointer;
  }