/* body settin
    gs */

html {
    height: 100%;
}

body{
    background:url(../images/energy.png);
    height:91%;
}
.body-container {
    border:0 solid #dd4814;
    border-bottom: 0;
    min-height:100%;
    background-color:#fff;
}

/* header settings*/

header {
  float: left;
  width: 100%;
}
.my-nav-container {
    float:left;
    width:100%;
}

footer {
    background-color: #DD4814;
    height:10%;
    min-height:80px;
}

.panel {
    padding: 0;
}

.panel-title.tallPanel {
    height: 40px!important;
}

.panel-title {
    font-weight:bold;
}

.panel-body {
    overflow-x: hidden;
}



.globalOp {
    float:right;
    margin-right: 30px;
    margin-top: -5px;
}

.rightOp {
    float: right;
    margin-top: -40px;
    cursor: pointer;
}

.rightDelButton {
    float: right;
    margin-right: 15px;
    margin-top: -10px;
}

/*navbar customize */

.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav>li>a:active {
    text-decoration:underline;
}

.navbar {
    border-radius: 0;
}

/* tables */

 .dataTables_wrapper {
    margin-bottom:45px;
    margin-top: 20px;
}

.table th {
    background-color: #000 !important;
    color:#fff!important;
    text-align:center;
  }

.table {
    border-color: #dd4814!important;
    border-width: 0 0 1px 1px!important;
    border-style: solid!important;
 }

.table td, .table th
{
    border-color: #dd4814!important;
    border-width: 1px 1px 0 0!important;
    border-style: solid!important;
}

/* dataTables

*/

.table .table-striped .table-hover {
    width:100%;
}


.table >tbody> tr> td {
    text-align:center;
    vertical-align: middle;
}

table.dataTable >thead> tr> th {
    vertical-align: top;
}

table.dataTable th,
    table.dataTable td {
        white-space: nowrap;
    }

table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after {
  position: absolute;
  top: 8px;
  right: 8px;
  display: block;
  font-family: 'Glyphicons Halflings';
  opacity: 2.0!important;
}

table.dataTable thead .sorting:after {
    opacity: 1.2!important;
    content: "";
}

.table td.child {
    text-align: left;
}

table.dataTable > tbody > tr.child span.dtr-title {
    min-width:20px!important;
}

.table>tbody>tr>td.leftAligned {
    text-align:left;
}

.table>tbody>tr>td.rightAligned {
    text-align:right;
    padding-right:20px;
}

.table>tbody>tr>td.noNorders {
    border:0 solid white;
}

table.centerTable {
    width:60%;
    padding:0 20%;
    border:0 solid white;
}
.table .centerTable td{
    border:0 solid white!important;
}

.table .centerTable>tbody>tr>td.rightAligned {
    text-align:right!important;
}

/* pagination */

.pagination>li>a, .pagination>li>span {
  border: 1px solid #dd4814!important;
}

/* datatables filter*/

.dataTables_filter input, .dataTables_length select {
    border:1px solid #dd4814!important;
}


/* pivots for responsiveness */

table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
    top: initial!important;
    border-radius: 0!important;
    background-color: #dd4814!important;
}


table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before {
    border-radius: 0!important;
    background-color: #dd4814!important;
}


/* branAndData*/

#brandAndDate {
    float: right;
    margin-bottom:10px;
}

#pBar {
    margin-top:20px;
}

#replyArea {
    margin-top: 10px;
    float: left;
    width: 100%;
}

/* dialogs */

.delItem {
    cursor: pointer;
}

.detailsRight {
    text-align: right;
}



/* tabs color customization */

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
  color: #fff;
  background-color: #dd4814;
  border: 1px solid #dd4814;
}

.nav-tabs {
    border-bottom: 1px solid #dd4814;
}

.nav-tabs>li>a {
    border: 1px solid #dd4814;
}

/* meter images */

.meterImage {
    width:150px;
    height: 150px;
}

.meterImage.thumbnail {
    margin-bottom:0;
}

.halfMeterTop {
    margin-top:95px;
}

.autoCenter {
    margin: 0 auto;
}

.paddingTop9 {
    padding-top:9px;
}

.margintTop10 {
    margin-top:20px;
}

.valueHighlight, .negativeValueHighlight {
    font-weight: bold;
}

.negativeValueHighlight {
    color:red;
}

.ct-label {
    font-size: 1rem!important;
}

#valSummary {
    clear:both;
}

.hasError .form-control {
  border-color: #b94a48;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.hasError .form-control:focus {
  border-color: #953b39;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
}
.hasError .input-group-addon {
  color: #b94a48;
  border-color: #b94a48;
  background-color: #f2dede;
}
.hasError .form-control-feedback {
  color: #b94a48;
}

.hasError .control-label,
.hasError .radio,
.hasError .checkbox,
.hasError .radio-inline,
.hasError .checkbox-inline,
.hasError.radio label,
.hasError.checkbox label,
.hasError.radio-inline label,
.hasError.checkbox-inline label {
  color: #b94a48;
}

.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
    stroke: #000!important;
}

#graphLegend {
    border: 1px solid #888;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 5px;
}

.previousYearBox {
    color: #000;
    background-color: #000;
    width: 10px;
    height: 10px;
    border: 1px solid #000;
    border-radius: 3px;
    float: left;
    margin-top: 5px;

}

.currentYearBox {
    color: #f05b4f;
    background-color: #f05b4f;
    width: 10px;
    height: 10px;
    border: 1px solid #f05b4f;
    border-radius: 3px;
    float: left;
    margin-top: 5px;

}

.previousYear {
    color: black;
    font-size:13px;
    margin-left: 5px;
    float: left;
    margin-top: 1px;
}

.currentYear {
    color: black;
    font-size:13px;
    margin-left: 5px;
    margin-top:1px;
    float:left;
}

.dialogBottomMargin10 {
    margin-bottom: 10px;
}

.previousYear::before {
    /* ReSharper disable once InvalidValue */
    content:box;
}

.cGraphContainer {
    max-height: 450px;
}
.cGraph {
    max-height: 420px;
}

.hiddenFlag, a.hiddenFlag, li a.hiddenFlag {
    display: none;
}

.loadingImage {
    display: inline;
}

.stackedButton {
    margin-top: 10px;
}

/* fix for smaller screens */

@media (max-width: 420px) {
  
  
  .dataTables_filter input {
      width:50%!important;
  }

  .globalOp {
      margin-right:5px;
  }

  .dataTable {
      font-size: 95%;
  }

  .dataTable td, .dataTable th {
      overflow-x:auto;
  }

  table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child {
      padding-left: 5px!important;
  }

  .meterImage {
    width:100px;
    height: 100px;
  }

  .halfMeterTop {
    margin-top:70px;
    }

  .sideButton {
      margin-top: 10px;
  }


  .paddingTop9 {
    padding-top:0;
  }

  .ct-bar {
    stroke-width: 2px!important;
  }

  .justificationGroup {
      margin: 10px 5px;
  }

  .nav-tabs>li {
      width:100%;  /*tabs are full with below 420px*/
  }

 .pagination>li>a {  /*pagination buttons are 50% width*/
     width:100%;
 }

} 

@media (max-width: 768px) {
  
  .bottom10 {
      margin-bottom:10px;
  }

  body {
      font-size: 14px;
  }

  .form-control {
      font-size: 14px;
  }

    .dropdown-menu > li > a {
        line-height: 2;
    }

    .navbar-nav .open .dropdown-menu > li > a {
        line-height: 25px;
    }

    .sideButton {
      margin-top: 10px;
    }

    .paddingTop9 {
        padding-top:0;
    }
    .ct-bar {
    stroke-width: 4px!important;
    }

    .currentYearBox {
        clear:left;
    }
  
     .justificationGroup {
      margin: 10px 5px;
  }
}