html, body {
  overflow-y: scroll;
  scrollbar-width: none;
  
} 

 

body {	color: #0; 
		/* font-size: 14px; */
		font-size: 0.875em;
		font-family: Georgia, Arial, Courier New, Monospace;
		font-weight: bold; 
		word-spacing: 0%; 
		letter-spacing: 0%;
		margin: 0px;
		width: 100%;
    	height: 100%;
    	padding: 0px;
    	box-sizing: border-box;
		color: #333;
		-moz-hyphens: auto !important;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto !important;
		
		}
							

body::-webkit-scrollbar, #letterBox::-webkit-scrollbar {
  		display: none;
		}

h1 {  	font-size: 20px;
	  	font-family: Arial !important;
		font-weight: bold; 
		color: Green;
		margin: 0;
									
		}	
		
.p1 {  	font-size: 16px;
	  	font-family: Arial !important;
		font-weight: bold; 
		color: #00006f;								
		}	
								
#left, minileft {	display: -webkit-flex;
		display: flex;
		/* flex-direction:row; */
		flex-wrap:wrap;
		margin-left: 6px;
		margin-right: 6px;
		margin-bottom: 6px;
		min-height: 100%;
		-webkit-font-smoothing: antialiased;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
}

               
							
.textLeft {	background-color: rgba(249,215,100,1);
  								}
.textLeftSmall {	background-color: rgba(249,215,100,1);
  								}
  								
.textLeftFeatured {	background-color: rgba(249,215,100,1);
  								}
  						


.textLeft:hover {               
  								background-color: yellow;
  								}

.textLeftFeatured:hover {               
  								background-color: yellow;
  								}  								
  								
  								


							
a, a:link         				{ 	color: green !important; 
								text-decoration: none; 
							}

a, a:visited          			{ 	color: green !important; 
								text-decoration: none; 
							}

a, a:hover     				{ 	color: purple !important; 
								text-decoration: none; 
							}
							
a, a:active    				{ 	color: red; 
								text-decoration: none; 
							}
							
.left div					{ 	margin-top: 0px;
								margin: 0pt; padding: 0pt; 
							}	

                           
.leftSpan 					{	/* white-space: pre-line; */
								padding: 0px; 
								/* float: right;  */
							}
							

.imageBox               	{	position: relative; 
								border: 12px solid rgba(255,192,203,.7);
								margin-bottom:12px
							}		
							
.imageBoxSmall              {	position: relative; 
								border: 12px solid rgba(255,192,203,.7);
								margin-bottom:12px
							}														
							                           	
                        							
img							{	padding: 0pt; 
								margin: 0pt;
								display: block;
  								margin-left: auto;
  								margin-right: auto;
  								margin-bottom:12px;
							}
							

div.homelink				{ 	width: 40px; height: 32px; 
							}



div.topArrow				{
								position: absolute;
								left: 0px;
								top: 0px;
								margin: 0px
							}
							


div.boxArrow				{	text-align: center; 
								padding-top: 14px; 
								height: 56px; 
								width: 24px; 
								font-size:16px; 
								line-height: 95%;
								float: right 
							}
							

.kleineBeer 				{ 	display: inline-block; 
								text-align:center;
								color: blue;
								/* margin: 12px; */
								
							}
								
.additional-text			{ 	font-style: italic;

							}								


/* slideshow */

    /*  * {box-sizing: border-box} */
.mySlides1, .mySlides2 {display: none}

.general-text-container {
  position: relative;
  display: flex;
  width: 100%; /* Ensure the container fills the available width */
  height: 100%; /* Ensure the container fills the available height */


}


.prev, .next {
 top: 0;
 left: 0;
 width: 50%;
  /* overflow: visible; */
  cursor: pointer;
  /* padding: 30px; */
  /* padding: 2px 10px; */
  /*  color: black; */
  /* top: 0px; */
  font-weight: bold;
  /* color: rgba(255,192,203,.4); */
  /* color: rgba(255,192,203,.7); */
  color: white;
  font-size: 28px;
  transition: 0.6s ease;
  /* border-radius: 10px; */
  /* user-select: none; */
  /* text-align: center; */
  padding-left: 6px;
  padding-right: 6px;
  user-select: none;
 /*  text-align: center; */

 z-index: 0;

  /* 
box-sizing: border-box; /* Include padding in height calculation */
}

.caption-overlay {
  flex: 1;
  position: absolute;
  text-align: center;
  z-index: 2;
  pointer-events: none;/*  Make the text overlay non-clickable */
}

.prev {text-align: right}
.next {text-align: left}

.prev:hover, .next:hover {
  
  color: rgba(94,186,214,1) !important;
  /* user-select: none; */
}  

/* 
.overlay {
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}
 */
.caption-overlay {
    pointer-events: none; /* Voorkom dat de .caption-overlay zelf muisgebeurtenissen ontvangt */
}

.caption-overlay .link {
    pointer-events: auto; /* Laat de links binnen .caption-overlay normaal reageren op muisgebeurtenissen */
}
.caption-overlay .link:hover {color: red } 

.leftSpan {
  /* position: relative; */
}

.slideshow-container {
  /* Zorg ervoor dat .slideshow-container relatief gepositioneerd is binnen .leftSpan */
  position: relative;
}

.additional-text-container {
background-color: rgba(255, 255, 255, 0.7);
  position: absolute;


 /* 
 bottom: 12px;
  left: 11px;
 */
  
}

.additional-text {
  display: none;
  
  padding: 0px;
 /* 
 margin-left: 3px;
  margin-right: 3px;
 */
}


/* 
@media only screen {
  .prev, .next {
    font-size: 100px;  }
}
 */



/* Position the "next button" to the right */
/* 
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}
 */

/* On hover, add a grey background color */