Email Button module loses styling when made dynamic
We have an email with a number of modules using dynamic content. Everything is working..... except the button module. When we make the module dynamic, the visual button (ie backgrouns and styling) disappears and just the link itself remains. I have the module code below. We originally just tested using the Send Sample and selecting a segment. That email arrives in the inbox with the button styling just fine. However, when sending the email using a smart campaign and Send Email flow step to a person, the email looses all button styling and just the link is there. I did try this with Litmus and it happens across all email clients. Any ideas why this is happening and what we can do about it? Would really like to make the button dynamic.
Thanks,
Sheila
<table class="mktoModule" mktoActive="true" mktoAddByDefault="true" id="Button" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" mktoname="Button">
<tr>
<td bgcolor="${Button-BgColor}" style="background-color:${Button-BgColor}">
<table class="inner_table" style="width:600px; margin: 0 auto; text-align: center; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">
<!--Extra space-->
<tbody>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="${Button-top-space}"> </td>
</tr>
<!--CTA button-->
<tr>
<td valign="top">
<div class="mktoText" mktoName="Button" id="banner-button1">
<table style="margin: 0 auto; border-collapse: collapse;" width="${Button-Width}" align="${Button-Position}" border="0" cellpadding="0" cellspacing="0" style="margin:0 auto;">
<tbody>
<tr>
<td style="background-color: ${Button-Color}; border:1px solid ${Button-Border};border-radius:${Button-Radius};font-family:${TextFontFamily}; font-size: 16px; mso-line-height-rule: exactly; line-height:22px ; text-align: center; vertical-align: middle; color: ${Button-Text-Color}; display: block; padding:9px 40px 8px;" valign="middle">
<a style="text-decoration: none; color: ${Button-Text-Color} !important;outline: none;" href="${Button-Link}">
<span style="color:${Button-Text-Color};">${Button-Text}</span>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="${Button-bottom-space}"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<!--Button Module End-->