4 card feauture

Hey @echoturnbull, some suggestions to improve you code:

Using CSS Grid with Grid-Template-Areas will make things way easier when building the layout. Not only will it reduce the amount of code needed but give you full control of the layout.

.card-container {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-template-areas:
      "supervisor team calculator"
      "supervisor karma calculator";
  }

  .karma-card {
    grid-area: karma;
  }

  .calculator-card {
    grid-area: calculator;
    align-self: center;
  }

  .team-card {
    grid-area: team;
  }

  .supervisor-card {
    grid-area: supervisor;
    align-self: center;
  }

Happy Coding! 👻🎃