<div class="wo_about_wrapper_parent">
	<div class="wo_about_wrapper"> 
		<div class="hero hero-overlay" style="background: #82b652;"> 
			<div class="container">
				<h1 class="text-center">{{LANG contact_us}}</h1>
			</div> 
		</div>
		<svg id="wave" viewBox="0 0 1440 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(0.000000, -564.000000)" fill="#82b652"><g id="Head-background" transform="translate(-168.000000, -346.000000)"><g id="waves-background" transform="translate(888.000000, 934.000000) scale(-1, 1) translate(-888.000000, -934.000000) translate(168.000000, 910.000000)"><path d="M0,14.60779 C101.722445,4.7613277 195.244576,-4.14113188e-14 429,-2.84217094e-14 C732,-1.97619698e-14 798,45.6756592 1089,45.6756592 C1245.83848,45.6756592 1364.64602,29.5028807 1440,14.5904096 C1440,14.60779 1440,48 1440,48 L0,48 C0,48 0.0410082206,34 0,14.60779 Z" id="Path-3-Copy"></path></g></g></g></g></svg>
	</div>
</div>
<div class="col-md-3"></div>
<form class="form-horizontal user-setting-panel contact-us-form pt_shadow pt_page_margin col-md-6 pt_forms" method="POST">
    <div class="contact-us-alert"></div>
		<div class="list-">
			<!-- Text input-->
			<div class="form-group">
				<label class="col-md-12" for="first_name">{{LANG first_name}} *</label>  
				<div class="col-md-12">
					<input id="first_name" name="first_name" type="text" class="form-control input-md">
				</div>
			</div>
			<!-- Text input-->
			<div class="form-group">
				<label class="col-md-12" for="last_name">{{LANG last_name}} *</label>  
				<div class="col-md-12">
					<input id="last_name" name="last_name" type="text" class="form-control input-md">
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-12" for="email">{{LANG email}} *</label>  
				<div class="col-md-12">
					<input name="email" id="email" type="text" class="form-control input-md">
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-12" for="message">{{LANG message}} *</label>  
				<div class="col-md-12">
					<textarea name="message" id="message" rows="5" class="form-control input-md"></textarea>
				</div>
			</div>
			<div class="last-sett-btn modal-footer" style="margin: 0px -30px -10px -30px;">
				<button type="submit" name="send" id="send" tabindex="4" class="btn btn-main setting-panel-mdbtn"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg> {{LANG submit}}</button>
			</div>
		</div>
	<div class="clear"></div>
</form>
<div class="col-md-3"></div>
<!-- .page-margin -->
<script>
	$(function() {
		var form = $('form.contact-us-form');
		form.ajaxForm({
			url: '{{LINK aj/contact_us}}?hash=' + $('.main_session').val(),
			dataTyep:'json',
			beforeSend: function() {
				form.find('button').text("{{LANG please_wait}}");
			},
			success: function(data) {
				if (data.status == 200) {
					$('.contact-us-alert').html($('<div>',{
						class: "alert alert-success",
						html: data.message
					}));

					$('.alert-success').fadeIn(300);
				} 
				else {
					$('.contact-us-alert').html($('<div>',{
						class: "alert alert-danger",
						html: data.message
					}));
				}
				form.find('button').html('<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg> {{LANG submit}}');
			}
		});
	});
</script>