@font-face {
  font-family: Lato-Regular, sans-serif;
  src: url("../fonts/Lato-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: Monaco, sans-serif;
  src: url("../fonts/Monaco.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@keyframes bar {
  0% {
    height: 0px;
    opacity: 0; }
  100% {
    height: 100%;
    opacity: 1; } }

body, BODY, .body {
  font-family: Lato-Regular, sans-serif;
  background: #151518;
  color: #CED1E0; }

.data-table {
  display: flex;
  flex-direction: column;
  text-align: right;
  font-size: 12px;
  margin-top: 68px;
  height: calc(100vh - 184px);
  overflow: auto; }
  .data-table .tr {
    display: flex;
    border-bottom: 1px solid #101010; }
    .data-table .tr:first-child {
      border-top: 1px solid #101010; }
    .data-table .tr-main .item {
      width: 225px; }
  .data-table .td {
    width: auto;
    display: grid;
    grid-auto-flow: column; }
    .data-table .td:first-child {
      display: none; }
  .data-table .item {
    width: 75px;
    border-right: 1px solid #101010; }
    .data-table .item-sub {
      display: grid;
      order: 2; }
      .data-table .item-sub .cell:nth-child(1) {
        order: 2; }
      .data-table .item-sub .cell:nth-child(2) {
        order: 1; }
      .data-table .item-sub .cell:nth-child(3) {
        order: 3; }
  .data-table .cell {
    padding: 5px;
    height: 100%; }
    .data-table .cell:nth-child(1) {
      padding: 0 5px; }

.btn-panel {
  display: flex;
  padding: 15px;
  width: 100%;
  background: #151518; }
  .btn-panel.top, .btn-panel.bottom {
    position: fixed;
    left: 0; }
  .btn-panel.top {
    top: 0; }
  .btn-panel.bottom {
    bottom: 0;
    display: grid;
    grid-gap: 10px; }
    .btn-panel.bottom .left {
      overflow: auto;
      display: flex;
      align-items: center; }
    .btn-panel.bottom .right {
      display: flex;
      align-items: center; }
  .btn-panel .btn:focus {
    box-shadow: none; }
  .btn-panel .btn + .btn {
    margin-left: 10px; }

.negative {
  background: rgba(234, 50, 73, 0.5); }

.positive {
  background: rgba(28, 214, 125, 0.5); }

.highlight-high {
  background: #53ffeb;
  color: #151518; }

.highlight-low {
  background: #ffac53;
  color: #151518; }