list-card.html

<div class="c-listCard" style="margin:0px auto;max-width:640px;">
    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
        <tbody>
            <tr>
                <td style="direction:ltr;font-size:0px;padding:0px 15px;padding-bottom:0;padding-top:0;text-align:center;">
                    <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td
               class="col-outlook img-outlook" style="vertical-align:top;width:244px;"
            ><![endif]-->
                    <div class="mj-column-per-40 mj-outlook-group-fix col img" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                            <tbody>
                                <tr>
                                    <td style="vertical-align:top;padding:0;">
                                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
                                            <tbody>
                                                <tr>
                                                    <td align="center" style="font-size:0px;padding:0;word-break:break-word;">
                                                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;" class="mj-full-width-mobile">
                                                            <tbody>
                                                                <tr>
                                                                    <td style="width:244px;" class="mj-full-width-mobile">
                                                                        <a href="#" target="_blank" style="color: #2787e7; text-decoration: underline;"><img height="auto" src="https://s3.us-east-1.amazonaws.com/sf-hagerty-rev/craft/assets/images/info-card-16x9.jpg" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;" width="244"></a>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <!--[if mso | IE]></td><td
               class="col-outlook txt-outlook" style="vertical-align:top;width:366px;"
            ><![endif]-->
                    <div class="mj-column-per-60 mj-outlook-group-fix col txt" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                            <tbody>
                                <tr>
                                    <td style="vertical-align:top;padding:0 0 0 20px;">
                                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
                                            <tbody>
                                                <tr>
                                                    <td align="left" class="f-overline1" style="font-size:0px;padding:0;word-break:break-word;">
                                                        <div style="font-family:GTA, Helvetica, Arial, sans-serif;font-size:16px;line-height:24px;text-align:left;color:#4F4F4F;">Overline</div>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td align="left" class="f-body1" style="font-size:0px;padding:10px 0px;word-break:break-word;">
                                                        <div style="font-family:GTA, Helvetica, Arial, sans-serif;font-size:20px;line-height:24px;text-align:left;color:#000000;">Body 1 lorem ipsum doler sit amet contra requiem</div>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td align="left" class="f-body2 lnk" style="font-size:0px;padding:0;word-break:break-word;">
                                                        <div style="font-family:GTA, Helvetica, Arial, sans-serif;font-size:16px;line-height:24px;text-align:left;text-decoration:underline;color:#000000;"><a style="text-decoration: underline; color: black;" href="#">Call to Action</a></div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <!--[if mso | IE]></td></tr></table><![endif]-->
                </td>
            </tr>
        </tbody>
    </table>
</div>