@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);

body {
  font-family: 'Open Sans', sans-serif;
  font-size: 16px !important;
  font-weight: 300;
  line-height: 1.42em;
  color:#A7A1AE;
  background-color:#1F2739;
}

.container {
  text-align: left;
  width: 80%;

  margin: 0 auto;
  display: table;
  padding: 0 0 8em 0;
  position: relative;
}

.container th {
  background-color: #1F2739;

  position: sticky;
  top: 0;

  font-weight: bold;
  text-align: center;
  color: #FFDD75;
}

.container td {
    font-weight: normal;
    text-align: center;
  -webkit-box-shadow: 0 2px 2px -2px #0E1119;
     -moz-box-shadow: 0 2px 2px -2px #0E1119;
          box-shadow: 0 2px 2px -2px #0E1119;
}

.container td{
  padding-bottom: 2%;
  padding-top: 2%;
  padding-left:2%;
}

/* Background-color of the odd rows */
.container tr:nth-child(odd) {
    background-color: #5e5e5e;
}

/* Background-color of the even rows */
.container tr:nth-child(even) {
    background-color: #2C3446;
}

.container tbody tr:hover {
  background-color: #21700d8f;
  color: #10ffb1;
  font-weight: bold;

  box-shadow:
    #016315 -1px 1px,
    #016315 -2px 2px,
    #016315 -3px 3px,
    #016315 -4px 4px,
    #016315 -5px 5px,
    #016315 -6px 6px;
  transform: translate3d(6px, -6px, 0);

  transition-delay: 0s;
  transition-duration: 0.4s;
  transition-property: all;
  transition-timing-function: line;
}

tr#bad:hover {
  background-color: #FF0000  !important;
  color: #10ffb1;
  font-weight: bold;

  box-shadow:
    red -1px 1px,
    red -2px 2px,
    red -3px 3px,
    red -4px 4px,
    red -5px 5px,
    red -6px 6px;
  transform: translate3d(6px, -6px, 0);

  transition-delay: 0s;
  transition-duration: 0.4s;
  transition-property: all;
  transition-timing-function: line;
}

@media (max-width: 800px) {
  .container td:nth-child(4),
  .container th:nth-child(4) { display: none; }
}