@import url(https://fonts.googleapis.com/css?family=Share+Tech);

:root {
	--clr_bg: #404558;
	--clr_t1: #ffffff;
	--clr_t2: #3abcf0;
	--clr_t3: #69c2ca;
	--clr_t4: #49a2aa;
	--clr_ln: #69a99a;
	--fnt_sz1: 1.6vw;
	--fnt_sz2: 1.4vw;
	--fnt_sz3: 1.2vw;
	--fnt_sz4: 1.1vw;
	--fnt_sz5: 1vw;
	--fnt_lh1: 2.3vw;
	--fnt_lh2: 2vw;
	--fnt_lh3: 1.7vw;
	--fnt_lh4: 1.5vw;
	--fnt_lh5: 1.3vw;
	--opc1: 0.65;
  }
html {overflow:hidden;}
body { background-color:var(--clr_bg)}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	.fnt_w  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);line-height:var(--fnt_lh1);color:var(--clr_t1)}
	.fnt_b  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);line-height:var(--fnt_lh1);color:var(--clr_t2)}
	.fnt_g  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);line-height:var(--fnt_lh1);color:var(--clr_t3)}
	.fnt_g2  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);line-height:var(--fnt_lh1);color:var(--clr_t4)}
	.pp_loc  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);color:#000;line-height:var(--fnt_lh1);padding-bottom:3px;}
	.pp_ttl  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz1);color:#444;line-height:var(--fnt_lh1);padding-bottom:1px;}
	.pnl_x  {position:absolute;left:79.8vw;top:0vh;width:4vw;height:4vw;z-index: 40;}

}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	.fnt_w  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);line-height:var(--fnt_lh2);color:var(--clr_t1)}
	.fnt_b  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);line-height:var(--fnt_lh2);color:var(--clr_t2)}
	.fnt_g  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);line-height:var(--fnt_lh2);color:var(--clr_t3)}
	.fnt_g2  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);line-height:var(--fnt_lh2);color:var(--clr_t4)}
	.pp_loc  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);color:#000;line-height:var(--fnt_lh2);padding-bottom:3px;}
	.pp_ttl  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz2);color:#444;line-height:var(--fnt_lh2);padding-bottom:1px;}
	.pnl_x  {position:absolute;left:80.8vw;top:0vh;width:3vw;height:3vw;z-index: 40;}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    .fnt_w  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);line-height:var(--fnt_lh3);color:var(--clr_t1)}
	.fnt_b  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);line-height:var(--fnt_lh3);color:var(--clr_t2)}
	.fnt_g  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);line-height:var(--fnt_lh3);color:var(--clr_t3)}
	.fnt_g2  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);line-height:var(--fnt_lh3);color:var(--clr_t4)}
	.pp_loc  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);color:#000;line-height:var(--fnt_lh3);padding-bottom:3px;}
	.pp_ttl  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz3);color:#444;line-height:var(--fnt_lh3);padding-bottom:1px;}
	.pnl_x  {position:absolute;left:81.8vw;top:0vh;width:2vw;height:2vw;z-index: 40;}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	.fnt_w  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);line-height:var(--fnt_lh4);color:var(--clr_t1)}
	.fnt_b  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);line-height:var(--fnt_lh4);color:var(--clr_t2)}
	.fnt_g  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);line-height:var(--fnt_lh4);color:var(--clr_t3)}
	.fnt_g2  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);line-height:var(--fnt_lh4);color:var(--clr_t4)}
	.pp_loc  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);color:#000;line-height:var(--fnt_lh4);padding-bottom:3px;}
	.pp_ttl  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz4);color:#444;line-height:var(--fnt_lh4);padding-bottom:1px;}
	.pnl_x  {position:absolute;left:81.8vw;top:0vh;width:2vw;height:2vw;z-index: 40;}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	.fnt_w  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);line-height:var(--fnt_lh5);color:var(--clr_t1)}
	.fnt_b  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);line-height:var(--fnt_lh5);color:var(--clr_t2)}
	.fnt_g  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);line-height:var(--fnt_lh5);color:var(--clr_t3)}
	.fnt_g2  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);line-height:var(--fnt_lh5);color:var(--clr_t4)}
	.pp_loc  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);color:#000;line-height:var(--fnt_lh5);padding-bottom:3px;}
	.pp_ttl  {font-family: 'Share Tech Mono', monospace;font-size:var(--fnt_sz5);color:#444;line-height:var(--fnt_lh5);padding-bottom:1px;}
	.pnl_x  {position:absolute;left:81.8vw;top:0vh;width:2vw;height:2vw;z-index: 40;}
}
.xxs  {font-family: 'Share Tech Mono', monospace;font-size:1.2vh;color:var(--clr_t4);text-decoration: none;}

#bg {position: absolute;left: 0vw;top: 0vh;width: 100vw;height: 100vh;z-index: 1;opacity: 0}
#bgwrap {position: absolute;left: 0vw;top: -50vh;width: 100vw;height: 100vh;z-index: 1}
.bgImage  {position:absolute;left:0vw;top:0vh;width:100vw;height:100vh;object-fit: fill; opacity: 0.8}
.bgGrad  {position:absolute;left:0vw;top:0vh;width:100vw;height:100vh;z-index: 1;object-fit: cover}
#hoofd    {position:absolute;left:10vw;top:0vh;width:80vw;height:6vh;z-index: 40;display: flex;flex-direction: row}
#knvtxt1    {position:absolute;left:10vw;top:7.6vh;width:60vw;height:16vh;z-index: 41;}
#kaart    {position:absolute;left:9vw;top:28vh;width:82vw;height:50vh;z-index: 43;filter: sepia(80%) hue-rotate(168deg) saturate(140%) brightness(1.4);border: 1px solid #404558;opacity: 0;}
.mrk_popup {cursor:pointer; width:100px}
#knvtxt2    {position:absolute;left:10vw;top:81vh;width:60vw;height:16vh;z-index: 42;}
hr {border: none;border-top: 1px dotted var(--clr_t3)}
#hlyn1 {position:absolute; left:7vw; width:86vw; top:7vh;z-index:5;opacity: var(--opc1);}
#hlyn2 {position:absolute; left:7vw; width:86vw; top:23vh;z-index:5;opacity: var(--opc1);}
#hlyn3 {position:absolute; left:7vw; width:86vw; top:80vh;z-index:5;opacity: var(--opc1);}
#hlyn4 {position:absolute; left:7vw; width:86vw; top:92vh;;z-index:5;opacity: var(--opc1);}
.lyn0a {position:absolute; left:0vw; top:0vh; width:0.2vh; height:2.4vh; background-color: var(--clr_ln);}
.lyn0b {position:absolute; left:0.2vh; top:0vh; width:calc(86vw - 0.4vh); height:0.2vh; background-color: var(--clr_ln);}
.lyn0c {position:absolute; right:0.2vh; top:0vh; width:0.2vh; height:2.4vh; background-color: var(--clr_ln);}
.lyn1a {position:absolute; left:0vw; top:0vh; width:0.2vh; height:3vh; background-color: var(--clr_ln);}
.lyn1b {position:absolute; left:0.2vh; top:1.4vh; width:calc(86vw - 0.4vh); height:0.2vh; background-image: url(../pix/fix/min.svg);background-repeat: repeat-x;}
.lyn1c {position:absolute; right:0.2vh; top:0vh; width:0.2vh; height:3vh; background-color: var(--clr_ln);}
.lyn2a {position:absolute; left:0vw; top:0vh; width:0.2vh; height:2.4vh; background-color: var(--clr_ln);}
.lyn2b {position:absolute; left:0.2vh; top:2.2vh; width:calc(86vw - 0.4vh); height:0.2vh; background-color: var(--clr_ln);}
.lyn2c {position:absolute; right:0.2vh; top:0vh; width:0.2vh; height:2.4vh; background-color: var(--clr_ln);}
#paneel   {position:absolute;left:8vw;top:calc(7vh + 1vw);width:83.8vw;height:calc(85.2vh - 1vw);overflow: hidden;z-index: 50;opacity: 0;display: none}
#pnl_bg   {position:absolute;left:0vw;top:0vh;width:100%;height:100%;z-index: 1;background-color: #212639BE}
.pnl_bgImage  {width: 100%;height: 100%;z-index: 2;object-fit: cover; opacity: 0.4}
#pnl_txt  {position:absolute;left:2vw;top:0vh;width:27vw;height:100%;z-index: 32;}
#prj_ttl  {position:absolute;left:0vw;top:-1vh;width:25vw;height:5vh;margin-top: 0px;overflow-y:auto;z-index: 32;}
#prj_tag  {position:absolute;left:0vw;top:2vh;width:25vw;height:10vh;margin-top: 0px;overflow-y:auto;z-index: 32;}
#prj_txt  {position:absolute;left:0vw;top:15vh;width:23vw;height:55vh;margin-top: 0px;overflow-y:auto;z-index: 32;}
#pnl_img  {position:absolute;left:30vw;top:0vh;width:58vw;height:73vh;z-index: 35;opacity: 0;}
.prj_foto {width: 100%;height: 100%;object-fit: contain;object-position: 0px 0px;}
#pnl_moz  {position:absolute;left:30vw;top:75vh;width:52vw;height:10vw;z-index: 35; overflow-x: auto;opacity: 0;}
#pnl_mozrow  {position:absolute;left:0vw;top:0vh;height:10vw;z-index: 1;display: flex;flex-direction: row}
.node  {width:6vw;height:4vw;padding-right: 4px;z-index: 34;cursor: pointer;overflow: hidden;}
#auth  {position:absolute;left:9vw;top:95vh;width:20vw;height:5vh;z-index: 60}
#deko     {position:absolute;left:9vw;top:29vh;width:82vw;height:50vh;z-index: 60;background-image: url(../pix/fix/zandloper.gif);
			background-repeat:no-repeat; background-position:50% 25%;display: none}


.leaflet-top.leaflet-left {
    opacity: 0.2;
}

.leaflet-bottom.leaflet-right {
    opacity: 0.2;
}
