/*----------------------------------------------------------
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.
----------------------------------------------------------*/


    .ReportIcon {
        right: 8px;
        top: 25px;
        position: absolute;
        z-index: 2;
    }
.dashboardWindowTitle {
    margin-right:1.44em;
}
#tabularContainer h2 {
    font-size: initial;
    font-weight: initial
}
#tabularContainer #TabularPageTitle {
    float: left;
    margin: 10px;
}
.ToolTipReport {
    right: 20px;
}
.dashboardWindowTitle {
    margin-right: 1.44em;
}

#CoverPathLinkWithUserName {
    /*width:100%;*/
    height:30px;
    margin:0 15px;
}
.ReportContent .icon-bar,.ReportIcon .icon-bar
{
	background-color:#000 !important;
}
    #CoverPathLinkWithUserName #pathLinks {
        float:right;
    }
    #CoverPathLinkWithUserName #UserName {
        float:left;
        margin-right:5px;
    }
       #CoverPathLinkWithUserName img.imageseperetor {
    height: 19px;
    margin: 0px 8px;
}
ul ul, ul ol, ol ol, ol ul {
    margin-bottom: 0;
}
    h2.ng-binding {
        padding-right: 47px;
    }
     .leftFilter {
        position: absolute;
        right: 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-window-titlebar .k-window-actions{
    left:.3em;
    right:auto !important;

}
.CostumGraphBox{
float: left;
    position: absolute;
    z-index: 2147483647;
    cursor: pointer;
    top: -58px !important;
    left: 7px;
    right: inherit;
    display: block;
}
.h1TextTitle {
    font-size: 16px;
    margin-right: 10px;
}
    .TabulasTable .k-grid-content, .TabulasTable .k-grid-header {
        overflow-y: visible;
        padding-right: 0px !important;
    }
 .TabulasTable .k-grid-header.HeaderWithPadding{
    padding-left:17px;
}
.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;

}
span.k-icon.k-i-arrow-60-right {
    background-position-y: -17px;
}
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;
}
.k-grid-content{
    overflow-x:auto;
    overflow-y:auto;
}
ul.slimmenu {
width:100%;
}
.kmlMonitors{
            border-radius: 24px;
    }
     .kmlListMonitors
     {
    position: absolute !important;
    height: 100%;
    width: 144px;
    top: 105px;
    left:0;
    display:table;
     }
      .kmlListMonitors .ListOfMonitors{
    display:inline-table;
    height:100%;
    width:100%

      }
     .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;
        font-size:14px;
        border-radius:6px;
    }
  .playslider,.forwardRewind
  {
      width:50px;
      float:left
  }
  #rightSlider{

      float:right;
  }
   #leftSlider{
      float:left;
  }
.k-content #chart{
    direction:ltr;
}   
.ListStationsLeft ul li{
    text-align:right;
}
 .IndexDivIconCover {
        border: 0px solid white;
        margin-bottom: 8px;
        width: 18%;
        float: left;
    }

    .SiteInform{
    width:40%;
}
    .bxslider{
    margin:0px;
}
    .labelOwner {
    margin-top: -41px !important;
    width: 20px;
    text-align: center;
    margin-left: -10px !important;
}
    #borderMapDiv{
        float: right;
    position: absolute;
    right: 12px;
    bottom: 23px;
    padding: 10px;
    background: #fff;
    border-radius: 38px;
    border: 1px solid black;
    font-size: 16px;
}
        .Target
    {
        margin-right:10px;
        display: inline-block;
    }
    .Target input{
            margin: -1px 0px 0px !important;
    }
    #ListTargetTitle{
        color: blue;

    }
     #borderMapDiv #borderMap {
        margin:0px;
    }
.CheckboxCategory {
    margin-left: 5px !important;
    margin-top: 0px !important;
}
.SiteInformTableDiv {
    width:58%;
}

    .monitorcheck {
        float:right !important;
    }
    .MonitorsDiv label{
        float:right !important;
    }
.ColorTabular{
        width: 100%;
    /* height: 52px; */
    position: relative;
    display: table;
    text-align: center;
}
 #leftFilter #spandiv {
    background: transparent;
    width: 10px;
    
    position: relative;
    top: -7px;

    right: -5px;
    height: 30px;
    float: left;
}
    #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) !important;
        border-style: solid;
        border-width: 7px 8px 5px;
        display: block;
        height: 1px;
        z-index: 2;
    }
.ToTimeBaseSelectedTitle {
    float: right;
    margin-left: 10px;
    margin-top: 5px;
}
#advanceReport{
    float:right !important;
}
.OwnerCheck{
        margin: 0 0 0 5px !important;
}
    .SiteInformCover {
    padding: 5px;
    clear: both;
     height: 30px;
}
    .SiteInformCover:nth-of-type(2n+1) {
    background: rgb(149, 197, 231) none repeat scroll 0 0 !important;
}

    .SiteInformTitle{
        font-weight:bold;
    }
    .SiteInform > table {
    /*float: left;*/
}
    .pollutantDiv{
        direction:ltr;
    }
    #AvaregeTime, #LastUpdate {
    margin: 5px;
}
  .SiteInform h3 {
   
    /*border-bottom: 1px solid rgb(149, 197, 231);*/
    margin-top: 0;
    padding: 0 5px;
}
.RadioClass{
    float:right;
}
.RadioClass input{
    float:right;

}
#nt-example1 li{
    text-align:right !important;
}
.RadioClass label{
    float:right;
    margin-right:5px;
    margin-left:10px;

}
#childPageLink {
    border-radius: 8px;
    display: inline-table;
    float: right;
    margin: 16px 0;
    padding: 10px;
    width: 12%;
}
.IndexValNum{
    height: 22px; 
    font-size: 13px; 
    line-height: 1; 
    font-weight: normal;
    display: table-cell;
    vertical-align: middle;
    padding-left:5px;
    direction:ltr;
}    
.YourOpinionDivarea #OpinionDiv {
                        width: 309px !important;
                        float: right;
                    }
    #navheader {
    width:80% !important;
    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: 25px;
    position: relative;
    width: 25px;
    z-index: 2;
     /*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;
            }
            .EnvelopeDiv{
    /*max-width:80%;*/
    margin:0 auto;
    position:relative;
    width:100%;
    display:table;
}
            #SearchCoverDivInTitle{
    width:16%;float:right
}
.LogInArea,.LangArea {
    height:25px;
     left:0px;
     overflow:hidden;
     width:25px;
}
.YourOpinionArea{
    /*width: 341px;*/
    /*left:-316px;*/
}
.LogInImage{
    text-align:center;
}
.LogInImage img{
    max-height:25px;
}
.LogInInput{
        margin-left: 5px;
}
.LogInInput input{
    width: 145px !important;
    height: 13px !important;
}
.LogInInput input[type="button"]{
        width: 158px !important;
    margin-bottom: 5px;
    height:24px !important;
}

        .searchImage {
  float: right;
    height: 21px;
    padding-top: 2px;
    position: relative;
    width: 21px;
    z-index: 1;
        }

            .searchImage img {
                height: 21px;
                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{
        }
        .FloatDivButton,.serchButton,.LogInButton,.YourOpinionButton,.LangButton{
                background: rgb(0, 136, 204) none repeat scroll 0 0;
    float: left;
    height:25px;
    width: 25px;
    cursor:pointer;
        }
        #searchVal{
               height: 13px;
    width: 100%;
        }

.footerDiv{
    width:80%;
    margin:0 auto;
    line-height:normal !important;
}  
.languageMenu {
    float: left;
    /*max-width: 10%;*/
    left: 0;
    top: 0;
    position: absolute;
    font-size: 12px;
    color: white;
    overflow: hidden;
    max-height: 39px;
    vertical-align: middle;
    cursor:pointer;
    /* 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: right;
        }
.IndexDivIcon 
{
    border-radius: 6px;
    float: right;
    height: 32px;
    width: 23%;
}
.IndexDivText{
 display: table;
    float: right;
    height: 32px;
    margin-right: 10px;
    vertical-align: middle;
}
#IndexDiv{
       position: absolute;
    top: 10%;
    left: 1px;
     margin-right:10px;
    margin-bottom:10px;
        width:25%;
       
    }
    #aqiDIv #spandiv{
    background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
    right: -18px;
    padding: 10px 1px;
    position: absolute;
    top: 10px;
    }
    #aqiDIv #spandiv span{
    cursor: pointer;
        border-color: rgba(97, 93, 93,0) rgba(97, 93, 93, 1) rgba(97, 93, 93, 0) rgba(97, 93, 93,0);
        border-style: solid;
        border-width: 7px 8px 5px;
        display: block;
        height: 1px;
        z-index: 2;
    }
#aqiTodayDIv div{
    float: right; 
}
 #AdvisoryDivTitle{
  background: rgb(71, 202, 177) none repeat scroll 0 0;
    color: rgb(255, 255, 255);
    float: right;
    min-width: 76px;
    padding: 11px;
    width: 6%;
    position: relative;
    }
    #AdvisoryDivTitle span{
   border-color: rgba(71, 202, 177, 0) rgb(71, 202, 177) rgba(71, 202, 177, 0) rgba(71, 202, 177, 0);
    border-style: solid;
    border-width: 8px;
    display: block;
    float: left;
    height: 2px;
    position: absolute;
    right: 98px;
    top: 12px;
    z-index: 2;
    }
    #AvisoryDivText{
    float: left;
    width: 90%;
    height: 30px;
    padding-top: 10px;
    }
      .TitleCoverHome {
        background: rgb(71, 202, 177) none repeat scroll 0 0;
        color: rgb(255, 255, 255);
        float: right;
        padding: 11px;
        position: relative;
    }
       .LinkPage {
        /*background: rgb(71, 202, 177) none repeat scroll 0 0;
        padding: 8px 11px;*/
        font-size: 14px;
        color: #fff;
        float: left;
    }
       .LinkPage img{
     width:63px;
 }
#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;
}
.histogramchart{
    background:url("../img/histogramicon(white).png");
    width: 41px;
    height: 31px;
    float:left;
}
.rightInMenu{
    float:left !important;
}
.LeftLogIn{
    float:right;
    width:60%;
}
.rightLogIn{
    float:left;
    width:24%;
}
.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;
}


.LogInlable{
    float:right;
    width:20%;
    min-width:110px;
}
.LogInfield
{
    float:right;
    width:42%;
    min-width:190px;
}
.LogInfield input{
    min-width:176px;
    border-radius:0 !important;
    width:93%;
     margin-top: 9px !important;
}
.LogInfieldSubmit{
    float:right;
    width:100%;
    min-width:190px;
    /*margin-right:22% !important;*/
}
    .LogInfieldSubmit input {
        width:100% !important;
    }
.histogramchart:hover,.histogramchart.selected {
    background: url("../img/histogramicon.png");
}
.diagramchart{
    background:url("../img/diagramicon(white).png");
    width: 41px;
    height: 31px;
     float:left;
}
    .diagramchart:hover,.diagramchart.selected{
        background:url("../img/diagramicon.png");
    }
.tablechart{
    background:url("../img/Text White.png");
    width: 41px;
    height: 31px;
     float:left;
}
.tablechart:hover,.tablechart.selected{
     background:url("../img/Text.png");
}
.Excel {
    background: url("../img/excel Icon(white).png");
    width: 31px;
    height: 31px;
    float: left;
}
.ExcelIcon
{
     background: url("../img/excel.png");
    width: 31px;
    height: 31px;
    float: left;
    background-size: 31px;
  cursor: pointer;
    
    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");
    }

.separatorDate{
    float: left; font-size: 29px; padding: 23px;
}
.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;
       max-width: 309px;
    text-align: center;
}
html{
    direction:rtl !important;
}

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

#StationsLeft {
    border-radius: 3px 1px 3px 2px;
    float: right;
    margin: 2% 0;
    padding-left: 2%;
    width: 65%;
}
#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: left;
    margin: 2% 0;
    width: 27%;
}
#TitleStationsRight{
    text-align: center;
    font-size: 20px;
    margin-bottom: 20px;
}
#informationTableAndImage{
    float: right;
    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;
    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;
    z-index: 1;
    position: relative;
}
/*.ng-scope .checkbox 
{
    margin-right: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;
    position: relative;
}

    #main h2 {
        /*padding: 10px;*/
        direction:rtl;
    }

    #main #content {
        padding: 10px;
    }

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: right;
    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: right;

    }

        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 34px;
}

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;
    left:auto;
    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;
    right: 100%;
    top: 0;
}

ul#menu li:hover > ul {
    display: block;
}
/*.HaveChild::after{
    content: "";
    position: relative;
    right: -7px;
    bottom: 27px;
    display: block;
    float: left;
    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: right;
        background-color: #e8eef4;
        border: solid 1px #e8eef4;
    }

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

.error {
    color: Red;
}

nav,
#menucontainer {
}

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

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

#logindisplay {
    font-size: 1.1em;
    display: block;
    text-align: left;
    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 {
    /*width: 1024px;*/
    height: 42px;
    margin-top: 8px;
    color: White;
    font-weight: bold;
    font-size: 18px;
}

#pollutant {
}

#ListIndex {
    margin-left: 0px;
    margin-right: 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-right: 0 solid rgb(255, 255, 255);
    margin-right: 0;
}

/*.listSelect, .listSelect1 {
    background: none repeat scroll 0 0 rgb(41, 60, 103);
    cursor: pointer;
    float: right;
    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: 41px;
    margin: 0 auto;
    overflow-y: hidden;
    position: relative;
    width: 848px;
    z-index: 7;
}

.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-left: 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-left: 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;
    right: 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;
    right: 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: right;
    font-size: 19px;
    height: 21px;
    line-height: 1;
    margin-bottom: 6px;
    margin-top: 0;
    position: relative;
    width: 185px;
    z-index: 2147483647;
}

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

.ReportLi {
}

body {
    color: #333;
    background-color: #fff;
    font-size: 100%;
    margin: 0;
    padding: 0;
}

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

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

    /*#masthead #LogoTopTitle {
        float: right;

        height: 37px;
        padding: 4px 5px 4px 28px;
    }*/

      #masthead #LogoTopRightTitle {
        float: left;
        /*height: 27px;*/
        padding: 4px 1% 4px 5px;
        max-width:8%;
    }
      #masthead #LogoTopTitle {
    float: right;
    /* height: 37px; */
    padding: 4px 5px 4px 1%;
    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;
    float:right !important;
}

#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;
}

#LogoSystemNameLeft {
    float: right;
    max-height: 27px;
    padding: 1px 3px;
}
#LogoSystemNameLeftDiv{
 float: right;
 /*width:20%;*/
}

#LogoSystemNameRight {
    float: left;
    max-height: 27px;
    padding: 1px 3px;
}
 #LogoSystemNameRightDiv
    {
        width:20%;
        float: left;
    }
.logOnOfli.lengInMenu{
    float: left !important;
    position: absolute;
    top: 45px;
    left: 197px;
    right:inherit !important;
}
#appheader #title {
    display: block;
    float: right;
    height: 21px;
    padding: 6px 0px 0;
    text-align: right;
    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;
    padding: 4px 4px 3px 3px;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-right: none;
    background: none;
    width:80% !important;
    margin: 0 auto !important;
float: none !important;
}

#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-right-colors: none;
    -moz-border-left-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: right;
    font-size: 16px;
    max-width: 202px;
    padding: 3px 2px;
    width: 19%;
}

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

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

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

    .scroll-text ul {
        float: left;
    }

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

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

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

#nt-example1-prev {
    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-next {
    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-stop {
    background: url("../Content/themes/base/images/puse.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: left;
    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: left;
    height: 18px;
    visibility: visible;
    width: 13px;
    background-size: 13px 18px;
    cursor: pointer;
}

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

.ColorVal {
    border-radius: 5px;
    box-shadow: 0 0 1px black;
    float: right;
    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;
    right: 10px;
    /*min-height:11px !important;
    min-width:38px !important;
    display:block !important;*/
}

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

    .liValList .ColorVal {
        border-radius: 0px;
        float: right;

        width: 24px;
    }

    .liValList .colorName {
        float: right;

        width: auto;
        font-size: 14px;
        text-align: right;
        font-weight:bold;
    }

#IndexList {
    display: table;
    text-align: center;
    vertical-align: middle;
    /*width: 91%;*/
    padding: 2%;
    margin-right: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-left: 0;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 20px;
    width: 46px;
    z-index: 39;
    padding: 20px 0px 0px 19px;
}

#titleGallery {
    background-color: none;
    width: 31px;
    height: 33px;
    margin-left: 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%;*/
}

    /*#content ul li:nth-child(4n+1) {
        clear: both;
    }*/

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

.TableStation {
    text-align:right;
}

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;
    left: 0;
    right: 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: right;
}

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

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

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

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

a.grapsButton {
}

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

.titlePageH1 {
    float: right;
}

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

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

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

#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-right: 10px;*/
    margin-left: 5%;
    text-align: center;
    width: 100%;
}

    .textBubble .titleBubble {
        direction: rtl;
        float: right;

        font-weight: bold;
        margin-right: 5px;
        position: relative;
        text-align: left;
        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: right;
        width: 300px;
    }

.maximize, .restore {
    display: none;
}

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

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

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

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

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

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

    .titleTable:last-child {
        border-left: 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-right: 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;
    overflow:hidden;
}

    #LinksDiv .link {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
        font-size: 12px;
        padding: 0 19px;
        border-left: 2px solid rgba(0, 0, 0, 0.18);
        line-height: 1.20;
   
    }

#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-right: -23px;
    padding: 6px 7px;
    position: absolute;
    text-align: center;
    vertical-align: middle;
    width: 9px;
     
    text-shadow: 1px 1px 17px black;
}

#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;
    left: 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: right;

    }

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

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

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

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

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

#MonitorsZeroDiv {
    float: right;
}

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

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

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

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

.clacDiv label {
    float: right;
}

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

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

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

#ReportType {
    float: right;
}

    #ReportType label {
        float: right !important;

        padding: 3px 0px 0px 5px !important;
    }
    #dateForm{
        direction: rtl;
    float: right;
    }
    #dateFormPeriod{
       padding:27px 0px 0px 6px !important;
    }
        #dateForm div {
            float:right !important;
           
        }
        .input-append .add-on, .input-prepend .add-on{
            float:right;
        }
#ValidInput {
    float: right;
    margin-right: 47px;
}

    #ValidInput label {
        float: right;

    }

    #ValidInput input {
        float: right;

        margin-right: 5px;
    }
    #Countries{
        float:right !important;
    }
    .generalInput{
        float:right !important;
    }
    .generalLable{
        float:right !important;
            margin-right: 7px;
            margin-left: 0px !important;
    }
    #AdvanceReportArrow{
        transform:rotate(180deg);
        float:right !important;
        margin-left:5px;
    }
    #FourthMaxMonitorsDiv{
        float:right !important;
      
    }
    #FourthMaxTypeDiv{
          width: auto !important;
              float: right !important;
    margin-right: 4px !important;
    }
    #AdvanceReportInputs{
            margin-right: 9px;
    }
    .ListOfCountryAndSite{
        background-color: rgb(255, 255, 255);
        padding:5px;
    }
    #MonitorsDiv{
        float:right !important;
        width: 300px !important;
        height:auto !important
    }
    #ListOfMonitors label{
            font-size: 12px;
    float: right !important;
    width:auto !important;
    }
    .titlePageH1 h1{
        padding-right:5px;
    }
    #ListOfMonitors input{
            float: right !important;
    margin-left: 7px;
    margin-top: 3px;
    }
    #ListOfCountres input, #ListOfSites input{
        float:right !important;
    }
    #ListOfCountres label, #ListOfSites label{
        float:right !important;
        margin-right: 10px;
    }
    #FourthMaxDiv{
        float:right !important;
    }
#displayFor {
    float: right;
    margin-right: 40px;
}

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

    #SortBy label {
        float: right;

        margin-left: 10px;
        margin-top: 4px;
    }

#SortBydateOrSite {
    width: 100px;
}

.ListOfMonitors {
    width: 100%;
}

#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;
}
.CloseGraph{
        right: 68px !important;
          left:inherit !important;
}
#ListMessages li{
      /* box-shadow: 0px 0px 9px black; */
    display: inline-table;
    padding: 2% !important;
    text-align: center;
    position: relative;
    /* width: 17%; */
    margin: 1%;
    padding: 2%;
    float: left;
}
.Message{
    margin: 0 auto 2px;padding: 10px;background: rgb(245, 245, 245);
    text-align:center;
    width:100%;
}
.MessageTitle
{
     padding: 0px 12px 10px;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    display:block
}
.MessageNameDate{
    float: right; width:15%;
}
.MessageTitleBody{
float: left; width: 85%;
}
.MessageDate
{
    font-size: 12px;
}
.MessageName{
    font-weight:bold;
}
#ListMessages a
{
    text-decoration: none;
}
@media (max-width : 1794px) {
    .coverMonitors {
      
        /*float: left;*/
    }
}
@media (max-width : 1320px) {
    .RadioClass:nth-child(2n){
        float:left !important;
        margin-top:5px;
    }
}
@media (max-width : 1300px) {
    .coverMonitors {
        width: 592px;
        /*float: left;*/
    }

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

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

    #agency {
        display: none;
    }

    ul#menu li a {
        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-right: 25px !important;
        /*height:39px;*/
        /*overflow:hidden;*/
    }

    #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 .coverMonitors {
        width:auto;
    }
     .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,ul#menu li div,.theList li {
        font-size: 13px !important;
    }
     ul#menu li ul li a {
        font-size: 12px !important;
        /*padding: 0 31px !important;*/
    }
    #navheader {
        width: auto;
        margin-right: 25px !important;
    }

    #AvisoryText {
        width: 70% !important;
    }

    #AdvisoryTitle {
        width: 20%;
    }

    #main {
        min-height: initial;
    }
}

@media (max-width : 870px) {
            #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%;
    margin:0 auto;
    position:relative;
}
 #imageSlider{
margin:0 auto;width:100%
}
    #LogoTopTitle {
        display: none;
    }

    #LogoTopRightTitle {
        display: none;
    }
    #sliderDivKML{
        width:auto !important;
    }
}

@media (max-device-width : 785px) {
    .ConnectionBotton{
display:none;
}
     .forwardRewind{
        display:none;
    }
    .kmlListMonitors
    {
        bottom:6px !important;
    }
    .coverMonitors{
        display:none;
    }
            #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%;
    margin:0 auto;
    position:relative;
}
     #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-right:4px !important;
        margin-bottom:4px !important;
        font-size:14px !important;
    }
   .HomeRightDiv #aqiTodayDIv{
       font-size:14px !important;
   }
    .TableaqiDIv div{
        font-size:9px !important;
    }
       #HmapDIv{
        margin-left:0px !important
    }
       #MessagesList{
           padding:3px !important;
           margin-right:0px !important;
       }
       #LeftTopMessagesList{
           padding-left:5px !important;
       }
       #ListmonitoringStationDiv{
            padding:3px !important;
           margin-left: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 44px 4px 5px !important;
    }

    #masthead {
        overflow: initial !important;
    }

    .PollutantSelect {
        display: block !important;
        float: left;
        margin: 7px;
        width: auto;
    }

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

    #main {
        min-height: initial;
    }

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

    }

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

    #AvisoryText {
        width: 63% !important;
    }

    #AdvisoryTitle {
        display: none;
    }

    #LinksDiv .link {
        display: block !important;
        border-left: 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: right;

        /*width: 20%;*/
    }
    /*#ButtonsIndexesArea{
        left:0;
    }*/

    .liValList .colorName {
      
        font-size: 12px;
        line-height: 1.1;
    }

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

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

        #buttons > select {
            width: 157px !important;
        }

    #ImageInfoStation {
        float: none;
    }

    #lang {
        display: none;
    }

    .logOnOf {
        display: none;
    }

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

    #content {
        width: 95% !important;
    }

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

    .TableStation h2 {
        height: 82px;
    }

    .Allgraph {
        top: 44px;
    }

    #Top_Content {
        padding-right: 20px;
    }

    .serchDiv {
        width: auto;
    }

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

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

@media (max-width : 785px) {
       .kmlListMonitors
    {
        bottom:6px !important;
    }
            #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%;
    margin:0 auto;
    position:relative;
}
     #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-right:4px !important;
        margin-bottom:4px !important;
        font-size:14px !important;
    }
   .HomeRightDiv #aqiTodayDIv{
       font-size:14px !important;
   }
    .TableaqiDIv div{
        font-size:8px !important;
    }
       #HmapDIv{
        margin-left:0px !important
    }
       #MessagesList{
           padding:3px !important;
           margin-right:0px !important;
       }
       #LeftTopMessagesList{
           padding-left:5px !important;
       }
       #ListmonitoringStationDiv{
            padding:3px !important;
           margin-left: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 {
        right: 18px !important;
        top: 0 !important;
    }

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

    .serchDiv {
        width: auto;
    }

    .TableStation h2 {
        height: 82px;
    }

    .Allgraph {
        top: 44px;
    }

    #Top_Content {
        padding-right: 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 44px 4px 5px !important;
    }

    #masthead {
        overflow: initial !important;
    }

    .PollutantSelect {
        display: block !important;
        float: left;
        margin: 7px;
        width: auto;
    }

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

    #main {
        min-height: initial;
    }

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

    }

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

    #AvisoryText {
        width: 63% !important;
    }

    #AdvisoryTitle {
        display: none;
    }

    #LinksDiv .link {
        display: block !important;
        border-left: 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: right;

        /*width: 20%;*/
    }

    .liValList .colorName {
          line-height: 1.1;
        font-size: 12px;
        
    }

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

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

        #buttons > select {
            width: 157px !important;
        }

    #ImageInfoStation {
        float: none;
    }

    #lang {
        display: none;
    }

    .logOnOf {
        display: none;
    }

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


.MinPlus {
    float: right;
    font-size: 27px;
    padding: 3px 6px;
}
.MinPlusAng{
       cursor: pointer;
   
}
.CategoryCover {
    /*border: 1px solid #cccccc;*/
    /*width: 206px;*/
    /*border-radius: 3px;*/
    padding: 4px 0px;
}

.MinPlusText{
    float:right;
    padding:0px 5px;
}
.listOfCounty{
    display:none;
        clear: both;
    max-height: 200px;
    overflow-y: auto;
    /*max-width: 186px;*/
    padding: 10px;
    direction: rtl;
    text-align: right;
    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:right;
}
#leftFilter {
    width: 21%;
    height: 100%;
    float: right;
    padding: 1%;
    min-width:125px;
    border-left: 1px solid #99C8EB;
}
#RightFilter{
    width:76%;
    height:100%;
    float:left;
    left:0;
    right:auto !important;
}
#RightTopFilter{
    width:100%;
}
#RightbottomFilter{
     width:100%;
}
.activeOption{
float:right !important;
}
.countyArea{
    padding: 0px 0px;
    overflow: hidden;
    min-width: 125px;
    border: 1px solid #cccccc;
    border-radius: 3px;
    margin-bottom: 12px;
}
.PeriodOption{
	float:right !important;
}
.countyArea label{
float:right !important;
margin-right:5px;
}
.activeOption input{
float:right !important;

}
.activeOption label
{
	float:left !important;
} 
.box-col {
    float: right;
    margin: 5px;
    /*max-width: 20%;*/
}
.DateTitle{
   float: right;
    margin-left: 5px;
    padding: 6px;
}
.k-grid-header th.k-header, .k-filter-row th
{
    text-align:right !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-left:17px !important;
    padding-right:0px !important;
}*/
.stationName{

}
#ToTimeBaseSelectedTitle{
    float:right;
    margin-left:10px;
    margin-top:5px;
}
#ToTimeBaseSelected{
    float:left;
    padding:7px;
    margin-bottom:0px;
}
#ButtonClick{
    margin-top: 5px;
    margin-right: 10px;
    float:right;
}




@media (max-width : 710px) {
        .RadioClass:nth-child(2n)
    {
        float:right !important;
        margin-top:0 !important;
    }
    #leftFilter{
        width:100%;
    }
    #RightFilter{
       width:100%;
    }
    .inputsfilter input
    {
        margin-bottom:2px !important;
    }
    .inputsfilter
    {
       width:99%
    }
    .inputsfilter ! select{
        width:100%;
    }
     #StationsSel{
         height:32px !important;
     }      
   }

.section-sub-wrapper {
    float: right;
}

.fixed-header {
        top:0;
        position:fixed;
        width:auto;
        z-index: 1;
      }
    
.k-grid-content-locked {
        float: right;
    }

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

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

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

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

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

   

     .languageMenu{
         margin-left:270px;
        margin-top: 14px !important;

     }

     #LogoSystemNameRightDiv
     {
        margin-top: 14px;
     }

.logOnOfli.lengInMenu {
        margin-top: 5px;
}

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

#pollutantsMenu .k-menu-expand-arrow {
    position:absolute !important;
    left:0 !important;
    top:10px !important;
}


#headerMap {
    padding-right: 5px;
}