<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Responsive Registration Form</title>
    <meta name="viewport" content="width=device-width,
      initial-scale=1.0"/>
    <link rel="stylesheet" href="registerOfStudentClub.css" />
    <!-- <script defer src="./validation.js"></script> -->
  </head>
  <body>
   
    <div class="container">
      <h1 class="form-title">REGISTRATION</h1>
      <form method="post" action="recordInsertion.php" id="formOfStudentClub">
        <div class="main-user-info">
          <div class="user-input-box">
            <label for="fullName">Full Name</label>
            <input class="heighlight" type="text"
                    id="fullname"
                    name="fullname"
                    placeholder="Enter Full Name" required>
          </div>
          <div class="user-input-box">
            <label for="email">Email</label>
            <input class="heighlight" type="email"
                    id="email"
                    name="email"
                    placeholder="Enter Email" required>
          </div>
          <div class="user-input-box">
            <label for="phone">Phone Number</label>
            <input class="heighlight" type="tel"
                    id="phone"
                    name="phone"
                    placeholder="Enter Phone Number" required>
          </div>
          <div class="user-input-box">
            <label for="prnno">PRNNo</label>
            <input class="heighlight" type="text"
                    id="prnno"
                    name="prnno"
                    placeholder="Enter PRNNo" required>
          </div>
          
          
          <div class="user-input-box">
            <label for="club">Choose Interested Club</label>

            <select class="selectbox" name="club" id="club" required>
              <option value="none">SELECT</option>
            <option value="IEEE COMPUTER SOCIETY STUDENT CHAPTER 2023-24">IEEE COMPUTER SOCIETY STUDENT CHAPTER 2023-24</option>
            <option value="COMPUTER SOCIETY OF INDIA STUDENT BRANCH">COMPUTER SOCIETY OF INDIA STUDENT BRANCH</option>
            <option value="ASSOCIATION OF COMPUTER SCIENCE AND ENGINEERING STUDENTS(ACSES)">ASSOCIATION OF COMPUTER SCIENCE AND ENGINEERING STUDENTS(ACSES)</option>
            <option value="CODECHEF CAMPUS CHAPTER DKTE">CODECHEF CAMPUS CHAPTER DKTE</option>
            <option value="OPEN WEB APPLICATION SECUITY PROJECT">OPEN WEB APPLICATION SECUITY PROJECT </option>
            <option value="SOCIAL CLUB">SOCIAL CLUB</option>
            </select>
    </div>
    <div class="user-input-box">
        <label for="branch">Branch</label>

        <select class="selectbox" name="branch" id="branch" required>
          <option value="none">SELECT</option>
        <option value="COMPUTER SCIENCE ENGINEERING">COMPUTER SCIENCE ENGINEERING</option>
        <option value="ARTIFICIAL INTELLIGENCE ENGINEERING">ARTIFICIAL INTELLIGENCE ENGINEERING</option>
        <option value="ARTIFICIAL INTELLIGENCE & DATA SCIENCE (AI&DS)">ARTIFICIAL INTELLIGENCE & DATA SCIENCE (AI&DS)</option>
        <option value="CIVIL ENGINEERING">CIVIL ENGINEERING</option>
        <option value="MECHANICAL ENGINEERING">MECHANICAL ENGINEERING</option>
        <option value="ELECTRONICS AND CCOMMUNICATION ENGINEERING">ELECTRONICS AND CCOMMUNICATION ENGINEERING</option>
        <option value="ELECTRICAL ENGINEERING">ELECTRICAL ENGINEERING</option>
        
        </select>
</div>
<div class="user-input-box">
    <label for="year">Year</label>

    <select class="selectbox" name="year" id="year" required>
      <option value="none">SELECT</option>
    <option value="FY">FIRST YEAR</option>
    <option value="SY">SECOND YEAR</option>
    <option value="TY">THIRD YEAR</option>
    <option value="BTECH">BACHLOR OF TECHNOLOGY</option>
    </select>
</div>
<div class="user-input-box">
            <label for="interested">Why You Are Interested</label>
            <textarea class="heighlight" type="password"
                    id="reason"
                    name="reason"
                    placeholder="Why You Are Interested" required></textarea>
          </div>
<div class="gender-details-box">
    <span class="gender-title">Gender</span>
    <div class="gender-category">
      <input type="radio" name="gender" id="genderm" value="Male" required>
      <label for="male">Male</label>
      <input type="radio" name="gender" id="genderm" value="Female">
      <label for="female">Female</label>
      <input type="radio" name="gender" id="genderm" value="Other">
      <label for="other">Other</label>
    </div>
  </div>
        </div>
        
        <div class="form-submit-btn">
          <input type="submit" value="REGISTER" style="font-weight: bold;" name="submit">
        </div>
      </form>
    </div>
    <script  src="https://cdnjs.cloudflare.com/ajax/libs/firebase/7.14.1-0/firebase.js"></script>
    <script src="./mail.js"></script>
  </body>
</html>