Email Template Builder
Select style.
View »
1 Row
2 Row
3 Row
/* Client-specific Styles */ #outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */ body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;} /* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */ .ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */ .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing. */ .textRightNotMobile{text-align:right;} #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;} img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;} a img {border:none;} .image_fix {display:block;} p {padding: 0 0 16px 0!important;} p {margin: 0 0 0 0!important;} table td {border-collapse: collapse;} table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; } a {color: #4f87c6;text-decoration: none!important;} img.gmailAppForceScale {width:600px!important;height:1px!important;border:0;} /*STYLES*/ table[class=full] { width: 100%; clear: both; } .mobileLinkWhite a{ color:#ffffff!important; } .mobileLinkGrey a{ color:#4b4b4c!important; } .mobileLinkBlack a{ color:#000000!important; } /*IPAD STYLES*/ @media only screen and (max-width: 640px) { a[href^="tel"], a[href^="sms"] { text-decoration: none; color: #9ec459; /* or whatever your want */ pointer-events: none; cursor: default; } .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] { text-decoration: default; color: #ffffff !important; pointer-events: auto; cursor: default; } table[class=devicewidth] {width: 440px!important;text-align:center!important;} td[class=devicewidth] {width: 440px!important;text-align:center!important;} img[class=devicewidth] {width: 440px!important;text-align:center!important;} img[class=banner] {width: 440px!important;height:147px!important;} table[class=devicewidthinner] {width: 420px!important;text-align:center!important;} table[class=icontext] {width: 345px!important;text-align:center!important;} img[class="colimg2"] {width:420px!important;height:243px!important;} table[class="emhide"]{display: none!important;} img[class="logo"]{width:440px!important;height:211px!important;} img[class="gmailAppForceScale"]{width:440px!important;height:1px!important;} .mobileTextCenter{ text-align:center!important; } .mobileLinkWhite a{ color:#ffffff; } .mobileLinkGrey a{ color:#4b4b4c; } } /*IPHONE STYLES*/ @media only screen and (max-width: 480px) { .dontlink a {color:#000000; text-decoration: none;} .dontlinkwhite a {color:#ffffff; text-decoration: none;} a[href^="tel"], a[href^="sms"] { text-decoration: none; color: #9ec459; /* or whatever your want */ pointer-events: none; cursor: default; } .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] { text-decoration: default; color: #ffffff !important; pointer-events: auto; cursor: default; } table[class=devicewidth] {width: 280px!important;text-align:center!important;} td[class=devicewidth] {width: 280px!important;text-align:center!important;} img[class=devicewidth] {width: 280px!important;text-align:center!important;} img[class=banner] {width: 280px!important;height:93px!important;} table[class=devicewidthinner] {width: 260px!important;text-align:center!important;} table[class=icontext] {width: 186px!important;text-align:center!important;} img[class="colimg2"] {width:260px!important;height:150px!important;} table[class="emhide"]{display: none!important;} img[class="logo"]{width:280px!important;height:134px!important;} img[class="gmailAppForceScale"]{width:280px!important;height:1px!important;} .responsiveText{ font-size:120%!important; line-height:120%!important; } .responsiveButton{ font-size:140%!important; line-height:140%!important; width:100%!important; margin:20px 0 20px 0; } .mobileTextCenter{ text-align:center!important; } .mobileLinkWhite a{ color:#ffffff; } .mobileLinkGrey a{ color:#4b4b4c; } .smaller4mobile1 {font-size:30px!important;} }
<table bgcolor="#f4f4f4" border="0" cellpadding="0" cellspacing="0" class="removeAllPaddingMargin" st-sortable="seperator" style="border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="100%"> <tbody> <tr> <td> <table align="center" bgcolor="#f4f4f4" border="0" cellpadding="0" cellspacing="0" class="devicewidth" style="width:600px;border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="600"> <tbody> <tr> <td style="padding-top:20px;padding-bottom:0px;"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidthinner" style="width:560px;border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="560"> <tbody> <tr> <td style="text-align: center; line-height: 130%; font-family: Helvetica, Arial, sans-serif; color: #000000; font-size: 12px;" class=""> <p class="responsiveText">Preview text here.</p> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td> <table align="center" bgcolor="#78A12E" border="0" cellpadding="0" cellspacing="0" class="devicewidth" style="width:600px;border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="600"> <tbody> <tr> <td style="text-align:left;padding-left:20px;" class=""><img alt="Spok Inc." border="0" height="31" src="http://info.spok.com/l/30372/2017-04-06/79fv74/30372/157159/spok_logo_white.png" width="80"></td> <td style="width:70px;text-align:right;padding-right:5px;padding-top:20px;padding-bottom:20px;" width="70" class=""><a href="%%addthis_url_email%%" target="_blank"><img alt="Forward" border="0" height="19" src="http://info.spok.com/l/30372/2017-04-03/798gdd/30372/156953/forward_button.png" width="70"></a></td> <td style="width:70px;text-align:right;padding-right:20px;padding-top:20px;padding-bottom:20px;" width="70" class=""><a href="%%view_online%%" target="_blank"><img alt="View Online" border="0" height="19" src="http://info.spok.com/l/30372/2017-04-03/798gdg/30372/156955/view_online_button.png" width="70"></a></td> </tr> </tbody> </table> </td> </tr> </tbody> </table>
<!-- Headline --> <table bgcolor="#f4f4f4" border="0" cellpadding="0" cellspacing="0" class="removeAllPaddingMargin" st-sortable="seperator" style="border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="100%"> <tbody> <tr> <td> <table align="center" bgcolor="#78A12E" border="0" cellpadding="0" cellspacing="0" class="devicewidth" style="width:600px;border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="600"> <tbody> <tr> <td> <table align="center" bgcolor="#78A12E" border="0" cellpadding="0" cellspacing="0" class="devicewidthinner" style="width:560px;border-collapse: collapse;table-layout: fixed;mso-table-lspace:0pt; mso-table-rspace:0pt;" width="560"> <tbody> <tr> <td style="font-family: Helvetica, Arial, sans-serif; font-size: 18px; color: #ffffff; font-weight: bold; text-align: center; padding-top: 20px; line-height: 22px;" valign="middle" class="">Webinar Series</td> </tr> <tr> <td style="font-family: Helvetica, Arial, sans-serif; font-size: 36px; color: #ffffff; font-weight: bold; text-align: center; padding-top: 10px; line-height: 42px;" valign="middle" class="smaller4mobile1">The State of Mobile Communications</td> </tr> <tr> <td style="font-family: Helvetica, Arial, sans-serif; font-size: 24px; color: #ffffff; font-weight: bold; text-align: center; padding-top: 30px; line-height: 30px;" valign="middle" class="">What you'll learn</td> </tr> <tr> <td style="font-family: Helvetica, Arial, sans-serif; font-size: 16px;color: #ffffff;font-weight:normal;text-align: center;padding-top:10px;line-height:160%;" valign="middle" class=""> <p class="responsiveText">Lorem ipsum dolor sit amet, consectetuer Adipiscing elit, sed diam nonummy nibh Euismod tincidunt ut laoreet dolore magna tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <!-- // Headline -->