.ReportIcon {
    left: 8px;
    top: 25px;
    position: absolute;
    z-index: 2;
}
ul ul, ul ol, ol ol, ol ul {
    margin-bottom: 0;
}
.ToolTipReport {
    left: 20px;
}
#leftFilter #StationsMonitorsList .k-checkbox-wrapper {
    float:left;
    width: 18px;
}
#tabularContainer h2 {
    font-size: initial;
    font-weight: initial
}
#tabularContainer #TabularPageTitle
{
    float:left;
    margin:10px;
}
.map .container .container g {
    cursor:pointer;
}
.k-icon.k-i-expand, .k-icon.k-i-collapse {
    float: left;
}


#CoverPathLinkWithUserName {
    /*width:100%;*/
    height: 30px;
    margin: 0 15px;
}
.ReportContent .icon-bar,.ReportIcon .icon-bar
{
	background-color:#000 !important;
}
    #CoverPathLinkWithUserName #pathLinks {
        float:left;
    }
    #CoverPathLinkWithUserName #UserName {
        float:right;
        margin-right:5px;
    }
    #CoverPathLinkWithUserName img.imageseperetor {
    height: 19px;
    margin: 0px 8px;
}
h2.ng-binding {
    padding-left: 47px;
}

.ReportH2 {
   padding-left: 50px;
   padding-right:160px;

}

.leftFilter {
    position: absolute;
    left: 0;
    height: auto;
    max-width: 320px;
    width: 100%;
    display: none;
    background: rgba(33, 110, 184, 1);
    z-index: 2;
    top: 56px;
}

.RightFilter {
    position: relative;
    right: 0;
    width: 100% !important;
    z-index: 1;
}

.k-content #chart {
    direction: ltr;
}

.CostumGraphBox {
    position: absolute;
    z-index: 2147483647;
    cursor: pointer;
    top: -49px !important;
    left: inherit;
    right: 7px;
    display: block;
}

.h1TextTitle {
    font-size: 16px;
    margin-right: 10px;
    margin-left: 10px;
}

ul.slimmenu {
    width: 100%;
}

.MinusDays {
    cursor: pointer;
}

.k-window-action .k-icon {
    margin: 2px !important;
}

.k-i-close {
    background-position: -47px -26px !important;
    background-size: 465px 478px !important;
}

.k-window-titlebar .k-window-action {
    display: inline-block;
    width: 26px !important;
    height: 26px !important;
    padding: 2px;
    text-decoration: none;
    vertical-align: middle;
    opacity: .7;
}

.TabulasTable .k-grid-content, .TabulasTable .k-grid-header {
    overflow-y: visible;
    padding-right: 0px !important;
}

    .TabulasTable .k-grid-header.HeaderWithPadding {
        padding-left: 17px;
        padding-right: 17px !important;
    }

span.k-icon.k-i-arrow-60-right {
    background-position-y: -17px;
}

.k-pager-numbers li {
    list-style: none;
    margin: 0px;
}

span.k-icon.k-i-arrow-60-left {
    background-position-y: -49px;
}

span.k-button.k-button-icon.k-bare.k-tabstrip-next {
    top: 0;
}

.kmlMonitors {
    border-radius: 24px;
}

.kmlListMonitors {
    position: absolute !important;
    height: 100%;
    width: 144px;
    top: 105px;
    padding: 10px;
    box-sizing:unset;
}

    .kmlListMonitors .ListOfMonitors {
        display: inline-table;
        height: 100%;
        width: 100%;
        box-sizing: unset;
    }

        .kmlListMonitors .ListOfMonitors .coverMonitors {
            height: 100%;
        }

    .kmlListMonitors #ListMeterology {
        height: 100%;
    }

        .kmlListMonitors #ListMeterology input {
            width: 80%;
            border-radius: 20px;
        }

    .kmlListMonitors .ListOfMonitors .coverMonitors ul li, .kmlListMonitors .ListOfMonitors .coverMonitors .theList input {
        margin: 5px 0px 0px 0px !important;
        list-style: none !important;
        border-radius: 6px;
        font-size: 14px;
        padding: 10px 0;
        width: 100%;
        box-sizing: unset;
    }

    #ListMeterology li{
        width: auto;
    }

.playslider, .forwardRewind {
    width: 50px;
    float: left;
}

#rightSlider {
    float: right;
}

#leftSlider {
    float: left;
}
/*.gmnoprint img,.gmnoprint{
        width:20px !important;
        height:20px !important;
    }*/
.esriLargeSliderBL {
    bottom: 40px;
}

.inputsfilter {
    border: 1px solid #cccccc;
    padding: 2px;
    height: 286px;
    border-radius: 4px;
    overflow: auto;
}

.labelOwner {
    margin-top: -41px !important;
    width: 20px;
    text-align: center;
    margin-left: -10px !important;
}

#googlemapWithForcast .labels {
    width: 20px;
}

    #googlemapWithForcast .labels.forcast {
        margin-top: -7px !important;
        margin-left: -10px !important;
    }

#googlemapWithForcast #HmapDIv {
    margin-bottom: 10px;
    height: 480px;
    width: 100%;
    /*background: blue;*/
    font-family: areal;
    font-size: 20px;
    /*color: blue;*/
    font-weight: bold;
}

#googlemapWithForcast #HmapDIvCover {
    position: relative;
    overflow: hidden;
    float: left;
    margin-left: 78px;
    max-width: 100%;
    width: 721px;
    /* max-width: 708px; */
    /* height: 600px; */
}

#googlemapWithForcast .ForcastButtons {
    float: left;
    padding: 11px;
    background: #0088cc;
    margin: 1px;
    font-size: 14px;
    font-weight: bold;
    color: white;
    cursor: pointer;
    border-radius: 8px 8px 0px 0px;
}

    #googlemapWithForcast .ForcastButtons.Forcast {
        background: #888787;
    }

    #googlemapWithForcast .ForcastButtons:hover, .ForcastButtons.selected {
        background: #394e5f !important;
    }

    #googlemapWithForcast .ForcastButtons.Poluttant, .ForcastButtons.Historic {
        padding: 11px 41px;
    }

#googlemapWithForcast #SelectDateInpoluttant {
    position: relative;
}

    #googlemapWithForcast #SelectDateInpoluttant label {
        float: left;
        margin: 6px 8px 0px 4px;
    }

    #googlemapWithForcast #SelectDateInpoluttant input {
        width: 100px;
    }

#googlemapWithForcast .dropdown-menu {
    margin: 0px !important;
}

#googlemapWithForcast #IndexDiv {
    top: 84px;
}

#googlemapWithForcast #TodayDIv {
    display: none !important;
}

#googlemapWithForcast #IndexDiv {
    position: relative;
    top: 0;
    /* right: 0px; */
    /* margin-left: 10px; */
    /* margin-bottom: 10px; */
    width: 100%;
    min-width: 168px;
}

#googlemapWithForcast #spandiv {
    display: none;
}
/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
.IndexDivIconCover {
    border: 0px solid white;
    margin-bottom: 8px;
    width: 18%;
    float: left;
}

#content.haveMenu {
    float: right !important;
}

.ColorTabular {
    width: 100%;
    /* height: 52px; */
    position: relative;
    display: table;
    text-align: center;
}

.bxslider {
    margin: 0px;
}

.labels.real {
}

.Target {
    margin-right: 10px;
    display: inline-block;
}

    .Target input {
        margin: -1px 0px 0px !important;
    }

#ListTargetTitle {
    color: blue;
}

#borderMapDiv {
    float: right;
    position: absolute;
    right: 12px;
    bottom: 23px;
    padding: 10px;
    background: #fff;
    border-radius: 38px;
    border: 1px solid black;
    font-size: 16px;
}

    #borderMapDiv #borderMap {
        margin: 0px;
    }

.SiteInform {
    float: left;
    width: 40%;
}

.SiteInformTableDiv {
    float: right;
    width: 58%;
}

.SiteInformCover {
    padding: 5px;
    clear: both;
    height: 30px;
}

.SiteInform table {
    min-width: 300px;
}

.SiteInformCover:nth-of-type(2n+1) {
    background: rgba(149, 197, 231,0.3) none repeat scroll 0 0 !important;
}

.SiteInformTitle {
    font-weight: bold;
}

.SiteInform > table {
    float: left;
}

#AvaregeTime, #LastUpdate, #indexTypeText {
    margin: 5px;
}

.SiteInform h3 {
    /*border-bottom: 1px solid rgb(149, 197, 231);*/
    margin-top: 0;
    padding: 0 5px;
}

.RadioClass {
    float: left;
}

    .RadioClass input {
        float: left;
    }

    .RadioClass label {
        float: left;
        margin-left: 1px;
        margin-right: 17px;
    }

.dropdown-menu {
    margin: 30px 0 !important;
}

#Bands {
    float: left;
    text-align: center;
}

    #Bands table {
        text-align: center;
    }

.ExceedanceQues {
    font-weight: bold;
}

.ExceedanceAns span {
    margin-left: 28px;
}

.labels {
    text-align: center;
    float: left !important;
    margin-left: -17px !important;
}

.IndexValNum {
    height: 22px;
    font-size: 13px;
    line-height: 1;
    font-weight: normal;
    display: table-cell;
    vertical-align: middle;
    padding-right: 5px;
    direction: ltr;
}

.jump-list li {
    padding: 1%;
}

.YourOpinionDivarea #OpinionDiv {
    width: 309px !important;
    float: left;
}

#navheader {
    width: auto;
    /*max-width: 60%;*/
    margin: 0 auto !important;
    float: none !important;
}

.LogOffDiv a {
    text-decoration: none;
    box-shadow: 0px 0px 2px black;
    padding: 2px;
    background: #c5c5c5;
}

.LogOffDiv {
    text-align: center;
}

.FloatDiv, .searchArea, .LogInArea, .YourOpinionArea, .LangArea {
    background: rgb(245, 245, 245) none repeat scroll 0 0;
    border: 1px solid rgb(204, 204, 204);
    /*box-shadow: 0 0 4px rgb(0, 0, 0);*/
    height: 52px;
    position: relative;
    width: 52px;
    z-index: 3;
    /*left:-175px;*/
    margin-top: 2px;
    overflow: hidden;
}

.LogInDivarea, .LangDivarea {
    width: 173px;
    margin-top: 5px;
}

    .LangDivarea .LangFlag li {
        margin: 0 5px;
    }

        .LangDivarea .LangFlag li img {
            width: 20px !important;
            height: 20px !important;
        }

    .LangDivarea .EnvelopeDiv {
        max-width: 100% !important;
        margin: 0px !important;
        height: 25px !important;
    }

.LogInArea, .LangArea {
    height: 52px;
    left: 0px;
    overflow: hidden;
    width: 52px;
}

.YourOpinionArea {
    /*width: 341px;*/
    /*left:-316px;*/
}

.LogInImage {
    text-align: center;
    line-height: 52px;
}

    .LogInImage img {
        max-height: 33px;
    }

.LogInInput {
    margin-left: 5px;
    display: inline-block;
    position: relative;
}

    .LogInInput input {
        width: 145px !important;
        height: 13px !important;
    }

        .LogInInput input[type="button"] {
            height: 27px !important;
            margin-top: -11px;
            padding: 0;
            width: 47px !important;
        }

.searchImage {
    float: right;
    height: 52px;
    padding-top: 2px;
    position: relative;
    width: 52px;
    z-index: 1;
    text-align: center;
    line-height: 52px;
}

    .searchImage img, .LogInImage img {
        max-width: 60%;
        ;
        /*width: 21px;*/
    }

.serchInput {
    float: left;
    height: 25px;
    margin-left: 7px;
    position: relative;
    width: 162px;
    z-index: 2;
}

    .serchInput input, .serchInput span {
        height: 21px;
        margin: 0;
        padding: 0;
        width: 156px;
    }

.serchDivarea, .LogInArea, .LangArea {
}

.serchDivarea {
    float: left;
}

.FloatDivButton, .serchButton, .LogInButton, .YourOpinionButton, .LangButton {
    background: rgb(0, 136, 204) none repeat scroll 0 0;
    float: right;
    height: 52px;
    width: 52px;
    cursor: pointer;
}

#searchVal {
    height: 13px;
    width: 100%;
}

.footerDiv {
    width: 80%;
    margin: 0 auto;
    line-height: normal !important;
}

.languageMenu {
    float: right;
    max-width: 8%;
    right: 0;
    top: 0;
    position: absolute;
    font-size: 12px;
    color: white;
    overflow: hidden;
    max-height: 39px;
    vertical-align: middle;
    padding-right: 1%;
    /* display: inherit; */
}

    .languageMenu a {
        color: white;
        text-decoration: none;
        cursor: pointer;
    }

        .languageMenu a:hover {
            color: black;
            text-decoration: none;
        }

        .languageMenu a:checked {
            color: black;
            text-decoration: none;
        }

.LinkName {
    float: left;
}

.IndexDivIcon {
    border-radius: 6px;
    float: left;
    height: 32px;
    width: 23%;
}

.IndexDivText {
    display: table;
    float: left;
    height: 32px;
    margin-left: 10px;
    vertical-align: middle;
}

#IndexDiv {
    position: absolute;
    top: 10%;
    right: 1px;
    margin-left: 10px;
    margin-bottom: 10px;
    width: 25%;
    min-width: 168px;
}

#aqiDIv #spandiv {
    background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
    left: -18px;
    padding: 10px 1px;
    position: absolute;
    top: 10px;
}

    #aqiDIv #spandiv span {
        cursor: pointer;
        border-color: rgba(97, 93, 93,0) rgba(97, 93, 93, 0) rgba(97, 93, 93, 0) rgba(97, 93, 93,1);
        border-style: solid;
        border-width: 7px 8px 5px;
        display: block;
        height: 1px;
        z-index: 2;
    }

#leftFilter #spandiv {
    background: transparent;
    width: 10px;
    /* left: 1px; */
    /* padding: 10px 1px; */
    position: relative;
    top: -7px;
    /* float: right; */
    right: -5px;
    height: 30px;
    float: right;
}

    #leftFilter #spandiv span {
        cursor: pointer;
        border-color: rgba(97, 93, 93,0) rgba(97, 93, 93, 0) rgba(97, 93, 93, 0) rgba(97, 93, 93,1);
        border-style: solid;
        border-width: 7px 8px 5px;
        display: block;
        height: 1px;
        z-index: 2;
    }

#aqiTodayDIv div {
    float: left;
}

.LinkPage {
    /*background: rgb(71, 202, 177) none repeat scroll 0 0;
        padding: 8px 11px;*/
    font-size: 14px;
    color: #fff;
    float: right;
}

    .LinkPage img {
        width: 63px;
    }

.TitleCoverHome {
    background: rgb(71, 202, 177) none repeat scroll 0 0;
    color: rgb(255, 255, 255);
    /*float: left;*/
    padding: 11px;
    position: relative;
}

#AdvisoryDivTitle {
    background: rgb(71, 202, 177) none repeat scroll 0 0;
    color: rgb(255, 255, 255);
    float: left;
    min-width: 76px;
    padding: 11px;
    width: 6%;
    position: relative;
}

    #AdvisoryDivTitle span {
        /* cursor: pointer; */
        border-color: rgba(71, 202, 177,0) rgba(71, 202, 177, 0) rgba(71, 202, 177, 0) rgba(71, 202, 177,1);
        border-style: solid;
        border-width: 8px 8px 8px;
        display: block;
        height: 2px;
        z-index: 2;
        float: right;
        position: absolute;
        top: 12px;
        right: -15px;
    }

#AvisoryDivText {
    float: right;
    width: 90%;
    height: 30px;
    padding-top: 10px;
}

.Message {
    margin: 0 auto 2px;
    padding: 10px;
    background: rgb(245, 245, 245);
    text-align: center;
    width: 100%;
}

#SearchCoverDivInTitle {
    width: 16%;
    float: left;
}

.LeftLogIn {
    float: left;
    width: 40%;
}

.rightLogIn {
    float: right;
    width: 24%;
}

#FullScrean {
    position: relative;
    bottom: 65px;
    color: white;
    background: rgba(0,0,0,0.8);
    float: right;
    right: 10px;
    padding: 6px;
    border-radius: 5px;
    cursor: pointer;
}

.RightLogInTitle {
    border-bottom: 1px solid rgb(0, 0, 0);
    /*color: rgb(73, 129, 125) !important;*/
    font-size: 22px;
    font-weight: bold;
    padding: 0 10px 7px;
}

.RightLogInBody {
    padding: 10px;
}

.rightInMenu {
    float: right !important;
}

.LogInlable {
    float: left;
    width: 20%;
    min-width: 110px;
}

.LogInfield {
    float: left;
    width: 42%;
    min-width: 190px;
}

    .LogInfield input {
        min-width: 176px;
        border-radius: 0 !important;
        width: 93%;
        margin-top: 9px !important;
    }

.LogInfieldSubmit {
    float: left;
    width: 100%;
    min-width: 190px;
    /*margin-left:22% !important;*/
}

    .LogInfieldSubmit input {
        width: 100% !important;
    }

.MessageTitle {
    padding: 0px 12px 10px;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    display: block;
}

.MessageNameDate {
    float: left;
    width: 15%;
}

.MessageTitleBody {
    float: right;
    width: 85%;
}

.MessageDate {
    font-size: 12px;
}

.MessageName {
    font-weight: bold;
}

.histogramchart {
    background: url("../img/histogramicon(white).png");
    width: 41px;
    height: 31px;
    float: left;
}

    .histogramchart:hover, .histogramchart.selected {
        background: url("../img/histogramicon.png");
    }

.diagramchart {
    background: url("../img/diagramicon.png");
    width: 41px;
    height: 31px;
    float: left;
}

    .diagramchart:hover, .diagramchart.selected {
        background: url("../img/diagramicon.png");
    }

.tablechart {
    background: url("../img/Text.png");
    width: 41px;
    height: 31px;
    float: left;
}

    .tablechart:hover, .tablechart.selected {
        background: url("../img/Text.png");
    }

.Excel {
    background: url("../img/excel.png");
    width: 31px;
    height: 31px;
    float: left;
}
.ExcelIcon
{
     background: url("../img/excel.png");
    width: 31px;
    height: 31px;
    float: left;
    cursor: pointer;
    background-size:31px;
    border-radius: 3px;

}
.ExcelIcon:hover
{
    box-shadow: 0px 0px 5px black;
}
    .Excel:hover, .Excel.selected {
        background: url("../img/excel Icon.png");
    }

.imagechart {

    background: url("../img/Export as image.png");

    width: 41px;
    height: 31px;
    float: left;
}

    .imagechart:hover, .imagechart.selected {
        background: url("../img/Export as image.png");
    }

.PDF {
    background: url("../img/pdf31.png");
    width: 31px;
    height: 31px;
    float: left;
}

    .PDF:hover, .PDF.selected {
        background: url("../img/pdf_white31.png");
    }

.CreateFiles {
    /*height: 26px;*/
    width: 400px;
    position: relative;
    margin: 12px auto;
    z-index: 4;
    background: rgba(255,255,255,0.7);
    font-weight: bold;
    padding-top: 4px;
    text-align: center;
}

.separatorDate {
    float: left;
    font-size: 29px;
    padding: 23px;
}

.EnvelopeDiv {
    /*max-width:80%;*/
    margin: 0 auto;
    position: relative;
    width: 100%;
    display: table;
}

.HomeRightDiv {
    margin-bottom: 25px !important;
}

#StationsLeft {
    width: 65%;
    float: left;
    /*border-right:2px solid #585858;*/
    margin: 2% 0%;
    padding-right: 2%;
    border-radius: 3px 1px 3px 2px;
}

#TitleStationsLeft {
    color: rgb(62,62,62);
    font-weight: bold;
    border-bottom: 4px solid rgb(88,88,88);
    border-radius: 3px 1px 3px 2px;
}

#StationsRight {
    float: right;
    width: 27%;
    margin: 2% 0%;
}

#TitleStationsRight {
    text-align: center;
    font-size: 20px;
    margin-bottom: 20px;
}

    #TitleStationsRight h1 {
        text-align: left;
    }

#informationTableAndImage {
    float: left;
    width: 50%;
}

.informationTable {
    width: 100%;
    border: 1px solid black;
}

    .informationTable .InformationTableHeader {
        background: rgb(31,70,124);
        color: white;
        text-align: center;
    }

#imageTableAndImage {
    float: right;
    width: 48%;
}

    #imageTableAndImage img {
        height: 283px;
    }

#LatestData {
    margin-top: 20px;
}

body {
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969;
    width: 1024px;
    margin: 0 auto !important;
    max-width: 100%;
    min-width: 300px;
    background: #fff;
}

a:link {
    color: #034af3;
    text-decoration: underline;
}

a:visited {
    color: #505abc;
}

a:hover {
    color: #1d60ff;
    text-decoration: none;
}

a:active {
    color: #12eb87;
}

p, ul {
    margin-bottom: 20px;
    line-height: 1.6em;
}
/*#footer
{
    display: none;
	
}*/

header,
footer,
nav,
section {
    display: block;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 1.5em;
    color: #000;
}

h1 {
    font-size: 2em;
    padding-bottom: 0;
    margin-bottom: 0;
}

h2 {
    padding: 0 0 10px 0;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
/*.ng-scope .checkbox 
{
    margin-left:30px;
}*/
header, #header {
    background: none repeat scroll 0 0 rgb(41, 60, 103);
    color: rgb(0, 0, 0);
    height: 106px;
    margin-bottom: 0;
    padding: 0;
    position: relative;
}

    #header a {
        font-weight: bold;
        padding: 5px 0;
        margin: 0;
        color: #fff;
        border: none;
        line-height: 2em;
        font-size: 24px;
        text-shadow: 1px 1px 2px #111;
        text-decoration: none;
    }

#main {
    padding: 4px 0 0 0;
    background-color: #fff;
    border-radius: 4px 0 0 0;
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
    /*min-height: 600px;*/
    position: relative;
    margin: 0 auto;
}

    #main h2 {
        /*padding: 10px;*/
        margin-bottom: 0px;
    }

/*#main #content {
        padding: 10px;
        display: inline-table;
    }*/

footer,
#footer {
    background-color: #fff;
    /*color: #999;*/
    /*padding: 10px 0;*/
    /*text-align: center;*/
    line-height: normal;
    /*margin: 0 0 30px 0;*/
    font-size: .9em;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
}

/* TAB MENU   
----------------------------------------------------------*/
ul#menu {
    /*width: 100%;*/
    float: left;
    height: 40px;
    /*background: rgb(240, 240, 240);*/
    margin: 0px;
    padding: 0px;
    position: relative;
    display: inline-table;
}

    ul#menu:after {
        content: "";
        clear: both;
        display: block;
    }


    ul#menu li {
        display: inline-table;
        text-align: center;
        float: left;
    }

        ul#menu li#greeting {
            padding: 10px 20px;
            font-weight: bold;
            text-decoration: none;
            line-height: 2.8em;
            color: #fff;
        }

.nameMenu {
    cursor: default;
}

ul#menu li a, .nameMenu {
    /*box-shadow: 2px 0 0 rgb(90, 127, 156);*/
    /*color: rgb(41, 60, 103);
    display: list-item;
    /*font-size: 16px;
    line-height: 40px;
    margin-bottom: 2px;
    margin-top: 2px;
    text-decoration: none;
    text-shadow: none;
    vertical-align: middle;*/
    padding: 0 17px 0 17px;
}

ul#menu li.HaveChild a, ul#menu li.HaveChild div, .nameMenu {
    padding: 0 33px 0 17px;
}

ul#menu li:last-child a {
    box-shadow: none;
    /*padding: 0 !important;*/
    margin: 0 !important;
}

.ListSelected {
    background: none repeat scroll 0 0 rgb(238, 238, 238) !important;
    box-shadow: 0 0 1px rgb(0, 0, 0);
    color: rgb(0, 0, 0);
}

ul#menu li a:hover, .nameMenu:hover {
    border-radius: 0px;
    background-color: #0088cc;
    color: #ffffff;
    box-shadow: 0px 0px 2px black;
}

ul#menu li a:active {
    background-color: #a6e2a6;
    text-decoration: none;
}

ul#menu li.selected a, ul#menu li.selected .nameMenu {
    background-color: #0088cc;
    color: #ffffff;
    box-shadow: 0px 0px 2px black;
}



ul#menu ul {
    position: absolute;
    top: 100%;
    display: none;
    z-index: 99999999999999;
    background: #F5F5F5;
    padding:0;
}

    ul#menu ul li {
        float: none;
        border-top: 1px solid #6b727c;
        border-bottom: 1px solid #575f6a;
        position: relative;
        display: table-row;
    }

ul ul li a {
    border-bottom: 1px solid #5a7f9c;
    box-shadow: none !important;
}



ul#menu ul li:last-child a {
    border-bottom: 0px solid rgb(0, 0, 0);
}

ul#menu ul li a:hover {
    background: #0088CC;
}

ul#menu ul ul {
    position: absolute;
    left: 100%;
    top: 0;
}

ul#menu li:hover > ul {
    display: block;
}
/*.HaveChild::after{
    content: "";
    position: relative;
    left: -7px;
    bottom: 27px;
    display: block;
    float: right;
    width: 1px;
    height: 2px;
    border-style: solid;
    border-width: 7px 6px 1px;
    border-color: #F7F2F2 transparent transparent;

}*/
/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/
#ListPollutant, #ListMeterology, #List2Index {
    display: block;
}

fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

textarea {
    min-height: 75px;
}

/*input[type="text"], 
input[type="password"] {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
    width: 200px;
}*/

select {
    border: 1px solid #ccc;
    padding: 2px;
    /*font-size: 1.2em;*/
    color: #444;
}

input[type="submit"] {
    font-size: 1.2em;
    padding: 5px;
}

/* TABLE
----------------------------------------------------------*/

table {
    border: solid 1px #e8eef4;
    border-collapse: collapse;
    margin: 0 auto;
}

    table td {
        padding: 5px;
        border: solid 1px #e8eef4;
    }

    table th {
        padding: 6px 5px;
        text-align: center;
        background-color: #e8eef4;
        border: solid 1px #e8eef4;
    }

/* MISC  
----------------------------------------------------------*/
.clear {
    clear: both;
}

.error {
    color: Red;
}

nav,
#menucontainer {
}

div#title {
    display: block;
    float: left;
    height: 37px;
    padding: 13px 15px 0;
    text-align: left;
}

    div#title a {
        font-size: 30px;
    }

#logindisplay {
    font-size: 1.1em;
    display: block;
    text-align: right;
    margin: 10px;
    color: White;
}

    #logindisplay a:link {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:visited {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:hover {
        color: white;
        text-decoration: none;
    }

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000 !important;
    background-color: #ffeeee !important;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label,
.editor-label {
    margin: 1em 0 0 0;
}

.display-field,
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

    .text-box.multi-line {
        height: 6.5em;
    }

.tri-state {
    width: 6em;
}

#report-controller ul {
    display: block;
    padding: 0;
    position: relative;
}

.LinkTitle {
    color: blue;
}

#buttons {
    height: 42px;
    margin-top: 8px;
    color: White;
    font-weight: bold;
    font-size: 18px;
}

#pollutant {
}

#ListIndex {
    margin-right: 0px;
    margin-left: 0px;
}

#mapDiv {
    width: 1024px;
    /*height: 620px;*/
    margin: 0 auto;
    box-shadow: 0px 1px 6px black;
    position: relative;
}

#pollutantList {
    display: none;
}

    #pollutantList .RightLeftButtons .LeftArrow, #pollutantList .RightLeftButtons .RightArrow {
        display: none;
    }

#Metrology {
    border-left: 0 solid rgb(255, 255, 255);
    margin-left: 0;
}

/*.listSelect, .listSelect1 {
    background: none repeat scroll 0 0 rgb(41, 60, 103);
    cursor: pointer;
    float: left;
    height: 31px;
    margin: 0px 6px 2px;
    padding: 9px 0 1px;
    text-align: center;
    width: 24%;
}

    .listSelect:hover, .listSelect1:hover {
        background: none repeat scroll 0 0 rgba(41, 60, 103, 0.6);
    }*/

#MetrologyList {
    display: none;
}

    #MetrologyList .RightLeftButtons .LeftArrow, #MetrologyList .RightLeftButtons .RightArrow {
        display: none;
    }

#index {
}

#ListMonitors {
    position: relative;
    z-index: 10;
    margin: 0 auto;
    text-align: center;
    display: block;
    margin-bottom: 6px;
    height: 41px;
}

#ListPollutant, #ListMeterology, #List2Index {
    height: 40px;
    margin: 0 auto;
    /*overflow-y: hidden;*/
    position: relative;
    /*width: 802px;*/
    z-index: 7;
    overflow-y: auto;
}

    #ListPollutant input, #ListMeterology input {
        margin: 3px 2px;
    }

.LeftArrow {
    float: left;
    width: 38px;
    cursor: pointer;
}

.RightArrow {
    float: Right;
    width: 38px;
    cursor: pointer;
}

.LeftArrowHome {
    float: left;
    cursor: pointer;
    transform: rotate(0deg);
    position: relative;
    margin-right: 5px;
    background: url("/img/Arrow_Right2 white.png") repeat scroll 0px 0px / 22px auto transparent;
    width: 22px;
    height: 22px;
    margin-top: 3px;
}

.RightArrowHome {
    float: Right;
    cursor: pointer;
    transform: rotate(180deg);
    position: relative;
    margin-right: 5px;
    background: url('/img/Arrow_Right2 white.png') repeat scroll 0px 0px / 22px auto transparent;
    width: 22px;
    height: 22px;
    margin-top: 3px;
}

.RightLeftButtons {
    /*display: inline;*/
    /*height: 30px;*/
    /*margin: 15px auto 0;*/
    position: absolute;
    width: 385px;
    z-index: 6;
    left: 0px;
    top: 0px;
}

#SearchDiv {
    margin: 0 auto;
    width: 83%;
}

#closeImage {
    height: 33px;
    overflow: hidden;
    position: absolute;
    right: -38px;
    top: -22px;
    z-index: 2147483647;
    cursor: pointer;
}

#boxList {
    position: absolute;
    z-index: 100000000000000000000000;
    width: 50%;
    margin: 0 auto;
    left: 22%;
    box-shadow: 0px 0px 19px black;
    background: white;
    text-align: center;
    max-height: 600px;
    display: none;
    height: auto;
}

#boxList1 {
    height: 800px;
    position: absolute;
    z-index: 2147483647;
    width: 93%;
    display: none;
}

.monitors, .ListIndex {
    font-weight: bold;
    /*height: 40px;*/
    min-width: 96px !important;
}

.IndexClicked {
    background: none repeat scroll 0 0 rgb(127, 138, 164);
    border-radius: 6px;
}

.dijitTooltipContainer {
    border: solid #293C67 2px !important;
    background: rgb(240, 240, 240) !important;
    color: black;
    font-size: small;
}

.graphH3 {
    float: left;
    font-size: 19px;
    height: 21px;
    line-height: 1;
    margin-bottom: 6px;
    margin-top: 0;
    position: relative;
    width: 185px;
    z-index: 2147483647;
}

.backHis {
    float: right;
    height: 28px;
    position: relative;
    width: 73px;
    z-index: 2147483647;
}

.ReportLi {
}

body {
    color: #333;
    background-color: #fff;
    font-family: Arial, sans-serif;
    font-size: 100%;
    margin: 0;
    padding: 0;
}

.LinksImg {
    float: left;
    max-height: 21px;
}

#masthead {
    background-color: #394e5f;
    text-align: left;
    margin: 0;
    padding: 0;
    border-bottom: 3px solid #5a7f9c;
    background-image: none;
    position: relative;
}

.TopTitleSideLeft {
    max-width: 20%;
    overflow: hidden;
    float: left;
    min-width: 278px;
    height: 37px;
}

.IconLinkLeft {
    width: 12%;
    height: 37px;
    display: block;
    float: left;
}

#masthead #LogoTopTitle {
    float: left;
    /*height: 37px;*/
    padding: 4px 5px 4px 1%;
    max-width: 8%;
    min-width: 37px;
}

#masthead #LogoTopRightTitle {
    float: right;
    /*height: 27px;*/
    padding: 4px 1% 4px 5px;
    max-width: 8%;
}


#agency {
    color: #fff;
    font-weight: bold;
    font-size: 108%;
    font-family: Arial, sans-serif;
    text-align: center;
    letter-spacing: 0.1em;
    margin: 0 2em;
    padding: 0.6em 0 0.2em;
}

#appheader {
    background-color: #f0f0f0;
    color: #000;
    font-weight: bold;
    font-size: 100%;
    font-family: Arial,sans-serif;
    text-align: center;
    letter-spacing: 0.1em;
    margin: 0;
    padding: 0.2em;
    color: rgb(0, 0, 0);
    height: 30px;
}

#LogoSystemNameLeftDiv {
    float: left;
    width: 20%;
}

#LogoSystemNameLeft {
    float: left;
    max-height: 27px;
    padding: 1px 3px;
}

#LogoSystemNameRight {
    float: right;
    max-height: 27px;
    padding: 1px 3px;
}

#LogoSystemNameRightDiv {
    width: 20%;
    float: right;
}

#appheader #title {
    display: block;
    float: left;
    height: 21px;
    padding: 6px 0 0;
    text-align: left;
    width: 60%;
    text-align: center;
    vertical-align: middle;
    padding-top: 19px;
}



    #appheader #title a {
        font-size: 20px;
        text-decoration: none;
        letter-spacing: 0;
        color: black;
    }

#navheader {
    font-size: 85%;
    text-align: right;
    margin: 0;
    padding: 4px 4px 3px 3px;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    background: none;
    float: left;
    /*height: 37px;*/
}

#footer {
    color: #a9a9a9;
    background: url(http://dnr.wi.gov/images/DNRc2icon.gif) no-repeat 4px 4px;
    margin: 0px;
    margin-top: 20px;
    padding: 4px;
    border-top: 1px solid #394e5f;
    /*height: 68px;*/
    color: Black;
}

    #footer p {
        font-family: Arial, sans-serif;
        font-size: x-small;
        margin: 30px 100px 0;
        padding: 0;
    }

    #footer address {
        font-family: Arial, sans-serif;
        font-size: x-small;
        font-style: normal;
        margin: 0 100px;
        padding: 0;
    }

#Advisory {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    /*border-color: rgb(204, 204, 204) rgb(51, 51, 51) rgb(51, 51, 51) rgb(204, 204, 204);
    border-image: none;
    border-style: solid;
    border-width: 1px;*/
    /*height: 34px;*/
    padding: 4px 5px 0;
    /*width: 1012px;*/
}

#AdvisoryTitle {
    float: left;
    font-size: 16px;
    max-width: 202px;
    padding: 3px 2px;
    width: 19%;
}

#AvisoryText {
    float: left;
    height: 36px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    /*max-width: 785px;*/
    width: 72%;
}

.TypeValue {
    float: left;
    height: 13px !important;
    margin-right: 4px !important;
    width: 13px !important;
}

.scroll-text {
    height: 18px;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
    top: 8px;
}

    .scroll-text ul {
        float: right;
    }

        .scroll-text ul li {
            float: right;
            margin: 0;
            padding-left: 15px;
        }

.Message {
    float: left;
    margin-right: 20px;
}

#AdvisoryBottons {
    float: right;
    margin-right: 3px;
    margin-top: 4px;
}

#nt-example1-prev {
    background: url("../Content/themes/base/images/right.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: right;
    height: 18px;
    visibility: visible;
    width: 20px;
    margin-left: 10px;
    background-size: 20px 18px;
    cursor: pointer;
}

#nt-example1-next {
    background: url("../Content/themes/base/images/left.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: left;
    height: 18px;
    visibility: visible;
    width: 20px;
    margin-right: 10px;
    background-size: 20px 18px;
    cursor: pointer;
}

#nt-example1-stop {
    background: url("../Content/themes/base/images/puse.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: right;
    height: 18px;
    visibility: visible;
    width: 13px;
    display: block;
    background-size: 13px 18px;
    cursor: pointer;
}

#nt-example1-start {
    background: url("../Content/themes/base/images/play2.png") repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0);
    display: none;
    float: right;
    height: 18px;
    visibility: visible;
    width: 13px;
    background-size: 13px 18px;
    cursor: pointer;
}

.colorName {
    float: left;
    margin-left: 10px;
    /*width:104px;*/
}

.ColorVal {
    border-radius: 5px;
    box-shadow: 0 0 1px black;
    float: left;
    height: 20px;
    width: 20px;
}

#indexes {
    /*background: rgba(250, 250, 250, 0.85) none repeat scroll 0 0;*/
    /*height: 43px;
    margin-top: 10px;*/
    padding: 2px 0;
    /*position: absolute;*/
    text-align: center;
    /*top: 200px;*/
    width: 183px;
    overflow: hidden;
    left: 10px;
    /*min-height:11px !important;
    min-width:38px !important;
    display:block !important;*/
}

.liValList {
    padding: 3px 0 0 !important;
}

    .liValList .ColorVal {
        border-radius: 0px;
        float: left;
        width: 24px;
    }

    .liValList .colorName {
        float: left;
        width: auto;
        font-size: 14px;
        text-align: left;
        font-weight: bold;
    }

#IndexList {
    display: table;
    text-align: center;
    vertical-align: middle;
    /*width: 91%;*/
    padding: 2%;
    margin-left: 21px;
}

    #IndexList li {
        /*display: table-cell;*/
        position: relative;
        text-align: center;
        vertical-align: middle;
        /*padding: 5px;*/
        clear: both;
        margin-bottom: 7px;
        display: table !important;
    }

#basemapGallery {
    height: 33px;
    margin-right: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 20px;
    width: 46px;
    z-index: 39;
    padding: 20px 0px 0px 19px;
}

#titleGallery {
    background-color: none;
    width: 31px;
    height: 33px;
    margin-right: 10px;
    cursor: pointer;
}

#GalleryMap {
    /*cursor: pointer;*/
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.49);
}

#content ul li {
    /*display: inline-table;
    padding: 3%;
    text-align: center;
    position: relative;
    width: 13%;*/
    list-style: initial;
    /*margin: 10px 29px;*/
}

.oNavigationList li {
    display: inline-table;
    padding: 3%;
    text-align: center;
    position: relative;
    width: 13%;
}

#childPageLink {
    border-radius: 8px;
    display: inline-table;
    float: left;
    margin: 16px 0;
    padding: 10px;
    width: 12%;
    font-size: 14px;
}

    #childPageLink ul li {
        text-align: left;
    }



.TableStation table {
    /*min-width:90%;*/
    font-size: 13.5px;
}

.TableStation {
}

h2 {
    background: none repeat scroll 0 0 rgb(252,186,63);
    font-size: 21px;
    font-weight: normal;
    padding: 2px 2px 2px 10px;
}

.ImageText {
    color: white;
    font-weight: bold;
    margin: 0 auto;
    max-width: 121px;
    padding: 9px;
    position: absolute;
    text-decoration: none;
    top: 0px;
    width: 100%;
    display: inline-table;
    z-index: 2;
    right: 0;
    left: 0;
}

    .ImageText a {
    }

/*tr[style*=" table-row"]:nth-child(2n+1) {
    background: none repeat scroll 0 0 #f5f5f5;
}

.TableRow:nth-child(2n+1) {
    background: none repeat scroll 0 0 #f5f5f5;
}*/

.serchDiv {
    position: relative;
    width: 365px;
    z-index: 323232;
    float: left;
}

.Content {
    margin: 0 auto;
    /*padding: 5px;*/
    position: relative;
    z-index: 2;
}

.grapsButton {
    /*border: 1px solid #7a7a77 !important;
    box-shadow: 0 0 2px black;*/
    height: 28px;
    margin: 2px;
    width: 36px !important;
}

.grapsButtonExcel {
    /*border: 1px solid #7a7a77 !important;
    box-shadow: 0 0 2px black;*/
    height: 28px;
    margin: 2px;
    width: 36px !important;
}

.Allgraph {
    float: right;
    position: absolute;
    right: 13px;
    top: 12px;
}

a.grapsButton {
}

#Top_Content {
    /*height: 44px;*/
    margin: 0 auto;
    position: relative;
    margin-top: 9px;
    margin-right: 10px;
    /*top: 9px;
    right: 10px;*/
    z-index: 5;
    float: right;
}

.titlePageH1 {
    /*float: left;*/
}

#excellAll {
    float: right;
    height: 40px;
    position: relative;
    /*width: 40px;*/
}

    #excellAll a {
        float: right;
        margin-top: 7px;
    }

#lang {
    margin-left: 8px;
    max-width: 92px;
    float: right;
}

#SetLang {
    max-width: 92px;
    width: 100%;
}

.contentPane table {
    text-align: center;
    width: 90%;
}

    .contentPane table tr:nth-child(2n+1) {
        background: none repeat scroll 0 0 #f7f7f7;
    }

.contentPane {
    background: #fff !important;
    max-height: inherit !important;
}

.textBubble {
    clear: both;
    font-size: 14px;
    margin-bottom: 4px;
    /*margin-left: 10px;*/
    margin-right: 5%;
    text-align: center;
    width: 100%;
}

    .textBubble .titleBubble {
        direction: ltr;
        float: left;
        font-weight: bold;
        margin-left: 5px;
        position: relative;
        text-align: right;
        width: auto;
    }

.esriPopup .sizer {
    text-align: center;
}

.esriPopup .titlePane {
    background-color: #444444;
    border-radius: 5px 5px 0 0;
    color: #ffffff;
    cursor: default;
    line-height: 20px;
    padding: 0 38px 0 4px;
    font-size: 17px;
}

#topPageTitle {
    position: relative;
    background: rgba(57, 78, 95, 0.48) none repeat scroll 0 0;
}

.esriPopup .titlePane {
    border-radius: 0 !important;
}

    .esriPopup .titlePane .title {
        background: none repeat scroll 0 0 transparent;
        text-align: left;
        width: 300px;
    }

.maximize, .restore {
    display: none;
}

.logOnOf {
    float: right;
    position: absolute;
    top: 2px;
    right: 5px;
}

.textBubbleTime {
    text-align: left;
    font-size: 11px;
    margin-left: 0px;
    margin-bottom: 0px;
    float: right;
}

.titlePage {
    float: right;
    position: absolute;
    right: 34px;
    top: 12px;
}

    .titlePage img {
        cursor: pointer;
        margin: 0 2px;
    }

.ImageInfo {
    float: left;
    margin: 0 4px;
}

.titleTable {
    border-left: 1px solid rgb(232, 238, 244);
    border-top: 1px solid rgb(232, 238, 244);
    float: left;
    /*height: 27px;*/
    padding-top: 2px;
    position: relative;
    width: 103px;
}

    .titleTable:last-child {
        border-right: 1px solid #e8eef4;
        width: 103px;
    }

    .titleTable:first-child {
        /*width: 166px;*/
    }

.tableDiv {
    /*width: 353px;*/
}

.titlesTable {
    background: none repeat scroll 0 0 #f7f7f7;
    font-weight: bold;
    height: auto;
    margin: 0 17px;
    padding-top: 0;
    text-align: center;
    width: 313px;
    display: table;
}


.onlyTable {
    /*max-height: 173px;
    overflow-y: scroll;*/
}

    .onlyTable table {
        /*margin: 0 17px;*/
        width: 313px !important;
    }

        .onlyTable table td:first-child {
            /*width: 114px;*/
        }

        .onlyTable table td {
            width: 103px;
            padding: 5px 0;
        }

            .onlyTable table td:last-child {
            }

.fixWidth {
    width: 38px;
}

.tableReportDiv {
    width: 100%;
}


.DateBubble {
    position: absolute;
    right: 217px;
    top: 55px;
}

.grapsButton:focus, .grapsButton:checked {
    border: none;
    outline: none;
}

.closeAllGraphs {
    border: 1px solid rgb(191, 191, 191);
    border-radius: 13px;
    height: 16px;
    margin-left: 5px;
    margin-top: 5px;
    padding: 3px;
    width: 18px;
    cursor: pointer;
}

#LinksDiv {
    display: inline-table;
    height: auto;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 94%;
    padding-top: 7px;
    max-height: 19px;
    overflow: hidden;
    line-height: 1.2;
}

    #LinksDiv .link {
        display: table-cell;
        text-align: center;
        /*vertical-align: middle;*/
        font-size: 12px;
        padding: 0 13px 0 13px;
        border-right: 2px solid rgba(0, 0, 0, 0.18);
    }

#Links {
    background: none repeat scroll 0 0 rgb(0, 136, 204);
    box-shadow: 0 0 6px 0 rgb(82, 117, 151);
    display: block;
    height: 37px;
    position: relative;
    width: 100%;
    overflow: hidden;
}

#Linkimg {
    background: none repeat scroll 0 0 rgb(0, 136, 204);
    border-radius: 0 0 0 50px;
    cursor: pointer;
    font-size: 29px;
    height: 26px;
    margin-left: -23px;
    padding: 6px 7px;
    position: absolute;
    text-align: center;
    vertical-align: middle;
    width: 9px;
}

#LinksDiv .link a {
    color: white;
    text-decoration: none;
}

    #LinksDiv .link a:hover {
        text-decoration: underline;
    }

#CloseLinksDiv {
    cursor: pointer;
    position: absolute;
    width: 35px;
    height: 34px;
    top: 0px;
    right: 6px;
    background: url('/Scripts/fancybox/source/fancybox_sprite.png') repeat scroll 0px 0px transparent;
}

.subres {
    background: none repeat scroll 0 0 rgb(103, 103, 103);
    border: medium none;
    padding: 5px 17px !important;
    font-size: 1.2em;
}

    .subres:first-child {
        float: left;
    }

    .subres:nth-child(2) {
        float: right;
    }

.textAdvance {
    font-size: 0.7em;
    line-height: 1.2;
    margin: 5px;
    text-align: center;
}

#TableInfoStation {
    float: left;
    margin-right: 10px;
}

#ImageInfoStation {
    float: right;
    text-align: center;
}

    #ImageInfoStation img {
        max-width: 90%;
        margin: 5px;
        box-shadow: 0px 0px 5px black;
    }

#MonitorsZeroDiv {
    float: left;
}

#ListOfMonitorsZero label, #ListOfMonitorsZero input, #ListOfMonitorsPartic label, #ListOfMonitorsPartic input {
    float: left;
}

#ListOfMonitorsZero label, #ListOfMonitorsPartic label {
    margin-left: 5px;
}

#MonitorsZeroDiv, #MonitorsParticDiv {
    float: left;
    height: 170px;
    margin: 0;
    padding: 10px;
    width: 200px;
}

#Error {
    color: red;
    text-align: center;
}

.clacDiv label {
    float: left;
}

.RememberMe input {
    float: left;
    margin-right: 5px !important;
}

.footerelem {
    margin-right: 34px;
    float: left;
}

.valuepopup {
    float: right;
    text-align: left;
    width: 105px;
}

#ReportType {
    float: left;
}

    #ReportType label {
        float: left;
        padding: 3px 5px 0 0;
    }

#ValidInput {
    float: left;
    margin-left: 47px;
}

    #ValidInput label {
        float: left;
    }

    #ValidInput input {
        float: left;
        margin-left: 5px;
    }

.ListOfCountryAndSite {
    background-color: rgb(255, 255, 255);
    padding: 5px;
}
/*#MonitorsDiv{
        width: 300px;
    }*/
#displayFor {
    float: left;
    margin-left: 40px;
}

#SortBy {
    float: left;
    margin-right: 48px;
    margin-top: 24px;
}

    #SortBy label {
        float: left;
        margin-right: 10px;
        margin-top: 4px;
    }

#SortBydateOrSite {
    width: 100px;
}

.ListOfMonitors {
    width: 80%;
    float: right;
    height: 50px;
}

#footer {
    display: block;
}

.coverMonitors {
    position: relative;
    /* width: 892px; */
    margin: 0px auto;
    z-index: 1;
    overflow: auto;
    height: 47px;
    width: 100%;
}

#imageSlider {
    margin: 0 auto;
    width: 50%;
}

.imageSlider {
    margin: 0 auto;
    width: 50%;
    margin: 0 25%;
    margin-bottom: 10px;
}

@media (max-width : 1794px) {
    .coverMonitors {
        float: right;
    }

    .kmlListMonitors .coverMonitors {
        float: none;
    }
}

@media (max-width : 1342px) {
    #googlemapWithForcast #HmapDIvCover {
        margin-left: 0px;
    }
}

@media (max-width : 1320px) {
    .RadioClass:nth-child(2n) {
        float: left !important;
        margin-top: 5px;
    }
}

@media (max-width : 1300px) {
    .TopTitleSideLeft {
        max-width: 53px;
        min-width: initial;
    }

    #navheader {
        max-width: 100%;
    }

    #googlemapWithForcast #HmapDIvCover {
        width: 65%;
    }

    #googlemapWithForcast .ForcastButtons {
        padding: 7px;
        font-size: 12px;
    }

        #googlemapWithForcast .ForcastButtons.Poluttant, .ForcastButtons.Historic {
            padding: 7px;
        }

    .coverMonitors {
        width: 622px;
        float: right;
    }

    .kmlListMonitors .ListOfMonitors .coverMonitors {
        width: auto;
    }

    .RadioClassReports:nth-child(2n) {
        float: left !important;
    }

    .ListIndex.IndexClicked {
        display: inline-block !important;
    }

    .monitors.IndexClicked {
        /*display: inline-block !important;*/
    }

    #agency {
        display: none !important;
    }

    ul#menu li a {
        font-size: 12px !important;
        /*padding: 0 31px !important;*/
    }

    ul#menu li div {
        /*font-size: 12px !important;*/
        /*padding: 0 31px !important;*/
    }

    ul#menu li ul li a {
        /*font-size: 12px !important;*/
        /*padding: 0 31px !important;*/
    }

    .logOnOfli lengInMenu {
        padding: 0;
    }


    #navheader {
        width: auto;
        /*margin-left: 25px !important;*/
    }

    #AvisoryText {
        width: 69% !important;
    }

    #AdvisoryTitle {
        width: 20%;
    }

    #main {
        min-height: initial;
    }

    .monitors, .ListIndex {
        min-width: 53px !important;
        font-size: 14px;
    }

    #LinksDiv {
        line-height: 1.2;
    }

    .theList {
        display: block;
        /*width: 519px !important;*/
    }

    .kmlListMonitors .theList {
        /*width: auto !important;*/
    }
}

@media (max-device-width : 1300px) {
    .theList {
        display: block;
    }

    #LinksDiv {
        line-height: 1.2;
    }

    .monitors, .ListIndex {
        min-width: 53px !important;
        font-size: 14px;
    }

        .ListIndex.IndexClicked {
            display: inline-block !important;
        }

        .monitors.IndexClicked {
            display: inline-block !important;
        }

    /*#agency {
        display: none;
    }*/

    ul#menu li a {
        font-size: 13px !important;
    }

    ul#menu li ul li a {
        font-size: 12px !important;
        /*padding: 0 31px !important;*/
    }

    #navheader {
        width: auto;
        /*margin-left: 25px !important;*/
    }

    #AvisoryText {
        width: 70% !important;
    }

    #AdvisoryTitle {
        width: 20%;
    }

    #main {
        min-height: initial;
    }
}

@media (max-width : 940px) {
    .TopTitleSideLeft {
        /*min-width: inherit;*/
        max-width: 53px;
    }

    #googlemapWithForcast #HmapDIvCover {
        width: 100%;
    }

    #googlemapWithForcast .ForcastButtons {
        padding: 11px;
        font-size: 14px;
    }

        #googlemapWithForcast .ForcastButtons.Poluttant, .ForcastButtons.Historic {
            padding: 11px;
        }
}

@media (max-width : 870px) {
    #navheader {
        width: 100% !important;
        max-width: 100%;
    }

    .EnvelopeDiv {
        /*max-width:100% !important;*/
    }
    /*#AdvanceReportArrow{
        margin-top:5px !important;
    }*/
    #FourthMaxDiv {
        padding-top: 5px !important;
        height: auto !important;
    }

    #imageSlider {
        margin: 0 auto;
        width: 100%;
    }

    #LogoTopTitle {
        display: none;
    }

    #LogoTopRightTitle {
        display: none;
    }

    #sliderDivKML {
        width: auto !important;
    }
}

@media (max-device-width : 785px) {
    .TopTitleSideLeft {
        min-width: initial;
    }

    .forwardRewind {
        display: none;
    }

    .kmlListMonitors {
        bottom: 6px !important;
    }

    .navheader {
        width: 100% !important;
    }

    .RadioClassReports:nth-child(2n) {
        float: left !important;
    }
    /*#AdvanceReportArrow{
        margin-top:5px
    }*/
    #FourthMaxDiv {
        padding-top: 5px !important;
        height: auto !important;
    }

    #appheader #title a {
        font-size: 14px !important;
    }

    #LogoSystemNameLeft {
        max-height: 40px !important;
    }

    #LogoSystemNameRight {
        max-height: 40px !important;
    }

    .EnvelopeDiv {
        max-width: 100%;
    }

    #imageSlider {
        margin: 0 auto;
        width: 100%;
    }

    #sliderDiv {
        width: auto !important;
    }

    #TopListmonitoringStationDiv {
        width: 92% !important;
        font-size: 14px !important;
    }

    #BottomListmonitoringStationDiv a {
        font-size: 13px !important;
    }

    .HomeRightDiv {
        margin-left: 4px !important;
        margin-bottom: 4px !important;
        font-size: 14px !important;
    }

        .HomeRightDiv #aqiTodayDIv {
            font-size: 14px !important;
        }

    .TableaqiDIv div {
        font-size: 9px !important;
    }

    #HmapDIv {
        margin-right: 0px !important;
    }

    #MessagesList {
        padding: 3px !important;
        margin-left: 0px !important;
    }

    #LeftTopMessagesList {
        padding-right: 5px !important;
    }

    #ListmonitoringStationDiv {
        padding: 3px !important;
        margin-right: 0px !important;
    }

    LeftTopMessagesList {
        font-size: 14px !important;
    }

    #ListMessages li {
        margin-bottom: 15px !important;
    }

        #ListMessages li a {
            font-size: 12px !important;
        }

    span#MessageDate {
        font-size: 8px !important;
    }

    #BottomMessagesList a {
        font-size: 14px !important;
    }

    footer #footer {
        display: none;
    }

    #LogoTopRightTitle {
        display: none;
    }

    #Linkimg {
        font-size: 19px !important;
    }

    #LogoTopTitle {
        display: block;
        height: 20px !important;
        padding: 7px 5px 4px 19px !important;
    }

    #masthead {
        overflow: initial !important;
    }

    .PollutantSelect {
        display: block !important;
        float: right;
        /*margin: 7px;*/
        width: inherit;
    }

    .ListOfMonitors {
        width: 61%;

        height:inherit !important;

    }
    /*@media (max-width:785px) {*/
    #navheader {
        width: auto;
        margin-left: 0 !important;
        float: none;
    }

    #main {
        min-height: initial;
    }

    ul#menu {
        position: absolute !important;
        background-color: #394e5f;
        z-index: 888888888;
        left: 0;
    }

        ul#menu ul {
            position: relative !important;
        }

    #AvisoryText {
        width: 63% !important;
    }

    #AdvisoryTitle {
        display: none;
    }

    #LinksDiv .link {
        display: block !important;
        border-right: 0px;
        border-bottom: 2px solid rgba(0, 0, 0, 0.18);
    }

    #LinksDiv {
        position: absolute !important;
        z-index: 999999999999999;
        width: 100% !important;
        padding-top: 0px !important;
        background-color: rgb(0, 136, 204);
    }

    .ListIndex {
        display: none !important;
    }

    .monitors {
        display: none !important;
    }

    .ListIndex.IndexClicked {
        display: inline-block !important;
    }

    .monitors.IndexClicked {
        display: inline-block !important;
    }

    #ListPollutant, #ListMeterology, #List2Index {
        display: none;
        position: absolute;
        height: inherit;
        width: 181px !important;
        overflow-y: hidden;
    }

    div.theList input {
        position: relative;
        display: table-row !important;
        width: 80%;
        z-index: 999999999999999999999999999999999;
        height: 30px;
    }

    .RightLeftButtons {
        display: none;
    }

    #indexes {
        top: 119px;
        /*width: 131px;*/
    }

    .liValList .ColorVal {
        float: left;
        /*width: 20%;*/
    }

    .liValList .colorName {
        float: left;
        /*width: 75%;*/
        font-size: 12px;
        line-height: 1.1;
    }

    #IndexList li {
        margin-bottom: 1px;
    }

    #buttons {
        /*top: 71px !important;*/
        left: 14px !important;
        display: block !important;
    }

        #buttons > select {
            width: inherit;  
        }

    #ImageInfoStation {
        float: none;
    }

    #lang {
        display: none;
    }

    .logOnOf {
        display: none;
    }

    #navheader .menu-collapser {
        display: block;
        font-size: 11px;
        text-align: left;
        padding-left: 25px;
    }

    #content {
        width: 95% !important;
    }

        #content ul li {
            padding: 1px !important;
        }

    .TableStation h2 {
        height: 82px;
    }

    .Allgraph {
        top: 44px;
    }

    #Top_Content {
        padding-left: 20px;
    }

    .serchDiv {
        width: auto;
    }

    .CloseGraph {
        left: 18px !important;
        top: 0 !important;
    }

    .DateBubble {
        right: 2px !important;
        top: 55px !important;
    }
}

@media (max-width : 785px) {
    .navheader {
        width: 100% !important;
    }

    .kmlListMonitors {
        bottom: 6px !important;
    }

    .datepickerDiv input.date-picker {
        width: 95%;
    }

    .SelectDateTitle h2 {
        font-size: 17px;
    }

    #FourthMaxDiv {
        padding-top: 5px !important;
        height: auto !important;
    }
    /*#AdvanceReportArrow{
        margin-top:5px !important;
    }*/
    #appheader #title a {
        font-size: 14px !important;
    }

    #LogoSystemNameLeft {
        max-height: 40px !important;
    }

    #LogoSystemNameRight {
        max-height: 40px !important;
    }

    #appheader #title a {
        font-size: 14px !important;
    }

    #LogoSystemNameLeft {
        max-height: 40px;
    }

    #LogoSystemNameRight {
        max-height: 40px;
    }

    .EnvelopeDiv {
        max-width: 100%;
    }

    #imageSlider {
        margin: 0 auto;
        width: 100%;
    }

    #sliderDiv {
        width: auto !important;
        max-width: 49% !important;
    }

    #slider {
        width: 67% !important;
    }

    #BottomListmonitoringStationDiv a {
        font-size: 13px !important;
    }

    #TopListmonitoringStationDiv {
        width: 92% !important;
        font-size: 14px !important;
    }

    .HomeRightDiv {
        margin-left: 4px !important;
        margin-bottom: 4px !important;
        font-size: 14px !important;
    }

        .HomeRightDiv #aqiTodayDIv {
            font-size: 14px !important;
        }

    .TableaqiDIv div {
        font-size: 8px !important;
    }

    #HmapDIv {
        margin-right: 0px !important;
    }

    #MessagesList {
        padding: 3px !important;
        margin-left: 0px !important;
    }

    #LeftTopMessagesList {
        padding-right: 5px !important;
    }

    #ListmonitoringStationDiv {
        padding: 3px !important;
        margin-right: 0px !important;
    }

    LeftTopMessagesList {
        font-size: 14px !important;
    }

    #ListMessages li {
        margin-bottom: 15px !important;
    }

        #ListMessages li a {
            font-size: 12px !important;
        }

    span#MessageDate {
        font-size: 8px !important;
    }

    #BottomMessagesList a {
        font-size: 14px !important;
    }

    .CloseGraph {
        left: 18px !important;
        top: 0 !important;
    }

    .DateBubble {
        right: 2px !important;
        top: 55px !important;
    }

    .serchDiv {
        width: auto;
    }

    .TableStation h2 {
        height: 82px;
    }

    .Allgraph {
        top: 44px;
    }

    #Top_Content {
        padding-left: 20px;
    }

    #content {
        width: 95% !important;
    }

        #content ul li {
            padding: 1px !important;
        }

    footer #footer {
        display: none;
    }

    #LogoTopRightTitle {
        display: none;
    }

    #Linkimg {
        font-size: 19px !important;
    }

    #LogoTopTitle {
        display: block;
        height: 20px !important;
        padding: 7px 5px 4px 19px !important;
    }

    #masthead {
        overflow: initial !important;
    }

    .PollutantSelect {
        display: block !important;
        float: right;
        /*margin: 7px;*/
        width: inherit;
    }

    .coverMonitors {
        display: none;
    }

    .ListOfMonitors {
        float: right;
        max-width: 210px;
        width: 61%;
    }
    /*@media (max-width:785px) {*/
    #navheader {
        width: 100% !important;
        margin-left: 0 !important;
        float: none;
    }

    #main {
        min-height: initial;
        width: 95% !important;
    }

    ul#menu {
        position: absolute !important;
        background-color: #394e5f;
        z-index: 888888888;
        left: 0;
    }

        ul#menu ul {
            position: relative !important;
        }

    #AvisoryText {
        width: 63% !important;
    }

    #AdvisoryTitle {
        display: none;
    }

    #LinksDiv .link {
        display: block !important;
        border-right: 0px;
        border-bottom: 2px solid rgba(0, 0, 0, 0.18);
    }

    #LinksDiv {
        position: absolute !important;
        z-index: 999999999999999;
        width: 100% !important;
        padding-top: 0px !important;
        background-color: rgb(0, 136, 204);
    }

    .ListIndex {
        display: none !important;
    }

    .monitors {
        display: none !important;
    }

    .ListIndex.IndexClicked {
        display: inline-block !important;
    }

    .monitors.IndexClicked {
        display: inline-block !important;
    }

    #ListPollutant, #ListMeterology, #List2Index {
        display: none;
        position: absolute;
        height: inherit;
        width: 181px !important;
        overflow-y: hidden;
    }


    div.theList input {
        position: relative;
        display: table-row !important;
        width: 80%;
        z-index: 999999999999999999999999999999999;
        height: 30px;
    }

    .RightLeftButtons {
        display: none;
    }

    #indexes {
        top: 119px;
        /*width: 131px;*/
    }

    .liValList .ColorVal {
        float: left;
        /*width: 20%;*/
    }

    .liValList .colorName {
        float: left;
        /*width: 75%;*/
        font-size: 12px;
        line-height: 1.1;
    }

    #IndexList li {
        margin-bottom: 1px;
    }

    #buttons {
        left: 0px !important;
        display: block !important;
    }

        #buttons > select { /*ECY NT 3/2022*/
            width: inherit; 
        }

    #ImageInfoStation {
        float: none;
    }

    #lang {
        display: none;
    }

    .logOnOf {
        display: none;
    }

    #navheader .menu-collapser {
        display: block;
        font-size: 11px;
        text-align: left;
        padding-left: 25px;
    }
}

@media (max-width : 687px) {
    .TopTitleSideLeft {
        min-width: initial;
    }

    .navheader {
        width: 100% !important;
    }

    #ValidInput {
        margin-left: 0px !important;
        clear: both;
    }

    #dateForm {
        clear: both;
    }

    .datepicker {
        /*max-width:100px !important;*/
    }

    .separatorDate {
        padding: 23px 5px !important;
    }

    #Countries {
        clear: both;
    }

    #MonitorsDiv {
        clear: both;
    }

    .ListOfCountryAndSite {
        clear: both;
    }
}

@media (max-width : 383px) {
    .navheader {
        width: 100% !important;
    }

    #AdvanceReportArrow {
        clear: both;
        margin-top: 5px !important;
    }
}


#RightbottomFilter {
    width: 100%;
}

.MinPlus {
    float: left;
    font-size: 27px;
    padding: 3px 6px;
    box-shadow: 0 0 1px rgb(0, 0, 0);
    margin: 5px 6px;
    padding: 0 6px 3px;
    /*float: left;
    font-size: 27px;
    margin: 5px 6px;
    box-shadow: 0px 0px 2px black;
    height: 5px;*/
}

.countydiv {
    background: rgb(230, 238, 238) none repeat scroll 0 0;
}

.MinPlusAng {
    cursor: pointer;
}

.CategoryCover {
    /*border: 1px solid #cccccc;*/
    /*width: 206px;*/
    /*border-radius: 3px;*/
    padding: 4px 0px;
}

.OwnerCheck {
    margin: 0 5px 0 0 !important;
}

.listOfCounty input {
    margin-right: 5px;
    margin-top: 0px;
}

.MinPlusText {
    float: left;
    padding: 0px 5px;
}

.listOfCounty {
    display: none;
    clear: both;
    max-height: 200px;
    overflow-y: auto;
    /*max-width: 186px;*/
    padding: 10px;
    direction: ltr;
    text-align: left;
    min-width: 104px;
}

#StationsSel {
    height: 400px;
}

.countyName {
    background: rgb(230, 238, 238) none repeat scroll 0% 0%;
    font-size: 20px;
    padding: 6px 20px;
    cursor: pointer;
    text-align: left;
}

#leftFilter {
    width: 20.5%;
    height: 100%;
    float: left;
    padding: 1%;
    min-width: 125px;
    border-right: 1px solid #99C8EB;
    position: relative;
}

#RightFilter {
    width: 77%;
    height: 100%;
    float: right;
    right: 0;
}

#RightTopFilter {
    width: 100%;
}

.RadioClass > input[type="radio"] {
    /*margin: -4px 0 0;*/
}

#RightbottomFilter {
    width: 100%;
}

.countyArea {
    padding: 0px 0px;
    overflow: hidden;
    min-width: 125px;
    border: 1px solid #cccccc;
    border-radius: 3px;
    margin-bottom: 12px;
}

.box-col {
    float: left;
    margin: 5px;
    /*max-width: 20%;*/
}

.DateTitle {
    float: left;
    margin-right: 5px;
    padding: 6px;
}

.ToTimeBaseSelectedTitle, .FromTimeBaseSelectedTitle {
    float: left;
    margin-right: 10px;
    margin-top: 5px;
}

#FromTimeBaseSelected {
    float: right;
    padding: 7px;
    margin-bottom: 0px;
}

.k-grid-header th.k-header, .k-filter-row th {
    text-align: center !important;
}

    .k-grid-header th.k-header, .k-filter-row th:first-child {
        border-width: 0 0 1px 1px;
    }

div.k-grid-header, div.k-grid-footer {
    padding-right: 17px !important;
    padding-left: 0px !important;
}

.stationName {
}

.ToTimeBaseSelectedTitle {
    float: left;
    margin-right: 10px;
    margin-top: 5px;
}

#ToTimeBaseSelected {
    float: right;
    padding: 7px;
    margin-bottom: 0px;
}

#ButtonClick {
    margin-top: 5px;
    margin-left: 10px;
    float: left;
}

@media (max-width : 710px) {
    .RadioClass:nth-child(2n) {
        float: right !important;
        margin-top: 0 !important;
    }

    .RadioClassReports:nth-child(2n) {
        float: right !important;
    }

    .navheader {
        width: 100% !important;
    }

    #leftFilter {
        width: 100%;
    }

    #RightFilter {
        width: 100%;
    }

    .inputsfilter input {
        margin-bottom: 2px !important;
    }

    .inputsfilter {
        width: 99%;
    }

        .inputsfilter ! select {
            width: 100%;
        }

    #StationsSel {
        height: 32px !important;
    }
   
}

    .checkbox-span{
        margin-left:0px;
    } 
 
   .section-sub-wrapper {
       float:left;
   }     
   .fixed-header {
        top:0;
        position:fixed;
        width:auto;
        z-index: 1;
      }
   .k-grid-content-locked {
        float: left !important;
    }

    .k-grid-header-locked {
        float: left !important;

    }

    .a-table {
        width: 32px;
        height: 32px;
        margin-right: 10px;
        padding: 0;
        display:inline-block;
        background-image: url("../img/Text.png");
        float:right;
    }

    .a-graph {
        width: 32px;
        height: 32px;
        margin-right: 10px;
        padding: 0;
        display:inline-block;
         background-image: url("../img/DiagramIcon.png");
        float:right;
    }
    .a-excel {
        width: 32px;
        height: 32px;
        margin-right: 10px;
        padding: 0;
        display: inline-block;
        background-image: url("../img/excel.png");
        float:right;
    }

    .a-pdf {
        width: 32px;
        height: 32px;
        margin-right: 10px;
        padding: 0;
        display: inline-block;
        background-image: url("../img/pdf31.png");
        float:right;
    }

     .wc-wrapper   {
         overflow:hidden;
         text-align:center;
         width:35%;
         float:right;
    } 

     .loading-image {
        margin:auto;
        width: 32px;
        height: 32px;
        background-image: url("../img/load32.gif"); 
        z-index:9999999;
        float:left;
        display:none;
     }

/* POLLUTANTS MENU */
    
#pollutantsMenu li {
    text-align:left !important;
}

#headerMap #stationsFilterContainer{
    margin-left: 10px;
}