﻿html, body { min-height:100%; min-width:100%; margin:0; padding:0; overflow:hidden; }
p {
    z-index:100;
    color:black;
    font-size:13px;
}
th, td {
    border-bottom:thin solid;
    border-bottom-color:silver;
    padding: 3px;
   margin-right:5px;
    
}

h2 {
    margin-top:10px;
    margin-left:120px;
    margin-right:100px;
    margin-bottom:200px;
    color:#3F3F3F;
    font:bold 11px arial;
    position:relative;
    width:140px;
   }
h3{
    margin-top:50px;
    margin-bottom:20px;
    color:white;
    font:bold 11px arial, arial;
    text-align:center;
}
h4{
    font:bold 11px arial, arial;
    color:#3F3F3F;
    margin:7px;
}
h5 {
    position:absolute;
    bottom:20px;
    left:20px;
    margin:20px;
    color:white;
    font:bold 10px arial, arial;
    text-align:center;
}
#container{
   overflow:hidden;
    z-index: 1;
    width:100%;
    height:100%;
    /*width:100%;*/
    /*border:red solid 2px;*/
    margin:0px;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */

}
#mapDiv{
    position:absolute;
    top:0px;
    left:0px;
    border:#000066 solid 10px;
    width:100%;
    padding:0px;
    z-index: 5;
    height:100%;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
  
}

#map {
    width:100%;
     height:100%;
     z-index:10;
}
#search {
         display: block;
         position: absolute;
         z-index: 20;
         top: 21px;
         left:55px;
         padding-left:7px;
         width: 325px;
         height:23px;
         color:darkblue;
         font:normal 11px arial;
         -webkit-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
         -moz-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
         box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
         border:1px solid white;
      }
.search::-ms-clear {
    display: none;
}
#searchAddBtn{
         display: block;
         position: absolute;
         height:25px;
         z-index: 20;
         top:170px;
         left: 61px;
         width:75px;
         font:bold 12px arial;
         color:#3F3F3F;
         }
#resetBtn{
         font:bold 12px arial;
         display: block;
         position: absolute;
         height:25px;
         z-index: 20;
         top:170px;
         left: 144px;
         width:75px;
         color:#3F3F3F;
         }

#legengDisclaimer {
    position:absolute;
    bottom:30px;
    left:20px;
    color:white;
    font:bold 12px arial;
}


.dijitSelect, .dijitSelect *, .dijitButtonNode, .dijitButtonNode * {
    cursor: pointer;
    font:12px arial;
}
.esriMeasurement .esriMeasurementTableContainer .esriMeasurementResultTable .esriMeasurementTableCell {
    text-align: center;
    width: 42%;
}
#searchImg{
    height:13px;
    width:13px;
    position:absolute;
    left:340px;
    z-index:20;
    top:26px;
    padding-right:5px;
    border-right:1px solid silver;

}
#closeImg{
    height:10px;
    width:10px;
    position:absolute;
    left:365px;
    z-index:20;
    top:28px;

}

#closestStnInfo {
   visibility:hidden;
    background-color:white;
    position: absolute;
    left:55px;
    max-height: 420px;
    margin-top: 25px;
    top: 30px;
    width: 305px;
    padding:10px;
    z-index:20;
    -webkit-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
    -moz-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
    box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
    }
#ZipStnInfo{
    visibility:hidden;
    background-color:white;
    /*display:none;*/
    position: absolute;
    left:55px;
    max-height: 420px;
    margin-top: 25px;
    top: 30px;
    width: 305px;
    z-index:20;
    padding:10px;
    overflow:auto;
    color:darkblue;
    font:normal 11px arial;
    -webkit-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
    -moz-box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);
    box-shadow: 3px 3px 5px 0px rgba(168,155,168,1);

}


#StnResDatagrid {
     display: inline-block;
     background-color:cornflowerblue;
     width:50%;
     height: 100%;
     box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
   -webkit-box-sizing:border-box; /* Safari */
}
#stnRes{
    position: absolute;
    bottom: 10px;
    right:10px;
    height:400px;
    width:385px;
    z-index:20;
    cursor:move;
    /*display:none;*/
    visibility:hidden;
    /*border: 10px solid transparent;*/
    border: 10px solid gray;
    /*opacity:.8;*/
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
    /*background: rgba(255,255,255, .5);*/ /* Old browsers */
    
   background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); 
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); 
    background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); 
    background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%);  
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );  
    font:bold 10px arial;

}
#StnInfoTbl{
   
    border-bottom:1px solid silver;
   

}
#InfoTbl{
    color:darkblue;
    font:normal 11px arial, arial;

}
#dataGrid{
    
    position: absolute;
    bottom: 0px;
    left:0px;
    height:150px;
    width:100%;
    border:1px solid silver;
    font:bold 11px arial, arial;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
   -webkit-box-sizing:border-box; /* Safari 
   font:bold 10px arial;*/
}

/*dgContainer{
    position: absolute;
    bottom: 0px;
    left:0px;

}*/



.dojoxGrid th{
    width:110px !Important;
    text-align: left;
      }
.dojoxGrid .dojoxGridCell {
    width:110px !Important;
    text-align: left;
    word-wrap: break-word;
    border-bottom:1px solid silver;
}
.dijitSelect, .dijitSelect *, .dijitButtonNode, .dijitButtonNode * {
    cursor: pointer;
    font-family: arial;
    font-size: 11px;
}

.dijitMenuItemLabel {
    vertical-align: middle;
    font:10px arial;
}
.dijitSliderBottomBumper, .dijitSliderLeftBumper {
    background-color: blue;
}
.dijitSliderProgressBar {
    background-color: blue;
    z-index: 1;
}
.dijitSliderButtonContainer * {
    color: blue;
    cursor: pointer;
}

#BasemapToggle{
    position: absolute;
      top: 20px;
      right: 20px;
      z-index: 50;
}
.ui-menu .ui-menu-item a {
    font-family:  Arial !Important;
    font-size: 11px !Important;
    color:gray !Important;
    display: block;
    font-weight: bold !Important;
    line-height: 1.25;
    min-height: 0;
    padding: 2px 0.4em;
    text-decoration: none;
}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: Arial !Important;
    font-size: 12px !Important;
    font-weight:bold;
    left: -7px;
    position: relative;
    width: 180px;
    /*color:gray !Important;*/
    margin-bottom:10px;
    height:20px;
    border:1px solid gray;
}
.ui-widget-content {
    background: #eeeeee url("images/ui-bg_highlight-soft_100_eeeeee_1x100.png") repeat-x scroll 50% top;
    border: 1px solid silver;
    color: darkblue;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 0px;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 0px;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 0px;
}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 0px;
}
.esriScalebarRulerBlock {
    background-color: darkgray;
    height: 50%;
    overflow: hidden;
    position: absolute;
}
.esriScalebarLabel {
    color: gray;
    font-size: 13px;
    font-weight: bolder;
    height: 5px;
    position: absolute;
    text-align: center;
    top: -1px;
    width: 10%;
    margin: 3px;
}
.esriScalebar{
    position:relative;
    bottom:50px;
    left:20px;
    padding-top: 10px;
    padding-bottom: 16px;
    padding-left:5px;
    padding-right:5px;
    background-color:lightyellow;
    width:13%;
    height:10px;
    border: solid 1px silver;

}


.dj_a11y div.dijitSliderImageHandle, .dijitSliderImageHandle {
    border: 8px solid gray;
    cursor: pointer;
    height: 0;
    margin: 0;
    padding: 0;
    position: relative !important;
    width: 0;
}
.dijitSliderBar {
    border-color: gray;
    border-style: solid;
    cursor: pointer;
    background-color:lightyellow;
    width:5px;
    height:auto;
}
.dijitRuleContainerV {
    height: 100%;
    line-height: 0;
    float: left;
    text-align: left;
    background-color: lightyellow;
    /*border:3px solid lightyellow;*/
}
.dijitSliderButtonContainer * {
    color: gray;
    cursor: pointer;
    /*background-color:lightyellow;*/
}


.esriScalebarRuler {
    background-color: White;
    border: 1px solid gray;
    height: 6px;
    overflow: hidden;
    position: relative;
    width: 100%;
}
/*
    Navigation style
    */
.esriSimpleSlider {
    -moz-user-select: none;
    background-color: #fff;
    border: 1px solid silver;
    border-radius: 0;
    color: #4c4c4c;
    position: absolute;
    text-align: center;
}
.esriSimpleSlider div {
    -moz-user-select: none;
    color: gray;
    cursor: pointer;
    font-family: arial,helvetica;
    font-size: 20px;
    height: 20px;
    line-height: 18px;
    width: 20px;
    background-color: white;
}
.esriSimpleSliderVertical .esriSimpleSliderIncrementButton {
    border-bottom: 1px solid silver;
    border-radius: 0px 0px 0 0;
}
.dijitReset {
    color: inherit;
    font-family: inherit;
    font-feature-settings: inherit;
    font-kerning: inherit;
    font-language-override: inherit;
    font-size: inherit;
    font-size-adjust: inherit;
    font-stretch: inherit;
    font-style: inherit;
    font-synthesis: inherit;
    font-variant: inherit;
    font-weight: inherit;
    line-height: normal;
    /*background-color:lightyellow;*/
}
.esriPopup .titlePane {
    color: #ffffff;
    cursor: default;
    line-height: 20px;
    background-color:#00005e;
    font: bold 10px verdana;
    PADDING:5px;
    border-radius:0px;

}
.esriPopup .contentPane {
    background-color: #d6d6e7;
    color: #000066;
    font: normal 10px verdana;
    max-height: 300px;
    overflow: auto;
    padding: 10px 6px 6px 10px;
    position: relative;
    width:auto;
}
.esriPopup .titleButton.maximize {
        display: none;
   }
.esriPopup .pointer.top {
    background-color: #000066;
    display: block;
    left: 50%;
    margin-left: -8px;
    top: -8px;
}
.esriPopup .actionsPane {
    background-color: #d6d6e7;
    border-radius: 0;
    padding: 2px 10px 4px;
    position: relative;
}
.esriPopup .outerPointer.left {
    background-color: #d6d6e7;
    display: block;
    left: 8px;
    margin-top: -8px;
    top: 50%;
}



