﻿body, html {
    height: 100%;
    padding: 0;
    margin: 0;
    background-color: #fafafa;
}

.hover-tr:hover {
    background:rgba(235, 254, 155, 0.30)
}

.webtable {
width:100%;
height:100%;
}
.page-header h1 {
    margin-top: 0;
}

.w100 {
    width: 100px;
}

.w120 {
    width: 120px;
}

.w200 {
    width: 200px;
}


.w300 {
    width: 300px;
}

.w350 {
    width: 350px;
}

.w600 {
width:600px;
}

.w700 {
    width: 700px;
}

.red {
color:red;
}

.grad {
    background: #ec5c05;
    background: -moz-linear-gradient(top, #ec5c05 -1%, #ec5c05 100%);
    background: -webkit-linear-gradient(top, #ec5c05 -1%,#ec5c05 100%);
    background: linear-gradient(to bottom, #ec5c05 -1%,#ec5c05 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec5c05', endColorstr='#014077',GradientType=0 );
}

.required {
/*border:1px solid red;*/

}

.errorspan {
    font: bold 10px Arial, sans-serif;
    line-height: 1.1em;
    color: red;
    padding: 2px 2px 0 2px;
    text-align: center;
    height: 16px;
    display: none; /*Required as we will use jQuery to fade in the error message */
    position: absolute; /* Required */
    /*right: 0;  Required - initially set all error messages to the right of the form row */

}

footer {
    
    padding-top: 8px;
}

.bfooter {
    padding-bottom: 3px;
    padding-top: 3px;
    background-color: #f5f5f5;
    color: #333;
}

.f9 {
    font-size: 9pt;
}

.wtitle {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    color: #cccccc;
}

.nobullets {
    list-style: none;
    padding: 0px;
}
    .nobullets li {
   
      margin-left:2px;
    }

.gtext {
    font-size: 10pt;
    color: #787878;
    font-family: Arial;
}

.yellowtext {
    font-size: 13pt;
    color: orange;
    font-family: Arial;
}

.redtext {
    font-size: 13pt;
    color: red;
    font-family: Arial;
}

.greentext {
    font-size: 13pt;
    color: green;
    font-family: Arial;
}

a.blacklink, a.blacklink:link, a.blacklink:active {
    font-size: 10pt;
    color: #333;
    font-family: Arial;
    text-decoration: none;
}

    a.blacklink:hover {
        font-size: 10pt;
        color: #212121;
        font-family: Arial;
        text-decoration: none;
    }


a.logout, a.logout:link, a.logout:active {
    font-size: 10pt;
    color: #015292;
    font-family: Arial;
    text-decoration: none;
}

    a.logout:hover {
        font-size: 10pt;
        color: #003f71;
        font-family: Arial;
        text-decoration: none;
    }


a.bluelink, a.bluelink:link, a.bluelink:active {
    font-size: 10pt;
    color: #0076a3;
    font-family: Arial;
    text-decoration: none;
}

    a.bluelink:hover {
        font-size: 10pt;
        color: #0076a3;
        font-family: Arial;
        text-decoration: none;
    }



a.graylink, a.graylink:link, a.graylink:active {
    font-size: 10pt;
    color: gray ;
    font-family: Arial;
    text-decoration: none;
}

    a.graylink:hover {
        font-size: 10pt;
        color: #0076a3;
        font-family: Arial;
        text-decoration: none;
    }


.inputboxformarea {
    font-family: Arial;
    font-weight: 300;
    font-size: 13pt;
    padding: 3px;
    background-color: #fff;
    color: #333;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.15);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;*/
    /*border:0;
border-bottom:1px solid gray;*/
    outline: 0;
    margin-top: 3px;
    height:100px;
}

.inputboxform {
    font-family: Arial;
    font-weight: 300;
    font-size: 13pt;
    padding: 3px;
    
    background-color: #fff;
    color: #333;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.15);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;*/
    /*border:0;
border-bottom:1px solid gray;*/
    outline: 0;
    margin-top: 3px;
}


.inputbox {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 14pt;
    padding: 6px;
    border: 1px solid #ededed;
    background-color: #fff;
    width: 300px;
    color: #333;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.15);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;*/
    /*border:0;
border-bottom:1px solid gray;*/
    outline: 0;
}

.webtitle{
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-size: 18pt;
    color: #b1b1b1;
}

.font14{
      font-size: 14pt;
}

.pill{
 background-color: rgba(0, 0, 0, 0.5);
  -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 4px;
}

.inputbox-downline {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 13pt;
    padding: 6px;
    border: 1px solid #ededed;
    background-color: #fff;
    width: 300px;
    color: #333;
	margin-top:3px;
	margin-bottom:3px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.15);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.15);
-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;*/
 border:0;
border-bottom:1px solid #e0e0e0;
    outline: 0;
}

button.black {
    background-color: #595959;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 4px;
    font-weight: normal;
    height: 36px;
    padding-left: 8px;
    padding-right: 8px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
}


button.black:hover {
    background-color: #383838;
    color: #fff;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -kthtml-transition: all 0.3s linear;
    transition: all 0.3s linear;
}


button.green {
    background-color: #598527;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 4px;
    font-weight: normal;
    height: 36px;
    padding-left: 8px;
    padding-right: 8px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
}


    button.green:hover {
        background-color: #197b30;
        color: #fff;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }

button.red {
    background-color: #e5141c;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 4px;
    font-weight: normal;
    height: 36px;
    padding-left: 8px;
    padding-right: 8px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
}


    button.red:hover {
        background-color: #c80910;
        color: #fff;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }


button.orange {
    background-color: orange;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 4px;
    font-weight: normal;
    height: 36px;
    padding-left: 8px;
    padding-right: 8px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
}


    button.orange:hover {
        background-color: darkorange;
        color: #fff;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }



.margin4 {
    margin: 4px;
}


.shadow {
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
}


#scrollup {
    position: fixed;
    bottom: 14px;
    right: 14px;
    z-index: 100000;
    display: none;
    cursor: hand;
    cursor: pointer;
}


.freebox {

  
    background-color: #fff;
   
    vertical-align: top;
    text-align: left;
    border: 0px solid #fdfdfd;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    /*float:left;*/
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    clear: both;
}

.freebox-sidebar {
    border-top: 1px solid rgba(50, 50, 50, 0.8);
    background-color: #fff;
    vertical-align: top;
    text-align: left;
    border: 0px solid #fdfdfd;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.3);
    /*float:left;*/
    height: 100%;
    clear: both;
  
}



.loginbox {
   width:320px;
         height:280px;
		 
		  position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -170px;
    margin-left: -160px;
 
		 
		 
          background-color:#fff;
  
       padding:0px;
        
     
        padding:2px;
        
         vertical-align:top;
 text-align:center;
        border:0px solid #fdfdfd;
     -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.1);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.1);

/*float:left;*/

  -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;

clear:both;
}


.loginbox h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    padding: 8px;
    margin: 0;
    font-size: 16pt;
    color: #333;
}


.loginbox2 {
   width:328px;
         height:280px;
         
          position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -170px;
    margin-left: -160px;
 
         
         
          background-color:#fff;
  
       padding:8px;
        
     
        padding:2px;
        
         vertical-align:top;
 text-align:center;
        border:0px solid #fdfdfd;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);


/*float:left;*/

  -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;

clear:both;
}


.loginbox2 h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    padding: 8px;
    margin: 0;
    font-size: 16pt;
    color: #333;
}

.ynotification {
    padding: 4px;
    display: inline-block;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color: #fff799;
    border: 1px solid #e8dc45;
}

.icon-search {
    padding-left: 38px;
    background-repeat: no-repeat;
    background-position: 4px -3px;
    background-image: url('icons/view.png');
    background-size: 24px;
}


.icon-email {
    padding-left: 38px;
    background-repeat: no-repeat;
    background-position: 4px 7px;
    background-image: url('icons/email.png');
    background-size: 24px;
}

.icon-pass {
    padding-left: 38px;
    background-repeat: no-repeat;
    background-position: 4px 7px;
    background-image: url('icons/pass.png');
    background-size: 24px;
}


.icon-dash {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px 0px;
    background-image: url('icons/dashboard.png');
    background-size: 16px;
}

.icon-forecast {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px 0px;
    background-image: url('icons/forecastDA.png');
    background-size: 16px;
}

.icon-livedata {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/Missingdata.png');
    background-size: 20px;
}


.icon-profile {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/forecastHA.png');
    background-size: 20px;
}

.icon-historical {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/historical.png');
    background-size: 20px;
}

.icon-euro {
    padding-left: 28px;
    background-repeat: no-repeat;
    background-position: 0px -6px;
    background-image: url('icons/euro.png');
    background-size: 28px;
}

.icon-feeder {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/feeder.png');
    background-size: 20px;
}

.icon-reports {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/Status normal.png');
    background-size: 20px;
}



.icon-alert {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/alerting.png');
    background-size: 20px;
}

.icon-loc {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/location2.png');
    background-size: 20px;
}

.icon-api {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/api.png');
    background-size: 20px;
}


.icon-eflow {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/eflow.png');
    background-size: 20px;
}

.icon-vpp {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/vpp.png');
    background-size: 20px;
}

.icon-solar {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('images/solar-panel.png');
    background-size: 20px;
}


.icon-dash-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/dashboard.png');
 display:inline-block;

}
.icon-accepted-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/accepted.png');
    display: inline-block;
}

.icon-pending-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/pending.png');
    display: inline-block;
}

.icon-newform-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/newform.png');
    display: inline-block;
}


.icon-formmanual-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/formmanual.png');
    display: inline-block;
}

.icon-form-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/form.png');
    display: inline-block;
}

.icon-form {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/form.png');
    background-size: 20px;
}


.icon-user-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/user2.png');
    display: inline-block;
}

.icon-user {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/user2.png');
    background-size: 20px;
}

.icon-alerts-big {
    padding-left: 64px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/alerts.png');
    display: inline-block;
}

.icon-alerts {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/alerts.png');
    background-size: 20px;
}


.icon-station {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/ic_settings_input_antenna_black_24dp_2x.png');
    background-size: 20px;
}

.icon-newform {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/newform.png');
    background-size: 20px;
}

.icon-pending {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/pending.png');
    background-size: 20px;
}

.icon-form {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/form.png');
    background-size: 20px;
}


.icon-accepted {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/accepted.png');
    background-size: 20px;
}

.icon-formmanual {
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 4px -2px;
    background-image: url('icons/formmanual.png');
    background-size: 20px;
}

.icon-station-big {
    padding-left: 62px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url('icons/ic_settings_input_antenna_black_24dp_2x.png');
    display: inline-block;
}

a.menulink {
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 11pt;
    padding-left: 4px;
    font-weight: normal;
    height: 40px;
    line-height: 40px;
    display: block;
    padding-top: 2px;
    outline: 0;
    color: #565656;
    padding-right: 6px;
    overflow: hidden;
    width: 200px;
    text-align:left
}


    a.menulink:hover {
        background-color: #f5f5f5;
        color: #565656;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }


a.menulink2 {
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 10pt;
    padding-left: 22px;
    font-weight: normal;
    height: 40px;
    line-height: 40px;
    display: block;
    padding-top: 2px;
    outline: 0;
    color: #565656;
    padding-right: 6px;
    overflow: hidden;
    width: 184px;
    text-align: left
}


    a.menulink2:hover {
        background-color: #f5f5f5;
        color: #565656;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }


    a.parklink {
        font-family: Arial;
        text-decoration: none;
        cursor: pointer;
        font-size: 10pt;
        padding-left: 4px;
        font-weight: normal;
        height: 24px;
        line-height: 24px;
        display: block;
        padding-top: 2px;
        outline: 0;
        color: #565656;
        padding-right: 6px;
        overflow: hidden;
        width: 100%;
        text-align:left
    }
    
    
        a.parklink:hover {
            background-color: #f5f5f5;
            color: #565656;
            -webkit-transition: all 0.3s linear;
            -o-transition: all 0.3s linear;
            -moz-transition: all 0.3s linear;
            -ms-transition: all 0.3s linear;
            -kthtml-transition: all 0.3s linear;
            transition: all 0.3s linear;
        }

.dashbox h4, table, p {
    margin-left:8px;
}

		.dashbox p{
		margin-bottom:4px;
		    color: #858585;
			font-size:8pt;
		}

        .dashbox td{
        margin-bottom:4px;
            color: #858585;
            font-size:9pt;
        }
		
		.dashbox{
    width: 280px;
    height: 150px;
  
    background-color: #fff;
    display: -moz-inline-stack;
    display: inline-block;
    padding: 0px;
    margin: 8px;
    zoom: 1;
    *display: inline;
    padding: 2px;
    position: relative;
    vertical-align: top;
    text-align: left;
    border: 0px solid #f5f5f5;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    cursor: pointer;
    cursor: hand;
    /*float:left;*/
    clear: both;
    text-decoration: none;
    
		}
		
		.dashbox:hover{
		 background-color: #f5f5f5;
    color: #565656;
    border: 0px solid #f5f5f5;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -kthtml-transition: all 0.3s linear;
    transition: all 0.3s linear;
		}

a.box:link {
    width: 400px;
    height: 100px;
    line-height: 100px;
    background-color: #fff;
    display: -moz-inline-stack;
    display: inline-block;
    padding: 0px;
    margin: 8px;
    zoom: 1;
    *display: inline;
    padding: 2px;
    position: relative;
    vertical-align: top;
    text-align: left;
    border: 0px solid #f5f5f5;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    cursor: pointer;
    cursor: hand;
    /*float:left;*/
    clear: both;
    text-decoration: none;
    padding-left:8px;
}

a.box:hover {
    background-color: #fbffeb;
    color: #565656;
    border: 0px solid #f5f5f5;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -kthtml-transition: all 0.3s linear;
    transition: all 0.3s linear;
}


#imgloader {
    display:none;
    padding:8px;
    text-align:center;
 position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 100px;
    -webkit-box-shadow: 0px 1px 2px 4px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 1px 2px 4px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 1px 2px 4px rgba(50, 50, 50, 0.1);
     -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color:#fff;
	  z-index:8001
}


#backloader {
    top:0;
    left:0;
    position:fixed;
    height:100%;
    width:100%;
    background-color:rgba(50, 50, 50, 0.45);
    z-index:8000;
    display:none;
}



#popupbg {
    top:0;
    left:0;
    position:fixed;
    height:100%;
    width:100%;
    background-color:rgba(50, 50, 50, 0.45);
    z-index:8000;
    display:none;
}

#popupcontent {
    min-height:100px;
    min-width:100px;
-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;


        border:0px solid #fdfdfd;
     -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.1);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.1);

display:block;
position:absolute;
background-color:#ffffff;
padding:16px;
}

#popupactions {
text-align:center;
}

#popuptitle {
 font-family: 'Roboto', sans-serif;
    font-weight:400;
   
color:#000;
font-size:16pt;
padding-left:4px;
padding-top:4px;
padding-bottom:4px;
}


#popuphtml {
padding-top:6px;
padding-bottom:10px;
}

.pagepath{
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    color: #333;

}

.indic-green {
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background-color: green;
    border: 0;
    width: 18px;
    height: 18px;
}

.alert-red {
    position:absolute;
    top:16px;right:16px;
    display:inline-block;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background-color: red;
    border: 0;
    width: 24px;
    height: 24px;
    color:white;
    text-align:center;
    font-weight:bold;
    line-height:24px;
}


.table-hover tbody tr:hover td {
    background: rgba(235, 254, 155, 0.20);
}


.ctable {
    width:100%;
    font-family: 'Arial';
    font-weight: 300;
    color: #5c5c5c;
    font-size: 10pt;
}

    .ctable td {
        border-bottom: 1px solid #ededed;
        padding: 4px;
    }


a.viewfile {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 0px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/view.png');
    background-size: 24px;
    display:block;
}


    a.viewfile:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }



button.stationview {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/view.png');
    background-size: 24px;
}


    button.stationview:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }


button.deleteuser {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/delete.png');
    background-size: 24px;
}


    button.deleteuser:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }



button.sendemail {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/emailblack.png');
    background-size: 24px;
}


    button.sendemail:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }


button.done {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/done.png');
    background-size: 24px;
}


    button.done:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }

button.stationedit {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/edit.png');
    background-size: 24px;
}


    button.stationedit:hover {
        /*background-image: url('icons/graphbarwhite.png');
        background-color: #333;*/
        color: #fff;
        -webkit-transition: all 0.1s linear;
        -o-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
        -kthtml-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }


button.stationclear {
    background-color: transparent;
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 12pt;
    padding: 2px;
    font-weight: normal;
    height: 24px;
    padding-left: 6px;
    padding-right: 6px;
    outline: 0;
    color: #fff;
    border: 0;
    overflow: hidden;
    text-align: center;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*-webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);*/
    width: 30px;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-image: url('icons/close.png');
    background-size: 24px;
}



.agreen {
    color: #197b30;
}


.bold {

font-weight:bold;
}


.boxhover:hover {
opacity:1.0;
}

#leftpanel0{
    width: 200px;
    height:800px;
    top:140px;
    
    position:absolute;
    background-color:transparent;
   padding: 4px;
   
}

#leftpanel{
    width: 200px;
    height: 200px;
    top:140px;
    left: 20px;
    position:fixed;
    background-color: #fff;
   padding: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);
}


a.dashboardlink {
    font-family: Arial;
    text-decoration: none;
    cursor: pointer;
    font-size: 10pt;
    padding-left: 4px;
    font-weight: normal;
    height: 80px;
    line-height: 100px;
    display: block;
    padding-top: 2px;
    outline: 0;
    color: #4f4f4f;
    padding-right: 6px;
    overflow: hidden;
min-width:120px;
    text-align:center;
}


    a.dashboardlink:hover {
        background-color: #f4f4f4;
        color: #4f4f4f;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
        -kthtml-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }


.icon-dashboard-dash {
    padding-top: 14px;
    background-size:32px;
    background-image: url('icons/dashboard.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}

.icon-forecast-dash {
    padding-top: 14px;
    background-size:32px;
    background-image: url('icons/forecast.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}

.icon-historical-dash {
    padding-top: 14px;
    background-size: 38px;
    background-image: url('icons/historical.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}

.icon-feeder-dash {
    padding-top: 14px;
    background-size: 38px;
    background-image: url('icons/feeder.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}

.icon-eflow-dash {
    padding-top: 14px;
    background-size: 38px;
    background-image: url('icons/eflow.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}

.icon-vpp-dash {
    padding-top: 14px;
    background-size: 38px;
    background-image: url('icons/vpp.png');
    background-repeat: no-repeat;
    background-position: center 10px;
    display: inline-block;
}


.dashlineright {
border-right:1px solid #f5f5f5;
}



.sitenaviseltitle{
     padding: 0px;
    
 font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #333
}



.sitenaviselarrow{ padding: 4px;
    
 font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 17pt;}

.sitenavisel{
    display: inline-block;
    padding: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border:1px solid #8d8d8c;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:    0px 1px 2px 0px rgba(50, 50, 50, 0.25);
box-shadow:         0px 1px 2px 0px rgba(50, 50, 50, 0.25);
 font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 17pt;
}

.sitenavitable td {
    padding: 6px;
}


.panel > .panel-heading {
    background-image: none;
    background-color: white;
    color: black;
 font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 12pt;
}

.row-no-padding {
   padding: 0 !important;
   margin: 0 !important;
}


.icon-csv {
    padding-left: 34px;
    background-repeat: no-repeat;
    background-position: 4px 8px;
    background-image: url('icons/csvexport.png');
    background-size: 24px;
}

.icon-pdf {
    padding-left: 34px;
    background-repeat: no-repeat;
    background-position: 4px 8px;
    background-image: url('icons/pdf.png');
    background-size: 24px;
}

.icon-email {
    padding-left: 34px;
    background-repeat: no-repeat;
    background-position: 4px 8px;
    background-image: url('icons/emailblack.png');
    background-size: 24px;
}