﻿#bar-protection-states .bar {
  cursor: pointer; }
  #bar-protection-states .bar:hover {
    opacity: 0.75; }

.horizontalbar UL {
  margin: 0;
  padding: 0;
  list-style: none; }

.horizontalbar .graphic {
  margin: 15px 0 0 0;
  background-color: rgba(0, 0, 0, 0.1);
  min-height: 29px; }
  .horizontalbar .graphic .bar {
    height: 25px;
    display: inline-block;
    transition: width 3s; }
    .horizontalbar .graphic .bar.darkgreen {
      background-color: #006400; }
    .horizontalbar .graphic .bar.dimgrey {
      background-color: #696969; }
    .horizontalbar .graphic .bar.skyblue {
      background-color: #87ceeb; }
    .horizontalbar .graphic .bar.yellowgreen {
      background-color: #9acd32; }
    .horizontalbar .graphic .bar.peru {
      background-color: #cd853f; }
    .horizontalbar .graphic .bar.yellow {
      background-color: #ffff00; }
    .horizontalbar .graphic .bar.salmon {
      background-color: #fa8072; }
    .horizontalbar .graphic .bar.orchid {
      background-color: #da70d6; }
    .horizontalbar .graphic .bar.orange {
      background-color: #ffa500; }
    .horizontalbar .graphic .bar.brown {
      background-color: #a52a2a; }
    .horizontalbar .graphic .bar.green {
      background-color: #5cb85c; }
    .horizontalbar .graphic .bar.orange {
      background-color: #e67d4a; }
    .horizontalbar .graphic .bar.red {
      background-color: #cc0e00; }
    .horizontalbar .graphic .bar.bluegreen {
      background-color: #5C99B8; }

.horizontalbar .label {
  display: inline-block;
  margin-right: 10px;
  transition: width 3s;
  min-height: 43px; }
  .horizontalbar .label:last-child {
    margin-right: 0; }
  .horizontalbar .label:hover.darkgreen LABEL {
    color: #006400; }
  .horizontalbar .label:hover.dimgrey LABEL {
    color: #696969; }
  .horizontalbar .label:hover.skyblue LABEL {
    color: #87ceeb; }
  .horizontalbar .label:hover.yellowgreen LABEL {
    color: #9acd32; }
  .horizontalbar .label:hover.peru LABEL {
    color: #cd853f; }
  .horizontalbar .label:hover.yellow LABEL {
    color: #ffff00; }
  .horizontalbar .label:hover.salmon LABEL {
    color: #fa8072; }
  .horizontalbar .label:hover.orchid LABEL {
    color: #da70d6; }
  .horizontalbar .label:hover.orange LABEL {
    color: #ffa500; }
  .horizontalbar .label:hover.brown LABEL {
    color: #a52a2a; }
  .horizontalbar .label:hover.green LABEL {
    color: #5cb85c; }
  .horizontalbar .label:hover.orange LABEL {
    color: #e67d4a; }
  .horizontalbar .label:hover.red LABEL {
    color: #cc0e00; }
  .horizontalbar .label:hover.bluegreen LABEL {
    color: #5C99B8; }

.horizontalbar B {
  color: rgba(0, 0, 0, 0.65);
  font-family: 'Open Sans Condensed', Verdana, sans-serif !important;
  font-size: 25px;
  display: block;
  line-height: 25px; }

.horizontalbar LABEL {
  text-transform: uppercase;
  color: #00c8cc;
  font-family: 'Open Sans Condensed', Verdana, sans-serif !important;
  font-weight: bold;
  font-size: 13px;
  display: block; }

.dashboard {
  padding: 0 15px 0 10px; }

.gridster UL {
  list-style: none; }

.card {
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.1) 2px 2px 1px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  position: relative; }
  .card.chart .body {
    text-align: center; }
    .card.chart .body canvas {
      margin: 5px auto; }
  .card.table.large.overflow thead, .card.table.large.overflow tfoot, .card.table.large.overflow tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed; }
  .card.table.large.overflow thead, .card.table.large.overflow tfoot {
    width: calc( 100% - 1em); }
  .card.table.large.overflow tbody {
    height: 280px;
    display: block;
    overflow-y: scroll; }
  .card.table.large .foot td {
    font-weight: bold !important; }
  .card.table.large th {
    font-size: 11px !important;
    text-align: right; }
    .card.table.large th.code {
      text-align: left; }
  .card.table.large b, .card.table.large a, .card.table.large td {
    font-size: 11px !important;
    color: #1A1F20 !important; }
  .card.table.large table TD {
    padding-top: 2px !important;
    padding-bottom: 3px !important;
    text-align: right; }
    .card.table.large table TD.code {
      text-align: left; }
  .card.table .body footer {
    position: absolute;
    bottom: 10px;
    width: 90%; }
  .card.table .body table {
    width: 100%; }
    .card.table .body table TR:nth-child(even) {
      background-color: rgba(0, 0, 0, 0.05); }
    .card.table .body table TR:hover {
      background-color: #53a8c2;
      cursor: pointer; }
    .card.table .body table TR TD {
      padding-top: 5px;
      padding-bottom: 4px; }
      .card.table .body table TR TD:nth-child(1) {
        padding-left: 10px; }
      .card.table .body table TR TD:nth-child(2) {
        text-align: right;
        padding-right: 10px; }
  .card.table .body b, .card.table .body a, .card.table .body td {
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    color: #4a5558; }
  .card.lines3 .body {
    text-align: center; }
    .card.lines3 .body b, .card.lines3 .body a {
      font-size: 20px;
      margin-top: 8px; }
  .card.lines2 .body {
    text-align: center; }
    .card.lines2 .body b, .card.lines2 .body a {
      font-size: 40px;
      margin-top: 3px; }
  .card.lines1 .body {
    text-align: center; }
    .card.lines1 .body b, .card.lines1 .body a {
      font-size: 60px;
      margin-top: 35px; }
  .card.labelvalue2 .body {
    text-align: center; }
    .card.labelvalue2 .body span {
      display: block;
      padding-top: 10px; }
    .card.labelvalue2 .body label {
      font-size: 10px;
      text-transform: uppercase;
      color: #4a5558; }
    .card.labelvalue2 .body .value, .card.labelvalue2 .body .timeago {
      font-family: 'Open Sans', sans-serif;
      line-height: 18px;
      font-size: 22px;
      font-weight: bold;
      margin-top: 0px;
      display: block; }
  .card HEADER {
    padding: 5px 10px 5px 10px;
    border-bottom: 1px solid #a6a6a6; }
    .card HEADER H1 {
      font-family: 'Open Sans', sans-serif;
      font-size: 13px;
      font-weight: 600;
      color: #333333;
      margin: 0;
      padding: 0; }
    .card HEADER H2 {
      font-family: 'Open Sans', sans-serif;
      font-size: 10px;
      font-weight: 400;
      text-transform: uppercase;
      color: #a6a6a6;
      margin: 0;
      padding: 0; }
    .card HEADER .key {
      display: inline-block;
      width: 10px;
      height: 10px;
      margin: 2px 5px 0 10px; }
      .card HEADER .key.blue {
        background-color: #53A8C2; }
      .card HEADER .key.green {
        background-color: #62B33E; }
      .card HEADER .key.red {
        background-color: #EA7472; }
      .card HEADER .key.lightblue {
        background-color: #0069FF; }
      .card HEADER .key.darkblue {
        background-color: #344055; }
      .card HEADER .key.yellow {
        background-color: #E8DF35; }
      .card HEADER .key.tan {
        background-color: #E5DBB3; }
      .card HEADER .key.darkgreen {
        background-color: #4F862F; }
  .card .body {
    padding: 5px 10px 5px 10px; }
    .card .body.overflow {
      height: 270px;
      overflow-y: scroll;
      overflow-x: hidden; }
    .card .body b, .card .body a {
      text-decoration: none;
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      color: #333333;
      display: block; }
      .card .body b.light, .card .body a.light {
        color: #01b8aa; }
      .card .body b.left, .card .body a.left {
        text-align: left;
        display: inline-block;
        font-weight: bold !important; }
      .card .body b.right, .card .body a.right {
        text-align: right;
        display: inline-block;
        float: right;
        font-weight: bold !important; }

