body {
    cursor: default;
    background-color: white;
    color: #dddddd;
    font-size: 16px;
    margin: 0px;
    padding: 0px;
}
:root { 
/*   --back: #1e90ff; 
  --back: #001a00;  
 
  --back: #004d00; */
 --back: black; 
 
 
  --color: grey;
  --color_hover: red;
  
  --font0:40px;
  --font1:30px;
  
  --bselect:white;
}


::placeholder {
  color: grey;
  opacity: 1; /* Firefox */
}

::-ms-input-placeholder { /* Edge 12-18 */
  color: grey;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
/**/
._unos{ color:red;  border:0px solid grey; border-bottom:1px solid grey; }


.bodyW{color:grey; background:var(--back); padding:0px; margin:0px; transition: 1.0s;}
.bodyB{color:red; background:var(--back); padding:0px; margin:0px; transition: 1.0s;}
.bodyT{color:red; opacity: 1; background:var(--back); padding:0px; margin:0px; transition: 1.0s;}
.frame{display:none;  color:grey; background:var(--back); padding:0px; margin:0px; 
	   border:0px solid grey; width:100%; height:100%; 
}
.frameH{display:block; float:left;  color:grey; background:var(--back); padding:0px; margin:0px; 
	   border:0px solid green; width:33.33%; height:100%; transition: width 1s;
}
.frameH0{display:block; float:left;  color:grey; background:var(--back); padding:0px; margin:0px; 
	   border:0px solid green; width:33.33%; height:100%;  overflow-y:scroll;
}
.frameM{display:block; float:left; opacity: 1;  color:grey; padding:0px; margin:0px; background:var(--back);
	   border:0px solid green; width:100%; height:100%; transition: width 1s;
}

.frameB{display:block; float:left;  color:grey; background:var(--back); padding:0px; margin:0px; 
	   border:0px solid green; width:33.33%; height:100%; transition: width 1s;
}

.Div_Meni{ cursor:pointer; padding:20px; background:transparent; width:90%; font-size:30px; color:grey;}
.Div_Meni:hover{  color:red !important;  border:0px solid grey; border-radius:0px 10px; }

.div_progress{transition: width 3s;}

/* border-radius:  0px 20px 20px 0px ; */
.mmeni{ display:block; width:100%; padding:10px;text-align:center; background:var(--back); color:grey; border:1px solid grey; }
.mmeni:hover{ background-color:var(--bselect); color:red; border:1px solid white; 
}

.batt{ width:80%; text-align:center; background:transparent; color:var(--noselect); border:1px solid transparent; }
.batt:hover{  color:var(--select); transition:0.6s; }
.icon { width:20% color:var(--romb);  }
.icon:hover{  color:var(--select); transition:0.6s; }

.MENI_RM{position:absolute; display:block;  z-index:1000; float:right;  color:grey; padding:0px; margin:0px; 
	   border:5px solid grey; border-radius:0px 10px; width:0px; left:-10px; height:100%; transition: width 1s;
}
.MENI_RMR{position:absolute; z-index:1000; float:right;  color:grey; padding:0px; margin:0px; 
	   border:5px solid grey; border-radius:10px 0px; 
	   height:100%; transition: width 1s;
}
.top_resize{ z-index: 901; float:left;  position:absolute;  top:0px; left:5px; background:black; border-radius: 10px; color:white; font-size:25px; opacity: 0.1; }
.top_resize:hover{  cursor: move; background:black; border:0px; color:white;  opacity: 1;}


.linkmeni{cursor:pointer; z-index: 101; color:var(--color); font-weight: bold; } 
.linkmeni:hover { color: var(--color_hover); font-weight: bold; } 

.titlC{color:white; opacity: 1; float: left !important; font-size: var(--font1);}
.topbutton_R{ z-index: 910;  color:white;  float: right !important;}
.ksabs00000{ position:absolute;  cursor:pointer; z-index: 101; font-size:var(--font1); color:var(--color); font-weight: normal; } 
.ksabs{ float:right;  cursor:pointer; z-index: 101; font-size:var(--font1); color:var(--color); font-weight: normal; } 
.ksabs:hover { color: white; font-weight: bold; }

.MyTab_b{ float:left; padding:5px 5px 0px 0px; background:black;}
.MyTab_b button { padding:5px 10px 0px 10px; font-size:25px; border-radius: 20px 20px 0px 0px; display:block; color:grey;  float:left; border:0px solid grey; background: transparent; }
.MyTab_b button:hover { color:white;   border:1px solid grey; background: transparent; }

.datum100_dmy{background-color:transparent; text-align:center; border:1px solid black; width:100%;}
.datum100_dmy:focus{ color:red; border:1px solid blue !important; }

.datum_dmy{background-color:transparent; text-align:center; border:1px solid red; width:80%;}
.datum_dmy:focus{ color:red; border:1px solid blue !important; }
.kalendar{ cursor:pointer; color:green; text-align:center; background:transparent; border:1px solid green; border-radius:5px;  }

.Dugme{cursor:pointer; float:left; color:grey; font-size:15px; background:transparent; border:0px solid grey; border-radius:90px; width:100px; height:100px;}
.Dugme:hover {cursor:pointer; font-size:15px; color:black; background:grey;   border:3px solid white; border-radius:90px; width:100px; height:100px; transition: background 1s;}

.div_install { z-index: 2000; text-align:center; position:absolute; border:0px solid grey; padding:2px; right:12px; top:0%; color:white; } 



.install{cursor:pointer; float:right; color:white; font-size:20px; background:red; padding:7px;   border:1px solid grey; border-radius:5px;}
.install:hover { color:white; border:2px solid white; border-radius:10px;}

.med{ z-index: 1010;  position:absolute; opacity: 1; border-radius:10px 10px 10px 10px; padding:0px; width:90%; height:90%; background:black; color:white; left:5%; top:5%; border: 5px solid white;
  transition-property: display;
  transition-duration: 5s;
  transition-delay: 2s; }
.Obavestenje{ z-index: 1010;  position:absolute; opacity: 1; border-radius:20px ; padding:0px;  background:white; color:black; left:5%; top:5%; border: 5px solid red;
  transition-property: display;
  transition-duration: 5s;
  transition-delay: 2s; }

  
.ob_text{padding:0px; text-align:center; top:10%; margin:0px; background: transparent; font-size: 20px;}
.zastor{ position:absolute; z-index: 1009; opacity: 0.5; padding:0px; background:black; color:grey; top:0; left:0; width:100%; height:100%; border: 1px solid grey;}
.ob_ok{ background-color: padding: 30px; color:black; text-align:center; width:80px; font-size:15px; border-radius:30px;}
.ob_ok:focus{ background-color: #0033cc; color:white;   }
.ob_ok:hover{ background-color: #ccd9ff; color:black; border-radius:40px;}

.div0{ padding:20px;  margin:0px; background: transparent; font-size: var(--font1); }
.div0 button {
  background-color: inherit;
  color: var(--color) !important;
  border: none;
  border-radius: 10px;
  outline: none;
  cursor: pointer;
  padding: 0px;
  text-align:center;
  width:100%;
}
.div0 button:hover {
  color: var(--color_hover) !important;
   border: 1px solid red;
  
}
.tab{opacity: 1; padding:5px 5px 5px 5px; border: 1px solid var(--back); font-size: var(--font1);}
/* Style the buttons inside the tab color:red; */
.tab button {
  background-color: inherit;
  color: var(--color) !important;
  float: left;
  border: none;
  
  outline: none;
  cursor: pointer;
 padding: 5px;
  /*  padding: 5px 5px 5px 5px;

  margin:0px; 
  transition: 0.9s;
  font-size: var(--font1);*/
  
  text-align:center;
}
/* Change background color of buttons on hover */
.tab button:hover {
  /* background-color: #ddd;  rgba(var(--color_hover), 0.1)  
  border-bottom: 2px solid white;*/
  color: var(--color_hover) !important;
  
}

.tooltipD {
  /**/position: relative;
  display: inline-block;
  border-bottom: 1px dotted var(--back);
  cursor:pointer;
}
.tooltipD:hover  {
 color:#0066ff !important; border: 1px !important; 
}

.tooltipD .tooltiptext {
  visibility: hidden;
  width: 150px;
  background-color: grey;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  font-size:15px;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: 37px;
  left: 10%;
}

.tooltipD:hover .tooltiptext {
  visibility: visible;
}

/* TABLE  */

.top_fix{ position:sticky; top:0px; background:grey; color:white; font-size:15px;}
.left_fix{ position:sticky; left:0px; background:grey; color:white; font-size:15px; z-index:0;}

#customers {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
  
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: center;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: center;
  background-color: #04AA6D;
  color: white;
}


.move {
    position: absolute;
    z-index: 1000;
	padding:2px 2px 2px 2px;
    /* width: 40px; */
    /* height: 30px; */
	border: 0px;
	background:transparent;
}
.moving {
    position: absolute;
    z-index: 3000;
	background:white;

}
.hp {
    position: absolute;
    z-index: 50;
    top: 15px;
    left: 15px;
}

a:link {
    color: #ffffff;
}
a:visited {
    color: #ffffff;
}
a:hover {
    color: #ffa3d8;
}
a:active {
    color: #a0d0ff;
}
#otop {
    position: absolute;
    top: 2px;
    left: 0px;
    width: 99%;
    height: 20px;
    text-align: right;
}