ul.donations {
  list-style: none;

  li {
    margin-bottom: 2rem;
    display: grid;
    grid-row-gap: 0.5rem;
    grid-column-gap: 2rem;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "date amount-btc"
      "public-name amounts-fiat";

    h3 {
      grid-area: "date";
      margin-bottom: 0;
    }

    p {
      margin-bottom: 0;

      &.amount-btc {
        grid-area: amount-btc;
        text-align: right;
        font-family: monospace;
        font-size: 1.25rem;
      }
      &.amounts-fiat {
        grid-area: amounts-fiat;
        text-align: right;
        font-family: monospace;
        font-size: 0.85rem;
        color: #888;
      }
      &.public-name {
        grid-area: public-name;
      }
    }
  }
}