// JavaScript Document
function getForm() {
	var formBgOp=document.createElement('div');
	formBgOp.setAttribute('id','form-bg-op');
	var formBg=document.createElement('div');
	formBg.setAttribute('id','form-bg');
	var formContainer=document.createElement('div');
	formContainer.setAttribute('id','form-container');
	var formContainer2=document.createElement('div');
	formContainer2.setAttribute('id','form-container-2');
	var formFooter=document.createElement('div');
	formFooter.setAttribute('id','form-footer');
	document.body.appendChild(formBgOp);
	document.body.appendChild(formBg);
	document.getElementById('form-bg').appendChild(formContainer);
	document.getElementById('form-container').appendChild(formContainer2);
	document.getElementById('form-container').appendChild(formFooter);
	var draw='<h1>Enquiry Form</h1>';
	draw+='<p>Please complete the following contact details and we will have one of our representatives get in touch with you ASAP!</p>';
	
	draw+='<div class="separator">';
	
	// First name
	draw+='<ul>';
	draw+='<li><label for="firstName">First name</label></li>';
	draw+='<li><input type="text" name="firstName" id="firstName" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Last name
	draw+='<ul class="right">';
	draw+='<li><label for="lastName">Last name</label></li>';
	draw+='<li><input type="text" name="lastName" id="lastName" class="txtFld" /></li>';
	draw+='</ul>';
	
	// City and/or state
	draw+='<ul>';
	draw+='<li><label for="cityState">City and/or state</label></li>';
	draw+='<li><input type="text" name="cityState" id="cityState" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Country
	draw+='<ul class="right">';
	draw+='<li><label for="country">Country</label></li>';
	draw+='<li><input type="text" name="country" id="country" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Contact number
	draw+='<ul>';
	draw+='<li><label for="contactNumber">Contact number</label></li>';
	draw+='<li><input type="text" name="contactNumber" id="contactNumber" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Email address
	draw+='<ul class="right">';
	draw+='<li><label for="emailAddress">Email address</label></li>';
	draw+='<li><input type="text" name="emailAddress" id="emailAddress" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Position
	draw+='<ul>';
	draw+='<li><label for="position">Position</label></li>';
	draw+='<li><input type="text" name="position" id="position" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Fleet size
	draw+='<ul class="right">';
	draw+='<li><label for="fleetSize">Fleet size</label></li>';
	draw+='<li><input type="text" name="fleetSize" id="fleetSize" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Where did you hear about Securatrak
	draw+='<ul>';
	draw+='<li><label for="referrer">Where did you hear about Securatrak?</label></li>';
	draw+='<li><input type="text" name="referrer" id="referrer" class="txtFld" /></li>';
	draw+='</ul>';
	
	// Comments
	draw+='<ul class="right">';
	draw+='<li><label for="comments">Comments</label></li>';
	draw+='<li><textarea name="comments" id="comments" rows="5" cols="30" class="txtAra" /></textarea></li>';
	draw+='</ul>';
	
	draw+='</div>';
	
	draw+='<div class="separator">';
	
	draw+='<h2>Please choose product of interest</h2>';
	
	draw+='<ul>';
	draw+='<li><input type="checkbox" name="products[]" id="driverPerformance" value="Driver performance" /><label for="driverPerformance">Driver performance</label></li>';
	draw+='<li><input type="checkbox" name="products[]" id="driverSafety" value="Driver safety" /><label for="driverSafety">Driver safety</label></li>';
	draw+='<li><input type="checkbox" name="products[]" id="travel" value="Travel" /><label for="travel">Travel</label></li>';
	draw+='</ul>';
	
	draw+='<ul>';
	draw+='<li><input type="checkbox" name="products[]" id="requestLiterature" value="Request literature on chosen product" /><label for="requestLiterature">Request literature on chosen product</label></li>';
	draw+='<li><input type="checkbox" name="products[]" id="requestCall" value="Request a no obligation telephone conversation with Securatrak" /><label for="requestCall">Request a no obligation telephone conversation with Securatrak</label></li>';
	draw+='<li><input type="checkbox" name="products[]" id="arrangeDemonstration" value="Arrange a demonstration" /><label for="arrangeDemonstration">Arrange a demonstration</label></li>';
	draw+='</ul>';
	
	draw+='</div>';
	
	draw+='<div class="separator">';
	
	draw+='<h2>Refer/send info to friend</h2>';
	
	draw+='<ul>';
	draw+='<li><label for="friendName">Name</label></li>';
	draw+='<li><input type="text" name="friendName" id="friendName" class="txtFld" /></li>';
	draw+='</ul>';
	
	draw+='<ul class="right">';
	draw+='<li><label for="friendPosition">Position</label></li>';
	draw+='<li><input type="text" name="friendPosition" id="friendPosition" class="txtFld" /></li>';
	draw+='</ul>';
	
	draw+='<ul>';
	draw+='<li><label for="friendPhone">Contact number</label></li>';
	draw+='<li><input type="text" name="friendPhone" id="friendPhone" class="txtFld" /></li>';
	draw+='</ul>';
	
	draw+='<ul class="right">';
	draw+='<li><label for="friendEmail">Email address</label></li>';
	draw+='<li><input type="text" name="friendEmail" id="friendEmail" class="txtFld" /></li>';
	draw+='</ul>';
	
	draw+='</div>';
	
	draw+='<div class="separator-last">';
	draw+='<div style="float:right; width:160px">';
	draw+='<input type="button" onclick="cancelForm()" value="Cancel" class="cancel-btn" />';
	draw+='<input type="submit" value="Submit" class="submit-btn" />';
	draw+='</div>';
	
	document.getElementById('form-container-2').innerHTML=draw;
	return false;
}

function cancelForm() {
	document.body.removeChild(document.getElementById('form-bg-op'));
	document.body.removeChild(document.getElementById('form-bg'));
}