/*---LÄBUUUUUUUUUUUUUU--------------------*/
/*$rem global css*/
body              { 
   background: #E8F0EA;
   font:12px Verdana; 
}
a:link, a:visited { text-decoration:none; }
a:hover           { background-color: yellow;}
hr                { color:blue;height:2px;}
p.pagebreak       { page-break-before: always}
/*----------------header,footer-------------------------------*/
.header{
    color:black;
    font-size:1.2em;
    font-weight:bold;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    margin:auto;
    align-items: center;
    text-align:center;
}
.footer{
    color:black;
    font-size:1em;
    font-weight:bold;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    margin:auto;
    align-items: center;
    text-align:center;
}
.hsp100{padding-left:100px;display:inline;}
.hsp200{padding-left:200px;display:inline;}
.hsp300{padding-left:300px;display:inline;}
.hspp10{padding-left:10%;display:inline;}
.hspp20{padding-left:20%;display:inline;}
.hspp30{padding-left:30%;display:inline;}
/*----------------nice text------------------------------*/
.nice {
    font-family: Comic Sans MS;
}
/*----------------link image class------------------------------*/
.link1{
    border:1px solid;
    width:48px;
	  height:48px;
}
.link0{
    border:0px solid;
    width:48px;
	  height:48px;
}
/*----------------top.html--------------------------------------*/
#topBTNS{
    border:0px solid;
    width:20%;
}
#topMSGS{
    border:0px solid;
    width:64%;
}
#topCLK{
    border:1px solid;
    background-color:#b0d0ff;
    border-radius:8px;
    padding:5px;
}
#topLIN{
    border:1px solid;
    width:8%;
    background-color:#b0d0ff;
    border-radius:8px;
    padding:5px;
}
#clkDIV{
    border:1px solid;
	  margin:4px;
	  background-color:#fff;
	  text-align:center;
	  vertical-align:middle;
	  font:1em Verdana;
	  width:180px;
	  height:1.5em;
	  top:2px;
	  left:2px;
	  line-height:1.5em;
}
#userDIV{
    border:1px solid;
	  margin:4px;
	  background-color:#fff;
	  text-align:center;
	  vertical-align:middle;
	  font:1em Verdana;
	  width:180px;
	  height:1.5em;
	  top:2px;
	  left:2px;
	  line-height:1.5em;
}
#statusDIV{
    cursor:pointer;
    font-size:2em;font-weight:bold;
    margin:5px;
    position:relative;
    width:20px;height:20px;left:1px;top:1px;
    text-align:center;
    border:1px solid black;
    border-radius:25px;
}
#reloadDIV{
    cursor:pointer;
    font-size:2em;font-weight:bold;
    margin:5px;
    position:relative;
    width:25px;height:25px;left:26px;top:-26px;
    text-align:center;
    border:0px solid black;    
    background-repeat: no-repeat;
}  
#infoDIV{
    cursor:pointer;
    font-size:2em;
    font-weight:bold;
    margin:5px;
    position:relative;
    width:25px;
    height:25px;
    left:52px;
    top:-56px;
    text-align:center;
    border:0px solid black;    
    background-repeat: no-repeat;
} 
#maximizeDIV{
    cursor:pointer;
    font-size:2em;
    font-weight:bold;
    margin:5px;
    position:relative;
    width:25px;height:25px;left:78px;top:-86px;
    text-align:center;
    border:0px solid black;    
    background-repeat: no-repeat;
} 
#pokeDIV{
    cursor:pointer;
    font-size:2em;
    font-weight:bold;
    margin:5px;
    position:relative;
    width:25px;height:25px;
    left:104px;top:-116px;
    text-align:center;
    border:0px solid black;    
    background-repeat: no-repeat;
}    
/*--------------simple bordered and noBordered table----------------------------------------*/
.borderedTBL{
    border:1px solid black;
}
.borderedTBL TD {
    height:20px;
    border-spacing:1px;
    border:1px solid black;
    text-align:left;
    vertical-align:bottom;
} 
.borderedTBL TH {
    border-spacing:1px;
    border:1px solid black;
    text-align:center;
    font-weight:bold;
    vertical-align:middle;
} 
.borderedTBL TR {
    border-spacing:0px;
    border:0px solid black;
    vertical-align:middle;
    /*border-collapse: separate|collapse|initial|inherit;*/
} 
.NOborderedTBL{
    border:0px solid black;
}
.NOborderedTBL TD {
    height:20px;
    border-spacing:1px;
    border:0px solid black;
    text-align:left;
    vertical-align:bottom;
} 
.NOborderedTBL TH {
    border-spacing:1px;
    border:0px solid black;
    text-align:center;
    font-weight:bold;
    vertical-align:middle;
} 
.NOborderedTBL TR {
    border-spacing:0px;
    border:0px solid black;
    border-collapse: collapse;
    vertical-align:middle;
}    
/*----------------main.html--------------------------------------*/
#mainDIV{
    /*margin:auto;
    text-align:center; */
}
#mainNokDIVtxt,#mainLOGOUTdiv{
    border:1px solid;
	  margin:auto;
	  background-color:#e9967a;
	  text-align:center;
	  vertical-align:middle;
	  font:2em Verdana;
	  font-weight:bold;
	  width:500px;
	  height:8em;
	  top:2px;
	  left:2px;
	  line-height:1.5em;
	  border-radius:8px;
}
#mainPW_LIN{
    border:1px solid;
    background-color:#b0d0ff;
    border-radius:8px;
    padding:5px;
    height:150px;
    width:330px;
}
#mainSC_LIN{
    border:1px solid;
    background-color:#b0d0ff;
    border-radius:8px;
    padding:5px;
    height:150px;
    width:300px;
}
.mainPW_RST{
    border:1px solid;
    background-color:green;
    padding:5px;
    width:16px;
    height:16px;
    border-radius:16px;
}
#SCloginDIVerr {
  overflow:hidden;
  font-weight:bold;
  padding:6px;
  border-radius:6px;
  background-color:#FFE0C0;
  height:22px;
}
#SCloginDIVname {
  overflow:hidden;
  font-weight:bold;
  padding:6px;
  border-radius:6px;
  background-color:#C0FFB0;
  height:22px;
}
#SCloginDIVpin {
  overflow:hidden;
  font-weight:bold;
  padding:6px;
  border-radius:6px;
  background-color:#C0FFB0;
  height:22px;
}
#SCloginPIN{
    border:1px solid;
	  padding:1px;
	  background-color:#fff;
	  text-align:left;
	  font:12px Verdana;
	  border-radius:6px;
	  padding:4px;
}
/*----------------my std skyblue form and space between ...---------------*/
.space {
    padding:20px;
    margin:auto;
    text-align:center;
}
.form {
    padding:10px;
    border:1px solid;
    border-radius:12px;
	  margin:auto;
	  background-color:#60e0e0;
	  font:1em Verdana;
	  width:75%;
	  overflow:hidden;
	  box-shadow: 10px 20px 3px 6px rgba(0, 0, 0, 0.12);
}
.formScroll {
    padding:10px;
    border:1px solid;
	  margin:auto;
	  background-color:#60e0e0;
	  font:1em Verdana;
	  width:50%;
	  overflow:scroll;
	  box-shadow: 10px 20px 3px 6px rgba(0, 0, 0, 0.12);
}
#errForm{
    padding:10px;
    color:red;
    font:1em Verdana;
    font-weight:bold;
    margin:auto;
    text-align:center;
}
.jswDT1{
    min-width:80px;
}
.jswDT2{
    min-width:220px;
}
.trnDT {color:red;}
/*----------------js trend div (/info/tags/live.php , TTagClass:TJSTREND)----------------*/
.jsTrendWinDIV {
    padding:10px;
    border:1px solid;
    border-radius:12px;
	  margin:auto;
	  background-color:#60e0e0;
	  font:1em Verdana;
	  width:95%;
	  overflow:hidden;
}
.jsTrendTableDIV {
    padding:10px;
    margin:auto;
    text-align:center;
    width:100%;
}
.jsTrendStatus {
    border-radius:5px;
    height:16px;
    background-color:gray;
    cursor:pointer;
    float:right;
    margin-right:10px;
}
/*-------wait,error,msg,cfm,.. needs /sys/html.php::echoDIVwindows(); and JS onclicks---*/
#stdWaitDIV{
    position:absolute;
    z-index:9999;
}
#stdErrDIV{
    position:absolute;
    z-index:9999;
    border:1px solid black;
    border-radius:15px;
    background-color:rgb(255,33,33);
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
#stdErrDIVtxt{
    margin-top:16px;
    height:84px;
    text-align:center;
    padding:10px;
    color:white;
    font:1.5em Verdana;
    font-weight:bold;
} 
#stdMsgDIV{
    position:absolute;
    z-index:9999;
    border:2px solid black;
    border-radius:15px;
    background-color:#33CC66;
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
#stdMsgDIVtxt{
    margin-top:16px;
    height:84px;
    text-align:center;
    padding:10px;
    color:white;
    font:1.5em Verdana;
    font-weight:bold;
} 
#stdCfmDIV{
    position:absolute;
    z-index:9999;
    border:2px solid black;
    border-radius:15px;
    background-color:#f0e68c;
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
#stdCfmDIVtxt{
    margin-top:16px;
    height:84px;
    text-align:center;
    padding:10px;
    color:black;
    font:1.5em Verdana;
    font-weight:bold;
}  
/*----------------messages--------------------------------------*/
#msgstd1{
    border-top-left-radius:5px;
    border-bottom-left-radius:5px; 
    border:1px solid;
    height:2em;
    font:1em Verdana;
    padding:5px;
    margin:5px;
    width:15%;
}
.msgstd2{
    border:1px solid;
    height:2em;
    font:1em Verdana;
    padding:5px;
    margin:5px;
    width:10%;
}    
#msgstd10{
    width:20%;
    border:1px solid;
    height:2em;
    font:1em Verdana;
    padding:5px;
    margin:5px;
    border-top-right-radius:5px;
    border-bottom-right-radius:5px; 
}
/*----------------Form elements--------------------------------------*/
textarea,
input[type='text'],input.text,
input[type='password'],input.password,
input[type='checkbox'],input.checkbox,
input[type='file'],input.file,
select
{
	  border:1px solid;
	  padding:1px;
	  background-color:#fff;
	  text-align:left;
	  font:12px Verdana;
}
input[type='radio'],input.radio
{
	  border:none;
	  padding:1px;
	  background-color:#fff;
	  text-align:left;
}
input[type='button'],input.button,input[type='submit'],input.submit,
input[type='reset'],input.reset
{
    border:2px solid;
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
	  padding:0px 20px 0px 20px;
	  background-color:yellow;
	  text-align:center;
	  border-radius:6px;
}
/*---------------- error div ---------------------------------------------*/
#ERRhome{
  cursor:pointer;
  font-size:2em;
  font-weight:bold;
  margin:5px;
  text-align:center;
  width:25px;
  height:25px;
  left:0px;
  top:0px;
  border:1px solid black;
  border-radius:30px;
  background-color:green;
  position:relative;
}  
#ERRback{
  cursor:pointer;
  font-size:2em;
  font-weight:bold;
  margin:5px;
  text-align:center;
  width:25px;
  height:25px;
  left:30px;
  top:-32px;
  border:1px solid black;
  border-radius:30px;
  background-color:blue;
  position:relative;
} 
#ERRdiv{
  left:30px;
  top:30px;
  width:400px;
  height:85px;
  text-align:center;
  border-radius:5px;
  border:1px solid black;
  overflow:hidden;
}
#ERRtext{
  top:-60px;
  text-align:center;
  font-size:1.2em;
  font-weight:bold;
  position:relative;
}
/*---------------- buttons ---------------------------------------------*/
.btnOK{

}
/*---------------- boxes ---------------------------------------------*/

/*---------------- circles ---------------------------------------------*/
.circleGREEN {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:green;
}
.circleRED {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:red;
}
.circleBLUE {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:blue;
}
.circleYELLOW {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:yellow;
}
.circleWHITE {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:white;
}
.circleGRAY {
  cursor:pointer;font-size:2em;font-weight:bold;margin:5px;position:relative;
  width:20px;height:20px;left:1px;top:1px;
  text-align:center;border:1px solid black;border-radius:25px;
  background-color:gray;
}
/*---------------- sheet ---------------------------------------------*/
.sheet {
	width:100%;
	text-align: center;
}
.sheet th {
	padding:3px;
	background-color:#ddd;
	border-top:1px solid #eef;
	border-left:1px solid #eef;
	border-right:1px solid #444;
	border-bottom:1px solid #444;
	color:#003;
	font-size:.9em;
	font-weight:bold;
	text-align:left;
}
.sheet td {
	padding-right:4px;
	border-right:1px solid #444;
	border-bottom:1px solid #444;
	background-color:#bbb;
	font-size:.9em;
	text-align:right;
	font:12px Verdana;
}
.sheet td input {
	border:0px none;
	padding:0px 0px 2px 5px;
	width:100%;
	height:100%;
	background-color:#fff;
	text-align:right;
	font:12px Verdana;
}
.sheet tr {
	vertical-align:top;
}
.sheet tr th {
	text-align:right;
	padding:1px 3px 1px 1px;
	color:#222;
}
/*some tables CSS*/
/*tbl_no : no borders,no padding*/
/*tbl_blueblue : black border , th,td blue background */
/*tbl_bluewhite : black border , th blue,td white background */
/*tbl_form: rounded(FX only),bluegray back*/
/*----------------tbl_no---------------------------------------------*/
.tbl_no {
  border-width:0px;
  border-spacing:0px;
  padding: 0px;
  border-collapse: collapse;
  text-align:left;
}
.tbl_no td {
  border-width:0px;
  border-spacing:0px;
  border-collapse: collapse;
  padding: 0px;
  text-align:left;
}
/*----------------tbl_blueblue---------------------------------------------*/
.tbl_blueblue {
  border-width:0px;
  border-spacing:0px;
  padding: 0px;}
.tbl_blueblue th {
	padding:0px;
	background-color:rgb(166,166,255);
	border-top:1px solid #444;
	border-left:1px solid #eef;
	border-right:1px solid #444;
	border-bottom:1px solid #444;
	color:#003;
	font-size:1.2em;
	font-weight:bold;
	text-align:center;
}
.tbl_blueblue td {
	padding-right:0px;
	border-right:1px solid #444;
	border-bottom:1px solid #444;
	background-color:rgb(193,217,255);
	font-size:1em;
	text-align:right;
}
/*----------------tbl_bluewhite---------------------------------------------*/
.tbl_bluewhite {
    border-width:0px;
    border-spacing:0px;
    padding: 0px;
}
/*----------------tbl_form---------------------------------------------*/
.tbl_form {
    border-width:0px;
    border-spacing:5px;
    padding: 10px;
    text-align:center;
}
.tbl_formTD {
    border-radius: 15px;
    border-width: 0px;
    border-spacing:5px;
    background:rgb(140,180,200);
    padding: 10px;
    text-align:center;
}
/*---------------- calendar.js ---------------------------------------------*/
#jsCAL_m1
{
    border:1px solid black;
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
	  padding:0px 0px 0px 0px;
	  background-color:white;
	  text-align:center;
	  border-radius:0px;
	  color:black;
}
#jsCAL_m3
{
    border:1px solid black;
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
	  padding:0px 0px 0px 0px;
	  background-color:white;
	  text-align:center;
	  border-radius:0px;
	  color:black;
}
/*---------------- jsWindows ---------------------------------------------*/
/*jsw common CSS*/
/*buttons*/
.jswOKbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnOK.png)
}
.jswDELEbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnDELE.png)
}
.jswXbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnDELE.png)
}
.jswQWERTYbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnKBQ.png)
}
.jswNUMbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnKBN.png)
}
.jswDTbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnCLK.png)
}
.jswCLOSEbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnCLOSE.png)
}
.jswCLOSE2btn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnCLOSE2.png)
}
.jswMINbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnMIN.png)
}
.jswMAXbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnMAX.png)
}
.jswPLUSSbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnPLUSS.png)
}
.jswMINUSbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnMINUS.png)
}
.jswHELPbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnHELP.png)
}
.jswSTARbtn  {
    display:inline;
    cursor: pointer;
    background-repeat: no-repeat;
    float:right;
    width:24px;
    height:20px;
    padding: 2px;
    background-image:url(gr/btnSTAR.png)
}
.jswDTclockP{
    width:24px;
    height:20px;
    padding: 2px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-image:url(gr/DTclockP.png);
}
.jswDTclockM{
    width:16px;
    height:16px;
    padding: 0px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-image:url(gr/DTclockM.png);
}    
/*titlebar--------------------------------------------------------------------*/
.jswTITLEdiv {
    width:97%;
    height:20px;
    border:1px solid;
    padding: 2px;
    margin:2px;
    background-color: lightblue;
    cursor: pointer;
}
.jswTITLEtxt {
    display:inline;
    float:left;
    overflow:hidden;
    cursor: pointer;
}
.jswTITLEdiv2 {
    width:98%;
    height:26px;
    border:1px solid;
    padding: 2px;
    background-color: #5493f1;
}
/*inputbar*/
.jswBAR1div {
    width:98%;
    height:22px;
    border:1px solid;
    padding: 2px;
    margin:2px;
    background-color: rgb(190,221,132);
}
.jswINPUTdiv {
    width:98%;
    height:20px;
    border:1px solid;
    padding: 2px;
    margin:2px;
    background-color: green;
}
.DTclockP{
}
/*simple window , no resize---------------------------------------------------------*/
.jsw_win_noresize_std {
 display:none;
 position:absolute;
 border:1px solid;
 padding: 5px;
 background-color: #e8ffce;
}
/*resizeable window----------------------------------------------------------*/
.jsw_window {
 display:none;
 border:1px solid;
 padding: 0px;
 background-color: #e8ffce;
}
/**/
.jsw_layer{
 width:99%;
 height:99%;
 background-color: #e8ffce;
 overflow:hidden;
}
.jsw_canvas{
 width:99%;
 height:90%;
 background-color: lime;
 overflow:scroll;
}
.jsw_border_left {
 display:inline;
 border:0px solid;
 padding: 0px;
 background-color: #e8ffce;
 cursor:e-resize;
 float:left;
 width:2px;
 height:99%;
}
.jsw_border_right {
 display:inline;
 border:0px solid;
 padding: 0px;
 background-color: #e8ffce;
 cursor:e-resize;
 float:right;
 width:2px;
 height:99%;
}
.jsw_border_down {
 font-size: 0px;
 display:block;
 border:0px solid;
 padding: 0px;
 background-color: #e8ffce;
 cursor:n-resize;
 width:99%;
 height:2px;
}
.jsw_sw_resize {
 font-size: 0px;
 display:block;
 border:0px solid;
 padding: 0px;
 background-color: #000;
 cursor:sw-resize;
 width:2px;
 height:2px;
 float:left;
}
.jsw_se_resize {
 font-size: 0px;
 display:block;
 border:0px solid;
 padding: 0px;
 background-color: #000;
 cursor:se-resize;
 width:2%;
 height:2%;
 float:right;
}
/*----------------------------------------------------------------------------*/
/*round*/
.jsw_win_round {
    display:none;
    position:absolute;
    border:1px solid;
    padding: 5px;
    background-color: #e8ffce;
    overflow:hidden;
    border-radius:15px;
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
.jsw_win_ellipse {
    display:none;
    position:absolute;
    border:1px solid;
    padding: 5px;
    background-color: #e8ffce;
    overflow:hidden;
    border-radius:66px;
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
.jswr_etitle{
    overflow:hidden;
    height:26px;
    border:1px solid;
    padding: 2px;
    margin:2px 2px 2px 32px;
    background-color: #5493f1;
    border-radius:15px;
    vertical-align:middle;
}
.jswr_title{
    overflow:hidden;
    height:26px;
    border:1px solid;
    padding: 2px;
    margin:2px;
    background-color: #5493f1;
    border-radius:15px;
    vertical-align:middle;
}
.jswr_txt {
    display:inline;
    float:left;
    overflow:hidden;
    font-size:16px;
    font-weight:bold;
    vertical-align:middle;
    margin:5px;
}
.jswr_body {
    position:absolute;
    top:40px;
    left:5px;
    border:0px solid;
    margin:0px;
    padding-top:10px;
}
.jswr_ebody {
    position:absolute;
    top:40px;
    left:5px;
    border:0px solid;
    margin-left:32px;
    padding-top:10px;
}
/*----------------------IO----------------------------------------------------*/
.jsw_span{
    margin:2px;
    font-size:16px;
    font-weight:bold;
}
.jsw_span100{
    margin:2px;
    font-size:16px;
    font-weight:bold;
    width:100px;
    display:inline-block;
    overflow:hidden;
}
.jsw_span150{
    margin:2px;
    font-size:16px;
    font-weight:bold;
    width:150px;
    display:inline-block;
    overflow:hidden;
}
.jsw_span200{
    margin:2px;
    font-size:16px;
    font-weight:bold;
    width:200px;
    display:inline-block;
    overflow:hidden;
}
.jsw_input[type="text"],.jsw_input[type="password"] {
    margin:2px;
    font-size:16px;
    height:22px;
    font-weight:bold;
}
.jsw_CB[type="checkbox"] {
    margin:2px;
    height:22px;
    width:22px;
    vertical-align:middle;
    content: "?";
}
.jsw_RB[type="radio"] {
    margin:2px;
    height:22px;
    width:22px;
}
.jsw_TA{
    font-size:16px;
    font-weight:bold;
    white-space: pre;  
    overflow: auto;
}
.jsw_TAMM{
    height:98%;
    width:98%;
    font-size:16px;
    font-weight:bold;
    white-space: pre;  
    overflow: auto;
}
/*----------MetaData CSS------------------------------------------------------*/
.METAcaption{
    text-align:left;
    overflow:hidden;
    font-size:1.2em;
    font-weight:bold;
    text-decoration: underline;
    white-space: nowrap;
}
.METAinput{
    text-align:left;
    font-size:1.2em;
    font-weight:bold;
}  
/*--------------------public mainpage ----------------------------------------*/
.center {
    text-align:center;
    margin:auto;
}
.left {
    text-align:left;
    margin:10px;
}
.right {
    text-align:right;
    margin:10px;
}
.box{
    background-color:#EEEEEE;
    border:1px solid #999999;
    box-shadow:0px 0px 3px 3px rgba(0, 0, 0, 0.12);
    border-radius:10px;
    width:75%;
}
.tarea {
  width:70%;
  height:100px;
}
.iarea {
  width:70%;
}
/*----------------KBW simple--------------------------------------------------*/
.KBWS_all{
   font-size:24px;
   text-align:center;
   font-weight:bold;
   cursor:pointer;
   border:1px solid black;
   border-radius:5px;
   padding: 3px;
   margin: 3px 0px 3px 10px; /*top,right,bottom,left*/ 
   height:50px; 
   line-height:50px; 
   vertical-align:middle;
   width :50px;
}
.KBWS_btn{
   background-color:lightblue;
   color:black;
}
.KBWS_comma{ /* +-,*/
   background-color:#00B010;
   color:black;
}
.KBWS_up{ 
   background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAtCAIAAAC1eHXNAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA86AAAPOgGXOdvCAAAAfElEQVR42u2XsREAMQjDgvffmbTfPrhwwEygk+4SiMw8AoOjMeagc0SEfVBl0Hz0aUZ0YUVh+mgyvd+FGIXso0P2eBdulLn/bdkTFKKM3oNqtqAQZfp+WnAGhSgL7oa/5qAQRahLdO7sr6Hmve771hzmMMfq99RdzLGM4wIS7Ax/74izawAAAABJRU5ErkJggg==");
   background-repeat: no-repeat;
   background-position: center; 
   background-color:#00B0E0;
   color:black;
}
.KBWS_down{ 
   background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAtCAIAAAC1eHXNAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA86AAAPOgGXOdvCAAAAjUlEQVR42u2YMQ7AIAwDidX/f5kOlZihIYoDztSlcPLRALXeeyMoNI4SByfH43nZzL4H/2KXF3GIQxzVOWyyFY7WOV9LTRYRg96xPkIjicpjFbrmdxunBgxSKvfTIDVgkFJ8n4tQAwYp/zm2R3LiOcgTElJmvcCLMx4kzn2ul/z/H7vUVLtH6X4rjsx6AeIuPyGZKpjxAAAAAElFTkSuQmCC");
   background-repeat: no-repeat;
   background-position: center; 
   background-color:#00B0E0;
   color:black;
}
.KBWS_right{ 
   background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAtCAIAAAC1eHXNAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA86AAAPOgGXOdvCAAAAk0lEQVR42u3WwQ6AIAwDUGr6/7+MBxMPRlFHZZh0Jw+QPcYAUWstE8RS5gg77LDDDjvs+CL4ajSA7UP+SjM2TQ5i53wViKrCdoL0fQpgNyXUo7M8OIwLLOVhtEEcdkO0K5Rwj502EAcjrnYHr45ZuHtuszBl9YMcgauMuemVDslTx9z0wfPi/0I77LDDDjvs+LNjBRkONl3zu05kAAAAAElFTkSuQmCC");
   background-repeat: no-repeat;
   background-position: center; 
   background-color:#00B0E0;
   color:black;
}
.KBWS_left{ /*backspace*/
   background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAtCAIAAAC1eHXNAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA86AAAPOgGXOdvCAAAAiUlEQVR42u3XwQ6AIAwDUGr6/7+MRw8m07nNYSz30QcjATDnHAuMbawx5JBDDjnkkOMbDgAAvFVMjI+Uszc+6siKf+hIj/c56uKPCON9Whd/DmXL6q2+tMRf9CVu8n5HaM/y2ibx5rKqQfTucxGIkcYnmphyGOOgnPs2DoL++3LIIYcccsjxG8cO6QskgCDoKcgAAAAASUVORK5CYII=");
   background-repeat: no-repeat;
   background-position: center; 
   background-color:#FF0066;
   color:black;
}
/*--------------------HighLighter*/
.HL_DEF {  /*default*/
   color: black;
}
.HL_RES {   /*reserved word*/
   color: black; 
   font-weight:bold;
}
.HL_VAR {  /*variable*/
   color: blue;
   font-weight:normal;
}
.HL_CSS {  /*css rule*/
   color: sienna;
   font-weight:bold;
}
.HL_TAG {  /*HTML tag*/
   color: magenta;
   font-weight:bold;
}
.HL_ATTR {  /*HTML attr name*/
   color: blue;
   font-weight:normal;
}
.HL_TXT {  /*text*/
   color: red;
   font-weight:normal;
}
.HL_DATA {  /*html data*/
   color: black;
   font-weight:normal;
}
.HL_SYN {  /*syntax*/
   font-weight:bold;
   color: #006600;
   margin-left:10px;
   margin-right:10px;
}
.HL_OBJ {  /*object, DOM*/
   color: rgb(200,140,0); /*darkorange*/
   font-weight:bold;
}                  
.HL_COM {  /*comment*/
   color: gray;
}
.HL_ERR {  /*error*/
   color: magenta;
}
.HL_NUM {  /*number*/
   color: green;
   font-weight:bold;
}
.HL_CON {  /*container*/
   color: black;
   background-color: gray;
   font-weight:bold;
}
#HL{ /*ouput DOM element*/
   background-color: #ffff99;
   padding:10px;
   margin:auto;
   border-radius:25px;
   width:80%;
   font-size:120%;
}                                       
/**/
/********NEW VERSION (uses CSS to draw balls,..)*******************************/
/*boxis,balls . replacement of some PNG,GIF files*/
/*color*/
.bred{
    background-color: red;
}
.bblue{
    background-color: blue;
}
.bgreen{
    background-color: green;
}
.byell{
    background-color: yellow;
}
.byellow{
    background-color: yellow;
}
.bgray{
    background-color: gray;
}
.bwhite{
    background-color: white;
}
.bblack{
    background-color: black;
}
.bsky{
    background-color:rgb(135,206,235);
}
.blgray{
    background-color:lightgray;
}
.blgreen{
    background-color:lightgreen;
}
.bcyan{
    background-color: cyan;
}
.bviolet{
    background-color: violet;
}
/************text colors ******************************************************/
.tred{
    color: red;
}
.tblue{
    color: blue;
}
.tgreen{
    color: green;
}
.tyell{
    color: yellow;
}
.tyellow{
    color: yellow;
}
.tgray{
    color: gray;
}
.twhite{
    color: white;
}
.tblack{
    color: black;
}
/*-------more colors----------------------------------------------------------*/
.bgMSG{/*green*/
    background-color:#33CC66;
}
.bgCFM{
    background-color:#f0e68c;
}
.bgMSG2{
    background-color:#00CED1;
}
.bgERR{
    background-color:#FF9966;
}
.bgMTurq{ /*MediumTurquoise*/
    background-color:#48D1CC;
}
.bgDTurq{ /*DarkTurquoise*/
    background-color:#00CED1;
}
.bgPTurq{ /*PaleTurquoise*/
    background-color:#AFEEEE;
}
.bgTurq{ /*Turquoise*/
    background-color:#40E0D0;
}
.bgMag{
    background-color: magenta;
}
.bgDMag{
    background-color: #8b008b;
}
.bgLMag{
    background-color: violet;
}
/*----------shadows-----------------------------------------------------------*/
.shadow{
    box-shadow: 8px 8px 3px 3px rgba(0, 0, 0, 0.12);
}
/*--------------vertical space---------------------------------------------------------*/
.space4 {
    padding:4px;
    margin:auto;
    text-align:center;
}
.space8 {
    padding:8px;
    margin:auto;
    text-align:center;
}
.space16 {
    padding:16px;
    margin:auto;
    text-align:center;
}
.space24 {
    padding:24px;
    margin:auto;
    text-align:center;
}
.space32 {
    padding:32px;
    margin:auto;
    text-align:center;
}
.space48 {
    padding:48px;
    margin:auto;
    text-align:center;
}
/*--------------horizontal space---------------------------------------------------------*/
.hspace16 {
    width:   16px; 
    display:inline-block;
}
.hspace32{
    width:   32px; 
    display:inline-block;
}
.hspace48 {
    width:   48px; 
    display:inline-block;
}
/*------------BALLs-----------------------------------------------------------*/
.ball16{
    width:   16px; 
    height:  16px; 
    padding: 1px;
    margin:  1px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    border-radius: 16px; 
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
}
.ball24{
    width:   24px; 
    height:  24px; 
    padding: 1px;
    margin:  1px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    border-radius: 24px; 
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
}
.ball32{
    width:   32px; 
    height:  32px; 
    padding: 1px;
    margin:  1px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    border-radius: 32px; 
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
}
.ball48{
    width:   48px; 
    height:  48px; 
    padding: 1px;
    margin:  1px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    border-radius: 48px; 
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
}
.ball64{
    width:   64px; 
    height:  64px; 
    padding: 1px;
    margin:  1px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    border-radius: 64px; 
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
}
/*---------BOX----------------------------------------------------------------*/
.rbox{
    padding: 2px;
    margin:  2px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
    border-radius: 0px; 
}
.abox{
    padding: 2px;
    margin:  2px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    vertical-align:middle;
    display:block;
    overflow:hidden;
    position:absolute;
    z-index:9999;
    border-radius: 0px; 
}
.rcox{
    padding: 2px;
    margin:  2px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    vertical-align:middle;
    display:inline-block;
    overflow:hidden;
    border-radius: 12px; 
}
.acox{
    padding: 2px;
    margin:  2px;
    border:  1px solid black;
    cursor: pointer; 
    text-align:center;
    vertical-align:middle;
    display:block;
    overflow:hidden;
    position:absolute;
    z-index:9999;
    border-radius: 12px; 
}
/*-------box sizing-----------------------------------------------------------*/
.b100x20{
    width:   100px; 
    height:  20px;
    line-height:20px;
}
.b200x40{
    width:   200px; 
    height:  40px;
    line-height:40px;
}
.b300x60{
    width:   300px; 
    height:  60px;
    line-height:60px;
}
.b300x100{
    width:   300px; 
    height:  100px;
    line-height:100px;
}
.b400x80{
    width:   400px; 
    height:  80px;
    line-height:80px;
}
.b500x100{
    width:   500px; 
    height:  100px;
}
.b600x120{
    width:   600px; 
    height:  120px;
}
.b700x150{
    width:   700px; 
    height:  150px;
}
/*--------------------texts---------------------------------------------------*/
.tx10e{
    font-size:1em;
    font-family:Verdana;
}
.tx15e{
    font-size:1.5em;
    font-family:Verdana;
}
.tx20e{
    font-size:2em;
    font-family:Verdana;
}
.tx10eu{
    font-size:1em;
    font-family:Verdana;
    text-decoration: underline;
}
.tx15eu{
    font-size:1.5em;
    font-family:Verdana;
    text-decoration: underline;
}
.tx20eu{
    font-size:2em;
    font-family:Verdana;
    text-decoration: underline;
}
.tx10eb{
    font-size:1em;
    font-family:Verdana;
    font-weight:bold;
}
.tx15eb{
    font-size:1.5em;
    font-family:Verdana;
    font-weight:bold;
}
.tx20eb{
    font-size:2em;
    font-family:Verdana;
    font-weight:bold;
}
.tx10ebu{
    font-size:1em;
    font-family:Verdana;
    font-weight:bold;
    text-decoration: underline;
}
.tx15ebu{
    font-size:1.5em;
    font-family:Verdana;
    font-weight:bold;
    text-decoration: underline;
}
.tx20ebu{
    font-size:2em;
    font-family:Verdana;
    font-weight:bold;
    text-decoration: underline;
}
/******************************************************************************/
.jsDashb_sep24h {
   height:24px;
}
.jsDashb_sep4h {
   height:4px;
}
.jsDashb_sep24w {
   width:24px;
   display:inline-block;
}
.jsDashb_ib {
   display:inline-block;
}
.jsDashb_min    {background-color:rgb(225,204,0);   /*HG_yellow*/ }
.jsDashb_max    {background-color:rgb(0,80,145);    /*HG_blue*/   }
.jsDashb_avg    {background-color:rgb(106,134,147); /*HG_gray*/  }
.jsDashb_btnw   {background-color:rgb(228,86,32);   /*HG_orange*/}
.jsDashb_btn {
   height:26px; 
   line-height:26px; 
   vertical-align:middle;
   width:48px;
   text-align:center;
   border-radius:3px;
   border:1px solid black;
   overflow:hidden;
   margin-top:1px;
   font-weight: bold;
   color:white;
   cursor:pointer;
}
.jsDashb_Data {
   height:20px;
   line-height:20px;
   border:1px solid black;
   border-radius:5px;
   overflow:hidden;
   color:white;
   text-align:center;
   font-weight: bold;
   display:inline-block;
   background-color:rgb(0,80,145);
}
.jsDashb_canvas{}
.jsDashb_canvas_tooltiptext {
  background-color: darkgray;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;  
}
/*****************************tblTurq******************************************/
.tblTurq {
    border:0px solid black;
}
.tblTurq TH{
    font-weight:bold;
    background-color:#00CED1; /*DarkTurquoise*/
    text-align:center;
    text-indent: 0px;
    border:2px solid;
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
}
.tblTurq TD{
    font-weight:normal;
    background-color:#AFEEEE;/*PaleTurquoise*/
    text-align:left;
    text-indent: 5px;
    border:2px solid;
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
}
/*****************************formTurq******************************************/
.formTurq {
    padding:10px;
    border:1px solid;
    border-radius:12px;
	  margin:auto;
	  background-color:#40E0D0; /*Turquoise*/
	  font:1em Verdana;
	  width:75%;
	  box-shadow: 10px 20px 3px 6px rgba(0, 0, 0, 0.12);
	  text-align : center;
    text-indent: 5px;
    overflow:hidden;
}
.sormTurq {
    padding:10px;
    border:1px solid;
    border-radius:12px;
	  margin:auto;
	  background-color:#40E0D0; /*Turquoise*/
	  font:1em Verdana;
	  width:75%;
	  box-shadow: 10px 20px 3px 6px rgba(0, 0, 0, 0.12);
	  text-align : center;
    text-indent: 5px;
    overflow:scroll;
}
/**********TESTS****************************************************************/
.yuashasasdhsxjjxxsji {
    overflow:hidden;
    overflow:scroll;
    font-weight:bold;
    text-decoration: none;
    text-decoration: overline;
    text-decoration: line-through;
    text-decoration: underline;
    text-transform: uppercase;
    text-transform: lowercase;
    text-transform: capitalize;
    text-align:center;
    text-indent: 50px;
    letter-spacing: -3px;
    line-height: 1.8; 
    direction: rtl;
    word-spacing: 10px;
    text-shadow: 3px 2px red;
    font-family: "Times New Roman", Times, serif;
    font-style: normal;
    font-style: italic;
    font-style: oblique;
    font-variant: small-caps;
    /*font: italic bold 12px/30px(font-size/line-height) Georgia, serif;*/
}
/******************************************************************************/
.box_fancy{
    border:3px solid;     
    border-top-color:#70A060;
    border-left-color:#70A060;
    border-right-color:#425723;
    border-bottom-color:#425723;
    border-radius: 12px;
    display:inline-block;
    box-shadow: 8px 8px 3px 3px rgba(0, 10, 150, 0.22);
    width:   300px; 
    height:  100px;
    background-color:#FFF040;
    line-height:100px;
    text-shadow: 3px 2px rgb(0, 10, 150);
    text-align:center;
    text-indent: 10px;
    letter-spacing: 5px;
    font-weight:bold;
    font-size:2em;
}