Bootstrap Columns not stacking

[Dilip]

Hi, I am using Grid in Bootstrap 5.3. It scales instead of stacking one below another.

 

 <section class="mt25me">

    <div class="text-center">


     <h2 class="mt-2">Why me?</h2>
     <br>

     <h1 class="fs-5 poppins-extralight">The Copywriter</h1>
     <br>
      
    </div> 

    <br><br><br>

    <div class="container text-center">
      <div class="row">
        <div class="col">

          <div class="mb-4" style="color: #0070ff;">

            <i class="fa-solid fa-thumbs-up fa-5x"></i>
           
          </div>

          <h3>Impressive</h3>
          <br>
          <p>Words that work magic, helps gain attention</p>
        </div>
        <div class="col">

          <div class="mb-4 green">

          <i class="fa-solid fa-circle-check fa-5x"></i>
         
        </div>

          <h3>Effective</h3>
          <br>
          <p>Post that standout in crowd. Simple by design, effective on field</p>
        </div>
        <div class="col">


          <div class="mb-4" style="color: #ffa700;">

            <i class="fa-solid fa-trophy fa-5x"></i>
           
          </div>


          <h3>Result Oriented</h3>
          <br>
          <p>They will love you for sure, and buy from you as well</p>
        </div>
      </div>
    </div>

  </section>

 

CSS

 

.msect5 {

margin-top: 50px;

padding-top: 15px;

margin-bottom: 75px;

}

Please help.

[Dilip]

Fixed by using col-sm-12