{% extends 'templates/callluge/site_layout.html' %}
{% block content %}
<div class="widget-box">
<div class="col-md-12 col-sm-12">
    <div class="widget-title">
        <h2>TechWyse Internet Marketing</h2>
    </div> 
</div>

<!-- 
<div style="width: 60%; margin: 1% 18%;">
<div style="width: 100%; text-align: center;"><h3>Order Local Number</h3></div> -->

<div class="widget-content order-nos">
<h3 class="page-sub-hdg">Order Local Number</h3>
	<form method="POST" action="/numbers/order-local/" id="" data-toggle="validator">
	{% csrf_token %}
		<div class="row">
			<div class="col-md-6 col-sm-6">
				<div class="form-group">
                    <div class="input-group no-padding">
                        <label for="">Country*</label>
                        <div class="dropdown-all">
                        	<select id="ordloc_dd1" tabindex="1" name="country_iso_code" data-error="Please select Country." required="">
								<option value="">Select Country</option>
								<option value="US">US</option>
								<option value="CA">CANADA</option>
							</select>
                        </div>
                        <div class="help-block with-errors"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-sm-6">
                <div class="form-group">
                    <div class="input-group no-padding">
                        <label for="">I Want Number Similar To <span>(Ex: 510,902 etc..)</span></label>
                        <input tabindex="2" maxlength="15" class="form-input" type="text" name="area_code">
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
				<div class="col-md-6 col-sm-6">
	                <div class="form-group">
	                    <div class="input-group no-padding">
	                        <label for="">Quantity*</label>
	                        <div class="dropdown-all">
	                        	<select id="ordloc_dd2" tabindex="3" name="quantity" data-error="Please select Quantity." required="">
									<option value="">Select Quantity</option>				
									<option>1</option>
									<option>2</option>
									<option>3</option>
									<option>4</option>
									<option>5</option>
									<option>6</option>									
								</select>
	                        </div>
	                        <div class="help-block with-errors"></div>
	                    </div>
	                </div>
	            </div>
	            <div class="col-md-6 col-sm-6">
	                <div class="form-group">
	                    <div class="input-group no-padding">
	                        <label for="">&nbsp;</label>
	                        <input tabindex="4" class="btn btn-primary" type="submit" value="Next">
	                    </div>
	                </div>
	            </div>
	    </div>



				<!-- <div style="margin-left: 300px">
					<p>Country 
					<select style="margin-left: 150px" name="country_iso_code">
						<option>Select Country</option>
							<option value="US">US</option>
							<option value="CA">CANADA</option>
							<option>3</option>
							<option>4</option>
							<option>5</option>
							<option>6</option>
							<option>7</option>
							<option>8</option>
					</select></p>

					<p>I Want Number Similar To <input type="text" name="area_code"> &nbsp;&nbsp;(Ex:510,902 etc..)</p>
					<p>Quantity &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;  
						<select name="quantity" style="width:150px">
							<option>Select Quantity</option>
							<option>1</option>
							<option>2</option>
							<option>3</option>
							<option>4</option>
							<option>5</option>
							<option>6</option>
							<option>7</option>
							<option>8</option>
						</select>&nbsp;&nbsp;
						</p><p style="margin-left: 210;"><input type="submit" value="Next">
					</p>
				</div> -->
			
		</form>
	</div>
</div>
<script>
$( document ).ready(function() {
	$("#ordloc_dd1").select2({});
	$("#ordloc_dd2").select2({});
});
</script>
{% endblock %}