﻿
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px; 
}

.iconimag
{
    height:20px;
    width:20px;
}

.RainfallCellNormal
{
    color:white;
    font-weight:bold;
    background-color:#00c800;
}

.RainfallCellModerate
{
        color:white;
        font-weight:bold;
    background-color:#F3E803;
}

.RainfallCellHeavy
{
        color:white;
        font-weight:bold;
    background-color:#ff7d00;
}

.RainfallCellVeryHeavy
{
        color:white;
        font-weight:bold;
    background-color:#ff0000;
}

.RainfallCellDefalut
{
        color:#000;
        font-weight:bold;
    background-color:#fff;
}
.dlTable
{
    /*background: rgba(0, 0, 0, 0) linear-gradient(#fff, #6691dc) repeat scroll 0 0;*/
    background-color:#36c766;
}

 #PregressPanel
    {
        background-color: #000;
        opacity: 999;
        width: 100%;
        top: 0;
        left: 0;
        height: 100%;
        opacity: 0.6;
        position: fixed;
        background-repeat: repeat-y;
        background-size: 100% auto;
        padding: 0;
        margin: 0;
        z-index: 0;
        /*text-align:center;*/
        /*vertical-align:central;*/
    }



    #PregressPanelDiv
    {
    position:absolute;
    top: 50%;
    left: 50%;
        padding: 10px;
        border: 2px solid #44b449;
        background-color: #fff;
    }
 
.dalPreogress
{
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    top: 0;
    background-color: Black;
    filter: alpha(opacity=60);
    opacity: 0.6;
    -moz-opacity: 0.8;
}
.ceterPreogress
{
    z-index: 1000;
    margin: 300px auto;
    padding: 10px;
     width: 60px; 
    background-color: White;
    border-radius: 10px;
    filter: alpha(opacity=100);
    opacity: 1;
    -moz-opacity: 1;
}
.centerPreogress img
{
    height: 55px;
    width: 55px;

}

 
.ui-timepicker-inline { display: inline; }

#ui-timepicker-div { padding: 0.2em; font-size:0.9em; }
.ui-timepicker-table { display: inline-table; width: 0; }
.ui-timepicker-table table { margin:0.15em 0 0 0; border-collapse: collapse; }

.ui-timepicker-hours, .ui-timepicker-minutes { padding: 0.2em;  }

.ui-timepicker-table .ui-timepicker-title { line-height: 1.8em; text-align: center; }
.ui-timepicker-table td { padding: 0.1em; width: 2.2em; }
.ui-timepicker-table th.periods { padding: 0.1em; width: 2.2em; }

/* span for disabled cells */
.ui-timepicker-table td span {
	display:block;
    padding:0.2em 0.3em 0.2em 0.5em;
    width: 1.2em;

    text-align:right;
    text-decoration:none;
}
/* anchors for clickable cells */
.ui-timepicker-table td a {
    display:block;
    padding:0.2em 0.3em 0.2em 0.5em;
    width: 1.2em;
    cursor: pointer;
    text-align:right;
    text-decoration:none;
}


/* buttons and button pane styling */
.ui-timepicker .ui-timepicker-buttonpane {
    background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0;
}
.ui-timepicker .ui-timepicker-buttonpane button { margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
/* The close button */
.ui-timepicker .ui-timepicker-close { float: right }

/* the now button */
.ui-timepicker .ui-timepicker-now { float: left; }

/* the deselect button */
.ui-timepicker .ui-timepicker-deselect { float: left; }

.Grid
{
    border: solid 1px #000;
}

    .Grid td
    {
        padding: 5px;
        text-align: center;
    }

.GridHeader th
{
      padding: 5px;
        text-align: center;
}

.GridHeader
{
    background-color: #ceddf8; 
    font-weight: bold;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    /*#6691dc*/
}

.GridItem
{
    background-color: #fff;
}

.GridAtlItem
{
    background-color: #efefef;
}


.modal
{
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    top: 0;
    background-color: Black;
    filter: alpha(opacity=60);
    opacity: 0.6;
    -moz-opacity: 0.8;
}
.center
{
    z-index: 1000;
    margin: 300px auto;
    padding: 10px;
    width: 130px;
    background-color: White;
    border-radius: 10px;
    filter: alpha(opacity=100);
    opacity: 1;
    -moz-opacity: 1;
}
.center img
{
    height: 128px;
    width: 128px;
}


.blueDiv a
{
    color:#000;
}

.content iframe
{
    min-width:100%;
    min-height:100%;
}

.station-info-head
{
    padding:10px;
    background-color:#cedef8;
    font-size:15px;
}

.station-info-row
{
    padding:10px;
    background-color:#f1f1f1;
     
}

 
.head-row-cell
{
    text-align:center;
    vertical-align:middle;
    font-weight:bold;
    background-color:#ceddf8;
    text-wrap:normal;
    padding:5px;
}

.table-row-cell td
{
    text-align:center;
    vertical-align:middle; 
    text-wrap:normal;
    padding:2px;
}

.table-row-cell td a
{
 color:#000;
}

.sec-name
{
   font-family: Arial,Helvetica,sans-serif;
    font-size: 20px;
    padding-left: 80px;
    padding-top:15px;
    padding-bottom:15px;
    background-color:#064288;
    color:#FFF;
    font-weight:bold;
}
.dashlink
{
    text-decoration:none;
}

.search-query
{
    height:30px;
    width:200px;    
    border:1px solid #4695d3
}
 

.search-query:focus { /* When you click on the field... */
    border-color: #6EA2DE;
    box-shadow: 0px 0px 10px #6EA2DE;
}

.greenDiv
{
    background-color:#00c800;
    border:1px solid #000;    
}

.yelloDiv
{
    background-color:#ff7d00;
    border:1px solid #000;    
}

.yelloDarkDiv
{
    background-color:#ffff00;
    border:1px solid #000;    
}

.purpleDiv
{
    background-color:#F3E803;
    border:1px solid #000;    
}

.redDiv
{
    background-color:#ff0000;
    border:1px solid #000;
}

.blueDiv
{
    background-color:#64aaff;
    border:1px solid #000;
}

.text-box-user
{
    height:25px;
    width:200px;
    border:1px solid #4695d3;
}
.text-box-user:focus { /* When you click on the field... */
    border-color: #6EA2DE;
    box-shadow: 0px 0px 10px #6EA2DE;
}

.ddl-drop-user
{
    height:25px;
    width:200px;
    border:1px solid #4695d3;
}
.ddl-drop-user:focus { /* When you click on the field... */
     border-color: #6EA2DE;
    box-shadow: 0px 0px 10px #6EA2DE;
}

.JpsButton {
	-moz-box-shadow: 0px 10px 14px -7px #276873;
	-webkit-box-shadow: 0px 10px 14px -7px #276873;
	box-shadow: 0px 10px 14px -7px #276873;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
	background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
	background-color:#599bb3;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:13px;
	font-weight:bold;
	padding:8px 15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.JpsButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
	background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
	background-color:#408c99;
}
.JpsButton:active {
	position:relative;
	top:1px;
}

.button {
    background-color: #2b91af;
    border-radius: 10px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none
}
.button.small {
    border-radius: 15px;
    float: right;
    margin: 22px 5px 0;
    padding: 6px 15px
}
.button:hover {
    background-color: #1e1e1e
}
.button>span {
    font-size: 84%
}
.button.b-close,
.button.bClose {
    border-radius: 7px 7px 7px 7px;
    box-shadow: none;
    font: bold 131% sans-serif;
    padding: 0 6px 2px;
    position: absolute;
    right: -7px;
    top: -7px
}
 
#popup,
#popup2,
.bMulti {
    background-color: #fff;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 0 25px 5px #999;
    color: #111;
    display: none;
    min-width: 450px;
    padding: 25px
}
#popup .logo {
    color: #2b91af;
    font: bold 325%'Petrona', sans
}
#popup,
.bMulti {
    min-height: 250px
}
#popup2 iframe {
    background: url('loader.gif') center center no-repeat;
    min-height: 240px;
    min-width: 450px
}
.loading {
    background: url('loader.gif') center center no-repeat
}
.bMulti p {
    font: 500%'Petrona', sans-serif;
    padding: 45px 0 0;
    text-align: center
}
.bMulti a {
    left: 175px;
    position: absolute;
    top: 175px
}
.lt-ie9 .bModal {
    background-color: #000
}

/**Below CSS for left menu*/

.blue .accordion{ border-top: 1px solid #013d6c; border-right: 1px solid #013d6c; border-left: 1px solid #013d6c;list-style: none;}
    .blue .accordion ul
    {
        margin-left: 0em;
        margin-bottom: 0px;
    }
.blue .accordion, .blue .accordion li {margin: 0; padding: 0; border: none;list-style: none;}
.blue .accordion a {padding: 10px 10px 10px 15px; background: #0D5995; text-decoration:none; display: block; color: #fff; border-bottom: 1px solid #013d6c; border-top: 1px solid #4695d3;}
.blue .accordion ul a {padding: 10px 10px 10px 25px;list-style: none;}
.blue .accordion a.dcjq-parent, .blue .accordion a.dcjq-parent:hover {padding: 10px 10px 10px 15px;}
.blue .accordion a.dcjq-parent.active {}
.blue .accordion a:hover {background: #05477c;}
.blue .accordion a:active{}

