/* iexplor snapt vars niet dus evt terugzet*/
 /* :root { --main-bg-color: #404040; } */
 /* :root { --main-f-color: lightgrey; } */
 /* body { background-color: var(--main-bg-color) ; color: var(--main-f-color)  } */
 /* input {  background-color: var(--main-bg-color) ; color: var(--main-f-color) } */
/*  background: #3B4049; */


/* W3.CSS 4.12 Novemberr 2018 by Jan Egil and Borge Refsnes */
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io normalize */
/* vraag is of we dit er bij moeten houden , deze hieronde zo terug */



html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}
button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring{outline:1px dotted ButtonText}
html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}

.w3-modal{z-index:3;display:none;padding-top:46px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;
	 background-color:rgb(0,0,0); background-color:rgba(0,0,0,0.4)}
.w3-modal-content{ width:600px; margin:50px 0; background-color:#fff;position:relative;padding:10;outline:0; border-radius: 9px;}
@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}	}
@media (max-width:768px){.w3-modal-content{width:500px}}
@media (min-width:993px){.w3-modal-content{width:900px}}

.w3-container:after,.w3-container:before {content:"";display:table;clear:both}
.w3-container {padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}

.w3-display-topright{position:absolute;right:0;top:0}
.w3-round-large{border-radius:8px}

.w3-bottom{position:fixed;width:100%;z-index:1}
.w3-round {border-radius:4px}
.w3-round-large{border-radius:8px}

.w3-button {border:none;display:inline-block;padding:8px 16px;vertical-align:middle;
	 overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}

.w3-grey {color:#000!important;background-color:#9e9e9e!important}
.w3-white {color:#000!important;background-color:#fff!important}

.w3-bar-block {width:100%}

.w3-panel{margin-top:16px;margin-bottom:16px}

h6{font-size:16px}

h1,h2,h3,h4,h5,h6 {font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}

.w3-wide{letter-spacing:4px}

hr{border:0;border-top:1px solid #eee;margin:20px 0}
/* 
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
*/


/*
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
@media (min-width:993px){.w3-modal-content{width:900px; margin:50px 0; background-color:#fff;position:relative;padding:10;outline:0; border-radius: 9px;}}
@media (max-width:768px){.w3-modal-content{width:500px; margin:50px 0; background-color:#fff;position:relative;padding:10;outline:0; border-radius: 9px;}}
@media (max-width:600px){.w3-modal-content{width:400px; margin:50px 0; background-color:#fff;position:relative;padding:10;outline:0; border-radius: 9px; }}
*/


/*
.w3-display-bottomright { position:absolute;right:3;bottom:3}
.w3-display-topleft { position:absolute;left:0;top:0; margin-bottom: 8px; }
background-color: rgb(255,255,255,0.3);

*/


  input {  background-color: #404040 ; color: lightgrey } 

.kassatb {   }
.kasbar { color: white;  }


.diapop {   

/*    width: 100px;
    height: 100px; 
     background: red;
*/
  background-color: rgb(255,255,255,0.5);
	  background-color: rgba(255,255,255,0.5);
 width:362px; 
 border-radius: 10px;


    position: relative;
    -webkit-animation: mypop 0.5s ; /* Chrome, Safari, Opera */
     /* Chrome, Safari, Opera */
    animation: mypop 0.5s ;
    
}

/* Chrome, Safari, Opera */
@-webkit-keyframes mypop {
    0%   { left: 0px; top: -462px;}
    100% { left: 0px; top: 0px;}
}

@keyframes mypop {
    0%   { left: 0px; top: -462px;}
    100% { left: 0px; top: 0px;}
}




  .buttontype1 { float: left;background: #1115C7; border: 0px solid #4D82B8; cursor:pointer; width: 50px; height: 50px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }
  .buttontype2 { float: left;background: #40FF40; border: 0px solid #C0C0C0; cursor:pointer; width: 40px; height: 40px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }
  .buttontype3 { float: left; background: #DB7303; border: 0px solid #C0C0C0; cursor:pointer; width: 40px; height: 40px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }

  .buttontype4 { float: right; background: #A934AA; border: 0px solid #800080; cursor:pointer; width: 40px; height: 40px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }
  .buttontype5 { float: left; background: #343434; border: 0px solid #C0C0C0; cursor:pointer; width: 45px; height: 45px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }
  .buttontype6 { float: right; background: #343434; border: 0px solid #C0C0C0; cursor:pointer; width: 45px; height: 45px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px;}


  .butima_big { height: 60px; }
  .butima_big:hover { border: 1px solid white; border-radius: 7px;  }


  .butima { height: 30px; }

  .butima:hover {
   border: 1px solid white; border-radius: 7px;   
}

  .buttontype7 { float: left; background: #1D1D1D; border: 0px solid #C0C0C0; cursor:pointer; width: 88px; height: 88px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }

  .buttontype8 { float: right; background: black; border: 0px solid #C0C0C0; display: inline-block; margin: 4px;
			 cursor:pointer; width: 38px; height: 38px; border-radius: 6px; align-items: center; 
			 justify-content: center; display: flex; text-align: center; padding-top: 1px;}

  .buttontype9 { float: left; background: #525252; border: 0px solid #C0C0C0; cursor:pointer; width: 88px; height: 88px; border-radius: 50%; align-items: center; justify-content: center; display: flex; text-align: center; padding-top: 3px; }

  .recspan { background: #c0c0c0;	color: black; text-align: center; border-radius: 5px; width: 300px ; padding-left: 5px; padding-right: 5px; font-size: 14pt; cursor:pointer; } 
 .recspan:hover {  border: 1px solid white; }

 .frmlab { font-size: 14pt; }
.frmlab:hover {  border: 1px solid white; }

  .recspant { background: #4D82B8; color: black; text-align: center; border-radius: 5px;	 width: 300px; padding-left: 5px; padding-right: 5px; font-size: 14pt; cursor:pointer;} 
 .recspant:hover { border: 1px solid white; }

.trglnk { cursor: pointer; }
 
 .img_round {  border-radius: 9px; }

 input.stdbut {  border: 0px solid; background: black; border-radius: 6px ; padding: 7px}
 input.stdbutnb {  border: 0px solid;  background: black; border-radius: 6px ; padding: 7px }
 input.stdwibut {  border: 1px solid; background-color: white; color: black }
/*  select.stdsel { border: 0px solid; width:300px; background: #343434 ; color: #C0C0C0; border-radius: 5px; font-size: 16pt } */
 .stdsel { max-height: 350px; border: 0px solid; overflow-y: scroll; overflow-x: auto;  }
 div.pooldiv { float: left; border: 0px solid; display: table-cell}
 table.pooltb {  border: 0px solid; }
 
 img.poolpic { border-radius: 9px; height: 110px;  }
 
 p.pooltxt { font-family: Arial; font-size:12pt;  color: #BCDEFE;
  background-color: rgb( 255, 255, 255, 0.3); background: rgba( 255, 255, 255, 0.3); border-radius: 6px; padding: 2px;
  }
 

 /* .poolpic { height: 80px; float: left }  */
 hr.hruler { border-color: black; border-width: 1px; background: black; color: black }
 input.stdip { border: 0px solid; width:140px; border-radius: 4px; background: #343434; font-size: 12pt}
input.stdip:hover {  border: 1px solid white; }

 input.stdipdt { border: 0px solid; width:140px; border-radius: 4px; background: #343434; font-size: 12pt  }

 input.smalip { border: 2px solid; width:80px; }


 input[type="file"] { display: none; }
 label.custfi { background-color: black ; color: lightgrey; border: 0px solid #ccc; display: inline-block; padding: 6px 12px; cursor: pointer; }
 a.stdref { color: lightgrey ; text-decoration: none }

table.tbrecent { min-height: 300px; width: 370px; font-family: arial;  
	font-size: 9pt; border-radius: 15px; background: rgb( 50, 50, 50);
		
	 padding-left: 3px; margin-top: 10px; 

   color: grey;    background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);
  
    }
 .cardblok {
  margin-top: 50px;  margin-left: 50px;

 }
 .cardpas {

  border-radius: 10px;
 }


.blokdiv_hid { display: none; }

@media (min-width:1600px){
  .blokdiv_hid { display: inline-block; vertical-align: top;
   margin-top: 8px; margin-left: 5px; } }



.blokdiv { display: inline-block; vertical-align: top;
	 margin-top: 8px; margin-left: 5px;   }

.ifrabigdivcl { display: none; }
@media (min-width:1600px){
.ifrabigdivcl {  margin-top: 70px; margin-left: 12px; display: table;  }
}

.ifradvfu { display: none; }

@media (min-width:1600px){
.ifradvfu { background: rgb(60,60,60); background: rgba(60,60,60); border-radius: 15px; padding-left: 5px; height: 768px;
	display: inline-block; margin-top: 20px; margin-left: 18px; float: left; }
}


.incheckblok {  float: left;  display: inline-block; margin-top: 20px;
 padding-left: 7px; height:auto; min-width: 200px;  margin-left: 18px;
		
}


.dvfotomaak { float:right; height: auto; display: inline-block

}
.bdleft { float: left; display: inline-block; margin-left: 12px; margin-top: 10px; }
 table.tbstd {   width: 370px; font-family: Arial;   }

 table.tbalgsmall {  height: 110px; width: 370px;     font-family: Arial;  color: grey;
    border-radius: 15px; background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);
    padding:15px; margin-top: 10px;   }

 table.tbalgmedi {  height: 560px; width: 370px;     font-family: Arial;  color: grey;
    border-radius: 15px; background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);
    padding:15px; margin-top: 10px;   }


 table.tbalg {  height: 770px; width: 370px;     font-family: Arial;  color: grey;
		border-radius: 15px; background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);
		padding:15px; margin-top: 10px;   }

.fotomaak {  height: auto; width: 370px; height: 420px;    
	 font-family: Arial;  border-radius: 15px; 
	padding:15px; margin-top: 10px;  
   color: grey;    background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);

}


table.tbalgt { height: 770px; width: 370px;     font-family: Arial;  color: grey;
    border-radius: 15px; background: rgb( 0, 0, 0, 0.8); background: rgba( 0, 0, 0, 0.8);
    padding:15px; margin-top: 10px;  }


div.tbalgdv { height: 770px;    font-family: Arial;  border-radius: 15px; padding:15px;
 float:left; padding-left: 7px; width: 400px; height:770px; display:inline-block;
}

 table.tbbreder {  font-family: Arial;  padding:15px; }
 #main{ margin: 15px auto;  overflow: auto;  float: left; } #header{  margin-bottom:15px; }
 #mainbody{   display:inline; } #footer{  } #v{ width:176x; height:144px;}
 /* stond op 	display:none;  v stond op : width:320px; height:240px;  */
 #qr-canvas{ display:none; }
 #qrfile{ width:320px; height:240px; }

 #mp1{ text-align:center; font-size:35px; }
 #imghelp{ position:relative; left:0px;top:-160px;z-index:100;font:18px arial,sans-serif;
    background:#f0f0f0;margin-left:35px;margin-right:35px;padding-top:10px; padding-bottom:10px;
	border-radius:20px; } .
/* 	selector{ margin:0; padding:0; cursor:pointer; margin-bottom:-5px; } */
 #outdiv { width:176px; height:144px;  }
 /* stond op 	width:320px; height:240px;  */
 #result{ border: solid; border-width: 1px 1px 1px 1px; padding:5px; width:70%; }
 ul{ margin-bottom:0; margin-right:40px; } li a{ text-decoration: none; color: black; }
 li{ display:inline; padding-right: 0.5em; padding-left: 0.5em; font-weight: bold; border-right: 1px solid #333333; }
 #footer a{ color: black; }  .tsel{padding:0;}
/* qr creat */
   /*div#qrcreatediv {width:300px; height:350px; background:white;}
   canvas#qrcreacanv {width:296; height:270;  }*/
.import_area { height: 400px; border-radius: 10px; width: 100%; background-color: grey ;
 overflow-x: scroll;
 }
.import_area:hover {  border: 1px solid white; }
/* was voor popup not use
 div.overdiv { filter: alpha(opacity=75);  -moz-opacity: .75;  opacity: .75; background-color: #c0c0c0; position: absolute; top: 0px; left: 0px;  width: 100%; height: 100%; }
 div.square { position: absolute; top: 40px; left: 30px; background-color: Menu; border: #f9f9f9; height: 500px; width: 950px; }
 div.square div.msg { color: #3e6bc2; font-size: 15px;  padding: 15px; }  */

.datave { padding: 5px; border-radius: 8px; min-width: 300px; display: table-cell; font-style: 11pt; }