123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609 |
- <!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 http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title>*|MC:SUBJECT|*</title>
- <style type="text/css">
- /* /\/\/\/\/\/\/\/\/ CLIENT-SPECIFIC STYLES /\/\/\/\/\/\/\/\/ */
- #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" message */
- .ReadMsgBody{width:100%;} .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 */
- body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} /* Prevent WebKit and Windows mobile changing default text sizes */
- table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up */
- img{-ms-interpolation-mode:bicubic;} /* Allow smoother rendering of resized image in Internet Explorer */
- /* /\/\/\/\/\/\/\/\/ RESET STYLES /\/\/\/\/\/\/\/\/ */
- body{margin:0; padding:0;}
- img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
- table{border-collapse:collapse !important;}
- body, #bodyTable, #bodyCell{height:100% !important; margin:0; padding:0; width:100% !important;}
- /* /\/\/\/\/\/\/\/\/ TEMPLATE STYLES /\/\/\/\/\/\/\/\/ */
- /* ========== Page Styles ========== */
- #bodyCell{padding:20px;}
- #templateContainer{width:600px;}
- /**
- * @tab Page
- * @section background style
- * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
- * @theme page
- */
- body, #bodyTable{
- /*@editable*/ background-color:#DEE0E2;
- }
- /**
- * @tab Page
- * @section background style
- * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
- * @theme page
- */
- #bodyCell{
- /*@editable*/ border-top:4px solid #BBBBBB;
- }
- /**
- * @tab Page
- * @section email border
- * @tip Set the border for your email.
- */
- #templateContainer{
- /*@editable*/ border:1px solid #BBBBBB;
- }
- /**
- * @tab Page
- * @section heading 1
- * @tip Set the styling for all first-level headings in your emails. These should be the largest of your headings.
- * @style heading 1
- */
- h1{
- /*@editable*/ color:#202020 !important;
- display:block;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:26px;
- /*@editable*/ font-style:normal;
- /*@editable*/ font-weight:bold;
- /*@editable*/ line-height:100%;
- /*@editable*/ letter-spacing:normal;
- margin-top:0;
- margin-right:0;
- margin-bottom:10px;
- margin-left:0;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Page
- * @section heading 2
- * @tip Set the styling for all second-level headings in your emails.
- * @style heading 2
- */
- h2{
- /*@editable*/ color:#404040 !important;
- display:block;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:20px;
- /*@editable*/ font-style:normal;
- /*@editable*/ font-weight:bold;
- /*@editable*/ line-height:100%;
- /*@editable*/ letter-spacing:normal;
- margin-top:0;
- margin-right:0;
- margin-bottom:10px;
- margin-left:0;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Page
- * @section heading 3
- * @tip Set the styling for all third-level headings in your emails.
- * @style heading 3
- */
- h3{
- /*@editable*/ color:#606060 !important;
- display:block;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:16px;
- /*@editable*/ font-style:italic;
- /*@editable*/ font-weight:normal;
- /*@editable*/ line-height:100%;
- /*@editable*/ letter-spacing:normal;
- margin-top:0;
- margin-right:0;
- margin-bottom:10px;
- margin-left:0;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Page
- * @section heading 4
- * @tip Set the styling for all fourth-level headings in your emails. These should be the smallest of your headings.
- * @style heading 4
- */
- h4{
- /*@editable*/ color:#808080 !important;
- display:block;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:14px;
- /*@editable*/ font-style:italic;
- /*@editable*/ font-weight:normal;
- /*@editable*/ line-height:100%;
- /*@editable*/ letter-spacing:normal;
- margin-top:0;
- margin-right:0;
- margin-bottom:10px;
- margin-left:0;
- /*@editable*/ text-align:left;
- }
- /* ========== Header Styles ========== */
- /**
- * @tab Header
- * @section preheader style
- * @tip Set the background color and bottom border for your email's preheader area.
- * @theme header
- */
- #templatePreheader{
- /*@editable*/ background-color:#F4F4F4;
- /*@editable*/ border-bottom:1px solid #CCCCCC;
- }
- /**
- * @tab Header
- * @section preheader text
- * @tip Set the styling for your email's preheader text. Choose a size and color that is easy to read.
- */
- .preheaderContent{
- /*@editable*/ color:#808080;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:10px;
- /*@editable*/ line-height:125%;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Header
- * @section preheader link
- * @tip Set the styling for your email's preheader links. Choose a color that helps them stand out from your text.
- */
- .preheaderContent a:link, .preheaderContent a:visited, /* Yahoo! Mail Override */ .preheaderContent a .yshortcuts /* Yahoo! Mail Override */{
- /*@editable*/ color:#606060;
- /*@editable*/ font-weight:normal;
- /*@editable*/ text-decoration:underline;
- }
- /**
- * @tab Header
- * @section header style
- * @tip Set the background color and borders for your email's header area.
- * @theme header
- */
- #templateHeader{
- /*@editable*/ background-color:#F4F4F4;
- /*@editable*/ border-top:1px solid #FFFFFF;
- /*@editable*/ border-bottom:1px solid #CCCCCC;
- }
- /**
- * @tab Header
- * @section header text
- * @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
- */
- .headerContent{
- /*@editable*/ color:#505050;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:20px;
- /*@editable*/ font-weight:bold;
- /*@editable*/ line-height:100%;
- /*@editable*/ padding-top:0;
- /*@editable*/ padding-right:0;
- /*@editable*/ padding-bottom:0;
- /*@editable*/ padding-left:0;
- /*@editable*/ text-align:left;
- /*@editable*/ vertical-align:middle;
- }
- /**
- * @tab Header
- * @section header link
- * @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
- */
- .headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
- /*@editable*/ color:#EB4102;
- /*@editable*/ font-weight:normal;
- /*@editable*/ text-decoration:underline;
- }
- #headerImage{
- height:auto;
- max-width:600px;
- }
- /* ========== Column Styles ========== */
- .templateColumnContainer{width:260px;}
- /**
- * @tab Columns
- * @section column style
- * @tip Set the background color and borders for your email's column area.
- */
- #templateColumns{
- /*@editable*/ background-color:#F4F4F4;
- /*@editable*/ border-top:1px solid #FFFFFF;
- /*@editable*/ border-bottom:1px solid #CCCCCC;
- }
- /**
- * @tab Columns
- * @section left column text
- * @tip Set the styling for your email's left column content text. Choose a size and color that is easy to read.
- */
- .leftColumnContent{
- /*@editable*/ color:#505050;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:14px;
- /*@editable*/ line-height:150%;
- padding-top:0;
- padding-right:20px;
- padding-bottom:20px;
- padding-left:20px;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Columns
- * @section left column link
- * @tip Set the styling for your email's left column content links. Choose a color that helps them stand out from your text.
- */
- .leftColumnContent a:link, .leftColumnContent a:visited, /* Yahoo! Mail Override */ .leftColumnContent a .yshortcuts /* Yahoo! Mail Override */{
- /*@editable*/ color:#EB4102;
- /*@editable*/ font-weight:normal;
- /*@editable*/ text-decoration:underline;
- }
- /**
- * @tab Columns
- * @section right column text
- * @tip Set the styling for your email's right column content text. Choose a size and color that is easy to read.
- */
- .rightColumnContent{
- /*@editable*/ color:#505050;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:14px;
- /*@editable*/ line-height:150%;
- padding-top:0;
- padding-right:20px;
- padding-bottom:20px;
- padding-left:20px;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Columns
- * @section right column link
- * @tip Set the styling for your email's right column content links. Choose a color that helps them stand out from your text.
- */
- .rightColumnContent a:link, .rightColumnContent a:visited, /* Yahoo! Mail Override */ .rightColumnContent a .yshortcuts /* Yahoo! Mail Override */{
- /*@editable*/ color:#EB4102;
- /*@editable*/ font-weight:normal;
- /*@editable*/ text-decoration:underline;
- }
- .leftColumnContent img, .rightColumnContent img{
- display:inline;
- height:auto;
- max-width:260px;
- }
- /* ========== Footer Styles ========== */
- /**
- * @tab Footer
- * @section footer style
- * @tip Set the background color and borders for your email's footer area.
- * @theme footer
- */
- #templateFooter{
- /*@editable*/ background-color:#F4F4F4;
- /*@editable*/ border-top:1px solid #FFFFFF;
- }
- /**
- * @tab Footer
- * @section footer text
- * @tip Set the styling for your email's footer text. Choose a size and color that is easy to read.
- * @theme footer
- */
- .footerContent{
- /*@editable*/ color:#808080;
- /*@editable*/ font-family:Helvetica;
- /*@editable*/ font-size:10px;
- /*@editable*/ line-height:150%;
- padding-top:20px;
- padding-right:20px;
- padding-bottom:20px;
- padding-left:20px;
- /*@editable*/ text-align:left;
- }
- /**
- * @tab Footer
- * @section footer link
- * @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
- */
- .footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts, .footerContent a span /* Yahoo! Mail Override */{
- /*@editable*/ color:#606060;
- /*@editable*/ font-weight:normal;
- /*@editable*/ text-decoration:underline;
- }
- /* /\/\/\/\/\/\/\/\/ MOBILE STYLES /\/\/\/\/\/\/\/\/ */
- @media only screen and (max-width: 480px){
- /* /\/\/\/\/\/\/ CLIENT-SPECIFIC MOBILE STYLES /\/\/\/\/\/\/ */
- body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:none !important;} /* Prevent Webkit platforms from changing default text sizes */
- body{width:100% !important; min-width:100% !important;} /* Prevent iOS Mail from adding padding to the body */
- /* /\/\/\/\/\/\/ MOBILE RESET STYLES /\/\/\/\/\/\/ */
- #bodyCell{padding:10px !important;}
- /* /\/\/\/\/\/\/ MOBILE TEMPLATE STYLES /\/\/\/\/\/\/ */
- /* ======== Page Styles ======== */
- /**
- * @tab Mobile Styles
- * @section template width
- * @tip Make the template fluid for portrait or landscape view adaptability. If a fluid layout doesn't work for you, set the width to 300px instead.
- */
- #templateContainer{
- max-width:600px !important;
- /*@editable*/ width:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section heading 1
- * @tip Make the first-level headings larger in size for better readability on small screens.
- */
- h1{
- /*@editable*/ font-size:24px !important;
- /*@editable*/ line-height:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section heading 2
- * @tip Make the second-level headings larger in size for better readability on small screens.
- */
- h2{
- /*@editable*/ font-size:20px !important;
- /*@editable*/ line-height:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section heading 3
- * @tip Make the third-level headings larger in size for better readability on small screens.
- */
- h3{
- /*@editable*/ font-size:18px !important;
- /*@editable*/ line-height:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section heading 4
- * @tip Make the fourth-level headings larger in size for better readability on small screens.
- */
- h4{
- /*@editable*/ font-size:16px !important;
- /*@editable*/ line-height:100% !important;
- }
- /* ======== Header Styles ======== */
- #templatePreheader{display:none !important;} /* Hide the template preheader to save space */
- /**
- * @tab Mobile Styles
- * @section header image
- * @tip Make the main header image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
- */
- #headerImage{
- height:auto !important;
- /*@editable*/ max-width:600px !important;
- /*@editable*/ width:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section header text
- * @tip Make the header content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
- */
- .headerContent{
- /*@editable*/ font-size:20px !important;
- /*@editable*/ line-height:125% !important;
- }
- /* ======== Column Styles ======== */
- .templateColumnContainer{display:block !important; width:100% !important;}
- /**
- * @tab Mobile Styles
- * @section column image
- * @tip Make the column image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
- */
- .columnImage{
- height:auto !important;
- /*@editable*/ max-width:260px !important;
- /*@editable*/ width:100% !important;
- }
- /**
- * @tab Mobile Styles
- * @section left column text
- * @tip Make the left column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
- */
- .leftColumnContent{
- /*@editable*/ font-size:16px !important;
- /*@editable*/ line-height:125% !important;
- }
- /**
- * @tab Mobile Styles
- * @section right column text
- * @tip Make the right column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
- */
- .rightColumnContent{
- /*@editable*/ font-size:16px !important;
- /*@editable*/ line-height:125% !important;
- }
- /* ======== Footer Styles ======== */
- /**
- * @tab Mobile Styles
- * @section footer text
- * @tip Make the body content text larger in size for better readability on small screens.
- */
- .footerContent{
- /*@editable*/ font-size:14px !important;
- /*@editable*/ line-height:115% !important;
- }
- .footerContent a{display:block !important;} /* Place footer social and utility links on their own lines, for easier access */
- }
- </style>
- </head>
- <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
- <center>
- <table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable">
- <tr>
- <td align="center" valign="top" id="bodyCell">
- <!-- BEGIN TEMPLATE // -->
- <table border="0" cellpadding="0" cellspacing="0" id="templateContainer">
- <tr>
- <td align="center" valign="top">
- <!-- BEGIN PREHEADER // -->
- <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templatePreheader">
- <tr>
- <td valign="top" class="preheaderContent" style="padding-top:10px; padding-right:20px; padding-bottom:10px; padding-left:20px;" mc:edit="preheader_content00">
- Use this area to offer a short teaser of your email's content. Text here will show in the preview area of some email clients.
- </td>
- <!-- *|IFNOT:ARCHIVE_PAGE|* -->
- <td valign="top" width="180" class="preheaderContent" style="padding-top:10px; padding-right:20px; padding-bottom:10px; padding-left:0;" mc:edit="preheader_content01">
- Email not displaying correctly?<br /><a href="*|ARCHIVE|*" target="_blank">View it in your browser</a>.
- </td>
- <!-- *|END:IF|* -->
- </tr>
- </table>
- <!-- // END PREHEADER -->
- </td>
- </tr>
- <tr>
- <td align="center" valign="top">
- <!-- BEGIN HEADER // -->
- <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateHeader">
- <tr>
- <td valign="top" class="headerContent">
- <img src="http://gallery.mailchimp.com/2425ea8ad3/images/header_placeholder_600px.png" style="max-width:600px;" id="headerImage" mc:label="header_image" mc:edit="header_image" mc:allowdesigner mc:allowtext />
- </td>
- </tr>
- </table>
- <!-- // END HEADER -->
- </td>
- </tr>
- <tr>
- <td align="center" valign="top">
- <!-- BEGIN COLUMNS // -->
- <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateColumns">
- <tr mc:repeatable>
- <td align="center" valign="top" class="templateColumnContainer" style="padding-top:20px;">
- <table border="0" cellpadding="20" cellspacing="0" width="100%">
- <tr>
- <td class="leftColumnContent">
- <img src="http://gallery.mailchimp.com/27aac8a65e64c994c4416d6b8/images/header_placeholder_260px.png" style="max-width:260px;" class="columnImage" mc:label="left_column_image" mc:edit="left_column_image" />
- </td>
- </tr>
- <tr>
- <td valign="top" class="leftColumnContent" mc:edit="left_column_content">
- <h3>Repeatable Content</h3>
- <a href="http://kb.mailchimp.com/article/how-do-i-work-with-repeatable-content-blocks" target="_blank">Repeatable sections</a> are noted with plus and minus signs so that you can add and subtract content blocks.
- <br />
- <br />
- You can also get a little fancy; repeat blocks and remove all text to make image galleries, or do the opposite and remove images for text-only blocks.
- </td>
- </tr>
- </table>
- </td>
- <td align="center" valign="top" class="templateColumnContainer" style="padding-top:20px;">
- <table border="0" cellpadding="20" cellspacing="0" width="100%">
- <tr>
- <td class="rightColumnContent">
- <img src="http://gallery.mailchimp.com/27aac8a65e64c994c4416d6b8/images/header_placeholder_260px.png" style="max-width:260px;" class="columnImage" mc:label="right_column_image" mc:edit="right_column_image" />
- </td>
- </tr>
- <tr>
- <td valign="top" class="rightColumnContent" mc:edit="right_column_content">
- <h3>Repeatable Content</h3>
- <a href="http://kb.mailchimp.com/article/how-do-i-work-with-repeatable-content-blocks" target="_blank">Repeatable sections</a> are noted with plus and minus signs so that you can add and subtract content blocks.
- <br />
- <br />
- You can also get a little fancy; repeat blocks and remove all text to make image galleries, or do the opposite and remove images for text-only blocks.
- </td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- <!-- // END COLUMNS -->
- </td>
- </tr>
- <tr>
- <td align="center" valign="top">
- <!-- BEGIN FOOTER // -->
- <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateFooter">
- <tr>
- <td valign="top" class="footerContent" mc:edit="footer_content00">
- <a href="*|TWITTER:PROFILEURL|*">Follow on Twitter</a> <a href="*|FACEBOOK:PROFILEURL|*">Friend on Facebook</a> <a href="*|FORWARD|*">Forward to Friend</a>
- </td>
- </tr>
- <tr>
- <td valign="top" class="footerContent" style="padding-top:0;" mc:edit="footer_content01">
- <em>Copyright © *|CURRENT_YEAR|* *|LIST:COMPANY|*, All rights reserved.</em>
- <br />
- *|IFNOT:ARCHIVE_PAGE|* *|LIST:DESCRIPTION|*
- <br />
- <br />
- <strong>Our mailing address is:</strong>
- <br />
- *|HTML:LIST_ADDRESS_HTML|* *|END:IF|*
- </td>
- </tr>
- <tr>
- <td valign="top" class="footerContent" style="padding-top:0;" mc:edit="footer_content02">
- <a href="*|UNSUB|*">unsubscribe from this list</a> <a href="*|UPDATE_PROFILE|*">update subscription preferences</a>
- </td>
- </tr>
- </table>
- <!-- // END FOOTER -->
- </td>
- </tr>
- </table>
- <!-- // END TEMPLATE -->
- </td>
- </tr>
- </table>
- </center>
- </body>
- </html>
|