How to move items in card using bootstrap-3

So i have this card, i am not sure how to pace items in it the way i want. In the html code i have used bootstrap-3. Css is just noob basic pixels movement.

 <body>
        <div class="row">
  <div class="col-lg-4 col-md-6 pop-up">
    <div class="front">
      <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 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>
  <br />
%d bloggers like this: