Lisa's Responsive Email Template

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> Brastile Inc <style type="text/css"> /*Hotmail and Yahoo specific code*/ /*designed by Lisamaribarnes.com*/ .ReadMsgBody {width: 100%;} .ExternalClass {width: 100%;} .yshortcuts {color: #ffffff;} .yshortcuts a span {color: #ffffff; border-bottom: none !important; background: none !important;} /*Hotmail and Yahoo specific code*/ body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; margin: 0 !important; padding: 0 !important; width: 100% !important; } @media all and (max-width: 520px) { /* Logo for Mobile */ #alterna-header .logo a { width: 250px; height: 47px; @media only screen and (max-width: 599px) { body { width: auto !important;} table[class="table610"] { max-width: 600px !important; width: 100% !important;} img[class="banner"] { max-width: 510px !important; width: 100% !important; height: auto; display: block;} img[class="img1"] { width: 100% !important; height: auto; display: block;} } @media only screen and (max-width: 479px) { body { width: auto !important;} table[class="table610"] { max-width: 600px !important; width: 100% !important;} img[class="img1"] { width: 100% !important; height: auto; display: block;} img[class="banner"] { max-width: 510px !important; width: 100% !important; height: auto; display: block;} img[class="border"] { max-width:284px !important; width: 100% !important; height: auto; display: block;} td[class="logo"] { max-width:116px !important; width:100% !important; height:auto; display:block; margin:0 auto;} td[class="social_logo"] { max-width:140px !important; width:100% !important; height:auto; display:block; margin:20px auto; margin-bottom:inherit !important;} td[class="box1"] { width: 100% !important; height: auto; display: block; margin: 0 auto;} td[class="box2"] { width: 100% !important; height: auto; display: block; margin: 20px auto; margin-bottom: inherit;} td[class="hide"] { width: 0px; display: none;} td[class="hide2"] { height:5px !important; display:block;} } body,td,th { font-family: Courier New, Courier, monospace; } .table610 tr td table tr td table tr td table tr td table tr td table tr td table tr td table tr td p { color: #003; } .black { color: #000; } </style> </head> <body style="margin:0px; font-family: Corbel, 'Courier New', Ebrima, 'Adobe Devanagari', 'Adobe Garamond Pro', Haettenschweiler, Harrington, 'Hobo Std', 'Kunstler Script', 'Maiandra GD'; color: #006; font-size: 18px;" bgcolor="#cccccc"> <table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF"> <tbody> <tr> <td valign="top"> <table width="600" border="0" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center" class="table610"> <tbody> <tr> <td width="20"></td> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td height="23"></td> </tr> <!--==============header area start here===============--> <tr> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="bottom"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="20"></td> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td height="5"></td> </tr> <tr> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr><!--==============logo start here===============--> <td align="center" valign="bottom" class="logo"><a href="http://www.brastile.com" target="_blank"><img src="http://www.brastile.com/wp-content/uploads/2016/06/Brastile-Logo-Approved-450-1.jpg" alt="Logo" width="450" height="100" border="0" align="middle" style="display: block;"></a></td> <!--==============logo end here===============--> <td width="" nowrap="nowrap" class="hide"> <p> </p> <p> </p> </td> <!--==============social logo start here===============--> <td class="social_logo"> </td> <!--==============social logo end here===============--></tr> </tbody> </table> </td> </tr> <tr> <td valign="top" align="center"></td> </tr> <tr> <td height="05"> </td> </tr> </tbody> </table> </td> <td width="20"></td> </tr> </tbody> </table> </td> </tr> <tr> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <!--==============header area end here===============--> <tr> <td height="20"></td> </tr> <!--==============banner area start here===============--> <tr> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="bottom"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="10"></td> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <th nowrap="nowrap" bgcolor="#ffffff" style="font-family: Corbel, 'Courier New', Ebrima, 'Adobe Devanagari', 'Adobe Garamond Pro', Haettenschweiler, Harrington, 'Hobo Std', 'Kunstler Script', 'Maiandra GD'; font-size: 36px; line-height: 26px; color: #000000; font-weight: bold; padding: 5px 5px 6px 10px;"> <div align="center"><strong>New Product Update</strong></div> </th> </tr> <tr> <td height="5"></td> </tr> <tr> <td> <table border="0" cellspacing="0" cellpadding="0" width="750"> <tbody> <tr> <td width="100%" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td> </td> </tr> <tr> <td> <p align="center">Tile & Marble by Brastile is pleased to announce our <span class="black">“New”</span> offering Chronos Marble.</p> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td width="100%" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td width="50%" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td valign="top"></td> </tr> </tbody> </table> </td> <td width="50%" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td valign="top"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td width="100%" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="100%"> <tbody> <tr> <td align="center"> <p>Chronos is a very cosmopolitan, inviting natural stone in the cool tones. </p> <p>The linear veining allows the Chronos to follow today’s most popular contemporary design trend. </p> <p>It's light Grey coloration is enhanced with subtle accents of beige. </p> <p>The Chronos is available in 24”x 48”x5/8” (61x122x1.2cm). </p> <p>Please contact your Brastile salesperson or our customer service department to arrange for actual samples of this “New” and exciting natural stone product “Chronos.”</p> <p align="center"> </p> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <p><img src="http://img.pulse-stat.com/28edd3380a1c17cf65b137fe96516659/files/emailservice/userfiles/2e3bea7461853baf8248ea71a28b1967642516/Chromus_new.jpg" width="700" height="460" border="3" caption="false"></p> <p><strong> </strong></p> </td> </tr> <tr> <td height="0"></td> </tr> </tbody> </table> </td> <td width=""></td> </tr> </tbody> </table> </td> <td valign="top"> </td> </tr> </tbody> </table> </td> </tr> <tr> <td height="0"></td> </tr> <!--==============banner area end here===============--> <!--==============content area start here===============--> <tr><!--==============box area1 start here===============--> <td> </td> <!--==============box area1 end here===============--></tr> <tr> <td height="0"></td> </tr> <tr><!--==============box area2 start here===============--> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="bottom"> </td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> <table width="97%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="20"></td> <td width="662" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td height="10"></td> </tr> <tr> <td align="center" style="font-family: Corbel, 'Courier New', Ebrima, 'Adobe Devanagari', 'Adobe Garamond Pro', Haettenschweiler, Harrington, 'Hobo Std', 'Kunstler Script', 'Maiandra GD'; font-size: 24px; line-height: 24px; color: #2b3e50;">LARGE SELECTIONS IN STOCK</td> </tr> <tr> <td height="15"></td> </tr> <tr> <td align="center"> </td> </tr> <tr> <td height="15"></td> </tr> <tr> <td align="center" style="font-family: Arial, Helvetica, sans-serif, Trebuchet MS; font-size: 14px; line-height: 22px; color: #2b3e50;"> <p>We Have one of the Largest and highest quality consistency of Tile and Marble inventory in the United States. Our warehouse is based in Miami and all in stock products are ready for immediate delivery.</p> <h1><strong>Call <img src="http://img.pulse-stat.com/28edd3380a1c17cf65b137fe96516659/files/emailservice/userfiles/2e3bea7461853baf8248ea71a28b1967642516/blue_phone.jpg" alt="" width="50" height="41"><a href="njs...void(0)" data-number="+18008811031" data-pstn-out-call-url="" title="Call via Hangouts" jsaction="r.oVdbr2mIpA8" data-rtid="iBBg8y9seW2w" jsl="$t t-6xg4lalHw8M$t-CuUqPxWI7dk;$x 0;" data-ved="0ahUKEwid4oiYqZnOAhXCdh4KHegmCS8QkAgIHjAA">(800) 881-1031</a></strong></h1> </td> </tr> <tr> <td height="12"></td> </tr> </tbody> </table> </td> <td width="1"></td> </tr> </tbody> </table> </td> </tr> <tr> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> <!--==============box area2 end here===============--></tr> <tr> <td height="20"></td> </tr> <tr><!--==============box area3 start here===============--> <td> <table width="755" border="0" cellspacing="0" cellpadding="0" height="40"> <tbody> <tr> <td width="270" valign="top" class="box1"> <table width="252" border="0" cellspacing="0" cellpadding="0" height="32"> <tbody> <tr> <td valign="bottom"></td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> </td> </tr> <tr> <td valign="top"></td> </tr> </tbody> </table> </td> <td width="20" class="hide"></td> <td width="270" valign="top" class="box2"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="bottom"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="20"></td> <td></td> <td width="20"></td> </tr> </tbody> </table> </td> </tr> <tr> <td valign="top"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> <!--==============box area3 end here===============--></tr> <tr> <td height="20"></td> </tr> <!--==============content area end here===============--> <!--==============footer area start here===============--> <tr> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="bottom"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> <tr> <td bgcolor="#ffffff" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td width="20"></td> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td height="15"></td> </tr> <tr><!--==============logo start here===============--> <td align="center" nowrap="nowrap"><a href="http://www.brastile.com" target="_blank"><img style="display: block;" src="http://www.brastile.com/wp-content/uploads/2016/08/button-4.png" width="184" height="43" alt="Logo" border="0"></a></td> <!--==============logo end here===============--></tr> <tr> <td height="12" align="center" nowrap="nowrap"> <p> </p> <p><a href="http://www.twitter.com/brastilemiami"><img src="http://www.brastile.com/wp-content/uploads/2016/07/twitter_icon-85.png" width="52" height="52"></a><a href="https://www.linkedin.com/company/tile-and-marble-by-brastile"><img src="http://www.brastile.com/wp-content/uploads/2016/07/linkedin-linkedin-icon-flat-icon-linkedin-png-social-icon-82.png" width="52" height="52"></a><a href="../DESKTOP3/www.pinterest.com/brastile"><img src="http://www.brastile.com/wp-content/uploads/2016/07/Transparent-Pinterest-Logo-Icon-82.png" width="52" height="52"></a><a href="http://www.facebook.com/brastile"><img src="http://www.brastile.com/wp-content/uploads/2016/07/social_facebook_box_blue-82.png" width="52" height="52"></a></p> </td> </tr> <tr><!--==============footer menu start here===============--> <td align="center" style="font-family: Arial, Helvetica, sans-serif, Trebuchet MS; font-size: 12px; line-height: 22px; color: #2b3e50;"> </td> <!--==============footer menu end here===============--></tr> <tr> <td height="8"></td> </tr> <tr> <td align="center" nowrap="nowrap" style="font-family: Arial, Helvetica, sans-serif, Trebuchet MS; font-size: 12px; line-height: 20px; color: #2b3e50;">Copyright © 2016 - Brastile inc., All rights reserved.</td> </tr> <tr> <td height="15"></td> </tr> </tbody> </table> </td> <td width="20"></td> </tr> </tbody> </table> </td> </tr> <tr> <td valign="top"> <table width="755" border="0" cellspacing="0" cellpadding="0" height="14"> <tbody> <tr> <td width="5"></td> <td bgcolor="#ffffff"></td> <td width="5"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td height="20"></td> </tr> <!--==============footer area end here===============--></tbody> </table> </td> <td width="20"></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </body> </html>
Perfect customizable email template designed for all responsive devices

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.