{literal}

	<script>
			$(document).ready(function(){
				
				$('.menu-close a, .menu-overlay').click(function(){$('.mobile-menu').removeClass("open");$('.menu-overlay').css("display","none");});
				$('.navbar-toggle').click(function(){$('.mobile-menu').addClass("open");$('.menu-overlay').css("display","block");});
				 $(".menu_li .submenu li:last-child").css("border-bottom", "none");
 $(".rightside-submenu li:last-child").css("border-bottom", "none");

				
				 $(".downarrow").click(function() {
  $(".downarrow").css("background-color", "")
  $(this).css("background-color", "#eee");
  $(this).next('.rightside-submenu').slideToggle();
 });
 
 $('.menu_li a').click(function() {
  $(this).next('ul').slideToggle();
 });
			 window.onload = function () {
				 var position=$(window).scrollTop();
				 if(position < 280){
				 window.setTimeout(function(){
					$("html, body").animate({ scrollTop: $('#signup_section').offset().top + 'px'
							}, 1, 'swing');
							$('html, body').css({'overflow': 'auto'});
					},10); 
				}
				else
				{
					window.setTimeout(function(){
					$("html, body").animate({ scrollTop: position + 'px'
							}, 1, 'swing');
							$('html, body').css({'overflow': 'auto'});
					},10); 
				}
			}
		});
	</script>
{/literal}

<style type="text/css">
{literal}
/* this is an intersting idea for this section */
 .ui-mobile-rendering>*{
   
   visibility: visible;
}
{/literal}
</style>


<script type="text/javascript"><!--
var ship2countries = new Array();
{if $ship2countries == "all"}
var ship2all = true;
{else}
var ship2all = false;
{section name=sc loop=$ship2countries}
ship2countries[{$smarty.section.sc.iteration}] = {$ship2countries[sc]};
{/section}
{/if};
--></script>
<script type="text/javascript"><!--
var countriesStates = {$countries_states};
{literal}
$(document).ready(function(){
setCountriesStates(
{/literal}
"#billing_country", "{$form.country|htmlspecialchars}",
"#billing_state", "{$form.state|htmlspecialchars}",
"#billing_province", "{$form.province|htmlspecialchars}",
countriesStates
{literal}
);
if ($.mobile)
{
$("#billing_country select,#billing_state select").selectmenu('refresh');
}
});
{/literal}
--></script>
{include file="templates/panels/panel-catalog-categories.html"}
<div id="signup_section" >
<div data-role="header">
<h1>{$msg.account.register}</h1>
</div>
<div data-role="content">
{if $is_user_errors == "yes"}
<div class="ui-corner-all ui-shadow msg-error">
{$msg.account.register_error}
{if $userErrors}
<ul>
{foreach from=$userErrors item="userError"}
<li>{$userError}</li>
{/foreach}
</ul>
{/if}
</div>
{/if}
<p>{lang msg=$msg.account.register_note url=$url_https}</p>
<div class="ui-corner-all ui-shadow msg-notice">{$msg.common.required_fields_are_bold}</div>
</div>
<form name="signupForm" action="{$url_https}p=signup" method="post" onsubmit="return CheckSignupForm(this, '{$FormsBillingCompany}', '{$FormsBillingAddressLine2}', '{$FormsBillingPhone}', ship2all, ship2countries)">
<input type="hidden" name="ua" value="{$USER_SIGNUP}"/>
<input type="hidden" name="cart_items_count" value="{$order->itemsCount|intval}"/>
<div class="ui-header" data-role="header" role="banner"><h2>{$msg.billing.billing_information}</h2></div>
<div data-role="content">
<div data-role="fieldcontain" class="required">
<label for="billing_first_name">{$msg.billing.first_name}</label>
<input id="billing_first_name" maxlength="24" type="text" name="form[fname]" value="{$form.fname|htmlspecialchars}" />
</div>
<div data-role="fieldcontain" class="required">
<label for="billing_last_name">{$msg.billing.last_name}</label>
<input id="billing_last_name" maxlength="24" type="text" name="form[lname]" value="{$form.lname|htmlspecialchars}" />
</div>
{if $FormsBillingCompany != "Invisible"}
<div data-role="fieldcontain"{if $FormsBillingCompany == "Required"} class="required"{/if}>
<label for="billing_company">{$msg.billing.company}</label>
<input id="billing_company" class="formControlText" maxlength="50" type="text" name="form[company]" value="{$form.company|htmlspecialchars}" />
</div>
{else}
<input type="hidden" name="form[company]" value="{$form.company|htmlspecialchars}"/>
{/if}
<div data-role="fieldcontain" class="required">
<label for="billing_address_line1">{$msg.billing.address_line1}</label>
<input id="billing_address_line1" class="formControlText" maxlength="125" type="text" name="form[address1]" value="{$form.address1|htmlspecialchars}" />
</div>
{if $FormsBillingAddressLine2 != "Invisible"}
<div data-role="fieldcontain"{if $FormsBillingAddressLine2 == "Required"} class="required"{/if}>
<label for="billing_address_line2">{$msg.billing.address_line2}</label>
<input id="billing_address_line2" class="formControlText" maxlength="125" type="text" name="form[address2]" value="{$form.address2|htmlspecialchars}" />
</div>
{else}
<input type="hidden" name="form[address2]" value="{$form.address2|htmlspecialchars}"/>
{/if}
<div data-role="fieldcontain" class="required">
<label for="billing_city">{$msg.billing.city}</label>
<input id="billing_city" maxlength="24" type="text" name="form[city]" value="{$form.city|htmlspecialchars}" />
</div>
<div id="billing_country" data-role="fieldcontain" class="required">
<label for="billing_country_select">{$msg.billing.country}</label>
<select id="billing_country_select" name="form[country]"></select>
</div>
<div id="billing_state" data-role="fieldcontain" class="required invisible">
<label for="billing_state_select">{$msg.billing.state_province}</label>
<select id="billing_state_select" name="form[state]"></select>
</div>
<div id="billing_province" data-role="fieldcontain" class="required invisible">
<label for="billing_province_input">{$msg.billing.state_province}</label>
<input id="billing_province_input" maxlength="24" type="text" name="form[province]"/>
</div>
<div data-role="fieldcontain" class="required">
<label for="billing_postal_code">{$msg.billing.postal_code}</label>
<input id="billing_postal_code" maxlength="24" type="text" name="form[zip]" value="{$form.zip|htmlspecialchars}" />
</div>
{if $FormsBillingPhone != "Invisible"}
<div data-role="fieldcontain"{if $FormsBillingPhone == "Required"} class="required"{/if}>
<label for="billing_phone_number">{$msg.billing.phone_number}</label>
<input id="billing_phone_number" maxlength="24" type="text" name="form[phone]" value="{$form.phone|htmlspecialchars}" />
</div>
{else}
<input type="hidden" name="form[phone]" value="{$form.phone|htmlspecialchars}" />
{/if}
{if $cf_billing}
{foreach from=$cf_billing item="cfield"}
<div data-role="fieldcontain"{if $cfield.is_required} class="required"{/if}>
{if $cfield.field_type != "radio"}
<label for="cf{$cfield.field_id}">{$cfield.field_caption}</label>
{cfield field=$cfield mobile=true}
{else}
<fieldset data-role="controlgroup">
<legend>{$cfield.field_caption}</legend>
{cfield field=$cfield mobile=true}
</fieldset>
{/if}
</div>
{/foreach}
{/if}
</div>
<div class="ui-header" data-role="header" role="banner"><h2>{$msg.shipping.shipping_information}</h2></div>
<div data-role="content">
<div data-role="fieldcontain">
<input type="checkbox" id="cb_thesame" name="form[thesame]" value="Yes" {if $form.thesame=="Yes" || $ShippingAllowSeparateAddress=="0"}checked="checked"{/if}{if $ShippingAllowSeparateAddress=="0"} disabled="disabled"{/if}/> 
<label id="label-cb_thesame" class="label-shipping-same" for="cb_thesame">{$msg.shipping.shipping_as_billing}</label>
{$msg.shipping.shipping_as_billing_description}
</div>
</div>
<div class="ui-header" data-role="header" role="banner"><h2>{$msg.account.account_information}</h2></div>
<div data-role="content">
<div data-role="fieldcontain" class="required">
<label for="account_login">{$msg.account.username} ({$msg.account.username_note})</label>
<input id="account_login" maxlength="24" type="text" name="form[login]" value="{$form.login|htmlspecialchars}"/>
</div>
<div data-role="fieldcontain" class="required">
<label for="account_password">{$msg.account.password} ({$msg.account.password_note})</label>
<input id="account_password" maxlength="24" type="password" name="form[password]" value=""/>
</div>
<div data-role="fieldcontain" class="required">
<label for="account_password_confirm">{$msg.account.password_confirm}</label>
<input id="account_password_confirm" maxlength="24" type="password" name="form[password2]" value=""/>
</div>
<div data-role="fieldcontain" class="required">
<label for="account_email_address">{$msg.account.email_address}</label>
<input id="account_email_address" maxlength="50" type="text" name="form[email]" value="{$form.email|htmlspecialchars}"/>
</div>
<div data-role="fieldcontain">
<label for="email_updates">{$msg.account.subscribe_updates}</label>
<input type="checkbox" name="form[email_updates]" id="email_updates" value="Yes" {if $form.email_updates == "Yes"}checked="checked"{/if}/>
</div>
<div data-role="fieldcontain">
<label for="email_newsletters">{$msg.account.subscribe_newsletter}</label>
<input type="checkbox" name="form[email_newsletters]" id="email_newsletters" value="Yes" {if $form.email_newsletters == "Yes"}checked="checked"{/if}/>
</div>
<div data-role="fieldcontain">
<label for="email_mode">{$msg.account.email_mode}</label>
<select id="email_mode" name="form[email_mode]">
<option value="html">{$msg.account.email_html}</option>
<option value="text" {if $form.email_mode == "text"} selected="selected"{/if}>{$msg.account.email_text}</option>
</select>
</div>
{if $cf_account}
{foreach from=$cf_account item="cfield"}
<div data-role="fieldcontain"{if $cfield.is_required} class="required"{/if}>
{if $cfield.field_type != "radio"}
<label for="cf{$cfield.field_id}">{$cfield.field_caption}</label>
{cfield field=$cfield mobile=true}
{else}
<fieldset data-role="controlgroup">
<legend>{$cfield.field_caption}</legend>
{cfield field=$cfield mobile=true}
</fieldset>
{/if}
</div>
{/foreach}
{/if}
</div>
{*if $captchaMethod != "None" && $captcha}
<div class="ui-header" data-role="header" role="banner"><h2>Captcha</h2></div>
<div data-role="content">
<div data-role="fieldcontain">
<label>Please enter CAPTCHA</label>
<div class="captcha">{$captcha}</div>
</div>
</div>
{/if*}
{if $cf_signup}
<div class="ui-header" data-role="header" role="banner"><h2>{$msg.cart.additional_information}</h2></div>
<div data-role="content">
{foreach from=$cf_signup item="cfield"}
<div data-role="fieldcontain"{if $cfield.is_required} class="required"{/if}>
{if $cfield.field_type != "radio"}
<label for="cf{$cfield.field_id}">{$cfield.field_caption}</label>
{cfield field=$cfield mobile=true}
{else}
<fieldset data-role="controlgroup">
<legend>{$cfield.field_caption}</legend>
{cfield field=$cfield mobile=true}
</fieldset>
{/if}
</div>
{/foreach}
</div>
{/if}
<div data-role="content">
{if $DisplayTermsAndConditionsCheckbox == "Yes"}
<div data-role="fieldcontain" id="agree-terms-and-conditions">
<input type="checkbox" id="cb_agree" name="form[agree]" value="Yes" {if $form.agree == "Yes"}checked="checked"{/if} /> 
<label >{lang msg=$msg.account.register_agree_policy url=$url_rel}</label>
</div>
{/if}
<input type="submit" class="submit" value="{$msg.buttons.buttonRegister}"/>
</div>
</form>
</div>
{literal}
<script type="text/javascript">
	function validate_signup(){	
		
		window.dataLayer = window.dataLayer || [];
		  window.dataLayer.push({
		    'event' : 'formSubmissionSuccess',
		    'formId' : 'createAccount'
		  });

		 return CheckSignupForm(this, '{$FormsBillingCompany}', '{$FormsBillingAddressLine2}', '{$FormsBillingPhone}', ship2all, ship2countries)
	}

</script>
{/literal}
{include file="templates/panels/panel-catalog-quick-links.html"}