我有一个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;"> </td></tr>
</tbody>
</table>
<table align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<table align="left" class="showonmobile" width="20" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
任何想法都感激不尽!
答案 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;"> </td></tr>
</tbody>
</table>
<!--[if mso]></td><td><![endif]-->
<table align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<!--[if mso]></td><td><![endif]-->
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<!--[if mso]></td><td><![endif]-->
<table align="left" class="showonmobile" width="20" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<!--[if mso]></td><td><![endif]-->
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
<!--[if mso]></td><td><![endif]-->
<table class="hideonmobile" align="left" width="17" style="font-size: 15px;"><tr><td> </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;"> </td></tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>