问如何在css中设置卡片样式

EN

<div class="row">
  <div class="col-lg-4 col-md-6 pop-up">
    <div class="front">
      <div>
        <img class="girlimg" src="girl.jpg" alt="asdasda" />
        <h2 class="activname">Guided hiking tours</h2>
        <button class="activbutt" type="button" name="button">
               SEE DETAILS
               </button>
      </div>
      <div class="details">
        <div class="duration">
          <i class="fas fa-clock">Duration</i>
        </div>
        <div class="people">
          <i class="fas fa-user-friends"></i><br />
          <p>Max adults:10</p>
        </div>
        <div class="kids">
          <i class="fas fa-child"></i><br />
          <p>Max children:3</p>
        </div>
      </div>
    </div>
  </div>
</div>
<br />
<div class="col-lg-4 col-md-6 pop-up-2">
  <div class="front">
    <div>
      <img class="girlimg" src="bike.jpg" alt="asdasda" />
      <h2 class="activname">Rent a bike(4 hours)</h2>
      <button class="activbutt" type="button" name="button">
             SEE DETAILS
             </button>
    </div>
    <div class="details">
      <div class="duration">
        <i class="fas fa-clock">Duration
               <p>QUARTER DAY</p> </i>
      </div>
      <div class="people">
        <i class="fas fa-user-friends"></i><br />
        <p>Max adults:9</p>
      </div>
      <div class="kids">
        <i class="fas fa-child"></i><br />
        <p>Max children:0</p>
      </div>
    </div>
  </div>
</div>
</div>
</div>