*  {box-sizing:border-box;}
@font-face {font-family:'scriptmt'; src:url("FONTS/scriptbl.ttf")format("truetype")
	url("FONTS/scriptbl.svg")format("svg") url("FONTS/scriptbl.otf")format("opentype");}
body {background:url("IMG/BACK04.gif") fixed no-repeat; background-size:100%; font-size:14px;}
h1 {position:absolute; left:50%; top:10px; color:blue; font-weight:bold; margin-left:-40vw; white-space:nowrap; 
	font-family:'scriptmt'; text-shadow:3px 3px 1px gray; font-size:6vw; }
h1 a {text-decoration:none; color:blue;}
h2 {color:blue; font-weight:bold; font-size:300%; margin:30px 0 20px; text-align:center;}
h3 {padding:5px; width:100%; background-color:#CCD6FC;                          /* kopje boven elke sektie */
	border-top:3px solid blue; color:blue; font-weight:bold; font-size:200%; vertical-align:middle;}
h3 a {text-decoration:none; color:blue;}
h3:hover a {color:white;text-decoration:underline; }
h4 {color:blue; font-weight:bold; font-size:150%;}
h5 {color:blue; font-size:111%; margin:0;}
table {table-layout:fixed;}
img {border-width:0;  break-inside:avoid;}   /* all images by default without border */
img[src*="VLAGENGELS.gif"] {height:15px; width:20px;} 
.clear {clear:both;}
.plaatjew50 {max-width:50%; height:auto;}
.plaatjew99 {max-width:99%; height:auto;}
.rood {color:red;}

/* ---------- totaal binnen blauwe kader ------------ */
#total {position:relative; padding:0; margin:15vw auto 500px -8px; width:100%; min-width:320px;
	max-width:1500px; border:thick solid blue; border-radius:20px; box-shadow:5px 8px 5px #888;}

/* ---------- menu ------------ */
#menzoek {background-color:transparent; position:absolute; top:3px; right:3px;}   /* google zoek */

#hiermenuladen {position:fixed; left:5px; top:5px; background: transparent; padding:10px;
	border-radius:15px; color:white; z-index:15; font-size:120%; } 
#menu3icons {}  /* wordt onderin MENU.HTML eventueel vergroot  */
#menu3icons img {width:100%; height:auto;}
nav {position:absolute; top:-40px; left:-60px; box-shadow:2px 2px 4px silver; border-width:0 0 5px 5px;
	padding:5px 5px 5px 5px; color:blue; border-radius:0 9px 9px 9px; width:99px; display:none; background:#CCD6FC;} 
nav div {width:100px; text-align:left; position:relative; z-index:25;}
nav .menu2 {display:none; text-align:left; margin-left:90px; position:absolute; top:-25px; 
	border-left:solid blue 5px;  border-bottom:5px blue solid; line-height:150%; padding:9px;
	box-shadow:2px 2px 4px silver; border-radius:0 0 9px 9px; background-color:#CCD6FC; z-index:55;}
nav .mennot,nav .menyes{display:block; text-decoration:none;}
nav .mennot:hover {color:white; font-weight:bold; font-size:120%; background:blue;}
nav .topmenu:hover{color:white;}
nav .menyes {color:#fff; font-weight:bold; text-shadow:1px 1px blue;}
nav div:hover .menu2 {display:block;} /* */ 
nav .nopoint{cursor:text;}
nav .menkop{border-bottom:1px solid blue; font-weight:bold; font-size:110%;}
nav span{font-weight:bold;}
#puntjelinks {position:absolute; left:-10px; top:5px;}
#menushow {max-width:50px; height:auto; margin-left:-10px;} 

/* de rest staat in MENU.HTML     */

/* ---------- introduktie onder menu ------------ */
.introtab {width:100%; border-collapse:collapse;}                               /* introducerende tekst onder menu */
.introlft {width:5%; border-right:5px solid blue; background-color:transparent; border-bottom:5px solid blue;}
.introrgt {width:5%; border:0; padding:0; background-image:url(IMG/BACK01.gif); 
	border-top:5px solid blue; border-left:5px solid blue;}
.intromid {padding:10px; background-color:#CCD6FC;}
.fontklein {font-size:85%;}

/* ---------- de echte inhoud ------------ */
#content {padding:0 10px 0 10px; background-image:url(IMG/BACK01.gif);      /* essentie  onder de introduktie */
	border-radius:0 0 15px 15px;}
#contentfotos {background-color:black; position:relative; border-radius:0 0 15px 15px; padding:0 5px;}
#botmid {text-align:center; font-size:70%;}                                     /* info bottom-center */
#botlft {float:left; font-size:70%;}                                            /* info bottom-left */
.col321 {column-count:1; column-rule:solid blue 1px;}                           /* 3,2 of 1 kolommen  */
.col21 {column-count:1; column-rule:solid blue 1px;}                           /* 3,2 of 1 kolommen  */

.pyl {clear:both; text-align:center;}                                           /* navigatie pijltjes */
.copyrgt,.copyfot {font-size:1em; position:relative; bottom:-15px; text-align:right;}  /* signature bottom-right */
.copyrgt,.copyrgt a{color:blue;}
.copyfot,.copyfot a{color:white;}
.copyrgt a:hover,.copyfot a:hover{color:#888;}
.center {text-align:center;}
.headcaps { margin-top:-0px;}
.headcaps:first-letter {float:left; font-size:300%; color:blue;}                /* mooie hoofdletter */

/* --- foto pagina's --- */
#zoomtext {position:absolute; width:300px; right:10px; top:200px; background:#CCD6FC; padding:3px;
	display:none; border:1px solid blue; border-radius:15px; z-index:111; box-shadow: 10px 10px 5px 0 rgba(0,0,0,0.75);}
#zoomicon:hover + #zoomtext{display:block;}
.bovenschrift {text-align:center; color:white;}
#smlpics {margin:0 auto 0 auto; color:white;}
#smlpics h2 {color:white;}
#smlpics div {display:flex; justify-content:space-around; flex-wrap:wrap;}
#smlpics div div{width:60px; height:60px; border:1px solid #333; margin:1px; padding:4px;
	display:flex; justify-content:center; align-items:center;}
#smlpics img{max-width:100%; max-height:100%; object-fit: contain; 
	box-shadow:2px 2px 2px 1px #555; /*5px 5px 9px 0px #333;*/}
#bigpicvat {position:fixed; top:15px; right:10px;
	max-width:625px; width:95%; padding:0 8px 2px; 
	border:4px ridge silver; background-color:#222; border-radius:9px; display:none; z-index:5; }
#bigpicimg {cursor:e-resize; max-width:100%; height:auto;}
#piccontrol {text-align:left; color:white; margin:5px 0 0px 10px; width:100%; height:60px;}   /* wordt onderin MENU.HTML eventueel vergroot  */
#piccontrol img {display:inline; box-shadow:0; height:30px; width:auto;}
#exitpng {position:absolute; right:-0px; top:0; z-index:99;}
.pylfotos {position:fixed; bottom:30px; padding:0 50px; opacity:0; z-index:999;}
.pylfotos:hover{opacity:1!important;}

/* special in one or two pages */
.outdent:first-letter {margin-left:-40px;}                                      /* outdenting of years in PRVEKE */
.left {float:left; padding:5px 10px 0 0;}                                       /* image within sektion h3 in APLQQ */
.subtit {font-size:15pt; font-style:normal; font-weight:normal; color:black;}   /* in APLQQ en PRVPRJ*/
.noot {font-size:10pt; padding-top:8px; line-height:11pt;}                      /* noot (referentie & literature) in elk PRJ en RNA */
.noot:first-line {font-weight:bold; font-style:italic; font-size:11pt; margin-left:-40px;}
.rnastruc {color:blue; font-size:10pt; break-inside:avoid; break-inside:avoid-column;}


@media (min-width:400px)
	{#zoomtext {width:390px; padding:10px; top:150px;}
	#total {margin:15vw auto 500px auto;}
	#smlpics div div{width:65px; height:65px;}
	}
@media (min-width:600px)
	{#zoomtext {width:450px; right:40px;}
	#smlpics div div{width:70px; height:70px;}
	.col321,.col21 {column-count:2;}
	}
@media (min-width:700px)
	{#smlpics div div{width:80px; height:80px;}
	#bigpicvat {left:50%; margin-left:-300px;}
	}
@media (min-width:800px)
	{#smlpics div div{width:90px; height:90px;}
	}
@media (min-width:900px)
	{#smlpics div div{width:100px; height:100px;}
	.col321 {column-count:3;}
	}
@media (min-width:1100px)
	{#smlpics div div{width:110px; height:110px;}
	}


/* voor printen   */
@media print 
	{h1 {}
	div#total {margin:200px 0 0 0;}
	nav {display:none;}
	div#content {background-image:none;}
	.introrgt {background-image:none;}
	#hiermenuladen{display:none;}
	}