body {
           padding: 0;
            margin: 0;
  background-color: rgb(0,0,0);
}

html, body, #mapid {
  height: 100%;
   width: 100%;
}

div#title{
  min-width: 960px;
}

div#varbar{
  /*
               position: relative;
              min-width: 840px;
                  float: left;
                  width: auto;
                  width: 348px;
  */
               position: absolute;
                  width: 524px;
                 height: 23px;
                padding: 3px 2.5px 0px;
                 bottom: 42px;
             background: rgba(5,5,5,0.4);
             visibility: hidden;
          border-radius: 3px;
     -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
                z-index: 555;
}

div#toolbar{
  /*
               position: relative;
                  float: left;
  */
               position: absolute;
                  /*width: auto;*/
                  width: 548px;
                 height: 23px;
                padding: 3px 2.5px 0px;
                 bottom: 14px;
             background: rgba(5,5,5,0.4);
             visibility: hidden;
          border-radius: 3px;
     -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
                z-index: 556;
}

label#tmlbl{
     display: inline-block;
       width: 48px;
  text-align: center;
       color: #fff;
   font-size: 12pt;
}

label#deplbl{
     display: inline-block;
       width: 80px;
  text-align: right;
       color: #fff;
   font-size: 12pt;
}

label#chklbl{
     display: inline-block;
      margin: 0 1px;
     padding: 0 0 2px 0;
       width: 56px;
  text-align: center;
       color: #fff;
      cursor: pointer;
          border-radius: 3px;
     -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
   font-size: 12pt;
}
label#scllbl{
      display: inline-block;
        width: 78px;
  padding-top: 0px;
   text-align: right;
        color: #fff;
    font-size: 12pt;
}

input[type=button]{
          display: inline-block;
   vertical-align: baseline;
          outline: none;
           cursor: pointer;
       text-align: center;
  text-decoration: none;
           border: 1px;
    border-radius: 2.5em;
            color: rgba(0,0,0,0.75);
       background: rgba(255,255,255,0.6);
}
input[type=button]:hover{
  background: rgba(255,255,255,0.75);
}
input[type=button]:active{
  background: rgba(255,255,255,0.9);
}

input[type=range]{
  -webkit-appearance: none;
              height: 9px;
       border-radius: 9px;
          background: rgba(255,255,255,0.5);
}
input[type=range]::-webkit-slider-runnable-track {
         height: 5px;
  border-radius: 5px;
     background: rgba(0,0,0,0.5);
    margin-left: 1px;
   margin-right: 1px;
}
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
              height: 13px;
               width: 13px;
          margin-top: -3.5px;
          background: rgba(255,255,255,1.0);
       border-radius: 50%;
              border: solid 2px rgba(255, 255, 255, 1.0);
}

input[type=checkbox]{
  /*
          margin-top: 0px;
  */
  -webkit-appearance: none;
     -moz-appearance: none;
            position: relative;
               width: 15px;
              height: 15px;
          margin-top: 0px;
              border: solid 3.0px rgba(255, 255, 255, 1.0);
       border-radius: 9px;
          background: rgba(255,255,255,0.0);
               color: rgba(255,255,255,1);
              cursor: pointer;
          text-align: center;
      vertical-align: middle;
          visibility: hidden;
}
input[type=checkbox]:checked{
  border: solid 3.0px rgba(155, 155, 155, 0.5);
  background: rgba(255,255,255,1.0);
}

select {
               width: auto;
              border: solid 1.5px rgba(255, 255, 255, 1.0);
       border-radius: 3px;
          appearance: none;
     -moz-appearance: none;
  -webkit-appearance: none;
               color: #fff;
             padding: 0 5px;
         margin-left: 5px;
        margin-right: 6px;
          background: rgba(255,255,255,0.3);
           direction: rtl;
              cursor: pointer;
}
select::-ms-expand { display: none; } /* for IE, remove style and down-arrow icon */
option {
  direction: rtl;
}

.pop .leaflet-popup-tip,
.pop .leaflet-popup-content-wrapper {
    background: rgba(255,255,255,0.8);
         color: #000;
}
.pop .leaflet-popup-content
{
    font-weight: normal;
      font-size: 13px;
         margin: 5px;
}

div.h0 {
   text-align: right;
   background: rgba(255,255,255,0.0);
  text-shadow: 1px 1px 2px #000;
}