Untitled

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Academic Conference</title>
<link href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">
    <div id="menu">
        <ul>
            <li><a href="home.html">Home</a></li>
            <li><a href="reserve.html">Reservation Form</a></li>
            <li><a href="queryForm.php">Query Form</a></li>
            <li><a href="work.html">Workshop Materials</a></li>
        </ul>
    </div>
    <div id="logo">
        <h1><a href="#">Academic Conference</a></h1>
    </div>
</div>
<h1 style="padding-left:440px;padding-top:10px;color:SlateGray">RESERVATION FORM
<div style="padding-left:140px;padding-top:10px;">FOR</div>
<div style="padding-top:10px;"> E-LEARNING CONFERENCE</div></h1>
<p><h3  style="padding-left:450px"> Please insert your personal details below:</h3>
<br><h3 style="padding-left:450px">All columns are required to fill in.</h3></p>


<form action="insertData.php" method="POST">
<label style="padding-left:450px">Title:
    <select name="gender">
        <option value="Male">Mr</option>
        <option value="Female">Mrs</option>
    </select>
</label>
 <p style="padding-left:450px">First Name: <input type="text" name="firstname" placeholder="First Name" required /> </p>
 <p style="padding-left:450px">Last Name: <input type="text" name="lastname" placeholder="Last Name" required /></p>
 <p style="padding-left:450px">Affiliation: <input type="text" name="affiliation" placeholder="Affiliation" required /></p>
     <p style="padding-left:450px">Email:<input type="email" name="mail" placeholder="E-mail" pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" required/></p>

     <p style="padding-left:470px"><br><input type="submit" value="Reserve" name="reserved" id="reserved" onclick='return confirm("Are you sure to submit?")'>
     <span style="padding-left:10px"><input type="reset" value="Clear"></span>
     <span style="padding-left:10px"><input type="button" value="Go to Query Form" name="query" onclick='window.location.href="queryForm.php"'></span></p>
</form>

<!-- end page -->
<div id="footer">
    <p id="legal">&copy;2015 Conference Page. All Rights Reserved. | Designed by Tan Chung Hao,1112700539 Chin Cheong Ye,1112700327 Zachary Arvin Asing, 1112700764</p>
</div>
</html>