Template | Preview | Get the HTML Code |
---|---|---|
Template | Blue background, with picture, responsive |
<!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> <title>Sendy | Email Template</title> <!-- Charset --> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <!-- Responsive Meta --> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"/> <style> .ExternalClass {width:100%;} .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} body {-webkit-text-size-adjust:none; -ms-text-size-adjust:none;} body {margin:0; padding:0;} table {border-collapse: collapse;} table td {border-collapse:collapse;} a {color: #c2e0fc; text-decoration: none; } /*-- Responsive --*/ .noDesktop{width: 0px; height: 0px; display: none;} @media only screen and (max-width: 640px){ /*-------- container --------*/ body[yahoo] .containerBox{width: 420px !important;} body[yahoo] .column{width: 380px !important; margin-bottom: 20px !important;} body[yahoo] .noDesktop{width: 10px !important; height: 20px !important; display: block !important;} body[yahoo] .noMobile{width: 0px !important; display: none !important;} body[yahoo] .onMobileWidth25{width: 25px !important;} body[yahoo] img{width: 100% !important;} } @media only screen and (max-width: 479px){ /*-------- container --------*/ body[yahoo] .containerBox{width: 300px !important;} body[yahoo] .column{width: 260px !important; margin-bottom: 20px !important;} body[yahoo] .noDesktop{width: 10px !important; height: 20px !important; display: block !important;} body[yahoo] .noMobile{width: 10px !important; display: none !important;} body[yahoo] .onMobileWidth25{width: 25px !important;} body[yahoo] img{width: 100% !important;} } </style> </head> <body bgcolor="f0f0f0" style="background-color: #f0f0f0; width: 100%; margin: 0px; padding: 0px;" yahoo="fix"> <table class="mainTable" bgcolor="f0f0f0" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center"> <!-- ========= PREHEADER ========= --> <table class="containerWide" bgcolor="016cb8" border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="background-color: #016cb8; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="10" width="600"> </td></tr> <tr> <td align="right" width="600" style="color: #ffffff; font-family: Helvetica,Arial,sans-serif; font-size: 13px; line-height: 13px; width: 600px;"> <a href="" target="_blank" style="color: #c2e0fc; text-decoration: none;">View in Browser</a> </td> </tr> <!-- Space --> <tr><td height="10" width="600"> </td></tr> </table> </td> </tr> </table> <!-- ========= END PREHEADER ========= --> <!-- ========= HEADER ========= --> <!-- Wide --> <table class="containerWide" bgcolor="016cb8" border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="background-color: #016cb8; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" background="http://themes.lioncodestudio.com/themes/sendy/dev/img/bg.jpg" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="0079dd" style="background-image: url(http://themes.lioncodestudio.com/themes/sendy/dev/img/bg.jpg); background-color: #0079dd; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="25"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="40"></td></tr> <!-- Headline --> <tr> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="left" style="color: #c2e0fc; font-family: Helvetica,Arial,sans-serif; font-size: 30px; line-height: 30px;" > <span style="color: #ffffff; font-size: 48px; line-height: 48px; font-weight: bold;">Sendy</span> is finally here. </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="20"></td></tr> <!-- Text --> <tr > <td> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="340" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="left" style="color: #c2e0fc; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit.<br />Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="20"></td></tr> <!-- Call To Action --> <tr > <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Button --> <tr> <td align="left" style="padding-bottom: 10px;" > <table border="0" align="left" cellpadding="0" cellspacing="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="left" style="background-color: #0079dd; border-radius: 20px; padding-left: 25px; padding-right: 25px; padding-top: 8px; padding-bottom: 5px; text-align: center;"> <a href="#" style="color: #ffffff; text-decoration: none; border-radius: 20px; font-family: Helvetica,Arial,sans-serif; font-size: 20px; font-weight: 600; line-height: 24px;text-align: left;">GET IT HERE!</a> </td> </tr> </table> </td> </tr> <!-- Subtext --> <tr> <td align="left" style="color: #c2e0fc; font-family: Helvetica,Arial,sans-serif; font-size: 12px; line-height: 12px; font-weight: 300;" > EXCLUSIVE ON THEMEFOREST </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="25"></td> </tr> </table> </td> </tr> </table> <!-- ========= END HEADER ========= --> <!-- ========= FEATURES ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="dddddd" cellpadding="0" cellspacing="0" width="100%" style="background-color: #dddddd; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="f0f0f0" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <!-- 3 Columns --> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Column 1 --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > RESPONSIVE </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="370" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td> <!-- Column 2 --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> <!-- Column 3 --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > SUPPORTED </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END FEATURES ========= --> <!-- ========= 1/3 IMAGE LEFT 2/3 CONTENT RIGHT ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="f0f0f0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="ffffff" style="background-color: #ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Image --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="200" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="center"> <img height="" src="http://placehold.it/200x150" alt="Image" width="200px" border="0" style="width: 200px; display: block; border-style: none;" /> </td> </tr> </table> <!-- Content --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="345" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Title --> <tr> <td width="10" class="noMobile"> </td> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> </tr> <!-- Space --> <tr><td height="10" class="noMobile"> </td><td> </td></tr> <!-- Text --> <tr> <td width="10" class="noMobile"> </td> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> </tr> <!-- Space --> <tr><td height="10" class="noMobile"> </td><td> </td></tr> <!-- Link --> <tr> <td width="10" class="noMobile"> </td> <td align="left"> <a href="#" target="_blank" style="color: #333333; text-decoration: none;" >Read More</a> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> <!-- Border --> <tr><td height="0" bgcolor="f0f0f0" style="line-height: 0px;"></td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END 1/3 IMAGE LEFT 2/3 CONTENT RIGHT ========= --> <!-- ========= 1/3 IMAGE RIGHT 2/3 CONTENT LEFT ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="f0f0f0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="ffffff" style="background-color: #ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td><td class="noMobile"> </td><td class="noMobile"> </td></tr> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Image --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="200" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="center"> <img height="" src="http://placehold.it/200x150" alt="Image" width="200px" border="0" style="width: 200px; display: block; border-style: none;" /> </td> </tr> </table> <!-- Content --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="345" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Title --> <tr> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> <td width="10" class="noMobile"> </td> </tr> <!-- Space --> <tr><td height="10"> </td><td class="noMobile"> </td></tr> <!-- Text --> <tr> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> <td width="10" class="noMobile"> </td> </tr> <!-- Space --> <tr><td height="10"> </td><td class="noMobile"> </td></tr> <!-- Link --> <tr> <td align="left"> <a href="#" target="_blank" style="color: #333333; text-decoration: none;" >Read More</a> </td> <td width="10" class="noMobile"> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END 1/3 IMAGE RIGHT 2/3 CONTENT LEFT ========= --> <!-- ========= FULL FEATURE ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="dddddd" cellpadding="0" cellspacing="0" width="100%" style="background-color: #dddddd; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="f0f0f0" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Content --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Title --> <tr> <td align="left" style="font-weight: 600;" > FULLY LAYERED PSD </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="left" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Button --> <tr> <td align="left" style="padding-top: 10px; padding-bottom: 10px;" > <table border="0" align="left" cellpadding="0" cellspacing="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="left" style="background-color: #016cb8; border-radius: 20px; padding-left: 20px; padding-right: 20px; padding-top: 5px; padding-bottom: 5px; text-align: center;"> <a href="#" style="color: #ffffff; text-decoration: none; background-color: #016cb8; border-radius: 20px; font-family: Helvetica,Arial,sans-serif; font-size: 14px; font-weight: 600; line-height: 20px;text-align: center;">GET IT HERE!</a> </td> </tr> </table> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END FULL FEATURE ========= --> <!-- ========= 1/2 IMAGE LEFT 1/2 CONTENT RIGHT ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="f0f0f0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="ffffff" style="background-color: #ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Image --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="275" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="center"> <img height="" src="http://placehold.it/275x175" alt="Image" width="275px" border="0" style="width: 275px; display: block; border-style: none;" /> </td> </tr> </table> <!-- Content --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="270" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Title --> <tr> <td width="10" class="noMobile"> </td> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> </tr> <!-- Space --> <tr><td height="10" class="noMobile"> </td><td> </td></tr> <!-- Text --> <tr> <td width="10" class="noMobile"> </td> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> </tr> <!-- Space --> <tr><td height="10" class="noMobile"> </td><td> </td></tr> <!-- Link --> <tr> <td width="10" class="noMobile"> </td> <td align="left"> <a href="#" target="_blank" style="color: #333333; text-decoration: none;" >Read More</a> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> <!-- Border --> <tr><td height="0" bgcolor="f0f0f0" style="line-height: 0px;"></td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END 1/2 IMAGE LEFT 1/2 CONTENT RIGHT ========= --> <!-- ========= 1/2 IMAGE RIGHT 1/2 CONTENT LEFT ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="f0f0f0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="ffffff" style="background-color: #ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Image --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="275" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="center"> <img height="" src="http://placehold.it/275x175" alt="Image" width="275px" border="0" style="width: 275px; display: block; border-style: none;" /> </td> </tr> </table> <!-- Content --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="270" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Title --> <tr> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> <td width="10" class="noMobile"> </td> </tr> <!-- Space --> <tr><td> </td><td height="10" class="noMobile"> </td></tr> <!-- Text --> <tr> <td align="left" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, voluptas, quae, ducimus animi earum eum nemo aspernatur rem cumque blanditiis eaque tempora qui expedita! </td> <td width="10" class="noMobile"> </td> </tr> <!-- Space --> <tr><td> </td><td height="10" class="noMobile"> </td></tr> <!-- Link --> <tr> <td align="left"> <a href="#" target="_blank" style="color: #333333; text-decoration: none;" >Read More</a> </td> <td width="10" class="noMobile"> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END 1/2 IMAGE RIGHT 1/2 CONTENT LEFT ========= --> <!-- ========= FEATURES ========= --> <!-- Wide --> <table class="containerWide" border="0" align="center" bgcolor="dddddd" cellpadding="0" cellspacing="0" width="100%" style="background-color: #dddddd; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="f0f0f0" style="background-color: #f0f0f0; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="20"></td> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="30"> </td></tr> <!-- 3 Columns --> <tr> <td style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;"> <!-- Column 1 --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > RESPONSIVE </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="370" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td> <!-- Column 2 --> <table class="column" border="0" align="left" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > FULLY LAYERED PSD </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> <!-- Column 3 --> <table class="column" border="0" align="right" cellpadding="0" cellspacing="0" width="180" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Icon --> <tr> <td align="center"> <img height="" class="icon" src="http://placehold.it/44x44" alt="Icon" width="44px" border="0" style="width: 44px !important; display: block; border-style: none;" /> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Title --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 600;" > SUPPORTED </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> <!-- Text --> <tr> <td align="center" style="color: #333333; font-family: Helvetica,Arial,sans-serif; font-size: 16px; line-height: 22px; font-weight: 300;" > Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td> </tr> <!-- Space --> <tr><td height="20" class="noDesktop"></td></tr> </table> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> <td width="20"></td> </tr> </table> </td> </tr> </table> <!-- ========= END FEATURES ========= --> <!-- ========= FOOTER ========= --> <!-- Wide --> <table class="containerWide" bgcolor="016cb8" border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="background-color: #016cb8; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" bgcolor="0079dd" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="40"> </td></tr> <!-- Headline --> <tr> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td width="25"> </td> <td align="center" style="color: #c2e0fc; font-family: Helvetica,Arial,sans-serif; font-size: 28px; line-height: 28px;" > Grab me on Themeforest! </td> <td width="25"> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> <!-- Call To Action --> <tr> <td> <table border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Button --> <tr> <td width="25"> </td> <td align="center" style="padding-bottom: 10px;" > <table border="0" align="center" cellpadding="0" cellspacing="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <tr> <td align="center" style="background-color: #003d6e; border-radius: 20px; padding-left: 25px; padding-right: 25px; padding-top: 8px; padding-bottom: 5px; text-align: center;"> <a href="#" style="color: #ffffff; text-decoration: none; border-radius: 20px; font-family: Helvetica,Arial,sans-serif; font-size: 20px; font-weight: 600; line-height: 24px;text-align: left;">GET IT HERE!</a> </td> </tr> </table> </td> <td width="25"> </td> </tr> </table> </td> </tr> <!-- Space --> <tr><td height="30"> </td></tr> </table> </td> </tr> </table> <!-- ========= END FOOTER ========= --> <!-- ========= SUB FOOTER ========= --> <table class="containerWide" bgcolor="016cb8" border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="background-color: #016cb8; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="10"> </td><td> </td></tr> <tr> <td align="center" style="color: #ffffff; font-family: Helvetica,Arial,sans-serif; font-size: 13px; line-height: 15px;"> <a href="" target="_blank" style="color: #c2e0fc; text-decoration: none;">Unsubscribe</a> from this list | <a href="" target="_blank" style="color: #c2e0fc; text-decoration: none;">Forward</a> to a friend | <a href="" target="_blank" style="color: #c2e0fc; text-decoration: none;">Update your profile</a><br /> Copyright 2013 - Lion Code Studio </td> <td align="right" valign="top" style="color: #ffffff; font-family: Helvetica,Arial,sans-serif; font-size: 13px; line-height: 15px;"> </td> </tr> <!-- Space --> <tr><td height="10"> </td><td> </td></tr> </table> </td> </tr> </table> <!-- ========= END SUB FOOTER ========= --> <!-- ========= Social ========= --> <table class="containerWide" bgcolor="ffffff" border="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="background-color: #ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" > <tr> <td> <!-- Box --> <table class="containerBox" border="0" align="center" cellpadding="0" cellspacing="0" width="600" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"> <!-- Space --> <tr><td height="10"> </td></tr> <tr> <td align="right"> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-facebook.jpg" alt="Facebook" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-twitter.jpg" alt="Twitter" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-googleplus.jpg" alt="Google Plus" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-linkedin.jpg" alt="LinkedIn" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-pinterest.jpg" alt="Pinterest" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-dribbble.jpg" alt="Dribbble" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-youtube.jpg" alt="Youtube" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> <a href="#" target="_blank" style="width: 32px !important;"><img height="" class="icon" src="http://themes.lioncodestudio.com/ui/img/icon-vimeo.jpg" alt="Vimeo" width="32px" border="0" style="width: 32px !important; border-style: none;" /></a> </td> </tr> <!-- Space --> <tr><td height="10"> </td></tr> </table> </td> </tr> </table> <!-- ========= END SOCIAL ========= --> </td> </tr> </table> </body> </html> |