bootstrap-v4.0_demo
/
email-alert.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">
    <head>
        <meta name="viewport" content="width=device-width" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Neptune</title>
    </head>
    <body style="margin:0px; background: #e8ebf0;">
        <div width="100%" style="background: #e8ebf0; padding: 0px 0px; font-family:arial; line-height:28px; height:100%;  width: 100%; color: #333;">
            <div style="max-width: 700px; padding: 50px 0; margin: 0px auto; font-size: 14px">
                <div style="padding: 30px; background: #fff;">
                    <table border="0" cellpadding="0" cellspacing="0" style="width: 100%;">
                        <tbody>
                            <tr>
                                <td>
                                    <div style="padding: 15px 30px; background: #f44236; border-radius: 5px; margin-bottom: 20px; color: #fff;">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    </div>
                                    <div style="padding: 15px 30px; background: #43b968; border-radius: 5px; margin-bottom: 20px; color: #fff;">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    </div>
                                    <div style="padding: 15px 30px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 5px; margin-bottom: 20px;">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    </div>
                                    <p>Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus. Aliquam molestie, leo sed molestie condimentum, massa enim lobortis massa, in <a href="#" style="color: #3e70c9; text-decoration: underline;">vulputate diam</a> lorem quis justo. Nullam nec dignissim mi.</p>
                                    <p style="text-align: center;"><a href="#" style="display: inline-block; padding: 10px 30px; font-size: 14px; color: #fff; background: #3e70c9; border-radius: 5px; text-decoration:none;"> Call to action button</a></p>
                                    <p>In non varius nibh. Proin et eros nisi, eu vulputate libero. Suspendisse potenti. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis ultricies augue id risus dapibus blandit.</p>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div style="text-align: center; font-size: 12px; color: #b2b2b5; margin-top: 20px">
                    <p>
                        Neptune
                        <br>
                        <a href="#" style="color: #b2b2b5; text-decoration: underline;">Unsubscribe</a>
                    </p>
                </div>
            </div>
        </div>
    </body>
</html>