div {
  margin: 0;
  padding: 0;
}

* {
  font-family: 'Roboto', sans-serif;
  //font-family: 'Comic Sans MS', sans-serif;
}
.headerTable{ 
   border-style: none;
}

.borderlessTable{
   border-style: none;
}

table, th, td {
   border-collapse: collapse;
   border-width: thin;
   border-style: solid;
}

#overviewTable,#overviewLegend{
  margin-right:1ex;
  margin-bottom:1ex;
}

.hide{
   display: none;
}

#custom-handle {
  width: 5em;
  height: 3em;
  top: 50%;
  margin-top: -1.5em;
  margin-left: -2.5em;
  text-align: center;
  line-height: 2.6em;
}

//body {
//  position:absolute;
//}

body, html{
  position: absolute;
  margin: 0;
  margin-top: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  top: 0;
}


#map {
  height: 100%;
}

#mapContainer {
//  position: absolute;
  position: relative;
  height: 77%;
  display: inline-block;
  float: bottom;
  //height: 100%;
  width: 100%;
  bottom: 0;
}

#slider {
  margin-top: 2em;
  margin-left: 2em;
  position: relative;
//  height: 100%;
//  left: 10em;
//  top: 50px;
  //bottom: 2em;
  height: 0.6em;
//  background-color: white;
}



@media all and (max-width:960px){
  .headerImage{
    display: none;
  }

  #slider{
    width: 30%;
  }
}

@media all and (min-width:960px){
  .headerImage{
    display: inline-block;
  } 
  #slider{
    width: 70%;
  }
}


@media all and (min-width:960px){
  .chartDiv {
    //width: 95%;
    width: 912px;
  }
}

@media all and (min-width:625px) and (max-width=960){
  .chartDiv {
    width: 95%;
  }
}

@media all and (max-width:625px){
  .chartDiv {
    width: 600px;
  }
}

@media all and (min-width:1100px){
  .chartDivBig {
    width: 90%;
  }
}

@media all and (max-width:1100px){
  .chartDivBig {
    width: 990px;
  }
}






#headerContainer {
  position: absolute;
  top: 0;
  margin: 0;
  padding: 0;
}