/* stylesheet - Christian Halsted 2019 */

* { box-sizing: border-box; }
div { /* border: thin solid #999; */ }  /* for testing */
body {
    /* padding-top: 59px; */
    font-family: 'Noto Sans';
    height: 100%;
    /* font-size: 22px; */
}

.navbar-custom {
    background-color: rgb(68, 114, 196) !important;
}
.navbar-custom .navbar-brand,
.navbar-custom .navbar-brand > a,
.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus {
   color: white;
}
.navbar-nav > li > a {
	color: white;
  font-size: .85em;
  padding: 0 10px 0 0;
}
.navbar-custom .navbar-nav > li > a:hover,
.navbar-custom .navbar-nav > li > a:focus {
    color: gold;
    font-size: .85em;
}

container-fluid {padding: 0px;}
#divSidebar, #divMapTable, #divMap, #divTable {
  padding: 0px;
}
#tableDataTableTownSummary #tableDataTableWells {
  width: 100%;
}

@media (min-width: 100px) {
  .navbar-custom .navbar-brand {font-size: 16px;}
  .navbar-custom {font-size: 14px;}
  #divSidebar {
    /* height: 500px; */
    padding-top: 56px;
  }
  #divMap {
    height: 400px;
    margin: 0px;
  }
  #divTable {
    height: 220px;
    width: 100%;
    margin: 0px;
  }
  #containerMapTable {
    padding: 0px;
  }
}
@media (min-width: 768px) {
  .navbar-custom .navbar-brand {font-size: 22px;}
  .navbar-custom {font-size: 16px;}
  #divSidebar {
    height: 100vh;
    overflow-y: auto;  /*adds vertical scroll bar*/
  }
  #divSidebar, #divMapTable {
    padding-top: 56px;
  }
  #divMap {
    /* border: thin solid #999; */
    position: absolute;
    height: 72.5%;
    width: 100%;
    margin-top: -56px;
    padding-top: 56px;
  }
  #divTable {
    /* border: thin solid red; */
    position: absolute;
    bottom: 0;
    /* height: 25%; */
    height: 220px;
    width: 100%;
  }
}

#tableDataTableTownSummary_wrapper {
  padding: 0px;
  width: 100%;
  position:absolute;
  bottom: 0;
  right: 0;
}
#tableDataTableWells_wrapper {
  padding: 0px;
  width: 100%;
  position:absolute;
  bottom: 0;
  right: 0;
}

#map {
   height: 100%;
   width: 100%;
   display: inline-block;
   width: 100%;
}

.toolTipTable {
  font-family: 'Noto Sans';
}

.form-group {margin: 5px;}
#ExtentGroup {margin: 5px;}
#stats {margin: 2px 10px 0px 10px;}
#stats p {font-size: .85em}
.statsValues {font-weight: bold; float: right;}

#containerTable {
  padding: 0px;
}


thead th { white-space: nowrap; }
th { font-size: 12px; }
table.dataTable thead th { padding: 2px 5px; }
table.dataTable tbody td {
  padding: 2px 5px;
  font-size: 11px;
}
.dataTables_info { font-size: 11px; }
.dataTables_filter label { font-size: 12px; }
.dataTables_wrapper .dataTables_filter  {float: left;}
.dataTables_filter input { width: 200px; }

#legendTitle {
  font-size: 12px;
  font-weight: bold;
  font-family: 'Noto Sans';
}
.legend {
    line-height: 18px;
    color: #555;
}
.legend i {
    width: 18px;
    height: 18px;
    float: left;
    margin-right: 8px;
    opacity: 0.9;
}
.info {
    padding: 6px 8px;
    font-size: 11px;
    font-family: 'Noto Sans';
    background: white;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 0 15px rgba(0,0,0,0.4);
    border-radius: 5px;
}


#maincontent {
  padding-top: 56px;
}