outlook html电子邮件表格不一致

时间:2015-08-20 10:08:22

标签: html css email outlook

我有一个Outlook 07/10表格对齐问题,我似乎无法解决......

这就是它的样子:http://postimg.org/image/lrizj0h0t/显然按钮应该排成一行(忽略奇怪的文本对齐 - 这是因为为了匿名而非常快速地拍照!)

我尝试在其周围添加额外的表格,尝试使按钮更窄,尝试将valign添加到其中的各个部分(包括它所在的表格)。我认为这可能是“有趣的”“Outlook真的是Word”渲染问题,它正在添加一个分页符,但似乎没有(因为我找不到解决方案,就像添加额外的表一样)使它成为单独的表,因此没有那么久,已经工作了)

以下是代码(我没有包含html body等标签,但请放心,它们就在那里。

<style type="text/css">
body{-webkit-text-size-adjust:none;}
.ReadMsgBody{width:100%;}
.ExternalClass{width:100%;}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
#outlook a{padding:0;}
.showonmobile {
	display: none!important;
	}
@media only screen and (max-width: 480px) {
	table[class="main"] {
	width: 300px!important;
	}	
	table[class="centermob"] {
	text-align: center!important;
	width: 300px!important;
	}
	td[class="hideonmobile"] {
	display: none!important;
	}
	table[class="hideonmobile"] {
	display: none!important;
	}
	tr[class="hideonmobile"] {
	display: none!important;
	}
    img[class="hideonmobile"] {
	display: none!important;
	}
	table[class="showonmobile"] {
	display: initial!important;
	}
	td[class="showonmobile"] {
	display: initial!important;
	}
	img[class="halfwidth"] {
	width: 300px!important;
	}
	table[class="halfwidth"] {
	width: 300px!important;
	}
    td[class="halfwidth"] {
	width: 300px!important;
	}
	table[class="hidespace"] {
	display: none!important;
	}
	table[class="thirdwidth"] {
	width: 48%!important;
	}
	img[class="onethirdleft"] {
	width: 48%!important;
	}
	img[class="onethirdright"] {
	width: 48%!important;
	}
	table[class="thirdwidthcontact"] {
	display: none!important;
	}
	table[class="thirdwidthwhy"] {
	width: 300px!important;
	}
	td[class="centralise"] {
	text-align: center;
	}
	span[class="showlinebreak"] {
	display: initial!important;
	}
	table[class="hidingonweb"] {
	display: initial!important;
	}
	td[class="nav"] {
	width: 206px!important;
	}
	table[class="twocol"] {
	width: 300px!important;
	}
	img[class="oneninethrees"] {
	width: 140px!important;
	}
        table[class="bottombuttonright"] {
          width: 140px!important;
          float: right!important;
          display: inline-block;
        }
        table[class="bottombuttonleft"] {
          width: 140px!important;
          float: left!important;
          display: inline-block;
        }
	td[class="bottombuttoninner"] {
	width: 82px!important;
        font-size: 13px!important; 
	}
	table[class="bottombuttoninner"] {
	width: 82px!important;
        font-size: 13px!important; 
	}
        td[class="smallerfont"] {
        font-size: 13px!important; 
        }
}
	</style>
	<table cellpadding="0" cellspacing="0" class="twocol" style="width: 620px; background-color: #ffffff; border-collapse: collapse; empty-cells: show;">
	<tbody>
	<tr>
		<td valign="top" align="center">
		<table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="empty-cells: show; border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		<table align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
		<!--[if mso]></td><td><![endif]-->
		<table align="left" class="bottombuttonright" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
		<!--[if mso]></td><td><![endif]-->
		<table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		<table align="left" class="showonmobile" width="20" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
		<!--[if mso]></td></tr><tr><td><![endif]-->
		<table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
		<!--[if mso]></td><td><![endif]-->
		<table align="left" class="bottombuttonright" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
		<!--[if mso]></td><td><![endif]-->
		<table height="55" align="left" valign="top" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:193px; color: #ffffff; width:193px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="193">
		<tbody>
		<tr>
			<td align="left" valign="top" height="40" width="22">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
			</td>
			<td class="bottombuttoninner" align="left" valign="top" height="40" width="135">
			<table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="135">
			<tbody>
			<tr>
				<td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
				<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
				</td>
			</tr>
			</tbody>
			</table>
			</td>
			<td align="left" valign="top" height="40" width="36">
			<p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
			</td>
		</tr>
		<tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
		</tbody>
		</table>
		</td>
	</tr>
	</tbody>
	</table>

任何想法都感激不尽!

1 个答案:

答案 0 :(得分:0)

你需要将tds放在outlook的所有元素周围。有几个点,你在一个td中只有2个表元素。 Outlook的另一个问题是你不能完全隐藏表,所以即使是showonmobile表你也需要在自己的td中。 我注意到你使用<!--[if mso]>为outlook添加你的tds。你应该在所有平台上都有tds,因为这是电子邮件的好习惯。

这是修改后的代码(使用<!--[if mso]>作为tds):

<table cellpadding="0" cellspacing="0" class="twocol" style="width: 620px; background-color: #ffffff; border-collapse: collapse; empty-cells: show;">
    <tbody>
    <tr>
        <td valign="top" align="center">
        <table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="empty-cells: show; border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        <!--[if mso]></td><td><![endif]-->
        <table align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
        <!--[if mso]></td><td><![endif]-->
        <table align="left" class="bottombuttonright" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        <!--[if mso]></td><td><![endif]-->
        <table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
        <!--[if mso]></td><td><![endif]-->
        <table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        <!--[if mso]></td><td><![endif]-->
        <table align="left" class="showonmobile" width="20" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
        <!--[if mso]></td></tr><tr><td><![endif]-->
        <table align="left" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        <!--[if mso]></td><td><![endif]-->
        <table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
        <!--[if mso]></td><td><![endif]-->
        <table align="left" class="bottombuttonright" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:195px; color: #ffffff; width:195px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="195">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="137">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="137">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        <!--[if mso]></td><td><![endif]-->
        <table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td>&nbsp;</td></tr></table>
        <!--[if mso]></td><td><![endif]-->
        <table height="55" align="left" valign="top" class="bottombuttonleft" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; max-width:193px; color: #ffffff; width:193px; mso-table-lspace:0pt; mso-table-rspace:0pt; background-color: #ffffff;" width="193">
        <tbody>
        <tr>
            <td align="left" valign="top" height="40" width="22">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="border: 0; text-decoration: none; color: #ffffff;" target="_blank"><img height="40" src="ctaleftwhite.jpg" style="width: 22px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="22" /> </a></p>
            </td>
            <td class="bottombuttoninner" align="left" valign="top" height="40" width="135">
            <table class="bottombuttoninner" border="0" cellpadding="0" cellspacing="0" height="40" style="border-collapse: collapse; margin: 0; border: 0; padding: 0; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; height: 40px; background-color: #ec6608; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="middle" width="135">
            <tbody>
            <tr>
                <td class="smallerfont" height="40" style="height: 40px; font-family: 'HelveticaNeue-CondensedBold', 'Arial Narrow', Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; color: #ffffff; background-color: #ec6608; mso-line-height-rule: exactly; line-height: 16px;">
                <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" style="text-decoration:none; color:#ffffff;border: 0px;" target="_blank">Text here</a></p>
                </td>
            </tr>
            </tbody>
            </table>
            </td>
            <td align="left" valign="top" height="40" width="36">
            <p style="mso-table-lspace:0;mso-table-rspace:0;margin:0;"><a href="#" target="_blank"><img height="40" src="ctarightwhite.jpg" style="width: 36px; margin: 0; border: 0; padding: 0; text-decoration: none; height: 40px;" width="36" /> </a></p>
            </td>
        </tr>
        <tr><td colspan="3" style="font-size: 15px; background-color: #ffffff;">&nbsp;</td></tr>
        </tbody>
        </table>
        </td>
    </tr>
    </tbody>
    </table>