body {
  font-family: Arial;
  color: #313409;
  
  /* background-color: rgba(251, 253, 222,0.85); */
  background-color: #E2F0E5;
    /* background-blend-mode: lighten;  */

  background-image: url('../Content/background100x100.png');
  background-image: url('../Content/background50x50.png');
  background-image: url('../Content/background50x50_V2.png');
  background-image: url('../Content/background30x30.png');
  background-image: url('../Content/background30x30V3.png');
  background-image: url('../Content/background30x30V4.png');

    /* margin-left: 100px; */
    overflow: hidden;

    width: 100%;
    height: 100%;
    /* display: flex;
    flex: auto; */
}



/*  ########  MENU BAR  ########  */
/*  ########  MENU BAR  ########  */
/*  ########  MENU BAR  ########  */
/*  ########  MENU BAR  ########  */
#menuContainer{
  display: flex;
  justify-content:left;
  align-items: stretch;
  vertical-align:middle;
  background-color: #6d9b7d;
  margin-right: 14px;
}

img.logo
{
  margin-top:4px;
  margin-left: 4px;
  width: 333;
  height: 150;
}
img.logoSmall
{
  margin-top:0px;
  margin-left: 0px;
  width: 111px;
  height: 50px;
}

/* Style the tab */
.tab {
  /* overflow: hidden;*/
  /* border: 1px solid #ccc; */
  /* background-color:#F1F791;  */
  /* padding-top:15px;
  padding-bottom: 15px;
  height: 50px; */
  margin-top: 30px;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;

  /* afwijkende stijl */
  /* box-shadow: 3px 0px 0px 0px #899599; */
	/* background:linear-gradient(to bottom, #FBFDDE 5%, #A5B00C 100%); */
	/* background-color:#ededed; */
	/* border-radius:6px 15px; */
	/* border:1px solid #d6bcd6; */
	display:inline-block;
	cursor:pointer;
	/* color:#3a8a9e; */
	font-family:Arial;
	font-size:17px;
	padding:7px 25px;
	text-decoration:none;
  /* text-shadow:0px 1px 0px #e1e2ed; */
  margin-bottom: 5px;
  margin-right: 4px;
  color:#A5CEB6
}

/* Change background color of buttons on hover */
.tab button:hover {
  /* background-color: #A5B00C; */
  background-color: #A5CEB6;
  /* afwijkende stijl */
  /* background:linear-gradient(to bottom, #FBFDDE 5%, #A5B00C 40%); */
  
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #A5CEB6;

  /* afwijkende stijl */
  /* background:linear-gradient(to bottom, #FBFDDE 5%, #A5B00C 40%);
  box-shadow: 3px 4px 2px 0px #428196; */
  color: #6d9b7d;
}










/* ######  CONTENT   ###### */
/* ######  CONTENT   ###### */
/* ######  CONTENT   ###### */
/* ######  CONTENT   ###### */
* {
  box-sizing:border-box;
}

.pageBody{
  /* max-width: 900px;*/
  margin: auto; 

  /* align direct UNDER menupart and ABOVE footer part */
   top:170px; bottom:53px;
  /*position:absolute;  */
  overflow:auto;
  float:left;
  width:70%;
  height: 60vh;
}
.pageBodyLeft{
  /* background-color:#2196F3; */
  float:left;
  width:15%; /* The width is 20%, by default */
  height:2px;
}
.pageBodyRight{
  /* background-color:#c921f3; */
  float:left;
  width:15%; /* The width is 20%, by default */
  height:2px;
}


 /* Use a media query to add a break point at 800px: */
 @media screen and (max-width:620px) {
  .pageBodyLeft, .pageBody, .pageBodyRight {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
}

/* aangepaste scrollbar */
/* aangepaste scrollbar */
/* aangepaste scrollbar */
.pageBody::-webkit-scrollbar {
  width: 25px;
}
.pageBody::-webkit-scrollbar-track {
  /* -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  */
  -webkit-box-shadow: inset 0 0 6px rgba(109,155,125,0.8); 
  
  border-radius: 5x;
}
.pageBody::-webkit-scrollbar-thumb {
  border-radius: 5px;
  /* -webkit-box-shadow: inset 0 0 6px rgba(109,155,125,0.8);  */
  -webkit-box: #1f3b29;
  -webkit-box-shadow: inset 0 0 6px #1f3b29; 
}



.Ingrid{
  text-align: left;
  float: right;
}
.IngridImg{
  /* transform: rotate(20deg); */
  /* box-shadow: 3px 4px 0px 0px #899599;
  box-shadow: 10px 10px 5px grey; */
  border-radius:90px;
  /* text-align: right; */
  /* float: left; */
  /* align-content: flex-end; */
}




/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}

/* Fade in tabs */
@-webkit-keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

.tabParagrapg{
  line-height: 1.5;
  overflow-y: visible;
  /* max-height: 500px; */
  padding-right: 5px;
  font-weight: bold;

}







/* ERVARINGEN <p> ratations */
/* ERVARINGEN <p> ratations */
/* ERVARINGEN <p> ratations */ 
p#rot5 {
  width: fit-content;
  -ms-transform: translate(0px,-5px) rotate(-3deg); /* IE 9 */
  transform: translate(0px,-5px) rotate(-3deg); /* Standard syntax */
  border-radius: 5px;
  /* background-color: darkorange; */
  background-color: #b3cbbc;
  margin: 20px;
  padding: 20px;
  border: 1px solid #6d9b7d;
  box-shadow: 5px 3px 5px#6d9b7d;
}

p#trans100 {
  width: fit-content;
   -ms-transform: translate(350px,-80px) rotate(5deg); /* IE 9 */
  transform: translate(350px,-80px) rotate(5deg); /* Standard syntax */
  border-radius: 10px;
  /* background-color:goldenrod; */
  background-color:#86ac93;
  margin: 20px;
  padding: 20px;
  border: 1px solid #6d9b7d;
  box-shadow: 10px 7px 5px #6d9b7d;
}

p#rot3 {
  width: fit-content;
  -ms-transform: translate(0px,-100px) rotate(0deg); /* IE 9 */
  transform: translate(0px,-100px) rotate(0deg); /* Standard syntax */
  border-radius: 3px;
  background-color:#e1eae4;
  margin: 20px;
  padding: 20px;
  border: 1px solid #6d9b7d;
  box-shadow: 5px 3px 5px #6d9b7d;
}


 /* FOOTER SETTINGS */
 /* FOOTER SETTINGS */
 /* FOOTER SETTINGS */
 /* FOOTER SETTINGS */
 .footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #6d9b7d;
  color: #A5CEB6;
  text-align: right;
 }

 #footerContainer {
  display: flex;
  justify-content:left;
  align-items: stretch;
  vertical-align:middle;
  background-color: #6d9b7d;
  color: #A5CEB6;
  text-align: center;

  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
}

#footerContainer a{
    color: #A5CEB6;       
    text-decoration: none; /* no underline */
 }

 .r2ware{
  font-family: 'Courier New', Courier, monospace;
  font-size: small;
  text-align: right;
 }




/* SMALLER SCREENS */
@media screen and (max-width: 600px) {
  .tab {
    position: relative;
    margin-top:4px;
  }
  .tab .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .tab a {
    float: none;
    display: block;
    text-align: left;
  }
  .tab button {
    margin-top: 2px;
    font-size: 13px;
    padding: 3px 7px;
  }
  .logo {
    margin-top:0px;
    margin-left: 0px;
    width: 111px;
    height: 50px;
  }
  #footerContainer{
    font-size: 12px;
  }
  .r2ware {
    display: none;
  }

  p#trans100 {
    width: fit-content;
     -ms-transform: translate(10px,-10px) rotate(5deg)!important; /* IE 9 */
    transform: translate(10px,-10px) rotate(5deg); /* Standard syntax */
  }
  p#rot3 {
    width: fit-content;
    -ms-transform: translate(0px,-30px) rotate(0deg)!important; /* IE 9 */
    transform: translate(0px,-30px) rotate(0deg)!important; /* Standard syntax */
  
}