preference.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes" />

<meta name="description" content="FOSSMeet is the annual event on Free and Open source software, conducted at National Institute of Technology, Calicut.">
<meta name="keywords" content="nitc,fossmeet,fsf,gnu,icfoss,concur,NITC,CSEA,FOSSCell">
<meta name="author" content="Creative Team, FOSSCell NIT Calicut">

  <meta property="og:title" content="FOSSMeet '16" />
  <meta property="og:type" content="Website" />
  <meta property="og:url" content="http://www.fossmeet.in"/>
  <meta property="og:description" content="FOSSMeet is the annual event on Free and Open source software, conducted at National Institute of Technology, Calicut." />
  <meta property="og:locale" content="en_IN" />
  <meta property="og:image" content="http://fossmeet.in/img/poster.jpg" />
  <meta property="fb:app_id" content="921306757944441" />

  <link rel="shortcut icon" type="image/png" href="img/logo16.png" />

  <title>FOSSMeet '16</title>

    <link rel="stylesheet" href="css/payment.css">


</head>
<body>

<h3 style="text-align:center;">Workshop Preference</h3>

<form method="POST" action="admin/preference.php" id="payment_form" name="payment_form" parsley-validate novalidate>

  <ul class="form-fields">

    <div class="row">


    <li class=" columns small-6 clear ">
      <label for="id_mojo_id"><img src="https://im-cdn.com/assets/images/logo.5f3975f3425a.png" width="180px" height="10px"> Payment ID: <br>(FORMAT: <b>MOJOXXXXXXXXXXXXXXXX</b>)</label>
      <input class="text-input parsley-validated" id="id_mojo_id" maxlength="20" name="mojo_id" maxlength="20" placeholder="Enter the Instamojo Payment ID" type="text" onfocus="document.getElementById('name_hint').style='display: -webkit-flex;display: -ms-flexbox;display: flex;';" onblur="document.getElementById('name_hint').style='display: none;';" required>
    </li>

<li class="columns small-6 clear">
<div class="text-hint" id="name_hint">
Please enter the Instamojo payment ID that you had received (probably in your e-mail)!
</div>
</li>

</div>

<div class="row"><li class="columns small-6 clear">
<div class="text-hint" id="sel_hint">Please see the schedule listed &nbsp; <a href="index.html#ib-container" target="_blank" style="text-decoration:none;"> here</a></div>
</li></div>

<div class="row"><li class="columns small-6 clear">
<div class="text-hint" id="sel_hint">Please select your preferences (carefully)</div>
</li></div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt0">Preference 0:</label>
      <select name="opt0" id="id_opt0">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt1">Preference 1:</label>
      <select name="opt1" id="id_opt1">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt2">Preference 2:</label>
      <select name="opt2" id="id_opt2">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt3">Preference 3:</label>
      <select name="opt3" id="id_opt3">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt4">Preference 4:</label>
      <select name="opt4" id="id_opt4">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt5">Preference 5:</label>
      <select name="opt5" id="id_opt5">
       <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt6">Preference 6:</label>
      <select name="opt6" id="id_opt6">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt7">Preference 7:</label>
      <select name="opt7" id="id_opt7">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt8">Preference 8:</label>
      <select name="opt8" id="id_opt8">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>

    <div class="row">
    <li class=" columns small-6 clear ">
      <label for="id_opt9">Preference 9:</label>
      <select name="opt9" id="id_opt9">
        <option value="no" class="no">No preference</option>
      </select>
    </li>
</div>


<li class="columns small-6 clear">
<div class="text-hint" id="name_hint">Please enter the Instamojo payment ID that you had received (probably in your e-mail)</div>
</li>

</div>


    <li class="columns small-6 clear"><input value="Submit your Preferences!" type="submit" class="btn--green btn--full" name="fm16_pay_btn">
	<p class="text-center"><small class="grey notice display-inline">The selection of the above preferences do not guarantee admission to the workshops. <sup>***</sup></small></p>
	</li>

  </ul>


</form>

<script src="js/jquery.js"></script>
<script src="js/payment.js"></script>

</body>
</html>