Multi-Step Form when resizing on mobile devices : So, I'm trying to create a mobile responsive web app, I've already managed to fit it properly on mobile devices, but I don't want the "second form" to go above the first one, but to create a multi-step form when viewing on mobile devices.

Here's my code so far:

    <div class="container">
      <form action="/action_page.php">
        <div class="row">
          <div class="col-25">
            <label for="fname">First Name</label>
          </div>
          <div class="col-75">
            <input type="text" id="fname" name="firstname" placeholder="Your name..">
          </div>
        </div>
        <div class="row">
          <div class="col-25">
            <label for="lname">Last Name</label>
          </div>
          <div class="col-75">
            <input type="text" id="lname" name="lastname" placeholder="Your last name..">
          </div>
        </div>
      </form>
    </div>
(I have two forms like this one)

