html form not grabbing correct variables from survey

I am building a survey form that gathers information from students, using HTML (open to using javascript too) and have found several examples online but none seem to be working. The survey form is currently just selecting these:

enter image description here

The survey should be selecting all options (first name, last name, living place, college choices, major, campus visit), and I don’t know how to fix this.

This is the survey and the code:

enter image description here

 <h3> Senior Survey </h3>
    <div class="w3-container">

      <script type="text/javascript">
        console.log("Prospective student form is about to be displayed.");
      </script>

      <form method="post" action="mailto:[email protected]" method="GET" enctype="text/plain" name="seniorsurvey">
        <table class="w3-table w3-blue" id="second-gradient">
          
          <tr>
            <td style="text-align: center";> 
            <p><b> Please enter your first and last names. </b></p>
            <input type="text" id="firstname" maxlength="60" placeholder="First Name:"/> 
            <input type="text" id="lastname" maxlength="60" placeholder="Last Name:"/>  
            </td>
          </tr>

          <tr>
            <td style="text-align: center";> 
              <p><b> Where do you live? </b></p>
              <input type="radio" id="peru" name="radiobutton" value="Peru">
              <label for="peru">Peru</label>

              <input type="radio" id="southamerica" name="radiobutton" value="SA">
              <label for="southamerica">South America</label>

              <input type="radio" id="unitedstates" name="radiobutton" value="USA">
              <label for="unitedstates">United States</label> 
            </td>
          </tr>

          <tr>
            <td>
              <fieldset style="text-align: center";>
                <p><b> What were your other top college choices? </b></p>
                <input type="checkbox" id="bentley" name="uni">
                <label for="bentley">Bentley U.</label>

                <input type="checkbox" id="brandeis" name="uni">
                <label for="brandeis">Brandeis U.</label>
                
                <input type="checkbox" id="boston" name="uni">
                <label for="boston">Boston U.</label>
                
                <input type="checkbox" id="babson" name="uni">
                <label for="babson">Babson U.</label>     
                
                <input type="checkbox" id="northeastern" name="uni">
                <label for="northeastern">Northeastern U.</label>               
              </fieldset>
            </td>
          </tr>

          <tr>
            <td style="text-align: center";> 
              <p><b> What is your prospective major? </b></p>
              <select name="majors" id="majors">
                <option value="un">undecided</option>
                <option value="cis">Computer Information Systems</option>
                <option value="fi">Finance</option>
                <option value="acc">Accounting</option>
                <option value="ci">Creative Industries</option>
                <option value="mkt">Marketing</option>
              </select>
              <br>
            </td>
          </tr>

          <tr>
            <td style="text-align: center";> 
              <p><b> When do you plan to visit campus? </b></p>
              <input type="date" id="start" name="visit-start" value="2021-10-25" min="2021-10-25" max="2030-12-31">
              <br><br>
            </td>
          </tr>

          <tr>
            <td style="text-align: center";> 
              <button type="submit" value="Submit College Info"> Submit </button>
              <button type="reset" value="Clear College Info"> Clear  </button>
              <br><br>
            </td>
          </tr>

        </table>
      </form>      

    </div>