/*

CSS for ndfd2.html

Created 10/11/2017

*/

#container {
   width:1000px;
}

#banner {
   width:1000px;
   display:inline-block;
   text-align: center;
   font-weight:bold;
   font-size:25px;
   background:skyblue;
   padding: 5px;
}


#header {
    text-align:center;
    padding:5px;
}

#nav {
    text-align:center;
    padding:5px;
}

#map {
    display:block;
    height:600px;
    width:800px;
}

.leaflet-div-icon-lomax {
    background-color: transparent;
    opacity: 0.9;
    text-align: center;
    color: blue;
    font-size: 20px;
}

.leaflet-div-icon-himax {
    background-color: transparent;
    opacity: 0.9;
    text-align: center;
    color: red;
    font-size: 20px;
}

.leaflet-div-icon-lomin {
    background-color: transparent;
    opacity: 0.9;
    text-align: center;
    color: purple;
    font-size: 20px;
}

.leaflet-div-icon-himin {
    background-color: transparent;
    opacity: 0.9;
    text-align: center;
    color: darkorange;
    font-size: 20px;
}

#infobox {
//    border:1px solid black;
    position: absolute;
    left:811px;
    top: 210px;
    height: 600px;
    width:200px;
    padding:0px;
}

#about {
    width:800px;
    clear:both;
    padding:5px;
}

#footer {
    clear:both;
    padding:5px;
}

table {
   width: 1000px;
   padding: 0px;
}

table, th, td {
    height: 20px;
    border: 1px solid black;
    border-collapse: collapse;
}

th {
    height: 20px;
    width: 90px;
    text-align: center;
    background-color: #f2f2f2;
}

tr {
//    height: 20px;
    text-align: center;
}

td {
    text-align: center;
    height: 25px;
    width: 90px;
}

span.status_text {
    display: inline;
    font-weight: bold;
}

span.status {
    display: inline;
    color:red;
}


/* 
0/white --> +5

High Maxes go to red (250,0,0)
High Mins go to orange (250,165,0)

Low Mins go to purple (128,0,128)
Low Maxes go to cyan (0,250,250)

Shades of background colors are:

Num records -- color
      0      none/white 
    1 -  4   lightest shading
    5 - 14
   15 - 29
   30 - 49
    50+      darkest shading

*/


td.himax1 {
    background-color:rgb(250,200,200);
    color:black;
}

td.himax2 {
    background-color:rgb(250,150,150);
    color:black;
}

td.himax3 {
    background-color:rgb(250,100,100);
    color:black;
}

td.himax4 {
    background-color:rgb(250,50,50);
    color:white;
}

td.himax5 {
    background-color:rgb(250,0,0);
    color:white;
}


td.lomax1 {
    background-color:rgb(200,250,250);
    color:black;
}

td.lomax2 {
    background-color:rgb(150,250,250);
    color:black;
}

td.lomax3 {
    background-color:rgb(100,250,250);
    color:black;
}

td.lomax4 {
    background-color:rgb(50,250,250);
    color:black;
}

td.lomax5 {
    background-color:rgb(0,250,250);
    color:black;
}


td.zero {
    background-color:white;
    color:black;
}

td.himin1 {
    background-color:rgb(250,233,200);
    color:black;
}

td.himin2 {
    background-color:rgb(250,216,150);
    color:black;
}

td.himin3 {
    background-color:rgb(250,199,100);
    color:black;
}

td.himin4 {
    background-color:rgb(250,182,50);
    color:black;
}

td.himin5 {
    background-color:rgb(250,165,0);
    color:black;
}


td.lomin1 {
    background-color:rgb(225,200,225);
    color:black;
}

td.lomin2 {
    background-color:rgb(201,165,201);
    color:black;
}

td.lomin3 {
    background-color:rgb(176,130,176);
    color:black;
}

td.lomin4 {
    background-color:rgb(152,95,152);
    color:black;
}

td.lomin5 {
    background-color:rgb(150,60,150);
    color:black;
}