@font-face{font-family:myFirstFont;src: url(sansation_light.woff)}
*{padding:0px;margin:0px}
html{scroll-behavior:smooth}
html, body{width:100%;min-height:100%;margin:-8px 0px 0px 0px;overflow-y:visible;overflow-x:hidden;text-align:center}
/* Designing for scroll-bar */::-webkit-scrollbar{width:5px}
/* Track */::-webkit-scrollbar-track{background:gainsboro;border-radius:5px}
/* Handle */::-webkit-scrollbar-thumb{background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);border-radius:5px}
/* Handle on hover */::-webkit-scrollbar-thumb:hover{background: #cccc99}
.center{display:block;position:relative;width:100%;height:100%;z-index:1;}
canvas#lijn{position:fixed;top:0;left:0;width:100%;height:100%;display:block;z-index:23}
#resetButton{display:none;position:absolute;left:20%;top:5%;width:2vw;height:2vh}
#social{z-index:23;display:flex;flex-wrap:wrap;height:400px;
align-content:space-between;width:300px;position:fixed;top:6%;left:4%}
#social img{z-index:23;display:block;width:50px;height:50px;border-radius:5px;padding:0px 15px 0px 0px}
#social a{float:left;clear:left;position:relative}
#tip-container{position:absolute;right:20px;top:40px;display:none;width:40px;height:40px;z-index:10000}
#lightbulb{width:40px;height:40px;cursor:pointer;z-index:10000}
#popup{position:fixed;top:51%;left:51%;transform:translate(-50%, -50%);z-index:1000;border:0px}
#gif-container img{width:100%;height:auto}
.hidden{display:none}
#key{display:block;position:fixed;z-index:24;left:calc(50% - 63.545px + 5vw);top:50%;transform:translate(-50%, -50%);width:10vw;height:10vmax;min-width:127.09px !important;min-height: 127.09px !important;
-webkit-transition:left 1.5s ease-in-out;transition:left 1.5s ease-in-out;transition-duration:400ms}}
#key::after{content:"";clear:left;padding-top:0%}
#pressed.format{position:inherit;float:right;right:105%;top:10%;max-width:100px;max-height:100px;text-align:center;border:double 2px #fef0ad;opacity:0.6}
#enter{z-index:24;min-width:125px;min-height:125px;pointer-events:all;border-radius:10%;background-color:#4d585c;border:double 5px #fef1ad}
#enter.format{z-index:24;position:fixed;visibility:visible;display:flex;justify-content:space-evenly;align-items:center;max-width:125px;max-height:125px}
.format:nth-child(1){position:inherit;bottom:10%;}
button{float:left;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;height:50px;width:50px;opacity:1;position:fixed;z-index:51}
button#do{background-color:#cccccc;border-radius:25%;position:fixed;top:12.5px;left:12.5px}
#do:hover {background-color:CadetBlue;}
#do:focus{padding:0px}
button#re{background-color:#cccccc;border-radius:25%;position:fixed;top:12.5px;left:72.5px}
#re:hover{background-color:CadetBlue;}
#re:focus{padding:0px;}
button#mi{background-color:#cccccc;border-radius:25%;position:fixed;top:72.5px;left:12.5px}
#mi:hover{background-color:CadetBlue;}
#mi:focus{padding:0px;}
button#sol{background-color:#cccccc;border-radius:25%;position:fixed;top:72.5px;left:72.5px}
#sol:hover{background-color:CadetBlue;}
#sol:focus{padding:0px;}
button#dot{background-color:transparent;background-repeat:no-repeat;border:none;cursor:pointer;overflow:hidden;outline:none;-webkit-transform:scale(0.5);top:52.5px;left:52.5px;height:20px;width:20px;background-color:red;border-radius:50%;position:absolute !important;display:block;clear:left;
transition-property:-webkit-transform;transition-duration:1s;transition-timing-function:ease-in-out;transition-delay:0s}
#U{z-index:22;position:fixed;top:0%;left:0%;width:50%;height:100%;text-align:center;background-color:#4d585c;border-right:dotted 5px #fef1ad;-webkit-transition:left 1.5s ease-in-out;transition:left 1.5s ease-in-out;transition-duration:400ms}
#U img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:21;opacity:0.1}
#content{display:block;z-index:23;position:fixed;right:3%;margin-top:4%;width:40%;border:1px solid white;border-radius:15px;background-color:#ccc;padding:10px;color:white;clear:right}
#modal{position:relative;width:100%;display:inline-block;padding:10px 0px 30px 0px}
#modal #box{height:auto;padding:0px 15px}
#box-legend{display:inline;position:relative;width:100%;height:30px;text-align:left}
#p-1{padding: 0px 10px 30px 0px;float:left;clear:left;cursor:pointer;position:relative;font-weight:400;width:35px;font-size:25px;display:inline-block;color:#4d585c;font-family:'Metamorphous'}
#p-1:hover{transition:0.8s;color:LightGoldenRodYellow}
#popup-window{position:fixed;width:250px;height:200px;background-color:#ccc;border:1px solid black;margin:auto;top:0;right:25%;bottom:5%;left:0%;z-index:60;display:none;} 
#popup-window img{width:150px;height:150px;position:absolute;top:25px;left:50px;z-index:60;display:block}
#close-button{border:none;display:inline-block;vertical-align:middle;overflow:hidden;text-decoration:none;cursor:pointer;white-space:nowrap;background-color:transparent;background-repeat:no-repeat;overflow:hidden;outline:none}
#talen{text-align:right;float:right;clear:right;position:relative;display:inline-block;height:20px;width:calc (100% - 100px)}
#talen li{display:inline;list-style-type:none}
#talen li a{text-decoration:none;font-size:25px;font-weight:400;display:inline-block;padding: 0px 10px 20px 10px;color:#666666;font-family:'Metamorphous'}
#talen li a:hover{transition:0.8s;color:LightGoldenRodYellow}
#talen li a:active{}
#result{position:absolute;bottom:0px;margin-bottom:100px}
#p-0{position:relative;float:left}
.click-count{color:orange;font-weight:bold;position:relative;float:right}
#modal #text{display:inline-block;height:auto;width:100%;text-align:left}
#modal #text h1{line-height:150%;color:LightGoldenRodYellow;border-radius:10px;background-color:#aaa;margin-top:10px;padding:10px}
#modal #text p{line-height:150%;display:inline-block;border-radius:10px;background-color:#aaa;padding:10px}
#modal #text a{color:LightGoldenRodYellow}
button#rechtstreeks{position:relative;float:right;margin-top:0px;background-color:transparent;background-repeat:no-repeat;border:none;cursor:pointer;overflow:hidden;outline:none;-webkit-transform:scale(1);height:45px;width:45px;background-color:#669966;border-radius:100%;display:block;clear:right} 
button#rechtstreeks:hover{-webkit-transform:scale(1.5);transition-property:-webkit-transform;transition-duration:0.7s;transition-timing-function:ease-in-out;transition-delay:0s}
.cc-calto-action-ripple{width:30px;height:30px;padding:1rem;border-radius:100%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-animation:cc-calto-action-ripple 0.6s linear infinite;animation:cc-calto-action-ripple 0.6s linear infinite;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;justify-items:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-decoration:none;}
  @-webkit-keyframes cc-calto-action-ripple {
	0% {
	  -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
	  box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2); }
	100% {
	  -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
	  box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0); } } 
  @keyframes cc-calto-action-ripple {
	0% {
	  -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
	  box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2); }
	100% {
	  -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
	  box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0); } }
#R{position:fixed;top:0px;right:0%;width:50%;height:100%;text-align:center;z-index:20;background-color:#4d585c;border-left:dotted 5px #fef1ad;-webkit-transition:right 1.5s ease-in-out;transition:right 1.5s ease-in-out;transition-duration:400ms;}
#R img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:21;opacity:0.1;}
#R p{visibility: hidden;}
#R h1{position:absolute;right:5%;bottom:5%;color:white;font-size:16px}
#I{display:flex;justify-content:center;position:fixed;bottom:0;left:-15vw;width:15vw;height:calc(100% - 90px);z-index:5;background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);text-align:center;-webkit-transition:left 2s ease-in-out;transition:left 2s ease-in-out;transition-duration: 1700ms;border-right:dotted 5px #fef1ad}	
#open-talen-I{display:block;width:100%;height:150px;position:relative;margin-top:75px}
#talen-I{display:inline-block;width:50%}			
#talen-I li{padding:20px 15px 15px 15px;list-style-type:none;background-color:#4d585c;opacity:0.5;border:solid 1px #fef1ad}
#talen-I li a{text-decoration:none;font-size:30px;font-weight:600;color:#cccc99;font-family:'Metamorphous'}
#talen-I li a:hover{}
#talen-I li a:active{}
#tellers{display:flex;height:50px;position:absolute;bottom:0px;margin-bottom:15%}
#D{display:flex;justify-content:center;width:15vw;height:calc(100% - 90px);position:fixed;bottom:0px;right:-15vw;z-index:5;background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);text-align:center;-webkit-transition:right 2s ease-in-out;transition:right 2s ease-in-out;transition-duration:1700ms;border-left:dotted 5px #fef1ad}	
#D p{padding: 5px 5px 0px 5px;}
#open-reference{display:block;width:100%;height:60px;position:relative;margin-top:75px;font-family:'Metamorphous'}
#open-reference a{padding:10px 20px;opacity:0.5;background-color:#4d585c;border:solid 1px #fef1ad;text-decoration:none;font-size:30px;font-weight:600;display:inline-block;color:#cccc99;font-family:'Metamorphous'}
#open-reference a:hover{}
#totaal-reference{display:none;}
#reference{position:fixed;width:100%;height:100%;border:1px solid white;background-color:#ccc;padding:10px;color:white;top:100px;right:0;left:0;z-index:15}
.topright{position:absolute;right:35px;top:5px;font-size:50px;font-weight:bold;color:LightGoldenRodYellow;opacity:1}
.topright:hover{opacity:0.5}
#reference-modal{padding: 15px 40px 30px 0px;display:block;height:100%;width:100%}
#reference-box{position:relative;display:inline-block;width:92.5%;height:10%;overflow-y:scroll;margin-top:30px;margin-right:10px;border-radius:15px}
#reference-box #link{display:inline;height:auto;width:100%;text-align:left}
#reference-box #link h1{color:LightGoldenRodYellow;border-radius:10px;background-color:#aaa;padding:10px 10px 10px 20px;width:95%}
#reference-box #link p{margin-left:20px;width:95%;line-height:200%;padding:5px 0px}
#logo{position:absolute;bottom:42.5%;display:flex;justify-content:center;width:200px;height:200px}
#social-layout{display:flex;height:50px;position:absolute;bottom:0px;margin-bottom:100px;margin-left:15px}
#social-layout img{display:block;width:50px;height:50px;border-radius:5px;padding:0px 20px 0px 0px}
#social-layout a{float:left;clear:left;position:relative}
#layout-table{display:inline-block;list-style-type: none;position:relative;margin-top:150px;left:0%;width:100%;height:100%;}
#totaal{position:absolute;display:table;left:50%;transform:translateX(-50%);width:70%;max-width:1350px;z-index:1;}
#artikel{display:none}
#totaal-introductie{display:flex;justify-content:center;flex-wrap:nowrap}
#introductie{position:relative;width:90%;height:auto;text-align:left;opacity:0.9;padding:20px;border-radius:10px;background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2)}
#introductie p{font-size:24px;line-height:125%;color:white}
#introductie a{cursor:pointer;font-size:24px;line-height:125%;text-decoration:none;color:LightGoldenRodYellow}
#introductie a:hover{color:orange;text-decoration:none}
.v2{position:relative;display:block;width:100%;height:auto;text-align:left}	  
/* marge tussen de iframes  */
.dialog{width:100%;height:auto;padding-top:12vh;padding-bottom:5vh}
#site_0{display:flex;justify-content:center;align-items:center}
#site_1{display:flex;justify-content:center;align-items:center}
#site_2{display:flex;justify-content:center;align-items:center}
#site_3{display:flex;justify-content:center;align-items:center}
#site_4{display:flex;justify-content:center;align-items:center}
#public :nth-child(1){position:relative;display:block;min-width:360px;height:700px;z-index:1}
#full{position:relative;margin-right:5%;min-width:330px;width:50%;height:760px;padding:20px;background-color: rgba(170, 170, 170, .5);backdrop-filter: blur(10px);box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);border-radius:5px;display:block;clear:left}
#full p{float:left;font-size:24px;line-height:125%;color:white;opacity:0.9;border-radius:10px;background-color: rgba(255, 255, 255, .10);backdrop-filter: blur(10px);padding:20px;margin-top:40px;margin-right:15px}
#full .full-margin{margin-top:5px}
#full .inhoud{height:715px;width:95%;position:absolute;display:inline-block;overflow-y:scroll;border-radius:10px}
#full a{position:absolute;bottom:0;left:0;padding:20px;text-decoration:none;font-size:30px;font-weight:800;color:LightGoldenRodYellow}
#full a:hover{transition:0.8s;color:orange;text-decoration:underline}
#future{position:relative;display:flex;justify-content:center;flex-wrap:nowrap;height:100%;margin-bottom:7vh}
#full-future{width:90%;height:auto;text-align:left;opacity:0.9;padding:20px;border-radius:10px;background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2)}
#full-future p{font-size:24px;line-height:125%;color:white}
#commentaar{position:relative;bottom:150px}
#full-commentaar{display:block;min-width:100%;height:auto;margin-top:0px}
#voetnoot{z-index:10;position:fixed;border-top:solid 3px #fef1ad;background-color: rgba(170, 170, 170, .55);backdrop-filter: blur(10px);display:flex;justify-content:center;align-items:center;bottom:0px;width:100%;height:70px;-webkit-transition:right 1.5s ease-in-out;transition:right 1.5s ease-in-out;transition-duration:400ms;}
#voetnoot p{font-size:15px;color:black;opacity:0.9;float:left;width:33%;clear:left}
#p-50{text-align:left;padding-left:5vw}
#p-50 a{text-decoration:none;font-weight:400;font-size:15px;color:LightGoldenRodYellow;font-family:'Metamorphous'}
#p-50 a:hover{transition:0.8s;color:orange;text-decoration:underline}
#p-51{text-align:center}
#p-51 a{text-decoration:none;font-weight:400;font-size:25px;color:LightGoldenRodYellow;font-family:'Metamorphous'}
#p-51 a:hover{transition:0.8s;color:orange;text-decoration:underline}
#p-52{text-align:right;padding-right:5vw}
#p-52 a{text-decoration:none;font-weight:400;font-size:15px;color:LightGoldenRodYellow;font-family:'Metamorphous'}
#p-52 a:hover{transition:0.8s;color:orange;text-decoration:underline}
/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/
@media (min-width: 1025px) and (max-width: 1280px) {
#key{left:calc(50%)}
#tip-container{display:none}
}
/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
#tip-container{display:none}
#key{left:calc(50%)}
button#rechtstreeks{margin-top:30px} 
#I{display:none}	
#D{display:none}	
#totaal{width:100%}
#artikel{display:flex;justify-content:center;align-items:center;position:relative;height:auto;width:100%}
#artikel-header{margin-bottom:50px;position:inherit;width:95%;height:auto;display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;align-content:flex-start}
#artikel-talen-L{display:flex;justify-content:center;flex-grow:4;align-self:grow;width:100%;height:60px;position:relative;left:0%}
#artikel-L li {display:inline-block;padding:10px 20px;list-style-type:none;background-color:#666666;border:solid 1px #fef1ad}
#artikel-L li a{text-decoration:none;font-size:30px;font-weight:600;color:#cccc99;font-family:'Metamorphous'}
#artikel-L li a:hover{}
#artikel-L li a:active{}
#artikel-resultaat .p-0{margin-left:20px;display:flex;flex-grow:5;position:relative}
#p-0 .p-0{display:inline-block;position:relative;float:left;clear:left}
.click-count .p-0{color:green;font-weight:bold;position:relative;float:right;clear:right}
#artikel-reference{display:block;width:100%;height:60px;position:relative;font-family:'Metamorphous'}
#artikel-reference a{padding:10px 20px;background-color:#666666;border:solid 1px #fef1ad;text-decoration:none;font-size:30px;font-weight:600;display:inline-block;color:#cccc99;font-family:'Metamorphous'}
#artikel-reference a:hover{}
#reference{position:fixed;display:block;width:100%;height:100%;border:1px solid white;background-color:#ccc;padding:10px;color:white;top:100px;right:0;bottom:0;left:0;z-index:15}
.topright{position:absolute;right:35px;top:5px;font-size:50px;font-weight:bold;color:LightGoldenRodYellow;opacity:1}
#reference-modal{padding: 15px 40px 30px 0px;display:block;height:100%;max-height:1250px;width:100%}
#reference-box{position:relative;display:inline-block;width:92.5%;max-width:170px;height:90%;overflow-y:scroll;margin-top:30px;margin-right:10px;border-radius:15px}
#artikel-social{display:flex;justify-content:center;flex-grow:1;height:50px;position:relative}
#artikel-social img{display:block;width:50px;height:50px;border-radius:5px;padding:0px 20px 0px 0px}
#artikel-social a{float:left;clear:left;position:relative} 
}
/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
#tip-container{display:none}
#I{display:none}	
#D{display:none}	
#content{display:none}
#totaal{width:100%}
#artikel{display:flex;justify-content:center;align-items:center;position:relative;height:auto;width:100%}
#artikel-header{margin-bottom:50px;position:inherit;width:95%;height:auto;display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;align-content:flex-start}
#artikel-talen-L{display:flex;justify-content:center;flex-grow:4;align-self:grow;width:100%;height:60px;position:relative;left:0%}
#artikel-L li {display:inline-block;padding:10px 20px;list-style-type:none;background-color:#666666;border:solid 1px #fef1ad}
#artikel-L li a{text-decoration:none;font-size:30px;font-weight:600;color:#cccc99;font-family:'Metamorphous'}
#artikel-L li a:hover{}
#artikel-L li a:active{}
#artikel-resultaat .p-0{margin-left:20px;display:flex;flex-grow:5;position:relative}
#p-0 .p-0{display:inline-block;position:relative;float:left;clear:left}
.click-count .p-0{color:green;font-weight:bold;position:relative;float:right;clear:right}
#artikel-reference a{padding:10px 20px;background-color:#666666;border:solid 1px #fef1ad;text-decoration:none;font-size:30px;font-weight:600;display:inline-block;color:#cccc99;font-family:'Metamorphous'}
#artikel-reference a:hover{}
.totaal-reference{display:none}
#reference{position:fixed;display:block;width:100%;height:auto;border:1px solid white;background-color:#ccc;padding:10px;color:white;top:100px;right:0;bottom:0;left:0;z-index:15}
.topright{position:absolute;right:35px;top:5px;font-size:50px;font-weight:bold;color:LightGoldenRodYellow;opacity:1}
#reference-modal{padding: 15px 40px 30px 0px;display:block;height:100%;max-height:1250px;width:100%}
#reference-box{position:relative;display:inline-block;width:92.5%;height:90%;overflow-y:scroll;margin-top:30px;margin-right:10px;border-radius:15px}
#artikel-social{display:flex;justify-content:center;flex-grow:1;height:50px;position:relative}
#artikel-social img{display:block;width:50px;height:50px;border-radius:5px;padding:0px 20px 0px 0px}
#artikel-social .gm img{height:40px;padding-top:5px}
#artikel-social a{float:left;clear:left;position:relative}
}
/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/
@media (min-width: 481px) and (max-width: 767px) {
#tip-container{display:block}
#key{left:calc(50%)}
#I{display:none}	
#D{display:none}	
#totaal{width:100%}
#artikel{display:flex;justify-content:center;align-items:center;position:relative;height:auto;width:100%}
#artikel-header{margin-bottom:50px;position:inherit;width:95%;height:auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;align-content:flex-start;gap:10px 50px}
#artikel-talen-L{display:flex;justify-content:center;flex-grow:4;align-self:grow;width:100%;height:60px;position:relative;left:0%}
#artikel-L li {display:inline-block;padding:10px 20px;list-style-type:none;background-color:#666666;border:solid 1px #fef1ad}
#artikel-L li a{text-decoration:none;font-size:30px;font-weight:600;color:#cccc99;font-family:'Metamorphous'}
#artikel-L li a:hover{}
#artikel-L li a:active{}
#artikel-resultaat .p-0{display:flex;flex-grow:5;position:relative}
#p-0 .p-0{display:flex;position:relative;float:left;clear:left}
.click-count .p-0{color:green;font-weight:bold;position:relative;float:right;clear:right}
#artikel-reference{display:block;width:100%;height:60px;position:relative;font-family:'Metamorphous'}
#artikel-reference a{padding:10px 20px;background-color:#666666;border:solid 1px #fef1ad;text-decoration:none;font-size:30px;font-weight:600;display:inline-block;color:#cccc99;font-family:'Metamorphous'}
#artikel-reference a:hover{}
.totaal-reference{display:none}
#reference{position:fixed;display:block;width:100%;height:auto;border:1px solid white;background-color:#ccc;padding:10px;color:white;top:100px;right:0;bottom:0;left:0;z-index:15}
.topright{position:absolute;right:35px;top:5px;font-size:50px;font-weight:bold;color:LightGoldenRodYellow;opacity:1}
#reference-modal{padding: 15px 40px 30px 0px;display:block;height:100%;max-height:1250px;width:100%}
#reference-box{position:relative;display:inline-block;width:92.5%;height:90%;overflow-y:scroll;margin-top:30px;margin-right:10px;border-radius:15px}
#artikel-social{width:100%;display:flex;justify-content:center;flex-grow:1;height:50px;position:relative}
#artikel-social img{display:flex;justify-content:center;width:50px;height:50px;border-radius:5px;padding:0px 10px 0px 0px}
#artikel-social .gm img{height:40px;padding-top:5px}
#artikel-social a{position:relative}
#content{display:none}
#full{margin-right:0%}
#site_0{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_1{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_2{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_3{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_4{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#canvas_0{margin-bottom:5%}
#canvas_1{margin-bottom:5%}
#canvas_2{margin-bottom:5%}
#canvas_3{margin-bottom:5%}
#canvas_4{margin-bottom:5%}
}
/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 320px) and (max-width: 480px) {
#tip-container{display:block}
#key{left:calc(50%)}
#R h1{bottom:2%;color:white;font-size:8px}
#I{display:none}	
#D{display:none}	
#totaal{width:100%}
#artikel{display:flex;justify-content:center;align-items:center;position:relative;height:auto;width:100%}
#artikel-header{margin-bottom:50px;position:inherit;width:95%;height:auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;align-content:flex-start;gap:10px 50px}
#artikel-talen-L{display:flex;justify-content:center;flex-grow:4;align-self:grow;width:100%;height:60px;position:relative;left:0%}
#artikel-L li {display:inline-block;padding:10px 20px;list-style-type:none;background-color:#666666;border:solid 1px #fef1ad}
#artikel-L li a{text-decoration:none;font-size:30px;font-weight:600;color:#cccc99;font-family:'Metamorphous'}
#artikel-L li a:hover{}
#artikel-L li a:active{}
#artikel-resultaat .p-0{display:flex;flex-grow:5;position:relative}
#p-0 .p-0{display:flex;position:relative;float:left;clear:left}
.click-count .p-0{color:green;font-weight:bold;position:relative;float:right;clear:right}
#artikel-reference{display:block;width:100%;height:60px;position:relative;font-family:'Metamorphous'}
#artikel-reference a{padding:10px 20px;background-color:#666666;border:solid 1px #fef1ad;text-decoration:none;font-size:30px;font-weight:600;display:inline-block;color:#cccc99;font-family:'Metamorphous'}
#artikel-reference a:hover{}
.totaal-reference{display:none}
#reference{position:fixed;display:block;width:100%;height:auto;border:1px solid white;background-color:#ccc;padding:10px;color:white;top:100px;right:0;bottom:0;left:0;z-index:15}
.topright{position:absolute;right:35px;top:5px;font-size:50px;font-weight:bold;color:LightGoldenRodYellow;opacity:1}
#reference-modal{padding: 15px 40px 30px 0px;display:block;height:100%;max-height:1250px;width:100%}
#reference-box{position:relative;display:inline-block;width:92.5%;height:90%;overflow-y:scroll;margin-top:30px;margin-right:10px;border-radius:15px}
#artikel-social{width:100%;display:flex;justify-content:center;flex-grow:1;height:50px;position:relative}
#artikel-social img{display:flex;justify-content:center;width:50px;height:50px;border-radius:5px;padding:0px 10px 0px 0px}
#artikel-social a{position:relative}
#content{display:none}
#full{margin-right:0%}
#site_0{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_1{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_2{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_3{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#site_4{display:flex;flex-wrap:wrap;flex-direction:column-reverse}
#canvas_0{margin-bottom:5%}
#canvas_1{margin-bottom:5%}
#canvas_2{margin-bottom:5%}
#canvas_3{margin-bottom:5%}
#canvas_4{margin-bottom:5%}
}