Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

HTML

            
              <!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" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
	<!--[if gte mso 9]><xml>
      <o:OfficeDocumentSettings>
        <o:AllowPNG/>
        <o:PixelsPerInch>96</o:PixelsPerInch>
      </o:OfficeDocumentSettings>
    </xml><![endif]-->
	<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
	<meta content="width=device-width, initial-scale=1" name="viewport" />
    <!--[if !mso]><!-- --><meta content="IE=edge" http-equiv="X-UA-Compatible" /><!--<![endif]-->
	<meta content="telephone=no" name="format-detection" />
    
	<title></title>
    
	<style type="text/css">html, body { background-color:#2a2929; }
		.ReadMsgBody { width:100%; }
		.ExternalClass { width:100%; }
		* { -webkit-text-size-adjust:none; }
		a:link, a:visited { color:#193152; }
		.whiteLinks a:link,	.whiteLinks a:visited { color:#ffffff!important;}
		table {border-collapse:collapse;}
		a[href^=tel]{ color:inherit; text-decoration:none; }
		.preheader{ font-size:1px; line-height:1px; display:none !important; mso-hide:all; }
	</style>
</head>
<body bgcolor="#2a2929" style="margin:0; padding:0; min-width:100%;" yahoo="fix">

<center bgcolor="#2a2929" style="width:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;">
  <div style="max-width:600px; font-size:0;">
		<div class="preheader" style="display:none; width:0; height:0; max-height:0; line-height:0; opacity:0; overflow:hidden; font-size:0;">Gmail responsive - ASB test</div>
        <!--[if gte mso 9]>
        <table cellspacing="0" cellpadding="0" border="0" width="600" align="center">
            <tr>
                <td>
        <![endif]-->
        <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif;color:#333333;Margin:0 auto;width:100%;max-width:600px;">
            <tbody>
            	<tr>
                    <td background="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-logo-strokes.jpg" bgcolor="#001e29" width="600" valign="top">
                    <!--[if gte mso 9]>
                    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;">
                    <v:fill type="frame" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-logo-strokes.jpg" color="#001e29" />
                    <v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
                    <![endif]-->
                    <div>
                    	<!--[if gte mso 9]>
                            <table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
                                <tr>
                                    <td valign="top">
                        <![endif]-->
                    	<table border="0" cellpadding="0" cellspacing="0" width="100%">
                            <tr>
                                <td align="center">
                                    <!--[if gte mso 9]>
                                        <table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
                                            <tr>
                                                <td valign="top">
                                    <![endif]-->
                                    <table border="0" cellpadding="0" cellspacing="0" class="deviceWidth" style="width:100%;">
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                                        <tr>
                                                            <td style="text-align:left;font-size:0;">
                                                                <!--[if gte mso 9]>
                                                                <table cellspacing="0" cellpadding="0" border="0" style="width:600px;">
                                                                    <tr>
                                                                        <td style="width:280px;" valign="top">
                                                                <![endif]-->
                                                                <div style="width:100%;max-width:280px;display:inline-block;vertical-align:top;">
                                                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="padding-bottom:1px;"><a href="https://asb.co.nz" target="_blank"><img alt="ASB" border="0" height="56" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/header-new_04.png" style="display:block;" width="140" /></a></td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </div>
                                                                <!--[if gte mso 9]>
                                                                        </td>
                                                                        <td style="width:315px;" valign="top">
                                                                <![endif]-->
                                                                <div style="width:100%;max-width:315px;display:inline-block;text-align:center;vertical-align:top;">
                                                                    <table border="0" cellpadding="0" cellspacing="0" class="deviceWidth" style="text-align:center;width:100%;">
                                                                        <tr>
                                                                            <td style="text-align:left;" dir="rtl">
                                                                                <!--[if gte mso 9]>
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="width:315px;" dir="rtl">
                                                                                        <tr>
                                                                                            <td valign="top" style="width:182px;">
                                                                                <![endif]-->
                                                                                <div style="width:100%;max-width:182px;display:inline-block;text-align:center;vertical-align:top;">
                                                                                <table align="right" border="0" cellpadding="0" cellspacing="0" class="contactDetails email socialicons" style="width:100%;" dir="ltr">
                                                                                    <tbody>
                                                                                        <tr>
                                                                                            <td class="contactDetailsPadding" align="center" style="padding-top:18px;">
                                                                                                <table border="0" cellpadding="0" cellspacing="0" class="deviceWidth" style="width:100%;">
                                                                                                    <tr>
                                                                                                        <td class="mobilemargin" style="width:30px;"><img alt="" class="mobilemargin" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" style="display:block;" width="30" /></td>
                                                                                                        <td class="socIcon" style="width:23px;"><a href="https://www.facebook.com/ASBBank" target="_blank"><img alt="Facebook" height="23" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-soc-facebook.jpg" style="display:block; border:0;" width="23" /></a></td>
                                                                                                        <td style="width:10px;"><img alt="" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" width="10" /></td>
                                                                                                        <td class="socIcon" style="width:23px;"><a href="https://twitter.com/asbbank" target="_blank"><img alt="Twitter" height="23" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-soc-twitter.jpg" style="display:block; border:0;" width="23" /></a></td>
                                                                                                        <td width="10"><img alt="" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" width="10" /></td>
                                                                                                        <td class="socIcon" style="width:23px;"><a href="https://www.youtube.com/user/ASBBank" target="_blank"><img alt="Youtube" height="23" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-soc-youtube.jpg" style="display:block; border:0;" width="23" /></a></td>
                                                                                                        <td width="10"><img alt="" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" width="10" /></td>
                                                                                                        <td class="socIcon" style="width:23px;"><a href="https://www.linkedin.com/company/asb-bank" target="_blank"><img alt="Linkedin" height="23" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/asb-soc-linkedin.jpg" style="display:block; border:0;" width="23" /></a></td>
                                                                                                        <td class="mobilemargin" style="width:30px;"><img alt="" class="mobilemargin" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" style="display:block;" width="30" /></td>
                                                                                                    </tr>
                                                                                                </table>
                                                                                            </td>
                                                                                        </tr>         
                                                                                    </tbody>
                                                                                </table>
                                                                                </div>
                                                                                <!--[if gte mso 9]>
                                                                                        </td>
                                                                                        <td style="width:130px;" valign="top">
                                                                                <![endif]-->
                                                                                <div style="width:100%;max-width:130px;display:inline-block;text-align:center;vertical-align:top;">
                                                                                <table align="left" border="0" cellpadding="0" cellspacing="0" style="width:100%;" dir="ltr">
                                                                                    <tbody>
                                                                                        <tr>
                                                                                            <td style="text-align:right;padding:16px 0 10px 0;">
                                                                                                <table border="0" cellpadding="0" cellspacing="0" class="phone" style="display:inline-block;width:100%;">
                                                                                                    <tbody>
                                                                                                        <tr>
                                                                                                            <td class="mobilemargin" style="width:30px;"><img alt="" class="mobilemargin" height="10" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/spacer.gif" style="display:block;" width="30" /></td>
                                                                                                            <td style="width:26px;"><img alt="mail icon" height="26" src="https://reports.asb.co.nz/objects/message/84/92/47/479284/images/icon-mail.png" style="display:block" width="25" /></td>
                                                                                                            <td class="text"><a href="https://www.asb.co.nz/customerService.aspx" style="font-family:Trebuchet MS, Arial, Helvetica, sans-serif; text-decoration:none; color:#ffffff; font-size:13px; line-height:26px; mso-line-height-rule:exactly" target="_blank">Email ASB</a></td>
                                                                                                        </tr>
                                                                                                    </tbody>
                                                                                                </table>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </tbody>
                                                                                </table>
                                                                                </div>
                                                                                <!--[if gte mso 9]>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </table>
                                                                                <![endif]-->
                                                                            </td>
                                                                        </tr>
                                                                    </table>
                                                                </div>
                                                                <!--[if gte mso 9]>
                                                                        </td>
                                                                    </tr>
                                                                </table>
                                                                <![endif]-->
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <!--[if gte mso 9]>
                                                </td>
                                            </tr>
                                        </table>
                                    <![endif]-->
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <img src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/banner.png" alt="Update your details to be in to win an iPhone 6." style="border:none;width:100%;max-width:600px;display:block;" />
                                </td>
                            </tr>
                        </table>
<!--[if gte mso 9]>
<table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
<tr>
<td valign="top">
<![endif]-->
                        <table bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="100%">
							<tbody>
                            	<tr>
                                	<td align="center" style="text-align:center; padding:30px 0; font-size:0;">
                                    	 <!--[if gte mso 9]>
                                            <table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
                                                <tr>
                                                    <td valign="top">
                                        <![endif]-->
                                    	<div style="display:inline-block; width:100%; max-width:600px;">
                                            <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:17px; color:#565656; text-align:left; width:100%;">
                                                <tr>
                                                    <td style="padding:0 30px;">
                                                        <p style="color:#000000; font-size:16px; line-height:21px; font-weight:bold; Margin:0 0 10px 0; padding:0;"><tp:salutation salutation="Hi " firstNameField="member.salutation" defaultValue="Hi"  mask="sf|d">#Name</tp:salutation>,</p>
                                                        
                                                        <p style="Margin:0 0 25px 0; padding:0;">It's awesome that you've turned 18! You're probably excited to reach this important milestone and are busy thinking about what you'll do next. Maybe you're heading off to do more study at uni, starting an apprenticeship, or heading into a fulltime job?</p>
                                                        
                                                        <p style="font-size:14px; color:#000000; line-height:19px; font-weight:bold; Margin:0 0 10px 0; padding:0;">Whatever you decide, we want to help.</p>
                                                        
                                                        <p style="Margin:0 0 25px 0; padding:0;">We'll be in touch again later in the year about your banking, but in the meantime we need to confirm we have all the right contact info. Update your contact details (particularly your mobile phone number and email address) before <#XX DATE#>, and in return you'll go in the draw to win one brand new Apple iPhone 6 worth $1,079.</p>
                                                        
                                                        <p style="font-size:14px; color:#000000; line-height:19px; font-weight:bold; Margin:0 0 10px 0; padding:0;">Updating is easy.</p>
                                                        
                                                        <p style="Margin:0; padding:0;">You can check and update your details by logging into ASB FastNet Classic or by calling us on <strong>0800 803 804</strong>. We can set you up on FastNet Classic over the phone. You can also come into any ASB branch.</p>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td bgcolor="#ffffff" align="center" valign="top" width="100%">
                                                        <!--[if gte mso 9]>
                                                        <table border="0" cellspacing="0" cellpadding="0" align="center" width="600">
                                                        <tr>
                                                        <td align="center" valign="top" width="600">
                                                        <![endif]-->
                                                        <table border="0" cellpadding="0" cellspacing="0" align="center" width="100%" style="max-width:600px;">
                                                            <tr>
                                                                <td bgcolor="#ffffff" align="center" valign="top" style="padding:30px 0;">
                                                                    <!--[if gte mso 9]>
                                                                    <table border="0" cellspacing="0" cellpadding="0" style="width:600px;">
                                                                    <tr>
                                                                    <td align="center" valign="top">
                                                                    <![endif]-->
                                                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                                                        <tr>
                                                                            <td align="center" style="padding:0 30px;">
                                                                                <table border="0" cellpadding="0" cellspacing="0" style="width:100%;">
                                                                                    <tr>
                                                                                        <td bgcolor="#f4f4f4" style="text-align:center; padding:24px 0; font-size:0;">
                                                                                            <!--[if gte mso 9]>
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="width:492px;">
                                                                                        <tr>
                                                                                            <td valign="top">
                                                                                <![endif]-->
                                                                                <div style="display:inline-block; width:100%; max-width:492px;">
                                                                                    <!--[if gte mso 9]>
                                                                                        <table border="0" cellpadding="0" cellspacing="0" style="width:492px;">
                                                                                            <tr>
                                                                                                <td valign="top" style="width:146px;">
                                                                                    <![endif]-->
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="display:inline-block; width:100%; max-width:146px; vertical-align:top;">
                                                                                        <tr>
                                                                                            <td align="center">
                                                                                                <img alt="Snapchat - asbbank" border="0" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/snapchat.jpg" style="display:block; width:100%; max-width:146px;" />
                                                                                            </td>
                                                                                        </tr>
                                                                                    </table>
                                                                                    <!--[if gte mso 9]>
                                                                                                </td>
                                                                                                <td valign="top" style="width:326px;">
                                                                                    <![endif]-->
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:18px; color:#565656; text-align:left; display:inline-block; width:100%; max-width:344px; vertical-align:top;">
                                                                                        <tr>
                                                                                            <td style="padding:40px 0 0 20px;">
                                                                                                <p style="font-size:14px; color:#000000; line-height:19px; font-weight:bold; margin:0 0 10px 0; padding:0;">Add us on Snapchat</p>
                                                                                                For more great competitions and freebies, just search <strong>asbbank</strong> or use this Ghost Code.
                                                                                            </td>
                                                                                        </tr>
                                                                                    </table>
                                                                                    <!--[if gte mso 9]>
                                                                                                </td>
                                                                                            </tr>
                                                                                        </table>
                                                                                    <![endif]-->
                                                                                </div>
                                                                                <!--[if gte mso 9]>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </table>
                                                                                <![endif]-->
                                                                                        </td>
                                                                                    </tr>
                                                                                </table>
                                                                            </td>
                                                                        </tr>
                                                                    </table>
                                                                    <!--[if gte mso 9]>
                                                                    </td>
                                                                    </tr>
                                                                    </table>
                                                                    <![endif]-->
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <!--[if gte mso 9]>
                                                        </td>
                                                        </tr>
                                                        </table>
                                                        <![endif]-->
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="padding:0 30px 35px 30px;">
                                                        Kind regards,<br />
                                                        <img alt="Damien Leng" border="0" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/damien-leng-signature.jpg" style="display:block; width:100%; max-width:137px;" /><br />
                                                        <span style="color:#000000; font-weight:bold;">Damien Leng</span><br />
                                                        <span style="font-size:10px; line-height:15px; font-weight:bold; color:#000000">Head of Customer Segments</span><br />
                                                        <br />
                                                        <a href="#" style="text-decoration:underline; color:#336699" target="_blank">See competition terms and conditions</a>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="padding:0 30px 35px 30px;">
                                                        <a href="https://blog.asb.co.nz/category/money-tip-videos.html" target="_blank"><img alt="Watch ASB money tips" border="0" src="https://reports.asb.co.nz/objects/message/86/61/47/476186/images/asb-footer-youtube.jpg" 
                                                        style="display:block; width:100%; max-width:540px;" /></a>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                        <!--[if gte mso 9]>
                                                    </td>
                                                </tr>
                                            </table>
                                        <![endif]-->
                                    </td>
								</tr>
							</tbody>
						</table>
<!--[if gte mso 9]>
</td>
</tr>
</table>
<![endif]-->
                        
                        <table bgcolor="#000000" border="0" cellpadding="0" cellspacing="0" width="100%">
							<tbody>
                            	<tr>
                                	<td style="text-align:center; font-size:0;">
                                        <!--[if gte mso 9]>
                                            <table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
                                                <tr>
                                                    <td valign="top">
                                        <![endif]-->
                                    	<div style="display:inline-block; width:100%; max-width:600px;">
                                        	<table border="0" cellpadding="0" cellspacing="0" class="deviceWidth" style="width:100%;">
                                                <tr>
                                                	<td style="width:30px;">&nbsp;</td>
                                                    <td style="text-align:left; padding:15px 0;">
                                                        <!--[if gte mso 9]>
                                                        <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                                                            <tr>
                                                                <td valign="top" style="width:145px;">
                                                        <![endif]-->
                                                        <table cellspacing="0" cellpadding="0" border="0" style="width:100%;max-width:145px;display:inline-block;vertical-align:top;">
                                                            <tr>
                                                                <td>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:10px; line-height:15px; color:#878787; text-align:left; width:100%;">
                                                                        <tr>
                                                                            <td style="width:16px;" valign="top"><img alt="" height="13" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/footer-arrow.png" style="display:block;" width="16" /></td>
                                                                            <td style="padding:0 8px 15px 0;"><a href="#" style="font-size:13px; color:#ffffff; font-family:'Calibri', 'Gill Sans', 'Trebuchet MS', sans-serif; text-decoration:none;">Stop receiving emails</a><br />
                                                                            Unsubscribe from ASB emails.</td>
                                                                        </tr>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <!--[if gte mso 9]>
                                                                </td>
                                                                <td valign="top" style="width:125px;">
                                                        <![endif]-->
                                                        <table cellspacing="0" cellpadding="0" border="0" style="width:100%;max-width:125px;display:inline-block;vertical-align:top;">
                                                            <tr>
                                                                <td>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:10px; line-height:15px; color:#878787; text-align:left; width:100%;">
                                                                        <tr>
                                                                            <td style="width:16px;" valign="top"><img alt="" height="13" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/footer-arrow.png" style="display:block;" width="16" /></td>
                                                                            <td style="padding:0 8px 15px 0;"><a href="https://www.asb.co.nz/Personal/Banking-with-ASB/Security" style=" font-size:13px; color:#ffffff; font-family:'Calibri', 'Gill Sans', 'Trebuchet MS', sans-serif; text-decoration:none;" target="_blank">Security</a><br />
                                                                            Read more about the safe &amp; secure service ASB provides to its customers.</td>
                                                                        </tr>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <!--[if gte mso 9]>
                                                                </td>
                                                                <td valign="top" style="width:145px;">
                                                        <![endif]-->
                                                        <table cellspacing="0" cellpadding="0" border="0" style="width:100%;max-width:145px;display:inline-block;vertical-align:top;">
                                                            <tr>
                                                                <td>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:10px; line-height:15px; color:#878787; text-align:left; width:100%;">
                                                                        <tr>
                                                                            <td style="width:16px;" valign="top"><img alt="" height="13" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/footer-arrow.png" style="display:block;" width="16" /></td>
                                                                            <td style="padding:0 8px 15px 0;"><a href="https://www.asb.co.nz/Personal/Banking-with-ASB/Security" style=" font-size:13px; color:#ffffff; font-family:'Calibri', 'Gill Sans', 'Trebuchet MS', sans-serif; text-decoration:none;" target="_blank">Security</a><br />
                                                                            Read more about the safe &amp; secure service ASB provides to its customers.</td>
                                                                        </tr>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <!--[if gte mso 9]>
                                                                </td>
                                                                <td valign="top" style="width:125px;">
                                                        <![endif]-->
                                                        <table cellspacing="0" cellpadding="0" border="0" style="width:100%;max-width:125px;display:inline-block;vertical-align:top;">
                                                            <tr>
                                                                <td>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif; font-size:10px; line-height:15px; color:#878787; text-align:left; width:100%;">
                                                                        <tr>
                                                                            <td style="line-height:13px; width:16px;" valign="top"><img alt="" height="13" src="http://touchpointgroup.com/objects/message/54/15/48/481554/images/footer-arrow.png" style="display:block;" width="16" /></td>
                                                                            <td style="padding:0 0 15px 0;"><a href="https://www.asb.co.nz/story260.aspx" style=" font-size:13px; color:#ffffff; font-family:'Calibri', 'Gill Sans', 'Trebuchet MS', sans-serif; text-decoration:none;" target="_blank">Terms &amp; Conditions</a><br />
                                                                            The terms &amp; conditions of our products and services.</td>
                                                                        </tr>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <!--[if gte mso 9]>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                        <![endif]-->
                                                    </td>
                                                	<td style="width:30px;">&nbsp;</td>
                                                </tr>
                                            </table>
                                        </div>
                                        <!--[if gte mso 9]>
                                                    </td>
                                                </tr>
                                            </table>
                                        <![endif]-->
                                    </td>
                                </tr>
							</tbody>
						</table>
                        
                        <table bgcolor="#000000" border="0" cellpadding="0" cellspacing="0" width="100%">
							<tbody>
								<tr>
									<td align="center" style="border-top:1px solid #444444; color:#565656; font-family:Arial, Helvetica, sans-serif; font-size:10px; padding-top:10px; padding-bottom:10px;">&copy; ASB Bank Ltd. 2015</td>
								</tr>
							</tbody>
						</table>
                        <!--[if gte mso 9]>
                                    </td>
                                </tr>
                            </table>
                        <![endif]-->
                    </div>
                    <!--[if gte mso 9]>
                    </v:textbox>
                    </v:rect>
                    <![endif]-->
                    </td>
                </tr>
            </tbody>
        </table>
        <!--[if gte mso 9]>
                </td>
            </tr>
        </table>
        <![endif]-->
    </div>
</center>
            
</body>
</html>

            
          
!

CSS

            
              
            
          
!

JS

            
              
            
          
!
999px

Console