Four Card Feature

• I used flex box in my approach because I find it helps me center items and I don't have experience with grid yet

<div class="main-cards">
        <div class="supervisor cards">
          <h3>Supervisor</h3>
          <p class="card-text">Monitors activity to identify project roadblocks</p>
          <img src="./images/icon-supervisor.svg" >
        </div>
        <div class="teamBuilder_Karma">
          <div class="teamBuilder cards">
            <h3>Team Builder</h3>
            <p class="card-text">Scans our talent network to create the optimal team for your project</p>
            <img src="./images/icon-team-builder.svg">
            
          </div>
          <div class="karma cards">
            <h3>Karma</h3>
            <p class="card-text">Regularly evaluates our talent to ensure quality</p>
            <img src="./images/icon-karma.svg">
          </div>
        </div>
        <div class="calculator cards">
          <h3>Calculator</h3>
          <p class="card-text">Uses data from past projects to provide better delivery estimates</p>
          <img src="./images/icon-calculator.svg">
        </div>

      </div>

• with:

.main-cards { 
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        gap: 25px 25px;
    }