* {
  box-sizing: border-box;
/*  font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
  font-size: 20px; 
  line-height: 120%; */
  line-height: 115%; 
}
body   { font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
 font-style: normal; font-weight: normal; 
}
.note {font-family: 'Architects Daughter', cursive;
}
@media print {
  body { font-size: 12px; }
  .fixed-navigation-block {display: none; visibility:hidden; }
  h1 { page-break-before: always; }
  h2 { page-break-before: always; }
}
body {
  color: #000000; 
  background-color: #FFFFFF; 
  overflow-x: hidden;
}

/*home-button en hamburger kleur en afmetingen*/
.hamburger-container, .button-container {
  position: relative;
  left: 1px;
/*  display: block;
  position: fixed;
  left: margin; /*iets fouts invullen maakt dat hij relatief links geplaatst wordt.*/
  top: 1px;
  float: left;
  margin: 0px;
  margin-left: .1em;
  padding: 0px;
  width: 2.4em;
  height: 2.5em;
  background: #d0f030;
  z-index: 5;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  transition: background 0.3s;
}
.button-container {
  z-index: 3;   /*uitklapmenu is 4; knoppen moeten hierachter, maar hamburger niet*/
}
/*verborgen checkbox net zo groot en op zelfde plaats als de hamburger*/
.hamburger-trigger {
  opacity: 0;
  position: absolute;
  margin: 0.1em;
  margin-left: .1em;
  padding: 0;
  width: 2.4em;
  height: 2.5em; /*schaalt niet goed: moet groter op groot beeldscherm*/
  width: 4.4em;
  height: 4.5em; /*dus ruimte laten eromheen voor kleiner scherm*/
  left: 0px;
  cursor: pointer;
  z-index: 6; /*hamburger-container is 5*/
}
/*de drie streepjes van de hamburger*/
.home-button, .home-button::before, .home-button::after, .hamburger-button, .hamburger-button::before, .hamburger-button::after {
  display: block;
  position: absolute;
  background: white;
  width: 1.7em; /*orig width: 40px;*/
  height: .25em; /*orig   height: 5px;*/
  margin: 1.3em 3em;
  top: -0.3em;          /*orig niets*/
  transition: background 0.3s;
}
/*de drie streepjes van de top- en down-button*/
.down-button, .down-button::after, .down-button::before, .top-button, .top-button::after, .top-button::before{
  display: block;
  position: absolute;
  background: white;
  height: 1.9em; /*orig width: 40px;*/
  width: .25em; /*orig   height: 5px;*/
  margin: 1.0em 1.05em;
  top: 0;
  transition: background 0.3s;
}
.hamburger-container:hover, .button-container:hover { /*todo: werkt ook boven witte streepjes, waar je niet kunt klikken*/
  /*background: #d0f030;*/
}
/*positie onderste en bovenste streepje */
.hamburger-button::before, .hamburger-button::after, .home-button::before, .home-button::after {
  content: '';
  position: absolute;
  margin: -0.4em 0 0;   /*orig -0,7; doe -0,7-(-0,3)*/
  transition: width 0.7s ease 0.3s, transform 0.7s ease 0.3s;
}
/*positie linker (en rechter) streepje */
.down-button::before, .down-button::after, .top-button::before, .top-button::after {
  content: '';
  position: absolute;
  margin: 0 -0.5em 0;   /*orig -0,7; doe -0,7-(-0,3)*/
  transition: width 0.7s ease 0.3s, transform 0.7s ease 0.3s;
}
/*positie onderste streepje */
.hamburger-button::after, .home-button::after {
  margin-top: 1em;    /*orig 0,7*; doe 0,7-(-0,3)*/
}
/*positie rechter streepje */
.top-button::after, .down-button::after {
  margin: 0 0.5em 0;  /*orig 0,7*; doe 0,7-(-0,3)*/
}
/*hamburger compositie middelste streepje*/
.hamburger-button, .home-button{
  position: absolute;
  left: 0px;
  display: block;
  margin: 0;
  margin-top: 1.45em;
  margin-right: 0.35em;
  margin-left: 0.35em;
  margin-bottom: 1.45em;
  transition: width 0.3s ease;
}
/*als aangeklikt middelste streepje verkorten*/
.hamburger-trigger:checked + .hamburger-menu-content .hamburger-button {
  width: 2em;
  transition-delay: 2s;
  transition: width 0.7s ease 0.7s;
}
/*homebutton bovenste streepje schuin draaien*/
/*als aangeklikt bovenste streepje schuin draaien*/
.hamburger-trigger:checked + .hamburger-menu-content .hamburger-button::before, .home-button::before {
  width: 1.5em;
  transition-delay: 1s;
  transform: rotate(315deg);
  margin-top: -0.2em;   /*orig -0,5*; doe -0,5-(-0,3)*/
}
/*linker streepje draaien*/
.top-button::after, .down-button::before {
  height: 1.5em;
  transform: rotate(315deg);
  margin-top: 0.6em;
}
/*homebutton onderste streepje schuin draaien*/
/*als aangeklikt onderste streepje schuin draaien*/
.hamburger-trigger:checked + .hamburger-menu-content .hamburger-button::after, .home-button::after {
  width: 1.5em;
  transition-delay: 0.5s;
  transform: rotate(-315deg);
  margin-top: 0.8em;    /*orig 0,5*; doe 0,5-(-0,3)*/
}
.top-button::before, .down-button::after {
  height: 1.5em;
  transform: rotate(-315deg);
  margin-top: 0.6em;
}
.top-button::before, .top-button::after {
  margin-top: -0.2em;
}
/*hamburger verborgen iframe */
.hamburger-iframe {
  display: flex;        /*bij none werkt transite niet*/
  border: none; 
  margin-bottom: 1em;
  margin-right: 0.9em;
  margin-top: 1.5em; /*nodig om pijl te zien bij uitgevouwen menu; z-index werkt niet voor hamburger, wel voor andere knoppen???*/
  margin-left: 1.5em; /*maar mag niet te groot zijn want dan komt hij onder de knop uit */
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  width: 0px;
  height: 0px;
  overflow: hidden;
  -webkit-transition-property: width, height; /* Safari */
  -webkit-transition-duration: 0.5s; /* Safari */
  transition-property: width, height;
  transition-duration: 0.5s ;
  z-index: 4; /*hamburger-container is 10; lijkt helaas van weinig invloed???*/
}
/*als aangeklikt iframe groter maken*/
.hamburger-trigger:checked + .hamburger-menu-content .hamburger-iframe {
/*  display: flex; */
  width: 90vw;
  height: 90vh;
  overflow: auto;
}
/*als aangeklikt hamburger en menucontent groter maken*/
.hamburger-trigger:checked + .hamburger-menu-content ul {
  width: auto;
  height: auto;
  min-width: 80vw;
  min-height: 10vh;
  -webkit-transition-property: width, height; /* Safari */
  -webkit-transition-duration: 0.5s; /* Safari */
  transition-property: width, height;
  transition-duration: 0.5s;
}
/*home-button compositie middelse streepje*/
.home-button, .top-button, .down-button {
  width: 0;
  transition: width 0.7s ease 0.7s;
}
.top-button, .down-button {
  margin-top: 0.3em;
}

.hamburger-menu-content p.crumb {
  position: relative;
  z-index: 1;
  display: inline-block;
  /*background-color: white;*/
  margin: 0;
  border-radius: 0.5em;
  text-indent: 0;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
}
/*.hamburger-menu-content p.crumb::before { content: "" }*/
.hamburger-menu-content a {
  display: inline-block;
  background-color: white;
  min-width: 50px;
  text-align: center;
  padding: .5em 0em; /*padding van de links zelf*/
  border-radius: 0.5em;
  text-indent: 0;
}
.hamburger-menu-content p.crumb a {
  display: inline-block;
  background-color: #90c020;
  color: white;
  min-width: 50px;
  text-align: center;
  padding: .5em 0em; /*padding van de links zelf*/
  border-radius: 0.5em;
  border:1px solid #7FCF00;
  text-indent: 0;
}
.hamburger-menu-content p.crumb a:hover {
  color: black;
  background-color: #d0f030;
  text-indent: 0;
}
/*menu inhoud zelfde kleur geven als hamburger*/
.hamburger-menu-content {
  opacity: 0.95;
  display: flex;
  padding: 0px 0px;
  margin: 0px;
  border-radius: 0.5em;
  background: #d0f030;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  color: black;
  float: left;
  text-indent: 0;
}
/*verborgen menuinhoud*/
.hamburger-menu-content ul.hiddentarget, .subnavblock ul.hiddentarget  {
  display: none;
}
.hiddentarget  {
  display: none;
}
/*verborgen menuinhoud*/
.hamburger-menu-content ul, .subnavblock ul, ul.nav  {
  padding-left: 1px;
  padding-right: 0;
  padding-top: .2em;
  padding-bottom: 0em;
  margin: 0px; /*geeft groen rand om menu*/
  background: white;
  border-radius: 0.5em;
/*  width: 0px;
  height: 0px;
  overflow: hidden;
  -webkit-transition-property: width, height;
  -webkit-transition-duration: 0.5s;
  transition-property: width, height;
  transition-duration: 0.5s;
*/
}
.hamburger-menu-content ul ul, .subnavblock ul ul, ul.nav ul {
  margin-left: 1em;
  margin-top: 0;
  padding-left: 0;
}
.hamburger-menu-content ul ul ul, .subnavblock ul ul ul, ul.nav ul ul {
  margin-left: 1em;
  margin-top: 0;
}
.hamburger-menu-content ul:target, .subnavblock ul:target  {
  display: block;
}
/*listitem*/
.hamburger-menu-content ul {
  list-style: none;
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  margin-top: 0.2em;
  /*cursor: pointer;*/
  transition: color 0.5s, background 0.5s;
  border-radius: 0.5em;
}
.subnavblock ul li, ul.nav li {
  list-style: none;
  padding-top: 0em;
  padding-bottom: 0.1em;
  margin: 0;
  text-align: left;
  /*margin-left: 3em;
  text-indent: -2em;
  cursor: pointer;
  transition: color 0.5s, background 0.5s;*/
  border-radius: 0.5em;
}
/*langzaam veranderen van kleur listitem bij hoveren*/
/*.hamburger-menu-content ul li:hover {
  color: #0CD6AD;
  background: #1E3300;
} */
.subnavblock ul li:hover, ul.nav li:hover, ul.nav a:hover {
  color: black;
  background: #d0f030;
}
/*.subnavblock ul ul li:hover, ul ul.nav li:hover {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  background: #d0f030;
}*/

.fixed-navigation-block {
  position:-webkit-sticky;
  position:fixed;
  top:0;
  left:0;
  margin: 0;
  padding: 0;
  z-index: 2;
  border-radius: 0.5em;
}
.fixed-navigation-block ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.fixed-navigation-block ul li { 
  display: inline-block;
  float:left; 
  width: 2.4em;
  height: 2.6em;
  margin: 0.2em;
  margin-left: 0.2em;
  /*overflow: hidden; fout; geen uitvouwbaar menu dan*/
  border-radius: 0.5em;
  text-indent: 0;
  }
.fixed-navigation-block ul li a {
  display: inline-block;
  background: #d0f030;
  color: white;
  opacity: 0.1;
  font-size: 1.5em;
  z-index: 9; /*??????????????????????????????????????*/
/*  text-align: center;
  padding: 0.3em 0.1em;
  text-decoration: none;
  min-width: 2.3em;
  height: 1em;
  width: 1em;*/
  text-indent: 0;
}
.fixed-navigation-block ul li a:hover {
  background: white;
  color: #7FCF00;
  text-indent: 0;
}
address { font-style: italic; }
h1 {
  text-indent: 0;
  font-size: 1.7em; font-weight: bold;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0.5em;
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
h2 { 
  text-indent: 0;
  font-size: 1.4em; font-weight: bold;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0.5em; 
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  clear: both; 
}
h3 {
  text-indent: 0;
  font-variant: small-caps;
  font-size: 1.4em; font-weight: normal;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0.5em; 
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  clear: both; 
}
h4 { font-size: 1em; font-weight: bold;
  text-indent: 0;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0.5em; 
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  clear: both;
}
h5 { font-size: 1em; font-weight: bold;
  text-indent: 0;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0px; 
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
h6 { font-size: 0.83em; font-weight: bold;
  text-indent: 0;
  display: block; /*color: #FFFFFF; background-color: #7FCF00;*/
  padding-left: .25em; padding-bottom: .2em; padding-top: .2em; 
  margin-top: 0px; margin-bottom: 0px; 
  text-align: left; 
  margin-right: 2em; 
  margin-left: 0em; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
table {
  border-collapse: collapse; 
  border-spacing: 0px;
  border-radius: 0.5em;
  border:1px solid #7FCF00;
  text-align: center;
  margin-left: 1em; 
  margin-right: 3em; 
}
td, th {
  vertical-align: middle;
  text-align: center;
  padding-left: 3px;
  padding-right: 3px;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 0.5em;
  border:1px solid #7FCF00;
}
.leftborder {
  border: none;
  border-left: 1px solid #7FCF00;
}
.noborder {
  border: none;
}
q:before        { content: open-quote; }
q:after { content: close-quote; }
/*strong        { background-color: #ccff99; }
em      { background-color: #ccff99; }
*/
ul      { margin-top: 0px; margin-bottom: 0px; margin-left: 1.5em;
                padding-left: 0px; }
ul.menulist     { margin-top: 0.5em; margin-bottom: 0.5em; margin-left: 0.5em;
                padding-left: 0px; font-size: 1.11em; }
ul.menulist ul.menulist { margin-top: 0.5em; margin-bottom: 0.5em; margin-left: 0.5em;
                padding-left: 0px; font-size: .9em; }
ol      { margin-top: 0px; margin-bottom: 0px; margin-left: 1.5em;
                padding-left: 0px; }
li      { margin-top: 0px; margin-bottom: 0px; margin-left: 0.5em;
                padding-left: 0px; }
dl      { margin-bottom: 0em; margin-top: 0px; margin-left: 1em; }
dt      { margin-bottom: 0em; margin-top: 0px; margin-left: -1em; 
                font-weight: bold;}
dd      { margin-bottom: 0em; margin-top: 0px; margin-left: 1em; }
iframe { border: none; margin: 0px;}
form { margin: 0 0 0 0; font-style: normal; font-weight: normal; }
legend { padding-left: 2px; padding-right: 2px; }
fieldset { margin-left: 2px; margin-right: 2px; margin-top: 6px; 
        margin-bottom: 6px; 
        padding: 0.2em 0.2em 0.2em 0.2em; 
        /*border-width: 2px;
        border-color: #7FCF00;*/
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
input,textarea,button   {
        color: #000000; vertical-align: bottom;
        padding: 0px 0px 0px 2px; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        /*border-width: 1px; background-color: #ccff99;*/}
textarea.readonly       { 
        color: #000000; vertical-align: bottom;
        padding: 0px 0px 0px 2px; /*border-width: 1px; background-color: #FFFFFF;*/
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        }
select { margin: 0;
        /*background-color: #ccff99; border-width: 1px;*/
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        }
option:checked { /*background-color: #7FCF00; */}
optgroup { font-style: normal; font-weight: bold;}

a.img {
  color: #000;
  font: 16px Impact;
  padding: 0.25em; 
  margin: 0.5em; 
  border: none;
  max-width: 90%;
  max-height: 90%;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  object-fit: contain;
  /*transition: width 0.5s, height 0.5s;*/
}

img {
  color: #000;
  font: 16px Impact;
  padding: 0; 
  margin: 0; 
  border: none;
  max-width: 90%;
  max-height: 90%;
  border-radius: 0;
  box-shadow: none;
  object-fit: contain;
  /*transition: width 0.5s, height 0.5s;*/
}
img[alt] {
  color: #000;
  font-style: italic;
  font: 16px Impact;
  font-size: 16px;
}
img.lang {
  padding: 0.25em; 
  margin: 0; 
  border: none;
  border-radius: 0.25em;
  box-shadow: none;
}
img.clean {
  background: white;
  padding: 0; 
  margin: 0; 
  border: none;
  border-radius: 0;
  box-shadow: none;
}
img.hovimg {
  cursor: pointer;
}
img.hovimg:target, img.hovimg:active, img.hovimg:hover { /*, img:focus {*/
/*  display: block; dit duwt tekst weg*/
  position: fixed;
  background: white;
  height: auto;
  width: 90%;
  top: 3em;
  right: 2em;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 14
}

a.showlink::after {
  content: " (" attr(href) ")";
}
a {
  border-radius: 0.25em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  text-indent: 0;
}
a:link {
  background: #d0d0d0; color: #004000; text-decoration: none; display: inline-block;
}
a:visited {
  background: #ffffff; color: #000000; text-decoration: none; display: inline-block;
}
/*A.external:visited
A:hover { color: #FFFFFF; background-color: #FF0000; text-decoration: none; }
*/
a:link:hover {
  color: #000000; background-color: #d0f030; text-decoration: underline; display: inline-block;
}
a:visited:hover {
  color: #000000; background-color: #e0ff40; text-decoration: underline; display: inline-block;
}
a:focus { color: #000000; background-color: #d0f030; text-decoration: none; display: inline-block;}
focus { color: #000000; background-color: #d0f030; text-decoration: none; display: inline-block;}
/*a:link:active   { color: #004000; background-color: #FFC800; text-decoration: none; }
a:visited:active        { color: #004000; background-color: #FF0000; text-decoration: none; }
a.hover:hover   { color: #FFFFFF; background-color: #FF0000; text-decoration: none; }
a.k:hover       { color: #FFFFFF; background-color: #FF0000; text-decoration: none; }
*/
a:active, a.active {
  background: #d0f030;
  text-decoration: none; 
  cursor: wait;
  /*
  color: #004000; 
  background-color: #0000FF; 
  */
}
.hover { color: #000000; background-color: #d0f030; }
.blink { text-decoration: blink }
.links { text-align: left; }
.rechts { text-align: right; }
.nomargin { margin: 0px; padding: 0px; }
.smallcaps { font-variant: small-caps }

.navframe{
  /*border:2px solid #7FCF00; */
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  float:right; 
  width:30%; 
  height:250px;
  margin-left:1em;
}
.mainnavframe{
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  border:0px ; 
  width:300px; 
  height:300px;
}

.active {
  background: #d0f030;
}
.center {
  margin: auto;
  text-align: center;
}
.right {
  float: right;
}

.clearfix::after, .row::after {
  content: "";
  clear: both;
  display: table;
}
.note {
  font-size: 11px;
}
.halfsize {
  font-size: 50%;
}
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
.hypothes {
  display: block;
  position: absolute;
  top: 0;
  right: 50px;
  border:1px solid #7FCF00;
  padding: 0.2em;
  /*padding-right: 0px;
  padding-left: 0.5em;*/
  text-align: center;
  width: 12em;
  font-size: 11px;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  background: white;
  margin-top: .2em;
  z-index: 15;
  /*background-color: #7FCF00;
  color: red;*/
}
.ahypothes {
  font-size: 11px;
}

.fixed-header-block {
  position:-webkit-sticky;
  position:fixed;
  margin: auto; 
  /*width: 100%; zonder width wordt breedte minimaal. Met 100% kloppen de marges maar op een klein scherm gaat de tekst onder de knoppen.*/
  min-height: 2.5em;
  max-height: 3em;
  overflow: hidden; 
  margin-top: .2em;
  padding-left: .2em;
  padding-right: .2em;
  padding-top: .2em;
  padding-bottom: .2em;
  vertical-align: middle;
/*left: 15em;*/
  min-width: 2em;
  max-width: 60%;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  background: white;
/*top: 0;*/
  z-index: 1;
  text-align: center;
}
.fixed-header-block a, .fixed-header-block a:link, .fixed-header-block a:visited, .subnavblock a , .subnavblock a:link, .subnavblock a:visited {
  border-radius: 0.5em;
  box-shadow: none;
  background: none; 
  color: black; 
  text-decoration: none; 
  font-size: 0.7em;
}
.fixed-header-block a:hover{
  background: #d0f030;
}
.header_blok { 
  display: block;
  position: relative; /*moet vreemd maar waar relative zijn om hierin absolute te kunnen positioneren*/
  width:100%;
  border: 0px;
  padding: 0px;
  padding-top: 2em;
  margin: 0px;
  text-align: center;
  font-size: 1.5em;
  z-index: 1;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  background: white;
  /*background-color: #7FCF00;
  color: white;*/
}
.subnavblock {
  /*border:2px solid #7FCF00; */
  display: none;
  position:-webkit-sticky;
  position:fixed;
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  width:30%; 
  height: 90%;
  margin-left:0em;
  padding-right:2em;
  left: 0em;
  top: 3em;
  overflow: auto;
  text-align: left;
  /*  max-width:390px; 
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  overflow-wrap: break-word;
  word-break: normal;
  word-wrap: break-word;*/
}
.main_blok { 
  /*border-left:1px solid #7FCF00;*/
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: .5em;
  padding-top: 0;
  background-color: #ffffff;
  z-index: 0;
}
img.bigimg {
  z-index: 5;
  cursor: pointer;
  background: white;
}
/*verborgen checkbox*/
.img-trigger {
  opacity: 0;
  position: absolute;
  margin: 0;
  padding: 0;
  width: 1px;
  height: 1px;
  left: 0px;
  cursor: pointer;
  z-index: 6;
}
.img-trigger:checked ~ * img.bigimg, .img-trigger:checked ~ * x3d.bigimg {
/*  display: flex; */
  position: fixed;
  background: white;
  height: auto;
  width: 90%;
  top: 3em;
  right: 2em;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 14
}
img.noimg {
  font-size: 1px;
  width: 1px;
  height: 1px;
  padding: 0px; 
  margin: 0px; 
  margin-right: 0px;
  border: 0px;
  float: right;
  border-radius: 0;
  box-shadow: none;
}
/*voetnoot verborgen iframe; werkt niet als voetnoot in <p> zit?!*/
.fn-link div, .fn-link span {
  position: fixed;
  background: #d0f030;
  right: 1em;
  bottom: 1em;
  float: left;
  margin: 1em;
  padding: 0px;	/*moet nul zijn of anders altijd zichtbaar*/
  display: flex;        /*bij none werkt transite niet*/
  border: none; 
  border-radius: 0.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  width: 0px;
  height: auto;
  max-height: 33vW;
  overflow: auto;
  -webkit-transition-property: width, height; /* Safari */
  -webkit-transition-duration: 0.5s; /* Safari */
  -webkit-transition-delay: 2s;
  -webkit-transition-timing-function: ease-in-out;
  transition-property: width, height;
  transition-duration: .5s ;
  transition-delay: 2s;
  transition-timing-function: ease-in-out;
  z-index: 15;
}
/*als aangeklikt iframe groter maken*/
.fn-link:hover div, .fn-link:hover ~ span {
  -webkit-transition-delay: .5s;
  -webkit-transition-duration: 0.5s ;
  transition-delay: .5s;
  transition-duration: 0.5s ;
  width: 90vw;
}
/*active moet achter hover*/
.fn-link:active ~ div, .fn-link:active ~ span {
  -webkit-transition-duration: 0s ;
  -webkit-transition-delay: 0s;
  transition-duration: 0s ;
  transition-delay: 0s;
  width: 90vw;
}
/*div.western, div.first-paragraph */
p, div.p, div, div.western {
  display: block;
  margin: 0px;
  text-indent: 2em;
  text-align: justify;
  margin-right: 1em; 
  margin-left: 0em; 
  line-height: 1.5;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
/* De volgende doet het niet, wellicht vanwege het getal vooraan*/
.1e-regel-inspringen {
  text-indent: 0;
}
blockquote {
  display: block;
  margin: 0px;
  /*text-indent: 2em;*/
  text-align: justify;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  margin-left: 1em; 
  margin-right: 2em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-size: 0.9em;
}

.first-paragraph, blockquote + div.p, h1 + div.p, h2 + div.p, h3 + div.p, h4 + div.p, div.p + blockquote, h1 + blockquote, h2 + blockquote, h3 + blockquote, h4 + blockquote blockquote + div.western, h1 + div.western, h2 + div.western, h3 + div.western, h4 + div.western, div.western + blockquote {
  text-indent: 0;
}

p.centered, div.centered {
  display: block;
  margin: 0px;
  text-indent: 0px;
  text-align: center;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.negatief-inspringen {
  display: block;
  margin: 0px;
  margin-left: 2em; 
  text-indent: -2em;
  text-align: left;
  margin-top: 0.5em;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.btn {
  display: inline-block;
/*  padding: 10px 20px;
  border: 1px solid #00898E;
*/padding: 0px 2px;
  border-radius: 5px;
  transition: background .3s;
}
.popup {
  color: LightGray;
  position: fixed;
  top: 50%;
  left: 50%;
  padding: 10px;
  padding-top: 3em;
  max-width: 66%;
  width: 80em;
  border-radius: 5px;
  transform: translate(-50%,-50%);
  background: rgba(255,255,255,.9);
  visibility: hidden;
  opacity: 0;
  /* "delay" the visibility transition */
  -webkit-transition: opacity .3s, visibility 0s linear .3s;
  transition: opacity .3s, visibility 0s linear .3s;
  z-index: 1;
  text-align: left;
  text-indent: 0pt;
}
.popup:target {
  color: Black;
  visibility: visible;
  opacity: 1;
  /* cancel visibility transition delay */
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.popup-close {
  position: fixed;
  top: 50%;
  left: 50%; 
  padding: 10px;
  padding-top: 3em;
  max-width: 66%;
  width: 80em;
  border-radius: 5px;
  transform: translate(-50%,-50%);
  background: rgba(255,255,255,.9);
}
.popup .close {
  position: absolute;
  right: 5px;
  top: 5px;
  padding: 5px;
  color: #000;
  transition: color .3s;
  font-size: 2em;
  line-height: .6em;
  font-weight: bold;
}
.close-popup {
  background: rgba(0,0,0,.7);
  cursor: default;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  visibility: hidden;
  /* "delay" the visibility transition */
  -webkit-transition: opacity .3s, visibility 0s linear .3s;
  transition: opacity .3s, visibility 0s linear .3s;
}
.popup:target + .close-popup{  
  opacity: .5;
  visibility: visible;
  /* cancel visibility transition delay */
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
/*volgende moeten als laatste
@import url('https://fonts.googleapis.com/css2?family=Andika&display=swap';
@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');
/*