<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Your Subscription: Step 1 of 2</title>
<link href="./css/checkboxs.css" rel="stylesheet" type="text/css" />
<link href="./css/main.css" rel="stylesheet" type="text/css" />
<link href="./css/default.css" rel="stylesheet" type="text/css" />
<link href="./css/bootstrap.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="./javascript/generic.js"></script>
<script language="javascript" type="text/javascript" src="./javascript/date.js"></script>
<script language="javascript" type="text/javascript" src="./javascript/validations.js"></script>
<script language="javascript" type="text/javascript" src="./javascript/jquery.icheck.min.js"></script>
<!-- This is where the variable is passed from the url -->
<script language="javascript" type="text/javascript">

function BankAccountValidation_Interactive_Validate_v1_00Begin(Key, AccountNumber, SortCode)
   {
      var scriptTag = document.getElementById("PCA2fa66b5844a148ee8994a2cf53992aeb");
      var headTag = document.getElementsByTagName("head").item(0);
      var strUrl = "";

      //Build the url
      strUrl = "https://services.postcodeanywhere.co.uk/BankAccountValidation/Interactive/Validate/v1.00/json.ws?";
      strUrl += "&Key=" + encodeURI(Key);
      strUrl += "&AccountNumber=" + encodeURI(AccountNumber);
      strUrl += "&SortCode=" + encodeURI(SortCode);
      strUrl += "&CallbackFunction=BankAccountValidation_Interactive_Validate_v1_00End";

      //Make the request
      if (scriptTag) 
         {
            try
              {
                  headTag.removeChild(scriptTag);
              }
            catch (e)
              {
                  //Ignore
              }
         }
      scriptTag = document.createElement("script");
      scriptTag.src = strUrl
      scriptTag.type = "text/javascript";
      scriptTag.id = "PCA2fa66b5844a148ee8994a2cf53992aeb";
      headTag.appendChild(scriptTag);
   }

function BankAccountValidation_Interactive_Validate_v1_00End(response)
   {
      //Test for an error
      if (response.length==1 && typeof(response[0].Error) != 'undefined')
         {
            //Show the error message
            alert(response[0].Description);
         }
      else
         {
            //Check if there were any items found
            if (response.length==0)
               {
                  alert("Sorry, no matching items found");
               }
            else
               {
                  //document.getElementById('status').innerHTML = response[0].StatusInformation;
				  statusCheck = response[0].StatusInformation;
				  if (statusCheck == "OK" || statusCheck == "CautiousOK")
					{statusCheck = "This account supports Direct Debits"}
				  if (statusCheck == "InvalidAccountNumber")
					{
					statusCheck = "This account does not support Direct Debits - please use a different account";
					alert(statusCheck);
					}
				  if (statusCheck == "UnknownSortCode")
					{
					statusCheck = "This SORT CODE isn't recognised - please check and amend";
					alert(statusCheck);
					}
			
				  document.getElementById('txtBankName').value = response[0].Bank;
				  
//More information on this API, as well as the entire set of fields returned can be found at:
//http://www.postcodeanywhere.co.uk/support/webservices/BankAccountValidation/Interactive/Validate/v1/default.aspx

               }
         }
   }


</script>
<!-- this bit of code creates todays date in the following format mmm-yyyy -->
<script type="text/javascript">
function showMe (it, box) {
  var vis = (box.checked) ? "block" : "none";
  document.getElementById(it).style.display = vis;
}
function hideVisa()
{
	document.getElementById('frmSubscription').action = "https://www.dbfactory2.co.uk/gateway/processing_page_token.asp?FAMILY_CODE=HA";
document.getElementById('divPaypal').style.display = 'none';	
document.getElementById('divVisa').style.display = "block";
document.getElementById('divMastercard').style.display = "none";
//document.getElementById('divMaestro').style.display = "none";
document.getElementById('divDirectdebit').style.display = "none";
document.getElementById('divOptions').style.display = "block";

	  //blank dd and mastercard fields - KC 11032011
	  document.getElementById('txtMastercardName').value = '';
	  document.getElementById('txtMasterCardCardNumber').value = '';
	  document.getElementById('txtMasterCardCvsNumber').value = '';

      document.getElementById('txtAccountHolderName').value = '';
      document.getElementById('txtAccountNumber').value = '';
      document.getElementById('txtSortCode').value = '';
      document.getElementById('txtBankName').value = '';
	  ////////////////////////////////
}
function hideMC()
{
	document.getElementById('frmSubscription').action = "https://www.dbfactory2.co.uk/gateway/processing_page_token.asp?FAMILY_CODE=HA";
document.getElementById('divPaypal').style.display = 'none';	
document.getElementById('divMastercard').style.display = 'block';
document.getElementById('divVisa').style.display = 'none';
//document.getElementById('divMaestro').style.display = 'none';
document.getElementById('divDirectdebit').style.display = 'none';
document.getElementById('divOptions').style.display = "block";

	  //blank dd and visa fields - KC 11032011
	  document.getElementById('txtCardName').value = '';
	  document.getElementById('txtCardNumber').value = '';
	  document.getElementById('txtCvsNumber').value = '';	
	  
	  document.getElementById('txtAccountHolderName').value = '';
	  document.getElementById('txtAccountNumber').value = '';
	  document.getElementById('txtSortCode').value = '';
	  document.getElementById('txtBankName').value = '';
	  ///////////////////////////
}
function hideMaestro()
{
   document.getElementById('frmSubscription').action = "https://www.dbfactory2.co.uk/gateway/processing_page_token.asp?FAMILY_CODE=HA";
document.getElementById('divPaypal').style.display = 'none';	
//document.getElementById('divMaestro').style.display = 'block';
document.getElementById('divVisa').style.display = 'none';
document.getElementById('divMastercard').style.display = 'none';
document.getElementById('divDirectdebit').style.display = 'none';
document.getElementById('divOptions').style.display = "block";
}
function hideDirectdebit()
{
document.getElementById('frmSubscription').action = "page3.php";
document.getElementById('divPaypal').style.display = 'none';
document.getElementById('divDirectdebit').style.display = 'block';
document.getElementById('divVisa').style.display = 'none';
//document.getElementById('divMaestro').style.display = 'none';
document.getElementById('divMastercard').style.display = 'none';
document.getElementById('divOptions').style.display = "block";

	  //blank visa and mastercard fields - KC 11032011
	  document.getElementById('txtCardName').value = '';
	  document.getElementById('txtCardNumber').value = '';
	  document.getElementById('txtCvsNumber').value = '';

	  document.getElementById('txtMastercardName').value = '';
	  document.getElementById('txtMasterCardCardNumber').value = '';
	  document.getElementById('txtMasterCardCvsNumber').value = '';	  
	  //////////////////////////////////
}

function hidePaypal()
{
	document.getElementById('frmSubscription').action = "page3_paypal.php";
document.getElementById('divPaypal').style.display = 'block';
document.getElementById('divDirectdebit').style.display = 'none';
document.getElementById('divVisa').style.display = 'none';
//document.getElementById('divMaestro').style.display = 'none';
document.getElementById('divMastercard').style.display = 'none';
//document.getElementById('divOptions').style.display = "none";
}

function showInvoice(){

var selValue
selValue= document.getElementById('selDifferentDeliveryDetails').value;
if (document.getElementById('selDifferentDeliveryDetails').value !== "No")
	{
	hidedev();
	document.getElementById('txtForename_Delivery').readOnly=""; 	
	document.getElementById("txtForename_Delivery").focus();
	document.getElementById("txtSurname_Delivery").readOnly=""; 	
	document.getElementById("txtAddressLine1_Delivery").readOnly=""; 	
	document.getElementById("txtAddressLine2_Delivery").readOnly=""; 	
	document.getElementById("txtTown_Delivery").readOnly=""; 	
	document.getElementById("txtCounty_Delivery").readOnly=""; 	
	document.getElementById("txtPostcode_Delivery1").readOnly=""; 	
	document.getElementById("txtPostcode_Delivery2").readOnly=""; 	
	document.getElementById("selCountry_Delivery").readOnly=""; 	
	document.getElementById("txtTelephone_Delivery").readOnly=""; 	
	document.getElementById("txtEmail_Delivery").readOnly=""; 	
	document.getElementById("txtConfirmEmail_Delivery").readOnly=""; 			
	}else{
	unhiddev();
	}
	
}

 <!-- 
var pageDateForExpiryDate;
// Array of month Names
var monthNames = new Array(
"Jan","Feb","Mar","Apr","May","Jun","Jul",
"Aug","Sep","Oct","Nov","Dec");

var now = new Date();
pageDateForExpiryDate = (monthNames[now.getMonth()] + "-" + now.getFullYear());

// -->
	
  
		function optionChoose() {
				if(document.form1.BILLRADIO[0].checked) {
					if((document.form1.WESBILLTYPE.options[document.form1.WESBILLTYPE.selectedIndex].value == "") ||
					(document.form1.WESBILLTYPE.options[document.form1.WESBILLTYPE.selectedIndex].value == "Z")){
						alert("Please select a credit card type.");
					    return false;
						}
					 else {return true}		
				  }
				 else if(document.form1.BILLRADIO[1].checked) {
				 		document.form1.WESBILLTYPE.selectedIndex=0
						document.form1.MSCCRDNR.value = ""
						document.form1.WESEXPMM.value = ""
						document.form1.WESEXPYY.value = ""
	    				return true;
				}
				 else {
					alert("Please check the pay by credit card or bill me option.");
					return false;
				}
			}

			function checkEmail(){
			 
				var emailvalue = document.form1.MSREMAIL.value;
				var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; 
				if(emailvalue != ""){	
						if (emailPattern.test(emailvalue)) {
							return true;
						} else  {
							alert("Please enter a valid e-mail address.");
							document.form1.MSREMAIL.focus;
							return false;
						}
					} else  {
						return true;
				}	
						
			}
			
			function submitForm(){
			checkBox();
			if(optionChoose() && checkEmail() && compareEmails()) {
			    document.form1.submit();
			  }			
			}


// No Right Click Script //

<!--

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->

<!--
//
function openWin(pageName)  {
var features = 'status=no,scrollbars=yes,width=500,height=385';
window.open(pageName,"win1", features );
}
function inb_openWin(Url,Name,Width,Height,Scrollbars)  {
var features = 'status=no,scrollbars=' + Scrollbars + ',width=' + Width +
',height=' + Height;
window.open(Url, Name, features );
}

//-->
</script>
<script type="text/javascript">
function hidedev(){
document.getElementById('deliveryaddress').style.display ='none'; 
document.getElementById('otherpayment').style.display ='block'; 
document.getElementById('devtext').innerHTML  ='Delivery Details <a href=# onclick=unhiddev()>(unhide)</a>';
document.getElementById('billad').innerHTML  ='Billing Address';
}
function unhiddev(){

	if (document.getElementById('selDifferentDeliveryDetails').value == "Yes")
		{
		document.getElementById('deliveryDiv').style.display ='block'; 
		}
	else
		{
		document.getElementById('deliveryDiv').style.display ='none'; 
		}
}

function paypalOption(){
check = document.getElementById('intIssueStart').value;

if (check > 5)
	{
	document.getElementById('paypalOption').style.display = "none";
	}
else
	{
	document.getElementById('paypalOption').style.display = "block";
	}
	
}


function countryCheck() {
check = document.getElementById('selCountry').value;
if (check == "Eire")
	{
	document.getElementById('ddHide').innerHTML = "Unfortunately we do not accept Direct Debit from Eire";
	}
else
	{
	document.getElementById('ddHide').innerHTML = "<img src='images/directDebitLogo2.gif' alt='Direct Debit' width='45' height='45' align='absmiddle' style='display:inline' /><br /><input type='radio' name='selPaymentMethod_1' id='selPaymentMethod_1' value='Direct_Debit' onclick='document.getElementById('selPaymentMethod').value='Direct_Debit';javascript:hideDirectdebit();' />";
	}
	
}
</script>
</head>
<body>
<script type="text/javascript" src="javascript/wz_tooltip.js"></script>
<!-- this loads the tooltip plugin -->
<div id="wrapper">
  <div id="banner" align="center">
    <table width="100%" border="0">
      <tr>
        <td align="center"><img src="images/hachette.jpg" alt="Hachette" /></td>

      </tr>
    </table>
  </div>
  <div id="content">
    <div id="bar">
      <h2>Update Credit Card Details</h2>
    </div>
    <div id="bmbPageOutterContent">
      <div id="bmbPageContent">
        <form action="page3.php" method="post" name="frmSubscription" id="frmSubscription" onsubmit="return subscriptionsValidateIndex();">
          <div class="container-fluid" style="padding:0;">
            <div class="pull-left>
            <div class="col-lg-10">
              <div class="col-lg-12">
                <!-- =========================== AREA ============================= -->
                <!-- ============================================================== -->
              </div>
              <!-- =========================== AREA 2 ============================= -->
              <div class="col-lg-12">
              <div class="area2">
                  <p>Please enter your subscriber number here:</p>
                  <div class="col-lg-12">
                     <label for="Subscriber Number">Subscriber Number*</label>
                    <div class="field">
                      <input name="selMarketingCode" id="selMarketingCode" class="textinput2" type="text" tabindex="2" maxlength="8" value=""  />
                    </div>
                  </div>
				  <p>&nbsp;</p>
                  <p>Please select which magazine you are subscribed to:</p>
                  <div class="col-lg-12">
                     <label for="Magazine Title">Magazine Title*</label>
                    <div class="field">
                      <select name="chkStands" id="chkStands" class="textinput" tabindex="2">
                        <option value="" selected="selected">(please select)</option>
                        <option value="2000AD">2000AD</option>
                        <option value="Batman Tumbler">Batman Tumbler</option>
                        <option value="Build the Bismarck">Build the Bismarck</option>
                        <option value="Build the Terminator">Build the Terminator</option>
                        <option value="DC Heroes and Villains">DC Heroes and Villains</option>
                        <option value="Disney Cross Stitch">Disney Cross Stitch</option>
						<option value="Ford Falcon XB GT">Marvel Graphic Novels</option>
                        <option value="Marvel Graphic Novels">Marvel Graphic Novels</option>
                        <option value="Marvel Graphic Novel Relaunch">Marvel Graphic Novel Relaunch</option>
                        <option value="My Little Library">My Little Library</option>
                        <option value="Peter Rabbit Cross Stitch">Peter Rabbit Quilt</option>
						<option value="Peter Rabbit Quilt">Peter Rabbit Quilt</option>
                        <option value="Spitfire">Spitfire</option>
                        <option value="Titanic">Titanic</option>
						<option value="The Darek">Titanic</option>
                        <option value="The Lancaster Bomber">The Lancaster Bomber</option>						
                        <option value="Transformers">Transformers</option>  						
                        <option value="Warhammer Conquest">Warhammer Combat Patrol</option>
						<option value="Warhammer Conquest">Warhammer Conquest</option>
						<option value="Warhammer Imperium">Warhammer Imperium</option>                        
                        <option value="Warhammer Mortal Realms">Warhammer Mortal Realms</option>
						<option value="Warhammer Stormbringer">Warhammer Stormbringer</option>
                      </select>
                    </div>
                  </div>
                  <div class="clear"></div>
                  </div>
                <!-- =========================== AREA 3 ============================= -->
                <div class="area2">
                  <div class="col-lg-12">
                    <h1>Billing Details</h1>
                  </div>
                  <div class="col-lg-6">
                    <label class="selTitleLabel" for="selTitle">Title</label>
                    <div class="field">
                      <select name="selTitle" id="selTitle" class="textinput" tabindex="3" onchange="">
                        <option value="Mr">Mr</option>
                        <option value="Mrs">Mrs</option>
                        <option value="Miss">Miss</option>
                      </select>
                    </div>
                    <br class="clear" />
                    <label for="txtForename">First name*</label>
                    <div class="field">
                      <input name="txtForename" id="txtForename" class="textinput2" type="text" tabindex="4" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtSurname">Surname*</label>
                    <div class="field">
                      <input name="txtSurname" id="txtSurname" class="textinput2" type="text" tabindex="5" maxlength="" />
                    </div>
                    <!--<br class="clear" />
            <label class="selSexLabel" for="selSex">Gender</label>
            <div class="field">
              <select name="selSex" id="selSex" class="textinput" tabindex="6" onchange="">
                <option value="Male">Male</option>
                <option value="Female">Female</option>
              </select>
            </div>-->
                    <br class="clear" />
                    <label class="selDate_DayLabel" for="selDate_Day"></label>
                    <div class="field">
                    <input name="selDate_Day" id="selDate_Day" type="hidden" value="01" />
                    <input name="selDate_Month" id="selDate_Month" type="hidden" value="01" />
                    <input name="selDateOfBirth_Year" id="selDateOfBirth_Year" type="hidden" value="2000" />
                      <!--<select name="selDate_Day" id="selDate_Day" tabindex="7" class="textinput" onchange="">
                        <option value="01">01</option>
                        <option value="02">02</option>
                        <option value="03">03</option>
                        <option value="04">04</option>
                        <option value="05">05</option>
                        <option value="06">06</option>
                        <option value="07">07</option>
                        <option value="08">08</option>
                        <option value="09">09</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>
                      <select name="selDate_Month" id="selDate_Month" tabindex="8" class="textinput" onchange="">
                        <option value="Jan">Jan</option>
                        <option value="Feb">Feb</option>
                        <option value="Mar">Mar</option>
                        <option value="Apr">Apr</option>
                        <option value="May">May</option>
                        <option value="Jun">Jun</option>
                        <option value="Jul">Jul</option>
                        <option value="Aug">Aug</option>
                        <option value="Sep">Sep</option>
                        <option value="Oct">Oct</option>
                        <option value="Nov">Nov</option>
                        <option value="Dec">Dec</option>
                      </select>
                      <select name="selDateOfBirth_Year" id="selDateOfBirth_Year" tabindex="9" class="textinput" onchange="">
                        <option value="1997">1997</option>
                        <option value="1996">1996</option>
                        <option value="1995">1995</option>
                        <option value="1994">1994</option>
                        <option value="1993">1993</option>
                        <option value="1992">1992</option>
                        <option value="1991">1991</option>
                        <option value="1990">1990</option>
                        <option value="1989">1989</option>
                        <option value="1988">1988</option>
                        <option value="1987">1987</option>
                        <option value="1986">1986</option>
                        <option value="1985">1985</option>
                        <option value="1984">1984</option>
                        <option value="1983">1983</option>
                        <option value="1982">1982</option>
                        <option value="1981">1981</option>
                        <option value="1980">1980</option>
                        <option value="1979">1979</option>
                        <option value="1978">1978</option>
                        <option value="1977">1977</option>
                        <option value="1976">1976</option>
                        <option value="1975">1975</option>
                        <option value="1974">1974</option>
                        <option value="1973">1973</option>
                        <option value="1972">1972</option>
                        <option value="1971">1971</option>
                        <option value="1970">1970</option>
                        <option value="1969">1969</option>
                        <option value="1968">1968</option>
                        <option value="1967">1967</option>
                        <option value="1966">1966</option>
                        <option value="1965">1965</option>
                        <option value="1964">1964</option>
                        <option value="1963">1963</option>
                        <option value="1962">1962</option>
                        <option value="1961">1961</option>
                        <option value="1960">1960</option>
                        <option value="1959">1959</option>
                        <option value="1958">1958</option>
                        <option value="1957">1957</option>
                        <option value="1956">1956</option>
                        <option value="1955">1955</option>
                        <option value="1954">1954</option>
                        <option value="1953">1953</option>
                        <option value="1952">1952</option>
                        <option value="1951">1951</option>
                        <option value="1950">1950</option>
                        <option value="1949">1949</option>
                        <option value="1948">1948</option>
                        <option value="1947">1947</option>
                        <option value="1946">1946</option>
                        <option value="1945">1945</option>
                        <option value="1944">1944</option>
                        <option value="1943">1943</option>
                        <option value="1942">1942</option>
                        <option value="1941">1941</option>
                        <option value="1940">1940</option>
                        <option value="1939">1939</option>
                        <option value="1938">1938</option>
                        <option value="1937">1937</option>
                        <option value="1936">1936</option>
                        <option value="1935">1935</option>
                        <option value="1934">1934</option>
                        <option value="1933">1933</option>
                        <option value="1932">1932</option>
                        <option value="1931">1931</option>
                        <option value="1930">1930</option>
                        <option value="1929">1929</option>
                        <option value="1928">1928</option>
                        <option value="1927">1927</option>
                        <option value="1926">1926</option>
                        <option value="1925">1925</option>
                        <option value="1924">1924</option>
                        <option value="1923">1923</option>
                        <option value="1922">1922</option>
                        <option value="1921">1921</option>
                        <option value="1920">1920</option>
                        <option value="1919">1919</option>
                        <option value="1918">1918</option>
                        <option value="1917">1917</option>
                        <option value="1916">1916</option>
                        <option value="1915">1915</option>
                        <option value="1914">1914</option>
                        <option value="1913">1913</option>
                        <option value="1912">1912</option>
                        <option value="1911">1911</option>
                        <option value="1910">1910</option>
                        <option value="1909">1909</option>
                        <option value="1908">1908</option>
                        <option value="1907">1907</option>
                      </select>-->
                    </div>
                    <br class="clear" />
                    <label for="txtTelephone">Telephone</label>
                    <div class="field">
                      <input name="txtTelephone" id="txtTelephone" tabindex="19" class="textinput2" type="text" maxlength="" />
                    </div>
                  </div>
                  <!-- ========================================== -->
                  <div class="col-lg-6" style="overflow:visible">
                    <label for="txtAddressLine1">Address Line 1*</label>
                    <div class="field">
                      <input name="txtAddressLine1" id="txtAddressLine1" class="textinput2" tabindex="14" type="text" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtAddressLine2">Address Line 2</label>
                    <div class="field">
                      <input name="txtAddressLine2" id="txtAddressLine2" class="textinput2" tabindex="15" type="text" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtTown">Town*</label>
                    <div class="field">
                      <input name="txtTown" id="txtTown" class="textinput2" type="text" tabindex="16" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtCounty">State/Territory</label>
                    <div class="field">
                      <input name="txtCounty" id="txtCounty" class="textinput2" tabindex="17" type="text" maxlength="" />
                    </div>
                        <br class="clear" />
                                        <label for="txtPostcode1">Postcode*</label>
                    <div class="field">
                      <input name="txtPostcode1" id="txtPostcode1" tabindex="13" class="textinput3" type="text" maxlength="8" />
                    </div>              

                    <br class="clear" />
                    <label class="selCountryLabel" for="selCountry">Country*</label>
                    <div class="field">
                      <select name="selCountry" id="selCountry" tabindex="18" class="textinput" onchange="countryCheck();">
                        <option value="AUS">Australia</option>                        
                      </select>
                    </div>
                    <div class="clear"></div>
                  </div>
                  <div class="col-lg-12" style="display:block; margin-top:10px">
                    <label class="selDifferentDeliveryDetailsLabel" for="selDifferentDeliveryDetails" style="width:400px; margin-top:19px">Is the address of the payer different from the delivery address?<br />
                      <br />
                    </label>
                    <div class="field seldelivery">
                      <select name="selDifferentDeliveryDetails" style="vertical-align:middle" id="selDifferentDeliveryDetails" tabindex="20" class="textinput" onchange="unhiddev(this.id, this.value);">
                        <option value="No">No</option>
                        <option value="Yes">Yes</option>
                      </select>
                    </div>
                    <br class="clear" />
                  </div>
                  <div class="clear"></div>
                </div>
                <!-- ============================================================== -->
              </div>
              <input type="hidden" name="selSex" id="selSex" value="NA">
              <!-- =========================== AREA 3 ============================= -->
              <div class="col-lg-12">
                <div id="deliveryDiv" class="area2" style="display:none">
                  <div class="col-lg-12">
                    <h2>Billing Address</h2>
                  </div>
                  <div class="col-lg-6">
                    <label class="selTitle_DeliveryLabel" for="selTitle_Delivery">Title</label>
                    <div class="field">
                      <select name="selTitle_Delivery" id="selTitle_Delivery" tabindex="20" class="textinput" onchange="">
                        <option value="Mr">Mr</option>
                        <option value="Mrs">Mrs</option>
                        <option value="Miss">Miss</option>
                      </select>
                    </div>
                    <br class="clear" />
                    <label for="txtForename_Delivery">Forename*</label>
                    <div class="field">
                      <input name="txtForename_Delivery" id="txtForename_Delivery" tabindex="21" class="textinput2" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtSurname_Delivery">Surname*</label>
                    <div class="field">
                      <input name="txtSurname_Delivery" id="txtSurname_Delivery" tabindex="22" class="textinput2" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtTelephone_Delivery">Telephone</label>
                    <div class="field">
                      <input name="txtTelephone_Delivery" id="txtTelephone_Delivery" tabindex="23" class="textinput2" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtPostcode_Delivery1">Postcode*</label>
                    <div class="field">
                      <input name="txtPostcode_Delivery1" id="txtPostcode_Delivery1" tabindex="13" class="textinput3" type="text" maxlength="8" />
                    </div>
                  </div>
                  <div class="col-lg-6">
                    <label for="txtAddressLine1_Delivery">Address Line 1*</label>
                    <div class="field">
                      <input name="txtAddressLine1_Delivery" id="txtAddressLine1_Delivery" tabindex="26" class="textinput2" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtAddressLine2_Delivery">Address Line 2</label>
                    <div class="field">
                      <input name="txtAddressLine2_Delivery" id="txtAddressLine2_Delivery" tabindex="27" class="textinput2" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtTown_Delivery">Town*</label>
                    <div class="field">
                      <input name="txtTown_Delivery" id="txtTown_Delivery" class="textinput2" tabindex="28" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label for="txtCounty_Delivery">State/Territory</label>
                    <div class="field">
                      <input name="txtCounty_Delivery" id="txtCounty_Delivery" class="textinput2" tabindex="29" type="text" value="" maxlength="" />
                    </div>
                    <br class="clear" />
                    <label class="selCountry_DeliveryLabel" for="selCountry_Delivery">Country*</label>
                    <div class="field">
                      <select name="selCountry_Delivery" id="selCountry_Delivery" tabindex="30" class="textinput" onchange="">
                        <option selected="selected" value="AUS">Australia</option>
                      </select>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-lg-12">
                <div class="area2">
                  <div class="col-lg-12">
                    <h1>Choose payment</h1>
                    <p id="paymenttext">I authorise you to update my card details.</p>
                  </div>
                  <div class="col-lg-12"></div>
                  <table width="100%" border="0" style="border-spacing:5">
                    <tr>
                      <td colspan="4" align="left" ></td>
                    </tr>
                    <!--  <form id="form1" name="form1" method="post" action=""> -->
                    <tr>
                      <td width="27%"><input type="hidden" name="selPaymentMethod" id="selPaymentMethod" value="Default" />
                        <img src="images/visaLogo.gif" alt="Visa" /><img src="images/DeltaLogo.gif" /><img src="images/electronLogo.gif" /><br />
                        <input type="radio" name="selPaymentMethod_1" id="selPaymentMethod_1" value="Visa/Visa_Delta" onclick="document.getElementById('selPaymentMethod').value='Visa/Visa_Delta';javascript:hideVisa();" /></td>
                      <td width="21%"><img src="images/mastercardLogo.gif" width="56" height="37" alt="MasterCard" /><br />
                        <input type="radio" name="selPaymentMethod_1" id="selPaymentMethod_1" value="MasterCard" onclick="document.getElementById('selPaymentMethod').value='MasterCard';javascript:hideMC();" /></td>
                     </tr>
                    <tr>
                      <td>&nbsp;</td>
                      <td>&nbsp;</td>
                      <td>&nbsp;</td>
                      <td>&nbsp;</td>
                    </tr>
<input type="hidden" name="intIssueStart" id="intIssueStart" value="1" />
<input type="hidden" name="chkBinders" id="chkBinders" value="Y" />
<input type="hidden" name="chkOtherCompanyPromotions" id="chkOtherCompanyPromotions" value="Y" />
<input type="hidden" name="chkThisCompanyPromotions" id="chkThisCompanyPromotions"  value="Y" />
<input type="hidden" name="txtEmail" id="txtEmail" value="anon@anon.com" />
<input type="hidden" name="txtCOnfirmEmail" id="txtConfirmEmail" value="anon@anon.com" />
<input type="hidden" name="chkReceiveSpecialIssues" id="chkReceiveSpecialIssues" value="Y" />
<input type="hidden" name="chkEmailMe" id="chkEmailMe" value="Y" />
                    <!--    </form>  -->
                  </table>
                  <div class="clearfix"></div>
                </div>
              </div>
              <div class="col-lg-12">
                <div>
                  <div id="divPaypal" style="display:none">
                    <!-- no text required anymore KC 30012012 -->
                  </div>
                  <div id="divVisa" style="display:none" class="area2" >
                    <div class="logoImages"> <img src="images/visaLogo.gif"/><img src="images/DeltaLogo.gif" /><img src="images/electronLogo.gif" /> </div>
                    <div class="clear"><br class="clear" />
                    </div>
                    <label for="txtCardName">Name on Card*</label>
                    <div class="field">
                      <input name="txtCardName" id="txtCardName" class="textinput2" type="text" value="" maxlength="" autocomplete="off"/>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label for="txtCardNumber">Card Number*</label>
                    <div class="field">
                      <input name="txtCardNumber" id="txtCardNumber" class="textinput2" type="text" maxlength="" autocomplete="off"/>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label class="selExpiry_MonthLabel" for="selExpiry_Month">Expiry Date*</label>
                    <div class="field">
                      <select name="selExpiry_Month" id="selExpiry_Month" class="textinput" onchange="">
                        <option value="Jan">Jan</option>
                        <option value="Feb">Feb</option>
                        <option value="Mar">Mar</option>
                        <option value="Apr">Apr</option>
                        <option value="May">May</option>
                        <option value="Jun">Jun</option>
                        <option value="Jul">Jul</option>
                        <option value="Aug">Aug</option>
                        <option value="Sep">Sep</option>
                        <option value="Oct">Oct</option>
                        <option value="Nov">Nov</option>
                        <option value="Dec">Dec</option>
                      </select>
                      <select name="selExpiry_Year" id="selExpiry_Year" class="textinput" onchange="">
                        <option value="2023">2023</option>
                        <option value="2024">2024</option>
                        <option value="2025">2025</option>
                        <option value="2026">2026</option>
                        <option value="2027">2027</option>
                        <option value="2028">2028</option>
                        <option value="2029">2029</option>
                        <option value="2030">2030</option>
                        <option value="2031">2031</option>
                        <option value="2032">2032</option>
                        <option value="2033">2033</option>                                                                        
                      </select>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label for="txtCvsNumber"> 3 Digit Security Number* </label>
                    <div class="field">
                      <input name="txtCvsNumber" id="txtCvsNumber" class="textinput3" type="text" maxlength="3" autocomplete="off"/>
                      What's this? <img height="17px" width="26px" src="images/security_digits.gif" onmousemove="Tip('&lt;img src=\'./images/security_digits.gif\' width=\'262px\' height=\'170px\'&gt;')"/> </div>
                    <br class="clear" />
                  </div>
                  <div id="divMastercard" style="display:none" class="area2" >
                    <div class="logoImages"><img src="images/mastercardLogo.gif" /></div>
                    <div class="clear"><br class="clear" />
                    </div>
                    <label for="txtMastercardName">Name on Card*</label>
                    <div class="field">
                      <input name="txtMastercardName" id="txtMastercardName" class="textinput2" type="text" value="" maxlength="" autocomplete="off"/>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label for="txtMasterCardCardNumber">Card Number*</label>
                    <div class="field">
                      <input name="txtMasterCardCardNumber" id="txtMasterCardCardNumber" class="textinput2" type="text" value="" maxlength="" autocomplete="off"/>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label class="selMasterCardExpiry_MonthLabel" for="selMasterCardExpiry_Month">Expiry Date*</label>
                    <div class="field">
                      <select name="selMasterCardExpiry_Month" id="selMasterCardExpiry_Month" class="textinput" onchange="">
                        <option value="Jan">Jan</option>
                        <option value="Feb">Feb</option>
                        <option value="Mar">Mar</option>
                        <option value="Apr">Apr</option>
                        <option value="May">May</option>
                        <option value="Jun">Jun</option>
                        <option value="Jul">Jul</option>
                        <option value="Aug">Aug</option>
                        <option value="Sep">Sep</option>
                        <option value="Oct">Oct</option>
                        <option value="Nov">Nov</option>
                        <option value="Dec">Dec</option>
                      </select>
                      <select name="selMasterCardExpiry_Year" id="selMasterCardExpiry_Year" class="textinput" onchange="">
                        <option value="2023">2023</option>
                        <option value="2024">2024</option>
                        <option value="2025">2025</option>
                        <option value="2026">2026</option>
                        <option value="2027">2027</option>
                        <option value="2028">2028</option>
                        <option value="2029">2029</option>
                        <option value="2030">2030</option>
                        <option value="2031">2031</option>
                        <option value="2032">2032</option>
                        <option value="2033">2033</option>                        
                      </select>
                    </div>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div class="clear"></div>
                    <label for="txtMasterCardCvsNumber"> 3 Digit Security Number*</label>
                    <div class="field">
                      <input name="txtMasterCardCvsNumber" id="txtMasterCardCvsNumber" class="textinput3" type="text" value="" maxlength="3" autocomplete="off"/>
                      What's this? <img height="17px" width="26px" src="images/security_digits.gif" onmousemove="Tip('&lt;img src=\'./images/security_digits.gif\' width=\'262px\' height=\'170px\'&gt;')"/> </div>
                    <br class="clear" />
                  </div>
                  <div id="divDirectdebit" style="display:none" class="area2" ><br />
                    <table width="100%">
                      <tr>
                        <td align="left"><p>Please fill in the following
                            <input type="text" readonly="readonly" class="requiredInput" value="highlighted" style="background-color:#fff3cf;" />
                            information on the form below: <br/>
                            <b>Confirm you are the account holder?</b> <br/>
                            <b>Bank Name,</b> <br/>
                            <b>Account Holders Name,</b> <br/>
                            <b>Sort Code,</b> <br/>
                            <b>Account number,</b> <br/>
                            in the boxes below.</p></td>
                      </tr>
                      <tr>
                        <td align="left"><p>
                            <input name="chkDD" id="chkDD" type="checkbox" value="N" onclick="value='Y'" style="background-color:#fff3cf;" />
                            Are you the account holder and the only person required to authorise direct debits on this account? </p></td>
                      </tr>
                      <tr>
                        <td align="left"><table align="center" width="412px" height="396px" border="0" background="images/RBA_DDI_New.gif">
                            <tr>
                              <th scope="col"> 
                              <td style="font-size:15px; font-family:Arial, Helvetica, sans-serif; color:#000" align="left" >Database Factory re RBA Colectionables SA</td>
                              </th>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td style="font-size:9px; font-family:Arial, Helvetica, sans-serif; color:#000" align="left" >FREEPOST Plus RRBR-UYAC-BJCK</br>
                                Ringwood <br />
                                BH24 1HD</td>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td valign="top"><p> <font size="1" style="font-family:Arial, Helvetica, sans-serif; color:#000"><strong>Name of Account Holder:</strong></font> <span class="requiredInput">
                                  <input name="txtAccountHolderName" id="txtAccountHolderName" class="requiredInput" type="text" value="Acc Holders Name" maxlength="" onfocus="value=''" style="background-color:#fff3cf;" autocomplete="off"/>
                                  </span></p>
                                <font size="1" style="font-family:Arial, Helvetica, sans-serif; color:#000"><strong>Account Number:</strong></font> <span class="requiredField">
                                <input name="txtAccountNumber" id="txtAccountNumber" class="requiredInput" type="text" value="Acc/No" maxlength="8" onfocus="value=''" style="background-color:#fff3cf;" autocomplete="off"/>
                                </span>
                                <p> <font size="1" style="font-family:Arial, Helvetica, sans-serif; color:#000"><strong>Branch Sort Code:</strong></font> <span class="requiredInput">
                                  <input name="txtSortCode" id="txtSortCode" class="requiredInput" type="text" value="S/Code" maxlength="6" onfocus="value=''" style="background-color:#fff3cf;" onBlur="BankAccountValidation_Interactive_Validate_v1_00Begin('BR81-EG69-RC26-ZE89', document.getElementById('txtAccountNumber').value, document.getElementById('txtSortCode').value)" autocomplete="off"/>
                                  </span></p></td>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td></td>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td></td>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td><font size="1" style="font-family:Arial, Helvetica, sans-serif; color:#000"><strong>&nbsp;&nbsp;To The Manager</strong></font></td>
                            </tr>
                            <tr>
                              <td></td>
                              <td valign="top"><font size="1" style="font-family:Arial, Helvetica, sans-serif; color:#000"><strong>&nbsp;&nbsp;Bank or Building Society:</strong></font> <span class="">&nbsp;
                                <input name="txtBankName" id="txtBankName" style="background-color:#fff3cf;" class="requiredInput" type="text" value="Bank Name" maxlength="" autocomplete="off"/>
                                </span></td>
                              <td align="center"><input name="date" id="date" style="background-color:#fff3cf;" class="requiredInput" type="text" maxlength="10" value=""/></td>
                            </tr>
                            <tr>
                              <td width="7">&nbsp;</td>
                              <!-- this is the indent -->
                              <td></td>
                              <td width="220" align="center"></td>
                            </tr>
                            <tr>
                              <td></td>
                              <td></td>
                              <td></td>
                            </tr>
                          </table></td>
                      </tr>
                      <tr>
                        <td align="left"><table align="center" width="412" border="0">
                            <tr>
                              <th scope="col" align="center"><img border="1" width="412" src="./images/RBA_Guarantee.jpg" onmousemove="Tip('&lt;img src=\'./images/RBA_Guarantee.jpg\' width=\'783px\' height=\'293px\'&gt;')"/><br />
                                <div align="center"><a style="font-size:10px"> Direct Debit Guarantee<br />
                                  (mouse over to zoom...) </a></div></th>
                            </tr>
                          </table></td>
                      </tr>
                      <tr>
                        <td align="center">&nbsp;</td>
                      </tr>
                    </table>
                  </div>
                  <br class="clear" />
                  <!--area5-->
                </div>
                <br class="clear" />
              </div>
              <div class="col-lg-12">
                <div class="col-lg-12" style="padding:0;">
                  <div class="col-lg-12" style="padding:0">
                    <input type="submit"  class="jqControl submit" value="Update Payment Details"  name="imgBtnSubmit" id="imgBtnSubmit"  tabindex="35" alt="Click button to Submit Information" title="Click button to Submit Information" />
                    <br class="clear" />
                    <br class="clear" />
                  </div>
                </div>
              </div>
              <div class="clear"></div>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
  <div id="footer"> <a> This site is provided by </a><a href="http://www.dbfactory.co.uk">Data Base Factory Ltd</a><a> on behalf of </a>Hachette<br />

    <a> This site is protected by Thawte using 256bit encryption for your security.</a> <br />
    <br />
    <!-- this is the Thawte site seal -->
    <table width="10" border="0" cellspacing="0" align="center">
      <tr>
        <td><script src="https://siteseal.thawte.com/cgi/server/thawte_seal_generator.exe"></script></td>
      </tr>
      <tr>
        <td height="0" align="center"><a style="color:#AD0034" target="_new"
   href="http://www.thawte.com/digital-certificates/"> <span style="font-family:arial; font-size:8px; color:#AD0034"> ABOUT SSL CERTIFICATES</span> </a></td>
      </tr>
    </table>
    <!-- this is the end of the Thawte site seal code -->
    <br />
    <table align="center" width="100" border="0">
      <tr>
        <th scope="col"><img src="./images/visaLogo.gif" /></th>
        <th scope="col"><img src="./images/mastercardLogo.gif" /></th>
        <th scope="col"><img src="./images/DeltaLogo.gif" /></th>
        <th scope="col"><img src="./images/electronLogo.gif" /></th>
        <th scope="col">&nbsp;</th>
        <th scope="col">&nbsp;</th>
        <th scope="col">&nbsp;</th>
        <th scope="col">&nbsp;</th>
        <th scope="col">&nbsp;</th>
        <th scope="col">&nbsp;</th>
      </tr>
    </table>
    <br />
    <a> &copy; 2018</a> </div>
</div>
</body>
</html>