ujh/fountainpencompanion

#micro-clusters-app,
#pens-micro-clusters-app,
#pens-model-micro-clusters-app {
  .summary {
    font-size: x-large;
    text-align: center;
    margin-bottom: 10px;
  }
  .loader {
    font-size: 100px;
    text-align: center;
    div {
      font-size: small;
    }
  }
  .app {
    display: flex;
    .main {
      margin-left: auto;
      margin-right: auto;
      width: 95%;

      .distance {
        color: #ccc;
      }
    }
    td,
    th {
      vertical-align: middle;
    }
    tr.selected td {
      background: #f5f5dc;

      @media (prefers-color-scheme: dark) {
        background: var(--fpc-bright-background);
      }
    }
    th:last-of-type,
    td:last-of-type {
      text-align: right;
    }
    .nav {
      &:hover {
        background-color: #ccc;
      }
      font-size: 50px;
      margin: -15px -10px;
      padding-left: 5px;
      padding-right: 5px;
      display: flex;
      justify-content: center;
      flex-direction: column;
    }
    .macro-cluster-collected-inks {
      font-size: 10px;
    }
  }
}