personal_data.html

<!-- "Personal data" form for Stepy wizard -->
<div class="row">
	<div class="col-md-6">
		<div class="form-group">
			<label>Select location:</label>
			<select name="location" data-placeholder="Select position" class="select">
				<option></option>
				<optgroup label="North America">
					<option value="1">United States</option>
					<option value="2">Canada</option>
				</optgroup>

				<optgroup label="Latin America">
					<option value="3">Chile</option>
					<option value="4">Argentina</option>
					<option value="5">Colombia</option>
					<option value="6">Peru</option>
					<option value="7">Brazil</option>
				</optgroup>

				<optgroup label="Europe">
					<option value="8">Croatia</option>
					<option value="9">Hungary</option>
					<option value="10">Ukraine</option>
					<option value="11">Greece</option>
					<option value="12">Norway</option>
					<option value="13">Germany</option>
					<option value="14">United Kingdom</option>
					<option value="15">Denmark</option>
					<option value="16">France</option>
					<option value="17">Austria</option>
					<option value="18">Italy</option>
					<option value="19">Spain</option>
					<option value="20">Poland</option>
				</optgroup>

				<optgroup label="Middle East &amp; Africa">
					<option value="21">Egypt</option>
					<option value="22">Israel</option>
					<option value="23">Nigeria</option>
					<option value="24">United Arab Emirates</option>
					<option value="25">Morocco</option>
				</optgroup>

				<optgroup label="Asia Pacific">
					<option value="26">Australia</option>
					<option value="27">China</option>
					<option value="28">India</option>
					<option value="29">Singapore</option>
					<option value="30">Thailand</option>
				</optgroup>
			</select>
		</div>
	</div>

	<div class="col-md-6">
		<div class="form-group">
			<label>Select position:</label>
			<select name="position" data-placeholder="Select position" class="select">
				<option></option>
				<optgroup label="Developer Relations">
					<option value="1">Sales Engineer</option>
					<option value="2">Ads Solutions Consultant</option>
					<option value="3">Technical Solutions Consultant</option>
					<option value="4">Business Intern</option>
				</optgroup>

				<optgroup label="Engineering &amp; Design">
					<option value="5">Interaction Designer</option>
					<option value="6">Technical Program Manager</option>
					<option value="7">Software Engineer</option>
					<option value="8">Information Security Engineer</option>
					<option value="9">Security Engineer</option>
					<option value="10">Usability Expert</option>
					<option value="11">UI Designer</option>
					<option value="12">Illustrator</option>
				</optgroup>

				<optgroup label="Marketing &amp; Communications">
					<option value="13">Media Outreach Manager</option>
					<option value="14">Research Manager</option>
					<option value="15">Marketing Intern</option>
					<option value="16">Business Intern</option>
				</optgroup>

				<optgroup label="Sales Operations">
					<option value="17">Sales Operations Analyst</option>
					<option value="18">Technology Product Manager</option>
					<option value="19">Product Expert</option>
					<option value="20">Sales Insights Analyst</option>
					<option value="21">Customer Operations Analyst</option>
					<option value="22">Data Program Manager</option>
				</optgroup>
			</select>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-md-6">
		<div class="form-group">
			<label>Applicant name:</label>
			<input type="text" name="name" class="form-control" placeholder="John Doe">
		</div>
	</div>

	<div class="col-md-6">
		<div class="form-group">
			<label>Email address:</label>
			<input type="email" name="email" class="form-control" placeholder="your@email.com">
		</div>
	</div>
</div>

<div class="row">
	<div class="col-md-6">
		<div class="form-group">
			<label>Phone #:</label>
			<input type="text" name="tel" class="form-control" placeholder="+99-99-9999-9999" data-mask="+99-99-9999-9999">
		</div>
	</div>

	<div class="col-md-6">
		<label>Date of birth:</label>
		<div class="row">
			<div class="col-md-4">
				<div class="form-group">
					<select name="birth-month" data-placeholder="Month" class="select">
						<option></option>
						<option value="1">January</option>
						<option value="2">February</option>
						<option value="3">March</option>
						<option value="4">April</option>
						<option value="5">May</option>
						<option value="6">June</option>
						<option value="7">July</option>
						<option value="8">August</option>
						<option value="9">September</option>
						<option value="10">October</option>
						<option value="11">November</option>
						<option value="12">December</option>
					</select>
				</div>
			</div>

			<div class="col-md-4">
				<div class="form-group">
					<select name="birth-day" data-placeholder="Day" class="select">
						<option></option>
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						<option value="11">11</option>
						<option value="12">12</option>
						<option value="13">13</option>
						<option value="14">14</option>
						<option value="15">15</option>
						<option value="16">16</option>
						<option value="17">17</option>
						<option value="18">18</option>
						<option value="19">19</option>
						<option value="20">20</option>
						<option value="21">21</option>
						<option value="22">22</option>
						<option value="23">23</option>
						<option value="24">24</option>
						<option value="25">25</option>
						<option value="26">26</option>
						<option value="27">27</option>
						<option value="28">28</option>
						<option value="29">29</option>
						<option value="30">30</option>
						<option value="31">31</option>
					</select>
				</div>
			</div>

			<div class="col-md-4">
				<div class="form-group">
					<select name="birth-year" data-placeholder="Year" class="select">
						<option></option>
						<option value="1">1980</option>
						<option value="2">1981</option>
						<option value="3">1982</option>
						<option value="4">1983</option>
						<option value="5">1984</option>
						<option value="6">1985</option>
						<option value="7">1986</option>
						<option value="8">1987</option>
						<option value="9">1988</option>
						<option value="10">1989</option>
						<option value="11">1990</option>
					</select>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- /"personal data" form for Stepy wizard -->