projects / weblabels.fsf.org.git / blob
? search:
summary | shortlog | log | commit | commitdiff | tree
blame | history | raw | HEAD
commiting uncommited changes on live site
[weblabels.fsf.org.git] / crm.fsf.org / 20131203 / files / sites / all / modules-new / civicrm / xml / templates / message_templates / sample / Sample Responsive Design Newsletter - Two Column.tpl
1 <html xmlns="http://www.w3.org/1999/xhtml">
2 <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
3 <meta content="width=device-width, initial-scale=1.0" name="viewport" />
4 <title></title>
5 <style type="text/css">
6 {literal}
7 img {height: auto !important;}
8 /* Client-specific Styles */
9 #outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
10 body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
11
12 /* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
13 .ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
14 .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing. */
15 #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
16 img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
17 a img {border:none;}
18 .image_fix {display:block;}
19 p {margin: 0px 0px !important;}
20 table td {border-collapse: collapse;}
21 table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
22 a {/*color: #33b9ff;*/text-decoration: none;text-decoration:none!important;}
23
24
25 /*STYLES*/
26 table[class=full] { width: 100%; clear: both; }
27
28 /*IPAD STYLES*/
29 @media only screen and (max-width: 640px) {
30 a[href^="tel"], a[href^="sms"] {text-decoration: none;color: #0a8cce;pointer-events: none;cursor: default;}
31 .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {text-decoration: default;color: #0a8cce !important;pointer-events: auto;cursor: default;}
32 table[class=devicewidth] {width: 440px!important;text-align:center!important;}
33 table[class=devicewidthmob] {width: 414px!important;text-align:center!important;}
34 table[class=devicewidthinner] {width: 414px!important;text-align:center!important;}
35 img[class=banner] {width: 440px!important;auto!important;}
36 img[class=col2img] {width: 440px!important;height:auto!important;}
37 table[class="cols3inner"] {width: 100px!important;}
38 table[class="col3img"] {width: 131px!important;}
39 img[class="col3img"] {width: 131px!important;height: auto!important;}
40 table[class="removeMobile"]{width:10px!important;}
41 img[class="blog"] {width: 440px!important;height: auto!important;}
42 }
43
44 /*IPHONE STYLES*/
45 @media only screen and (max-width: 480px) {
46 a[href^="tel"], a[href^="sms"] {text-decoration: none;color: #0a8cce;pointer-events: none;cursor: default;}
47 .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {text-decoration: default;color: #0a8cce !important; pointer-events: auto;cursor: default;}
48 table[class=devicewidth] {width: 280px!important;text-align:center!important;}
49 table[class=devicewidthmob] {width: 260px!important;text-align:center!important;}
50 table[class=devicewidthinner] {width: 260px!important;text-align:center!important;}
51 img[class=banner] {width: 280px!important;height:100px!important;}
52 img[class=col2img] {width: 280px!important;height:auto!important;}
53 table[class="cols3inner"] {width: 260px!important;}
54 img[class="col3img"] {width: 280px!important;height: auto!important;}
55 table[class="col3img"] {width: 280px!important;}
56 img[class="blog"] {width: 280px!important;auto!important;}
57 td[class="padding-top-right15"]{padding:15px 15px 0 0 !important;}
58 td[class="padding-right15"]{padding-right:15px !important;}
59 }
60
61 @media only screen and (max-device-width: 800px)
62 {td[class="padding-top-right15"]{padding:15px 15px 0 0 !important;}
63 td[class="padding-right15"]{padding-right:15px !important;}}
64 @media only screen and (max-device-width: 769px) {.devicewidthmob {font-size:14px;}}
65
66 @media only screen and (max-width: 640px) {.desktop-spacer {display:none !important;}
67 }
68 {/literal}
69 </style>
70 <body>
71 <!-- Start of preheader --><!-- Start of preheader -->
72 <table bgcolor="#0B4151" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" width="100%">
73 <tbody>
74 <tr>
75 <td>
76 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
77 <tbody>
78 <tr>
79 <td width="100%">
80 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
81 <tbody><!-- Spacing -->
82 <tr>
83 <td height="20" width="100%">&nbsp;</td>
84 </tr>
85 <!-- Spacing -->
86 <tr>
87 <td>
88 <table align="left" border="0" cellpadding="0" cellspacing="0" class="devicewidthinner" width="360">
89 <tbody>
90 <tr>
91 <td align="left" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; line-height:120%; color: #f8f8f8;padding-left:15px;" valign="middle">Organization or Program Name Here</td>
92 </tr>
93 </tbody>
94 </table>
95
96 <table align="right" border="0" cellpadding="0" cellspacing="0" class="emhide" width="320">
97 <tbody>
98 <tr>
99 <td align="right" style="font-family: Helvetica, arial, sans-serif; font-size: 16px;color: #f8f8f8;padding-right:15px;" valign="middle">Month Year</td>
100 </tr>
101 </tbody>
102 </table>
103 </td>
104 </tr>
105 <!-- Spacing -->
106 <tr>
107 <td height="20" width="100%">&nbsp;</td>
108 </tr>
109 <!-- Spacing -->
110 </tbody>
111 </table>
112 </td>
113 </tr>
114 </tbody>
115 </table>
116 </td>
117 </tr>
118 </tbody>
119 </table>
120 <!-- End of preheader --><!-- start of logo -->
121
122 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="100%">
123 <tbody>
124 <tr>
125 <td>
126 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidthmob" width="700">
127 <tbody>
128 <tr>
129 <td width="100%">
130 <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
131 <tbody><!-- Spacing -->
132 <tr>
133 <td height="20" width="100%">
134 <table align="center" border="0" cellpadding="2" cellspacing="0" width="93%">
135 <tbody>
136 <tr>
137 <td rowspan="2" width="330"><a href="#"> <div class="imgpop"><img src="https://civicrm.org/sites/default/files/civicrm/custom/images/civicrm-logo-transparent.png" alt="Replace with your own logo" width="220" border="0" style="display:block;"/></div></a></td>
138 <td align="right" >
139 <h6 class="collapse">&nbsp;</h6>
140 </td>
141 </tr>
142 <tr>
143 <td align="right">
144
145 </td>
146 </tr>
147 </tbody>
148 </table>
149 </td>
150 </tr>
151
152 </tbody>
153 </table>
154 </td>
155 </tr>
156 </tbody>
157 </table>
158 </td>
159 </tr>
160 </tbody>
161 </table>
162 <!-- end of logo --> <!-- hero story 1 -->
163
164 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="101%">
165 <tbody>
166 <tr>
167 <td>
168 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
169 <tbody>
170 <tr>
171 <td width="100%">
172 <table align="center" bgcolor="#f8f8f8" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
173 <tbody>
174 <tr>
175 <td>
176 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
177 <tbody>
178 <tr>
179 <td width="100%">
180 <table align="center" bgcolor="#f8f8f8" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
181 <tbody><!-- /Spacing -->
182 <tr>
183 <td style="font-family: Helvetica, arial, sans-serif; font-size: 24px; color:#f8f8f8; text-align:left; line-height: 26px; padding:5px 15px; background-color: #80C457">Hero Story Heading</td>
184 </tr>
185 <!-- Spacing -->
186 <tr>
187 <td>
188 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidthinner" width="700">
189 <tbody><!-- image -->
190 <tr>
191 <td align="center" class="devicewidthinner" width="100%">
192 <div class="imgpop"><a href="#" target="_blank"><img alt="" border="0" class="blog" height="396" src="https://civicrm.org/sites/default/files/civicrm/custom/images/700x396.png" style="display:block; border:none; outline:none; text-decoration:none; padding:0; line-height:0;" width="700" /></a></div>
193 </td>
194 </tr>
195 <!-- /image --><!-- Spacing -->
196 <tr>
197 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
198 </tr>
199 <!-- /Spacing --><!-- hero story -->
200 <tr>
201 <td style="font-family: Helvetica, arial, sans-serif; font-size: 18px; text-align:left; line-height: 26px; padding:0 15px;"><a href="#" style="color:#076187; text-decoration:none; " target="_blank">Subheading Here</a></td>
202 </tr>
203 <!-- Spacing -->
204 <tr>
205 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
206 </tr><!-- /Spacing -->
207 <tr>
208 <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 26px; padding:0 15px;"><span class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;">Replace with your text and images, and remember to link the facebook and twitter links in the footer to your pages. Have fun!</span></td>
209 </tr>
210
211 <!-- Spacing -->
212 <tr>
213 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
214 </tr><!-- /Spacing -->
215
216 <!-- /Spacing --><!-- /hero story -->
217
218 <!-- Spacing --> <!-- Spacing -->
219
220
221
222 <!-- Spacing --><!-- end of content -->
223 </tbody>
224 </table>
225 </td>
226 </tr>
227 </tbody>
228 </table>
229 </td>
230 </tr>
231 </tbody>
232 </table>
233 </td>
234 </tr>
235 <!-- Section Heading -->
236 <tr>
237 <td style="font-family: Helvetica, arial, sans-serif; font-size: 24px; color:#f8f8f8; text-align:left; line-height: 26px; padding:5px 15px; background-color: #80C457">Section Heading Here</td>
238 </tr>
239 <!-- /Section Heading -->
240 </tbody>
241 </table>
242 </td>
243 </tr>
244 </tbody>
245 </table>
246 </td>
247 </tr>
248 </tbody>
249 </table>
250 <!-- /hero story 1 --><!-- story one -->
251
252 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="100%">
253 <tbody>
254 <tr>
255 <td>
256 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
257 <tbody>
258 <tr>
259 <td width="100%">
260 <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
261 <tbody><!-- Spacing -->
262 <tr>
263 <td class="desktop-spacer" height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
264 </tr>
265 <!-- Spacing -->
266 <tr>
267 <td>
268 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="660">
269 <tbody>
270 <tr>
271 <td><!-- Start of left column -->
272 <table align="left" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="330">
273 <tbody><!-- image -->
274 <tr>
275 <td align="center" class="devicewidth" height="150" valign="top" width="330"><a href="#"><img alt="" border="0" class="col2img" src="https://civicrm.org/sites/default/files/civicrm/custom/images/330x150.png" style="display:block; border:none; outline:none; text-decoration:none; display:block;" width="330" /></a></td>
276 </tr>
277 <!-- /image -->
278 </tbody>
279 </table>
280 <!-- end of left column --><!-- spacing for mobile devices-->
281
282 <table align="left" border="0" cellpadding="0" cellspacing="0" class="mobilespacing">
283 <tbody>
284 <tr>
285 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
286 </tr>
287 </tbody>
288 </table>
289 <!-- end of for mobile devices--><!-- start of right column -->
290
291 <table align="right" border="0" cellpadding="0" cellspacing="0" class="devicewidthmob" width="310">
292 <tbody>
293 <tr>
294 <td class="padding-top-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 18px; text-align:left; line-height: 24px;"><a href="#" style="color:#076187; text-decoration:none; " target="_blank">Heading Here</a><a href="#" style="color:#076187; text-decoration:none;" target="_blank" title="CiviCRM helps keep the “City Beautiful” Movement”going strong"></a></td>
295 </tr>
296 <!-- end of title --><!-- Spacing -->
297 <tr>
298 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
299 </tr>
300 <!-- /Spacing --><!-- content -->
301 <tr>
302 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;"><span class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
303 tempor incididunt ut labore et dolore magna </span></td>
304 </tr>
305 <tr>
306 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; font-weight:bold; color: #333333; text-align:left;line-height: 24px; padding-top:10px;"><a href="#" style="color:#80C457;text-decoration:none;font-weight:bold;" target="_blank" title="CiviCRM helps keep the “City Beautiful” Movement”going strong">Read More</a></td>
307 </tr>
308 <!-- /button --><!-- end of content -->
309 </tbody>
310 </table>
311 <!-- end of right column --></td>
312 </tr>
313 </tbody>
314 </table>
315 </td>
316 </tr>
317 <!-- Spacing -->
318 <tr>
319 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
320 </tr>
321 </tbody>
322 </table>
323 </td>
324 </tr>
325 </tbody>
326 </table>
327 </td>
328 </tr>
329 </tbody>
330 </table>
331 <!-- /story one -->
332 <!-- story two -->
333
334 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="100%">
335 <tbody>
336 <tr>
337 <td>
338 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
339 <tbody>
340 <tr>
341 <td width="100%">
342 <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
343 <tbody><!-- Spacing -->
344 <tr>
345 <td bgcolor="#076187" height="0" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
346 </tr>
347 <!-- Spacing --><!-- Spacing -->
348 <tr>
349 <td class="desktop-spacer" height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
350 </tr>
351 <!-- Spacing -->
352 <tr>
353 <td>
354 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="660">
355 <tbody>
356 <tr>
357 <td><!-- Start of left column -->
358 <table align="left" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="330">
359 <tbody><!-- image -->
360 <tr>
361 <td align="center" class="devicewidth" height="150" valign="top" width="330"><a href="#"><img alt="" border="0" class="col2img" src="https://civicrm.org/sites/default/files/civicrm/custom/images/330x150.png" style="display:block; border:none; outline:none; text-decoration:none; display:block;" width="330" /></a></td>
362 </tr>
363 <!-- /image -->
364 </tbody>
365 </table>
366 <!-- end of left column --><!-- spacing for mobile devices-->
367
368 <table align="left" border="0" cellpadding="0" cellspacing="0" class="mobilespacing">
369 <tbody>
370 <tr>
371 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
372 </tr>
373 </tbody>
374 </table>
375 <!-- end of for mobile devices--><!-- start of right column -->
376
377 <table align="right" border="0" cellpadding="0" cellspacing="0" class="devicewidthmob" width="310">
378 <tbody>
379 <tr>
380 <td class="padding-top-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 18px; text-align:left; line-height: 24px;"><a href="#" style="color:#076187; text-decoration:none; " target="_blank">Heading Here</a><a href="#" style="color:#076187; text-decoration:none;" target="_blank" title="How CiviCRM will take Tribodar Eco Learning Center to another level"></a></td>
381 </tr>
382 <!-- end of title --><!-- Spacing -->
383 <tr>
384 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
385 </tr>
386 <!-- /Spacing --><!-- content -->
387 <tr>
388 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;"><span class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
389 tempor incididunt ut labore et dolore magna </span></td>
390 </tr>
391 <tr>
392 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; font-weight:bold; color: #333333; text-align:left;line-height: 24px; padding-top:10px;"><a href="#" style="color:#80C457;text-decoration:none;font-weight:bold;" target="_blank" title="How CiviCRM will take Tribodar Eco Learning Center to another level">Read More</a></td>
393 </tr>
394 <!-- /button --><!-- end of content -->
395 </tbody>
396 </table>
397 <!-- end of right column --></td>
398 </tr>
399 </tbody>
400 </table>
401 </td>
402 </tr>
403 <!-- Spacing -->
404 <tr>
405 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
406 </tr>
407 </tbody>
408 </table>
409 </td>
410 </tr>
411 </tbody>
412 </table>
413 </td>
414 </tr>
415 </tbody>
416 </table>
417 <!-- /story two --><!-- story three -->
418
419 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="100%">
420 <tbody>
421 <tr>
422 <td>
423 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
424 <tbody>
425 <tr>
426 <td width="100%">
427 <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
428 <tbody><!-- Spacing -->
429 <tr>
430 <td bgcolor="#076187" height="0" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
431 </tr>
432 <!-- Spacing --><!-- Spacing -->
433 <tr>
434 <td height="20" class="desktop-spacer" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
435 </tr>
436 <!-- Spacing -->
437 <tr>
438 <td>
439 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="660">
440 <tbody>
441 <tr>
442 <td><!-- Start of left column -->
443 <table align="left" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="330">
444 <tbody><!-- image -->
445 <tr>
446 <td align="center" class="devicewidth" height="150" valign="top" width="330"><a href="#"><img alt="" border="0" class="col2img" src="https://civicrm.org/sites/default/files/civicrm/custom/images/330x150.png" style="display:block; border:none; outline:none; text-decoration:none; display:block;" width="330" /></a></td>
447 </tr>
448 <!-- /image -->
449 </tbody>
450 </table>
451 <!-- end of left column --><!-- spacing for mobile devices-->
452
453 <table align="left" border="0" cellpadding="0" cellspacing="0" class="mobilespacing">
454 <tbody>
455 <tr>
456 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
457 </tr>
458 </tbody>
459 </table>
460 <!-- end of for mobile devices--><!-- start of right column -->
461
462 <table align="right" border="0" cellpadding="0" cellspacing="0" class="devicewidthmob" width="310">
463 <tbody>
464 <tr>
465 <td class="padding-top-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 18px; text-align:left; line-height: 24px;"><a href="#" style="color:#076187; text-decoration:none; " target="_blank">Heading Here</a><a href="#" style="color:#076187; text-decoration:none;" target="_blank" title="CiviCRM provides a soup-to-nuts open-source solution for Friends of the San Pedro River"></a></td>
466 </tr>
467 <!-- end of title --><!-- Spacing -->
468 <tr>
469 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
470 </tr>
471 <!-- /Spacing --><!-- content -->
472 <tr>
473 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;"><span class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
474 tempor incididunt ut labore et dolore magna </span></td>
475 </tr>
476 <tr>
477 <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; font-weight:bold; color: #333333; text-align:left;line-height: 24px; padding-top:10px;"><a href="#" style="color:#80C457;text-decoration:none;font-weight:bold;" target="_blank" title="CiviCRM provides a soup-to-nuts open-source solution for Friends of the San Pedro River">Read More</a></td>
478 </tr>
479 <!-- /button --><!-- end of content -->
480 </tbody>
481 </table>
482 <!-- end of right column --></td>
483 </tr>
484 </tbody>
485 </table>
486 </td>
487 </tr>
488 <!-- Spacing -->
489 <tr>
490 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
491 </tr>
492 <!-- Spacing -->
493 </tbody>
494 </table>
495 </td>
496 </tr>
497 </tbody>
498 </table>
499 </td>
500 </tr>
501 </tbody>
502 </table>
503 <!-- /story three -->
504
505
506
507
508
509 <!-- story four -->
510 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="left-image" width="100%">
511 <tbody>
512 <tr>
513 <td>
514 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
515 <tbody>
516 <tr>
517 <td width="100%">
518 <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
519 <tbody>
520 <!-- Spacing -->
521 <tr>
522 <td bgcolor="#076187" height="0" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
523 </tr>
524 <!-- Spacing -->
525 <!-- Spacing -->
526 <tr>
527 <td class="desktop-spacer" height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
528 </tr>
529 <!-- Spacing -->
530 <tr>
531 <td>
532 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="660">
533 <tbody>
534 <tr>
535 <td><!-- Start of left column -->
536 <table align="left" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="330">
537 <tbody><!-- image -->
538 <tr>
539 <td align="center" class="devicewidth" height="150" valign="top" width="330"><a href="#"><img alt="" border="0" class="col2img" src="https://civicrm.org/sites/default/files/civicrm/custom/images/330x150.png" style="display:block; border:none; outline:none; text-decoration:none; display:block;" width="330" /></a></td>
540 </tr>
541 <!-- /image -->
542 </tbody>
543 </table>
544 <!-- end of left column --><!-- spacing for mobile devices-->
545
546 <table align="left" border="0" cellpadding="0" cellspacing="0" class="mobilespacing">
547 <tbody>
548 <tr>
549 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
550 </tr>
551 </tbody>
552 </table>
553 <!-- end of for mobile devices--><!-- start of right column -->
554
555 <table align="right" border="0" cellpadding="0" cellspacing="0" class="devicewidthmob" width="310">
556 <tbody>
557 <tr>
558 <td class="padding-top-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 18px;text-align:left; line-height: 24px;"><a href="#" style="color:#076187; text-decoration:none; " target="_blank">Heading Here</a><a href="#" style="color:#076187; text-decoration:none;" target="_blank" title="Google Summer of Code"></a></td>
559 </tr>
560 <!-- end of title --><!-- Spacing -->
561 <tr>
562 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
563 </tr>
564 <!-- /Spacing --><!-- content -->
565 <tr>
566 <td class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;"><span class="padding-right15" style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #7a6e67; text-align:left; line-height: 24px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
567 tempor incididunt ut labore et dolore magna </span></td>
568 </tr>
569 <tr>
570 <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; font-weight:bold; color: #333333; text-align:left;line-height: 24px; padding-top:10px;"><a href="#" style="color:#80C457;text-decoration:none;font-weight:bold;" target="_blank" title="Google Summer of Code">Read More</a></td>
571 </tr>
572 <!-- /button --><!-- end of content -->
573 </tbody>
574 </table>
575 <!-- end of right column --></td>
576 </tr>
577 </tbody>
578 </table>
579 </td>
580 </tr>
581 <!-- Spacing -->
582 <tr>
583 <td height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;" width="100%">&nbsp;</td>
584 </tr>
585 <!-- /Spacing -->
586 <tr>
587 <td style="padding: 15px;">
588 <p style="font-family: Helvetica, arial, sans-serif; font-size: 16px; color:#076187; text-align:left; line-height: 26px; padding-bottom:10px;">Remember to link the facebook and twitter links below to your pages!</p>
589 </td>
590 </tr>
591 <!-- Spacing -->
592 </tbody>
593 </table>
594 </td>
595 </tr>
596 </tbody>
597 </table>
598 </td>
599 </tr>
600 </tbody>
601 </table>
602 <!-- /story four -->
603
604 <!-- footer -->
605
606 <!-- End of footer --><!-- Start of postfooter -->
607 <table bgcolor="#d8d8d8" border="0" cellpadding="0" cellspacing="0" id="backgroundTable" st-sortable="footer" width="100%">
608 <tbody>
609 <tr>
610 <td>
611 <table align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
612 <tbody>
613 <tr>
614 <td width="100%">
615 <table align="center" bgcolor="#89c66b" border="0" cellpadding="0" cellspacing="0" class="devicewidth" width="700">
616 <tbody><!-- Spacing -->
617 <tr>
618 <td height="10" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
619 </tr>
620 <!-- Spacing -->
621 <tr>
622 <td><!-- logo -->
623 <table align="left" border="0" cellpadding="0" cellspacing="0" width="250">
624 <tbody>
625 <tr>
626 <td width="20">&nbsp;</td>
627 <td align="left" height="40" width="250"><span style="font-family: Helvetica, arial, sans-serif; font-size: 13px; text-align:left; line-height: 26px; padding-bottom:10px;"><a href="{action.unsubscribeUrl}" style="color: #f0f0f0;">Unsubscribe | </a><a href="{action.subscribeUrl}" style="color: #f0f0f0;">Subscribe |</a> <a href="{action.optOutUrl}" style="color: #f0f0f0;">Opt out</a></span></td>
628 </tr>
629 <tr>
630 <td width="20">&nbsp;</td>
631 <td align="left" height="40" width="250"><span style="font-family: Helvetica, arial, sans-serif; font-size: 13px; text-align:left; line-height: 26px; padding-bottom:10px; color: #f0f0f0;">{domain.address}</span></td>
632 </tr>
633 </tbody>
634 </table>
635 <!-- end of logo --><!-- start of social icons -->
636 <table align="right" border="0" cellpadding="0" cellspacing="0" height="40" vaalign="middle" width="60">
637 <tbody>
638 <tr>
639 <td align="left" height="22" width="22">
640 <div class="imgpop"><a href="#" target="_blank"><img alt="" border="0" height="22" src="https://civicrm.org/sites/default/files/civicrm/custom/images/facebook.png" style="display:block; border:none; outline:none; text-decoration:none;" width="22" /> </a></div> </td>
641 <td align="left" style="font-size:1px; line-height:1px;" width="10">&nbsp;</td>
642 <td align="right" height="22" width="22">
643 <div class="imgpop"><a href="#" target="_blank"><img alt="" border="0" height="22" src="https://civicrm.org/sites/default/files/civicrm/custom/images/twitter.png" style="display:block; border:none; outline:none; text-decoration:none;" width="22" /> </a></div>
644 </td>
645 <td align="left" style="font-size:1px; line-height:1px;" width="20">&nbsp;</td>
646 </tr>
647 </tbody>
648 </table>
649 <!-- end of social icons --></td>
650 </tr>
651 <!-- Spacing -->
652 <tr>
653 <td height="10" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
654 </tr>
655 <!-- Spacing -->
656 <tr>
657 <td bgcolor="#80C457" height="10" width="100%">&nbsp;</td>
658 </tr>
659 <!-- Spacing -->
660 </tbody>
661 </table>
662 </td>
663 </tr>
664 </tbody>
665 </table>
666 </td>
667 </tr>
668 </tbody>
669 </table>
670 <!-- End of footer -->
671 </body>
672 </html>