@charset "UTF-8";
/* CSS Document */

.debug{
  padding: 4px;
  border: solid 1px lightgray;
  margin: 8px;
  color: darkgrey;
}

.scroll-to-top {
  z-index: 10000;
}

.none{
  display: none;
}
.hide{
  opacity: 0;
  pointer-events: none;
}


.error_message{
  color: red;
}

.disabled{
  opacity:0.65;
  pointer-events:none;
}

.site_image .img_box{
  min-height: 48px;
  min-width: 68px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.site_image img{
  max-width: 65px;
  max-height: 45px;
}



#dtable thead th {
  font-size: 0.8rem;
  text-align: center;
  vertical-align: center;
}

#dtable tfoot th {
  font-size: 0.8rem;
  text-align: center;
  vertical-align: center;
}

#dtable tbody td.left {
  font-size: 0.9rem;
  text-align: left;
  vertical-align: center;
}

#dtable tbody td.right {
  font-size: 0.9rem;
  text-align: right;
  vertical-align: center;
}

#dtable tbody td.center {
  font-size: 0.9rem;
  text-align: center;
  vertical-align: center;
}

#dtable tbody tr:nth-child(even):hover td{
  color: black;
  background-color: #ebf1ff !important;
  /*background-color: rgba(0, 0, 255, 0.2) !important;*/
}

#dtable tbody tr:nth-child(odd):hover td {
  color: black;
  background-color: #ebf1ff !important;
  /*background-color: rgba(0, 0, 255, 0.2) !important;*/
}

#dtable tbody tr {
  cursor:pointer;
}


.graph-card{
  min-width: 460px;
}

.graph-image{
  position: relative;
  padding: 0;
  max-width: 280px;
}
.graph-canvas{
  position: absolute;
  top:0;
  left:0;
}

.graph-point-value{
  position: absolute;
  top:0;
  left:0;
  z-index: 1;
  font-size: 16px;
  height: 30px;
  line-height: 30px;
  min-width:100px;
  padding: 0 8px;
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.7);
  border: solid 2px white;
  color: white;
  transition: all 150ms 0s ease;
}


.graph-bar{
  position: absolute;
  background-color: rgba(0, 0, 196, 0.5);
  top:0;
  left:0;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  cursor: pointer;
}
.graph-bar:hover {
  background-color: rgba(0, 0, 196, 0.3);
  transform: scale(1, 1.05);
}

.graph-bar.isolation_layer{
  position: absolute;
  background-color: rgba(72, 156, 235, 0.2);
  top:0;
  left:0;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  cursor: pointer;
}
.graph-bar.isolation_layer:hover {
  background-color: rgba(72, 156, 235, 0.2);
  transform: scale(1, 1.05);
}


.graph-point{
  position: absolute;
  background-color: rgba(0, 0, 109, 0.6);
  height: 20px;
  width: 20px;
  border-radius: 50%;
  top:0;
  left:0;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  transform: translate(-10px, -10px);
  cursor: pointer;
}
.graph-point:hover {
  background-color: rgb(34, 34, 121);
  transform: translate(-10px, -10px) scale(1.2, 1.2);
}

.bootbox.modal.show .modal-dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: calc(100% - (1.75rem * 2));
}


.bg-warning2 {
  background-color: #FEEF0B !important;
}

a.bg-warning2:hover, a.bg-warning2:focus,
button.bg-warning2:hover,
button.bg-warning2:focus {
  background-color: #f4b30d !important;
}



.notify-badge {
    position: absolute;
    background: rgba(255,0,0,1);
    height:1rem;
    top:0.5rem;
    right:1.0rem;
    width:2rem;
    text-align: center;
    line-height: 1rem;;
    font-size: 1rem;
    border-radius: 50%;
    color:white;
    border:0px solid blue;
}

thead th.rightline-2 {
    border-right: solid 2px;
}

thead th.rightline-1 {
    border-right: solid 1px;
}

tbody td.rightline-2 {
    border-right: solid 2px;
}

tbody td.rightline-1 {
    border-right: solid 1px;
}