@media screen and (max-width: 767px) {
  header[role="banner"] {
    margin-top: 60px;
  }

    header[role="banner"] nav {
      position: fixed;
      top: 0;
      right: 0;
      left: 0;
      z-index: 1030;
    }
}

.list-group .list-group-item:hover {
  color: #222;
  background-color: #efefef;
  text-decoration: none;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 5px 0px;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 5px 0px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 5px 0px;
}

#formContracts .list-group-item:hover .fa-sort {
  color: #c20e1a;
}

#nav_contracts {
  margin-top: -2rem;
  margin-bottom: 2rem;
  z-index: 98;
  position: relative;
}

.dx-widget {
  font-family: inherit !important;
}

.dx-tab {
  padding: 9px 18px;
  border-right: 1px solid #cecece;
  background-color: #f0f0f0;
}

  .dx-tab:last-child {
    border-right: 0;
  }

.dx-tab-text {
  color: #666;
}

.dx-icon {
  font-size: 16px;
  color: #777 !important;
}

.dx-icon-add {
  font-size: 14px;
}

.dx-tab .dx-icon {
  margin-right: 6px;
}

@media (max-width: 767px) {
  #nav_view_tabs .dx-item .dx-icon {
    display: none !important;
  }
}

.dx-tab.dx-state-hover, .dx-tab.dx-tab-selected {
  background-color: #fff;
}

.dx-tab.dx-tab-selected {
  font-weight: 600;
}

.dx-tab-selected .dx-tab-text {
  color: #3f4042;
}

.dx-tab.dx-tab-selected .dx-icon {
  color: #3f4042 !important;
}

.hidden {
  display: none;
}

.state-tooltip {
  z-index: 100;
}

  .state-tooltip h4 {
    font-weight: 600;
    margin-bottom: 9px;
    font-size: 1.1rem;
  }

  .state-tooltip hr {
    margin: 0.4rem 0;
  }

.sortable {
  cursor: n-resize;
}

.sortable-pad {
  padding: 8px;
}

.list-icon-sortable-right {
  text-align: right;
  position: absolute;
  right: 10px;
  margin-top: 25px;
}

.no-close .ui-dialog-titlebar-close {
  display: none;
}

@media screen and (max-width: 767px) {
  .sortable-pad {
    padding: 8px 15px;
  }
}

.normal {
  font-weight: normal;
}

label.normal {
  font-weight: normal;
  margin: 0;
}

#formEfficiency label {
  font-weight: 600;
  margin-bottom: 0;
}

.bs-tooltip-left div, .bs-tooltip-right div {
  text-align: left;
}

.efficiencyBox {
  position: relative;
  margin: 20px 0;
}

  .efficiencyBox .efficiencyBoxMyHousehold {
    position: absolute;
    top: -10%;
    /*bottom: -40px\9; /* IE Specific */
    left: 132px;
    right: 3px;
  }

    .efficiencyBox .efficiencyBoxMyHousehold .arrow {
      padding: 10px;
      background: #3f4042;
      color: white;
      /*border-radius: 5px;*/
      border: 1px solid #3f4042;
      z-index: 100;
      font-size: 14px;
      font-weight: bold;
      white-space: nowrap;
    }

      .efficiencyBox .efficiencyBoxMyHousehold .arrow::before {
        content: "";
        width: 0;
        height: 0;
        border-top: 21px solid transparent;
        border-bottom: 21px solid transparent;
        border-right: 21px solid #3f4042;
        position: absolute;
        left: -21px;
        top: 0px;
      }

  .efficiencyBox .class_a {
    top: -5%;
  }

  .efficiencyBox .class_b {
    top: 9%;
  }

  .efficiencyBox .class_c {
    top: 24%;
  }

  .efficiencyBox .class_d {
    top: 39%;
  }

  .efficiencyBox .class_e {
    top: 54%;
  }

  .efficiencyBox .class_f {
    top: 68%;
  }

  .efficiencyBox .class_g {
    top: 82%;
  }

  .efficiencyBox .report {
    position: absolute;
    top: 60px;
    left: -60px;
    right: 0;
  }

    .efficiencyBox .report.right {
      text-align: right;
    }

  .efficiencyBox .class_e .report, .efficiencyBox .class_f .report, .efficiencyBox .class_g .report {
    top: auto;
    bottom: 60px;
  }

.efficiencyData {
  display: none;
}

.card-header {
  text-transform: uppercase;
  font-size: 1.5rem;
  font-weight: 600;
}

  .card-header .fa {
    margin-right: 0.65rem;
  }

.card-body.smart, .card-footer.smart {
  padding: 10px;
}

.card-body.consumption, .card-footer.consumption {
  padding: 0;
  margin-left: 15px;
  margin-right: 15px;
}

.btn-footer {
  background-color: transparent;
  border-color: transparent;
  color: #3f4042;
}

.dx-tab-text .fa {
  position: relative;
  top: 2px;
  font-size: 18px;
  margin-left: 1px;
  margin-right: 3px;
}

#chart {
  min-height: 320px;
}

#nav_view_tabs {
  min-height: 34px;
}

  #nav_view_tabs.dx-tabs {
    border-width: 1px;
  }

  #nav_view_tabs .dx-item.dx-tab {
    padding: 4px;
    font-size: 13px;
  }

#consumptionFilters .datepicker-here {
  text-align: center;
  /*width: 225px !important;*/
}

.table.table-centered thead th, .table.table-centered tbody td {
  vertical-align: middle;
  text-align: center;
}

  .table.table-centered thead th.text-left, .table.table-centered tbody td.text-left {
    text-align: left;
  }

  .table.table-centered thead th.text-right, .table.table-centered tbody td.text-right {
    text-align: right;
  }

.datepicker {
  z-index: 1100 !important;
}

.valign-bottom {
  vertical-align: bottom !important;
}

#feedback {
  position: fixed;
  right: -360px;
  bottom: 60px;
  height: 430px;
  margin-right: 0;
}

  #feedback.active {
    z-index: 1001;
  }

#feedback-widget {
  z-index: 97;
  float: right;
  width: 360px;
  height: 100%;
}

  #feedback-widget .card {
    background-color: #2f2f2f;
    border-color: #3f4042;
    color: #fff;
  }

  #feedback-widget .card-body {
    padding: 20px;
    min-height: 404px;
  }

  #feedback-widget textarea {
    resize: none;
    background: #3f4042;
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff;
  }

    #feedback-widget textarea::-moz-selection, #feedback-widget textarea::selection {
      color: #3f4042;
      background: #fff;
    }

  #feedback-widget hr {
    border-color: rgba(255, 255, 255, 0.2);
  }

#feedback-tab {
  z-index: 97;
  position: relative;
  top: 210px;
  float: right;
  color: #fff;
  text-transform: uppercase;
  font-size: 22px;
  cursor: pointer;
  text-align: center;
  width: 198px;
  height: 46px;
  padding-top: 5px;
  background-color: #3f4042;
  margin-top: 74px;
  margin-right: -76px;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

  #feedback-tab:hover {
    background-color: #dd0011;
    color: #fff;
  }


@media screen and (max-width: 767px) {
  #feedback {
    display: none;
  }
}

#chart_container {
  height: 420px;
}

.consumption #chart_container {
  height: 330px;
}

.consumptionWidget {
  padding: 1.5rem;
  background-color: rgba(0, 0, 0, 0.03);
  height: 360px;
  overflow: auto;
}

  .consumptionWidget .card-title {
    text-transform: uppercase;
    font-size: 22px;
    font-weight: bold;
  }

  .consumptionWidget hr {
    margin-bottom: 0.6rem;
  }

@media (max-width: 767px) {
  .consumptionWidget {
    height: auto;
    overflow: unset;
  }

  #nav_contracts.addContractsAllowed .dx-tab:last-child {
    width: 42px;
    padding: 5px 9px;
  }
    #nav_contracts.addContractsAllowed .dx-tab:last-child .dx-tab-text {
      text-overflow: unset;
    }
}

#nav_contracts .dx-tabs {
  border-top: 0;
}

#nav_contracts .contracts_warning {
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  border-right: 0;
  width: 42px;
  text-align: center;
  background-color: #fff !important;
  min-height: 43px;
  float: left;
}

  #nav_contracts .contracts_warning .dx-tab-text {
    color: #999;
  }

  #nav_contracts .contracts_warning .dx-tab {
    padding: 9px;
  }

#nav_contracts.hasHiddenContracts #nav_contracts_tabs_container {
  margin-left: 42px;
}

#nav_contracts_tabs {
  min-height: 43px;
}

  #nav_contracts_tabs .fa.not-active {
    color: #AAA;
    margin-left: 0.2rem;
    margin-right: 0.6rem;
    top: 1px;
    font-size: 16px;
    font-weight: 400;
  }

#nav_contracts .alert {
  color: rgba(0, 0, 0, 0.75);
  background-color: #ffa366;
  border-color: rgba(0, 0, 0, 0.1);
  border-radius: 0;
  border-top: 0;
}

.strike {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}

  .strike > span {
    position: relative;
    display: inline-block;
  }

    .strike > span:before,
    .strike > span:after {
      content: "";
      position: absolute;
      top: 50%;
      width: 9999px;
      height: 1px;
      background: #c8c8c8;
    }

    .strike > span:before {
      right: 100%;
      margin-right: 15px;
    }

    .strike > span:after {
      left: 100%;
      margin-left: 15px;
    }


.formConsumptionInput .form-group.row .row {
  margin-right: 0;
  margin-left: 0;
}

  .formConsumptionInput .form-group.row .row > div {
    padding-right: 0;
    padding-left: 0;
  }

  .formConsumptionInput .form-group.row .row .input-group-text {
    display: block;
    border-left-width: 0;
    border-right-width: 0;
  }

    .formConsumptionInput .form-group.row .row .input-group-text:last-child {
      border-right-width: 1px;
    }

.formConsumptionInput .checkbox {
  line-height: 1.05rem;
}

.formConsumptionInput label {
  margin-bottom: 0.1em;
}

.text-ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.cciprint {
  margin: 0 auto;
  max-width: 190mm;
}

  .cciprint #chart_container {
    height: auto;
  }

  .cciprint .table th, .table td {
    padding: 0.5rem;
  }

.calc-note {
  position: absolute;
  bottom: 1.7rem;
}

.row.fit-card-heights .card {
  height: 100%;
}

.ccm-request-card {
  background-color: var(--light);
  border: 1px solid var(--gray);
}

  .ccm-request-card .ccm-request-headline {
    border-bottom: 1px solid var(--gray);
  }