body {
  margin:0;
  padding:0;
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  color:#222;
}

#content {
  position:absolute;
  bottom:0;
  top:10%;
  left:0;
  right:0;
  overflow:hidden;
}

#graph {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
}

#graph svg {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
}
.hide {
  display:none !important;
}


/* and (orientation: landscape)*/
@media (min-width: 800px)  {
  #controls {width:100%; display:flex;}
  #base-controls, #date-controls {display:flex; flex-grow: 1;}
}

@media (max-width: 799px)  {
  #content {top:11%;}
  #controls {width:100%;}
  #base-controls, #date-controls {display:flex;}
  #base-controls select, #date-controls input {
    font-size:1.3em;
  }
}

/* and (orientation: landscape)*/
@media (orientation: landscape) and (orientation: portrait)  {
  #base-controls select, #date-controls input {
    font-size:1.5em;
  }
  body {background:#000;}
}

#base-controls select, #date-controls input {
  flex-grow: 1;
  width:50%;
  padding:3px;
  margin:3px;
  border:1px solid #ddd;

}

#tabel-cote {margin:0; padding:0;}
#tabel-cote li {display:flex;border-bottom:1px solid #eee;}
.cote-head {font-weight:bold; margin:10px 0 5px 0; border-bottom:1px solid #ddd;}
.hcol-loc, .col-loc {
  max-width:43%;
  flex-grow: 1;
  text-align:left;
  padding-left:5px;
}

.hcol-niv, .hcol-vari, .hcol-temp,
.col-niv, .col-vari, .col-temp {
  max-width:19%;
  flex-grow: 1;
  text-align:right;
}
.hcol-temp,
.col-temp {
  padding-right:5px;
}


.morris-hover{position:absolute;z-index:1000}
.morris-hover.morris-default-style{border-radius:10px;padding:6px;color:#666;background:rgba(255,255,255,0.8);border:solid 2px rgba(230,230,230,0.8);font-family:sans-serif;font-size:1.2em;text-align:center}
.morris-hover.morris-default-style .morris-hover-row-label{font-weight:bold;margin:0.25em 0}
.morris-hover.morris-default-style .morris-hover-point{white-space:nowrap;margin:0.1em 0}

.ui-widget {z-index:10000 !important;}
select option {
    background: #fff !important;
}
select option[val="1"]{
    background: #eee;
}
