html {
  scroll-behavior: smooth;
}

.menuitem {
  padding: 1px;
  margin: 0px;
  font-size: 16px;
  color : #0033FF;
}

.grotelink a {
  font-size: 18px;
}

.kopregel {
  top: 0px;
  margin: -5px;
  height: 60px;
}

/*
header{
    width: 100%;
    position: fixed; 
    top: 0;
    height: 105px !important;
}

.hr {
  border: 10px solid green;
  border-radius: 5px;
}

*/

.contents{
    position:relative;
    height: 100%;
    margin-top: -25px;
/*    padding:255px 0 0 280;  */
}

.sticky {
  position: fixed;
  top: 160;
  width: 100%;
  color: #FF0000;
}

.rood {
  color: #FF0000;
}

.groen {
  color: #458716;
}

.overlayFoto {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  padding: 5px;
  background-color: #dddddd;
  overflow-y: scroll;
  opacity: 1.0;
}

.groteFoto {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  padding: 5px;
  background-color: #dddddd;
  overflow-y: scroll;
  opacity: 1.0;
}

.overlayWrapper {
  position: relative;
}

.overlayGrootImage {
  display: block;
  height: auto;
}

.overlayKleinImage {
  position: absolute;
  background-color: #FFAAAA;
  width:20px;
  padding:5px;
  margin-top:20px;
  border:1px;
}
  
.overlayKleinImageBreed{
  position: absolute;
  background-color: #FFAAAA;
  width:30px;
  padding:5px;
  margin-top:20px;
  border:1px;
}
  
.cijfer {
  height:12px;
  margin-bottom:10px;
  margin-top:-10px;
}

.clickButton{
  color: blue;
  cursor: pointer;
  font-size: 15px;
}

#overlayHalte{
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 80%; /* Full width (cover the whole page) */
  height: 80%; /* Full height (cover the whole page) */
  top: 10%;
  left: 10%;
  right: 10%;
  bottom: 0;
  background-color: rgba(40,40,40,0.8); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

#overlayHalteTekstVervolg{
  position: absolute;
  top: 20px;
  left: 20px;
  font-size: 15px;
  color: white;
//  transform: translate(-50%,-50%);
//  -ms-transform: translate(-50%,-50%);
}

#tekstInspring  {
  left: 15px;
  font-size: 33px;
}

.inspringveel{
  margin:0px 0px 0px 35px;
}

.cardnaam {
  color: #1f7035;
  font-size: 20px;
  font-weight: bold;
  margin-left: 10px;
  margin-bottom: 10px;
}
.cardgeg {
  margin: 10px;
  top: 10px;
  left: 10px;
}

.kopfoto {
  position: absolute;
  top: 10px;
  left: 10px;
}

.koptekst {
  position: absolute;
  top: 30px;
  left: 210px;
  margin: 5px;
  font-size: 30px;
  font-weight: bold;
  color: #009933;
}

.koptekstlinks {
  position: absolute;
  top: 30px;
  left: 30px;
  margin: 5px;
  font-size: 30px;
  font-weight: bold;
  color: #009933;
}

.koptekstklein {
  font-size: 14px;
  font-weight: bold;
  color: #009933;
}

a    {
	text-decoration: none;
    font-size: 12px;
	color : #0033FF;
     }

a:hover {
	color : #000000;
	background:yellow;
     }

input:hover {
	color:red;
	background:yellow;
     }