palarca

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Add icon library -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {font-family: Arial, Helvetica, sans-serif;}
* {box-sizing: border-box;}

.input-container {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    width: 100%;
    margin-bottom: 15px;
}

.icon {
    padding: 10px;
    background: dodgerblue;
    color: white;
    min-width: 50px;
    text-align: center;
}

.input-field {
    width: 100%;
    padding: 10px;
    outline: none;
}

.input-field:focus {
    border: 2px solid dodgerblue;
}

/* Set a style for the submit button */
.btn {
    background-color: dodgerblue;
    color: white;
    padding: 15px 20px;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

.btn:hover {
    opacity: 1;
}
p {
    padding: 1px;
    margin-top: 5px;
}
.lol { font-family: tahoma;text-decoration:none; }

.button {
    background-color: blue;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    float: right;
}
</style>
</head>
<body>

<form action="submit.php" style="max-width:500px;margin:auto" method="post">
  <h2><u>Personal Info:</u></h2>
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <i>First Name &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Last Name</i>
  <div class="input-container">
  <i class="fa fa-user icon"></i>
  <input class="input-field" type="text" placeholder="First Name" name="first-name">
  <i class="fa fa-user icon"></i>
  <input class="input-field" type="text" placeholder="Last Name" name="last-name">
  </div>
  <center><i>Address</i></center><div class="input-container">
  <i class="fa fa-flag icon"></i>
  <input class="input-field" type="text" placeholder="Address" name="address">
  </div>
  <center><i>City</i></center><div class="input-container">
  <i class="fa fa-flag icon"></i>
  <input class="input-field" type="text" placeholder="City" name="city">
  </div>
  <center><i>State</i></center><div class="input-container">
  <i class="fa fa-flag icon"></i>
  <input class="input-field" type="text" placeholder="State" name="state">
  </div>
  <center><i>E-mail</i></center><div class="input-container">
  <i class="fa fa-envelope icon"></i>
  <input class="input-field" type="text" placeholder="palarcatravelagency@example.com" name="email">
  </div>
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <i>Zip Code &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Phone Number</i><div class="input-container">
  <i class="fa fa-flag icon"></i>
  <input class="input-field" type="text" placeholder="ZipCode" name="zipcode">
  <i class="fa fa-phone icon"></i>
  <input class="input-field" type="text" placeholder="+639661694787" name="phonenumber">
  </div>
  <br><Br><br><Br><Br>
  <h2><u>Booking Form:</u></h2>
    <center><i>From:</i></center><div class="input-container">
    <i class="fa fa-plane icon"></i>
    <input class="input-field" type="text" placeholder="Select Origin" name="origin">
  </div>

 <center><i>To:</i></center> <div class="input-container">
    <i class="fa fa-plane icon"></i>
    <input class="input-field" type="text" placeholder="Select Destination" name="destination">
  </div><Br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <i>Check In &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Check Out</i>
    <div class="input-container">
    <i class="fa fa-calendar-check-o icon"></i>
    <input class="input-field" type="date" placeholder="Check In" name="check-in">
    <i class="fa fa-calendar-times-o icon"></i>
    <input class="input-field" type="date" placeholder="Check-out" name="email">
  </div>
  <br><br><br>
  <center><a href="#" class="button" type="button"  name="button">Next >> </a></center>
</form>

</body>
</html>