#databox {

width: 470px;
height: 100%;
position: absolute;
background: #fff;
opacity: 01;
z-index: 9999999;
}

#databox .m_name {
  text-align: center;
}

#databox .pm {
  text-align: center;
}

#databox .textright {
  text-align: right;
}

#databox svg.Icon {
    border-radius: 50%;
    border: 2px solid rgb(239, 187, 15);
    display: block;
    width: 40px;
    height: 40px;
}

#databox svg.Icon path {
    fill: rgb(41, 50, 61);
}


.pmpanel {
  position: absolute;
  right:0;
  top:0;
  background: rgba(255, 255, 255, 0.5);
  width: 110px;
  height: 110px;
  border: 1px solid #e2e2e2;

}

.pmpanel2 {
  position: absolute;
  left:360px;
  top:0;
  background: rgba(255, 255, 255, 0.5);
  width: 60px;
  height: 110px;
  border: 1px solid #e2e2e2;

}

.pmbuttons {
  position: absolute;
  right:0;
  top:0;
}

.pmbuttons svg.Icon {
    border-radius: 50%;
    border: 2px solid rgb(239, 187, 15);
    display: block;
    width: 40px;
    height: 40px;
}

.pmbuttons svg.Icon path {
    fill: rgb(41, 50, 61);
}

.popu svg.Icon {
    border-radius: 50%;
    border: 2px solid rgb(239, 187, 15);
    display: block;
    width: 40px;
    height: 40px;
}

.popu svg.Icon path {
    fill: rgb(41, 50, 61);
}

.pmbutton {
  padding: 5px;
  display: inline-block;
}

.pmbuttons .active  > svg.Icon {
  border: 2px solid rgb(000,200,000) !important;
}

.skala {
  position: absolute;
  right: 0;
  bottom:30px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid #e2e2e2;
}
.skala img {
  width: 29px;
  height: 29px;
  display: inline-block;
  padding: 5px 5px;
  margin: 5px 0px;
}

.mapbuttons {
  position: absolute;
  left:365px;
  top:5px;
}
.mapbutton {
  padding: 0px;
  margin: 2px;
  border: 2px solid rgb(239, 187, 15);
  border-radius: 10px;
}
.mapbutton img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}

.mapbuttons .active {
  border: 2px solid rgb(000,200,000) !important;
}

.maphistorybuttons {
  position: absolute;
  right:3px;
  top:50px;
}
.maphistorybutton,.maphistorybutton2 {
  padding: 0px;
  margin: 2px;
  border: 2px solid rgb(239, 187, 15);
  border-radius: 10px;
  display: inline-block;
}
.maphistorybutton img,.maphistorybutton2 img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}

.maphistorybutton.active, .maphistorybutton2.active  {
  border: 2px solid rgb(000,200,000) !important;
}

.maphistory,.maphistory2 {
  display: none;
  position: absolute;
  top:50px;
  right: 120px;
  max-width: 400px;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  border: 2px solid rgb(239, 187, 15);
  padding: 5px;
  border-radius: 10px;

}

.maphistory input { width: 100%; }
.maphistory2 input { width: 100%; }

#popupbig {
  min-width: 600px !important;
  width: 100%;
}
.pull-right {
      float: right!important;
}
.pull-left {
      float: left!important;
}

.bgwhite { background: white !important; }

.pm10blockname {text-align: center; display: block;}
.pm10block {text-align: center; padding:5px;}
.pm10block span {font-size: 14px;}

.pm10color0 { background:#d2d2d2; color:#464E5F;}
.pm10color1 { background:#21EFEF; color:#464E5F;}
.pm10color2 { background:#47D1A3; color:#464E5F;}
.pm10color3 { background:#FFFF00; color:#464E5F;}
.pm10color4 { background:#FF4F4F; color:#ffffff;}
.pm10color4 { background:#B00000; color:#ffffff;}
.pm10color6 { background:#812785; color:#ffffff;}


.overlay2{
       display: none;
       position: fixed;
       width: 100%;
       height: 100%;
       top: 0;
       left: 0;
       z-index: 9999999;
       background: rgba(255,255,255,0.8);
       padding-top: 50vh;
    text-align: center;
   }
   body{
       text-align: center;
   }
   /* Turn off scrollbar when body element has the loading class */
   body.loading{
       overflow: hidden;
   }
   /* Make spinner image visible when body element has the loading class */
   body.loading .overlay2{
       display: block;
   }

   .ctime { font-weight: bold;}

@media (max-width: 991.98px) {
  .pmpanel { top:60px;  }
  .pmpanel2 { top:60px; left:40px; }
  .pmbuttons { top:60px;  }
  .mapbuttons { top:65px; left:45px;   }
  .maphistorybuttons { top:110px;  }
#databox {
  width: 320px;
}

}