drip.html 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <meta name="viewport" content="width=device-width">
  6. <title>Title</title>
  7. <style>
  8. .wrapper {
  9. width: 100%; }
  10. #outlook a {
  11. padding: 0; }
  12. body {
  13. width: 100% !important;
  14. min-width: 100%;
  15. -webkit-text-size-adjust: 100%;
  16. -ms-text-size-adjust: 100%;
  17. margin: 0;
  18. Margin: 0;
  19. padding: 0;
  20. -moz-box-sizing: border-box;
  21. -webkit-box-sizing: border-box;
  22. box-sizing: border-box; }
  23. .ExternalClass {
  24. width: 100%; }
  25. .ExternalClass,
  26. .ExternalClass p,
  27. .ExternalClass span,
  28. .ExternalClass font,
  29. .ExternalClass td,
  30. .ExternalClass div {
  31. line-height: 100%; }
  32. #backgroundTable {
  33. margin: 0;
  34. Margin: 0;
  35. padding: 0;
  36. width: 100% !important;
  37. line-height: 100% !important; }
  38. img {
  39. outline: none;
  40. text-decoration: none;
  41. -ms-interpolation-mode: bicubic;
  42. width: auto;
  43. max-width: 100%;
  44. clear: both;
  45. display: block; }
  46. center {
  47. width: 100%;
  48. min-width: 580px; }
  49. a img {
  50. border: none; }
  51. p {
  52. margin: 0 0 0 10px;
  53. Margin: 0 0 0 10px; }
  54. table {
  55. border-spacing: 0;
  56. border-collapse: collapse; }
  57. td {
  58. word-wrap: break-word;
  59. -webkit-hyphens: auto;
  60. -moz-hyphens: auto;
  61. hyphens: auto;
  62. border-collapse: collapse !important; }
  63. table, tr, td {
  64. padding: 0;
  65. vertical-align: top;
  66. text-align: left; }
  67. @media only screen {
  68. html {
  69. min-height: 100%;
  70. background: #f3f3f3; } }
  71. table.body {
  72. background: #f3f3f3;
  73. height: 100%;
  74. width: 100%; }
  75. table.container {
  76. background: #fefefe;
  77. width: 580px;
  78. margin: 0 auto;
  79. Margin: 0 auto;
  80. text-align: inherit; }
  81. table.row {
  82. padding: 0;
  83. width: 100%;
  84. position: relative; }
  85. table.spacer {
  86. width: 100%; }
  87. table.spacer td {
  88. mso-line-height-rule: exactly; }
  89. table.container table.row {
  90. display: table; }
  91. td.columns,
  92. td.column,
  93. th.columns,
  94. th.column {
  95. margin: 0 auto;
  96. Margin: 0 auto;
  97. padding-left: 16px;
  98. padding-bottom: 16px; }
  99. td.columns .column,
  100. td.columns .columns,
  101. td.column .column,
  102. td.column .columns,
  103. th.columns .column,
  104. th.columns .columns,
  105. th.column .column,
  106. th.column .columns {
  107. padding-left: 0 !important;
  108. padding-right: 0 !important; }
  109. td.columns .column center,
  110. td.columns .columns center,
  111. td.column .column center,
  112. td.column .columns center,
  113. th.columns .column center,
  114. th.columns .columns center,
  115. th.column .column center,
  116. th.column .columns center {
  117. min-width: none !important; }
  118. td.columns.last,
  119. td.column.last,
  120. th.columns.last,
  121. th.column.last {
  122. padding-right: 16px; }
  123. td.columns table:not(.button),
  124. td.column table:not(.button),
  125. th.columns table:not(.button),
  126. th.column table:not(.button) {
  127. width: 100%; }
  128. td.large-1,
  129. th.large-1 {
  130. width: 32.33333px;
  131. padding-left: 8px;
  132. padding-right: 8px; }
  133. td.large-1.first,
  134. th.large-1.first {
  135. padding-left: 16px; }
  136. td.large-1.last,
  137. th.large-1.last {
  138. padding-right: 16px; }
  139. .collapse > tbody > tr > td.large-1,
  140. .collapse > tbody > tr > th.large-1 {
  141. padding-right: 0;
  142. padding-left: 0;
  143. width: 48.33333px; }
  144. .collapse td.large-1.first,
  145. .collapse th.large-1.first,
  146. .collapse td.large-1.last,
  147. .collapse th.large-1.last {
  148. width: 56.33333px; }
  149. td.large-1 center,
  150. th.large-1 center {
  151. min-width: 0.33333px; }
  152. .body .columns td.large-1,
  153. .body .column td.large-1,
  154. .body .columns th.large-1,
  155. .body .column th.large-1 {
  156. width: 8.33333%; }
  157. td.large-2,
  158. th.large-2 {
  159. width: 80.66667px;
  160. padding-left: 8px;
  161. padding-right: 8px; }
  162. td.large-2.first,
  163. th.large-2.first {
  164. padding-left: 16px; }
  165. td.large-2.last,
  166. th.large-2.last {
  167. padding-right: 16px; }
  168. .collapse > tbody > tr > td.large-2,
  169. .collapse > tbody > tr > th.large-2 {
  170. padding-right: 0;
  171. padding-left: 0;
  172. width: 96.66667px; }
  173. .collapse td.large-2.first,
  174. .collapse th.large-2.first,
  175. .collapse td.large-2.last,
  176. .collapse th.large-2.last {
  177. width: 104.66667px; }
  178. td.large-2 center,
  179. th.large-2 center {
  180. min-width: 48.66667px; }
  181. .body .columns td.large-2,
  182. .body .column td.large-2,
  183. .body .columns th.large-2,
  184. .body .column th.large-2 {
  185. width: 16.66667%; }
  186. td.large-3,
  187. th.large-3 {
  188. width: 129px;
  189. padding-left: 8px;
  190. padding-right: 8px; }
  191. td.large-3.first,
  192. th.large-3.first {
  193. padding-left: 16px; }
  194. td.large-3.last,
  195. th.large-3.last {
  196. padding-right: 16px; }
  197. .collapse > tbody > tr > td.large-3,
  198. .collapse > tbody > tr > th.large-3 {
  199. padding-right: 0;
  200. padding-left: 0;
  201. width: 145px; }
  202. .collapse td.large-3.first,
  203. .collapse th.large-3.first,
  204. .collapse td.large-3.last,
  205. .collapse th.large-3.last {
  206. width: 153px; }
  207. td.large-3 center,
  208. th.large-3 center {
  209. min-width: 97px; }
  210. .body .columns td.large-3,
  211. .body .column td.large-3,
  212. .body .columns th.large-3,
  213. .body .column th.large-3 {
  214. width: 25%; }
  215. td.large-4,
  216. th.large-4 {
  217. width: 177.33333px;
  218. padding-left: 8px;
  219. padding-right: 8px; }
  220. td.large-4.first,
  221. th.large-4.first {
  222. padding-left: 16px; }
  223. td.large-4.last,
  224. th.large-4.last {
  225. padding-right: 16px; }
  226. .collapse > tbody > tr > td.large-4,
  227. .collapse > tbody > tr > th.large-4 {
  228. padding-right: 0;
  229. padding-left: 0;
  230. width: 193.33333px; }
  231. .collapse td.large-4.first,
  232. .collapse th.large-4.first,
  233. .collapse td.large-4.last,
  234. .collapse th.large-4.last {
  235. width: 201.33333px; }
  236. td.large-4 center,
  237. th.large-4 center {
  238. min-width: 145.33333px; }
  239. .body .columns td.large-4,
  240. .body .column td.large-4,
  241. .body .columns th.large-4,
  242. .body .column th.large-4 {
  243. width: 33.33333%; }
  244. td.large-5,
  245. th.large-5 {
  246. width: 225.66667px;
  247. padding-left: 8px;
  248. padding-right: 8px; }
  249. td.large-5.first,
  250. th.large-5.first {
  251. padding-left: 16px; }
  252. td.large-5.last,
  253. th.large-5.last {
  254. padding-right: 16px; }
  255. .collapse > tbody > tr > td.large-5,
  256. .collapse > tbody > tr > th.large-5 {
  257. padding-right: 0;
  258. padding-left: 0;
  259. width: 241.66667px; }
  260. .collapse td.large-5.first,
  261. .collapse th.large-5.first,
  262. .collapse td.large-5.last,
  263. .collapse th.large-5.last {
  264. width: 249.66667px; }
  265. td.large-5 center,
  266. th.large-5 center {
  267. min-width: 193.66667px; }
  268. .body .columns td.large-5,
  269. .body .column td.large-5,
  270. .body .columns th.large-5,
  271. .body .column th.large-5 {
  272. width: 41.66667%; }
  273. td.large-6,
  274. th.large-6 {
  275. width: 274px;
  276. padding-left: 8px;
  277. padding-right: 8px; }
  278. td.large-6.first,
  279. th.large-6.first {
  280. padding-left: 16px; }
  281. td.large-6.last,
  282. th.large-6.last {
  283. padding-right: 16px; }
  284. .collapse > tbody > tr > td.large-6,
  285. .collapse > tbody > tr > th.large-6 {
  286. padding-right: 0;
  287. padding-left: 0;
  288. width: 290px; }
  289. .collapse td.large-6.first,
  290. .collapse th.large-6.first,
  291. .collapse td.large-6.last,
  292. .collapse th.large-6.last {
  293. width: 298px; }
  294. td.large-6 center,
  295. th.large-6 center {
  296. min-width: 242px; }
  297. .body .columns td.large-6,
  298. .body .column td.large-6,
  299. .body .columns th.large-6,
  300. .body .column th.large-6 {
  301. width: 50%; }
  302. td.large-7,
  303. th.large-7 {
  304. width: 322.33333px;
  305. padding-left: 8px;
  306. padding-right: 8px; }
  307. td.large-7.first,
  308. th.large-7.first {
  309. padding-left: 16px; }
  310. td.large-7.last,
  311. th.large-7.last {
  312. padding-right: 16px; }
  313. .collapse > tbody > tr > td.large-7,
  314. .collapse > tbody > tr > th.large-7 {
  315. padding-right: 0;
  316. padding-left: 0;
  317. width: 338.33333px; }
  318. .collapse td.large-7.first,
  319. .collapse th.large-7.first,
  320. .collapse td.large-7.last,
  321. .collapse th.large-7.last {
  322. width: 346.33333px; }
  323. td.large-7 center,
  324. th.large-7 center {
  325. min-width: 290.33333px; }
  326. .body .columns td.large-7,
  327. .body .column td.large-7,
  328. .body .columns th.large-7,
  329. .body .column th.large-7 {
  330. width: 58.33333%; }
  331. td.large-8,
  332. th.large-8 {
  333. width: 370.66667px;
  334. padding-left: 8px;
  335. padding-right: 8px; }
  336. td.large-8.first,
  337. th.large-8.first {
  338. padding-left: 16px; }
  339. td.large-8.last,
  340. th.large-8.last {
  341. padding-right: 16px; }
  342. .collapse > tbody > tr > td.large-8,
  343. .collapse > tbody > tr > th.large-8 {
  344. padding-right: 0;
  345. padding-left: 0;
  346. width: 386.66667px; }
  347. .collapse td.large-8.first,
  348. .collapse th.large-8.first,
  349. .collapse td.large-8.last,
  350. .collapse th.large-8.last {
  351. width: 394.66667px; }
  352. td.large-8 center,
  353. th.large-8 center {
  354. min-width: 338.66667px; }
  355. .body .columns td.large-8,
  356. .body .column td.large-8,
  357. .body .columns th.large-8,
  358. .body .column th.large-8 {
  359. width: 66.66667%; }
  360. td.large-9,
  361. th.large-9 {
  362. width: 419px;
  363. padding-left: 8px;
  364. padding-right: 8px; }
  365. td.large-9.first,
  366. th.large-9.first {
  367. padding-left: 16px; }
  368. td.large-9.last,
  369. th.large-9.last {
  370. padding-right: 16px; }
  371. .collapse > tbody > tr > td.large-9,
  372. .collapse > tbody > tr > th.large-9 {
  373. padding-right: 0;
  374. padding-left: 0;
  375. width: 435px; }
  376. .collapse td.large-9.first,
  377. .collapse th.large-9.first,
  378. .collapse td.large-9.last,
  379. .collapse th.large-9.last {
  380. width: 443px; }
  381. td.large-9 center,
  382. th.large-9 center {
  383. min-width: 387px; }
  384. .body .columns td.large-9,
  385. .body .column td.large-9,
  386. .body .columns th.large-9,
  387. .body .column th.large-9 {
  388. width: 75%; }
  389. td.large-10,
  390. th.large-10 {
  391. width: 467.33333px;
  392. padding-left: 8px;
  393. padding-right: 8px; }
  394. td.large-10.first,
  395. th.large-10.first {
  396. padding-left: 16px; }
  397. td.large-10.last,
  398. th.large-10.last {
  399. padding-right: 16px; }
  400. .collapse > tbody > tr > td.large-10,
  401. .collapse > tbody > tr > th.large-10 {
  402. padding-right: 0;
  403. padding-left: 0;
  404. width: 483.33333px; }
  405. .collapse td.large-10.first,
  406. .collapse th.large-10.first,
  407. .collapse td.large-10.last,
  408. .collapse th.large-10.last {
  409. width: 491.33333px; }
  410. td.large-10 center,
  411. th.large-10 center {
  412. min-width: 435.33333px; }
  413. .body .columns td.large-10,
  414. .body .column td.large-10,
  415. .body .columns th.large-10,
  416. .body .column th.large-10 {
  417. width: 83.33333%; }
  418. td.large-11,
  419. th.large-11 {
  420. width: 515.66667px;
  421. padding-left: 8px;
  422. padding-right: 8px; }
  423. td.large-11.first,
  424. th.large-11.first {
  425. padding-left: 16px; }
  426. td.large-11.last,
  427. th.large-11.last {
  428. padding-right: 16px; }
  429. .collapse > tbody > tr > td.large-11,
  430. .collapse > tbody > tr > th.large-11 {
  431. padding-right: 0;
  432. padding-left: 0;
  433. width: 531.66667px; }
  434. .collapse td.large-11.first,
  435. .collapse th.large-11.first,
  436. .collapse td.large-11.last,
  437. .collapse th.large-11.last {
  438. width: 539.66667px; }
  439. td.large-11 center,
  440. th.large-11 center {
  441. min-width: 483.66667px; }
  442. .body .columns td.large-11,
  443. .body .column td.large-11,
  444. .body .columns th.large-11,
  445. .body .column th.large-11 {
  446. width: 91.66667%; }
  447. td.large-12,
  448. th.large-12 {
  449. width: 564px;
  450. padding-left: 8px;
  451. padding-right: 8px; }
  452. td.large-12.first,
  453. th.large-12.first {
  454. padding-left: 16px; }
  455. td.large-12.last,
  456. th.large-12.last {
  457. padding-right: 16px; }
  458. .collapse > tbody > tr > td.large-12,
  459. .collapse > tbody > tr > th.large-12 {
  460. padding-right: 0;
  461. padding-left: 0;
  462. width: 580px; }
  463. .collapse td.large-12.first,
  464. .collapse th.large-12.first,
  465. .collapse td.large-12.last,
  466. .collapse th.large-12.last {
  467. width: 588px; }
  468. td.large-12 center,
  469. th.large-12 center {
  470. min-width: 532px; }
  471. .body .columns td.large-12,
  472. .body .column td.large-12,
  473. .body .columns th.large-12,
  474. .body .column th.large-12 {
  475. width: 100%; }
  476. td.large-offset-1,
  477. td.large-offset-1.first,
  478. td.large-offset-1.last,
  479. th.large-offset-1,
  480. th.large-offset-1.first,
  481. th.large-offset-1.last {
  482. padding-left: 64.33333px; }
  483. td.large-offset-2,
  484. td.large-offset-2.first,
  485. td.large-offset-2.last,
  486. th.large-offset-2,
  487. th.large-offset-2.first,
  488. th.large-offset-2.last {
  489. padding-left: 112.66667px; }
  490. td.large-offset-3,
  491. td.large-offset-3.first,
  492. td.large-offset-3.last,
  493. th.large-offset-3,
  494. th.large-offset-3.first,
  495. th.large-offset-3.last {
  496. padding-left: 161px; }
  497. td.large-offset-4,
  498. td.large-offset-4.first,
  499. td.large-offset-4.last,
  500. th.large-offset-4,
  501. th.large-offset-4.first,
  502. th.large-offset-4.last {
  503. padding-left: 209.33333px; }
  504. td.large-offset-5,
  505. td.large-offset-5.first,
  506. td.large-offset-5.last,
  507. th.large-offset-5,
  508. th.large-offset-5.first,
  509. th.large-offset-5.last {
  510. padding-left: 257.66667px; }
  511. td.large-offset-6,
  512. td.large-offset-6.first,
  513. td.large-offset-6.last,
  514. th.large-offset-6,
  515. th.large-offset-6.first,
  516. th.large-offset-6.last {
  517. padding-left: 306px; }
  518. td.large-offset-7,
  519. td.large-offset-7.first,
  520. td.large-offset-7.last,
  521. th.large-offset-7,
  522. th.large-offset-7.first,
  523. th.large-offset-7.last {
  524. padding-left: 354.33333px; }
  525. td.large-offset-8,
  526. td.large-offset-8.first,
  527. td.large-offset-8.last,
  528. th.large-offset-8,
  529. th.large-offset-8.first,
  530. th.large-offset-8.last {
  531. padding-left: 402.66667px; }
  532. td.large-offset-9,
  533. td.large-offset-9.first,
  534. td.large-offset-9.last,
  535. th.large-offset-9,
  536. th.large-offset-9.first,
  537. th.large-offset-9.last {
  538. padding-left: 451px; }
  539. td.large-offset-10,
  540. td.large-offset-10.first,
  541. td.large-offset-10.last,
  542. th.large-offset-10,
  543. th.large-offset-10.first,
  544. th.large-offset-10.last {
  545. padding-left: 499.33333px; }
  546. td.large-offset-11,
  547. td.large-offset-11.first,
  548. td.large-offset-11.last,
  549. th.large-offset-11,
  550. th.large-offset-11.first,
  551. th.large-offset-11.last {
  552. padding-left: 547.66667px; }
  553. td.expander,
  554. th.expander {
  555. visibility: hidden;
  556. width: 0;
  557. padding: 0 !important; }
  558. table.container.radius {
  559. border-radius: 0;
  560. border-collapse: separate; }
  561. .block-grid {
  562. width: 100%;
  563. max-width: 580px; }
  564. .block-grid td {
  565. display: inline-block;
  566. padding: 8px; }
  567. .up-2 td {
  568. width: 274px !important; }
  569. .up-3 td {
  570. width: 177px !important; }
  571. .up-4 td {
  572. width: 129px !important; }
  573. .up-5 td {
  574. width: 100px !important; }
  575. .up-6 td {
  576. width: 80px !important; }
  577. .up-7 td {
  578. width: 66px !important; }
  579. .up-8 td {
  580. width: 56px !important; }
  581. table.text-center,
  582. th.text-center,
  583. td.text-center,
  584. h1.text-center,
  585. h2.text-center,
  586. h3.text-center,
  587. h4.text-center,
  588. h5.text-center,
  589. h6.text-center,
  590. p.text-center,
  591. span.text-center {
  592. text-align: center; }
  593. table.text-left,
  594. th.text-left,
  595. td.text-left,
  596. h1.text-left,
  597. h2.text-left,
  598. h3.text-left,
  599. h4.text-left,
  600. h5.text-left,
  601. h6.text-left,
  602. p.text-left,
  603. span.text-left {
  604. text-align: left; }
  605. table.text-right,
  606. th.text-right,
  607. td.text-right,
  608. h1.text-right,
  609. h2.text-right,
  610. h3.text-right,
  611. h4.text-right,
  612. h5.text-right,
  613. h6.text-right,
  614. p.text-right,
  615. span.text-right {
  616. text-align: right; }
  617. span.text-center {
  618. display: block;
  619. width: 100%;
  620. text-align: center; }
  621. @media only screen and (max-width: 596px) {
  622. .small-float-center {
  623. margin: 0 auto !important;
  624. float: none !important;
  625. text-align: center !important; }
  626. .small-text-center {
  627. text-align: center !important; }
  628. .small-text-left {
  629. text-align: left !important; }
  630. .small-text-right {
  631. text-align: right !important; } }
  632. img.float-left {
  633. float: left;
  634. text-align: left; }
  635. img.float-right {
  636. float: right;
  637. text-align: right; }
  638. img.float-center,
  639. img.text-center {
  640. margin: 0 auto;
  641. Margin: 0 auto;
  642. float: none;
  643. text-align: center; }
  644. table.float-center,
  645. td.float-center,
  646. th.float-center {
  647. margin: 0 auto;
  648. Margin: 0 auto;
  649. float: none;
  650. text-align: center; }
  651. .hide-for-large {
  652. display: none !important;
  653. mso-hide: all;
  654. overflow: hidden;
  655. max-height: 0;
  656. font-size: 0;
  657. width: 0;
  658. line-height: 0; }
  659. @media only screen and (max-width: 596px) {
  660. .hide-for-large {
  661. display: block !important;
  662. width: auto !important;
  663. overflow: visible !important;
  664. max-height: none !important;
  665. font-size: inherit !important;
  666. line-height: inherit !important; } }
  667. table.body table.container .hide-for-large * {
  668. mso-hide: all; }
  669. @media only screen and (max-width: 596px) {
  670. table.body table.container .hide-for-large,
  671. table.body table.container .row.hide-for-large {
  672. display: table !important;
  673. width: 100% !important; } }
  674. @media only screen and (max-width: 596px) {
  675. table.body table.container .callout-inner.hide-for-large {
  676. display: table-cell !important;
  677. width: 100% !important; } }
  678. @media only screen and (max-width: 596px) {
  679. table.body table.container .show-for-large {
  680. display: none !important;
  681. width: 0;
  682. mso-hide: all;
  683. overflow: hidden; } }
  684. body,
  685. table.body,
  686. h1,
  687. h2,
  688. h3,
  689. h4,
  690. h5,
  691. h6,
  692. p,
  693. td,
  694. th,
  695. a {
  696. color: #0a0a0a;
  697. font-family: Helvetica, Arial, sans-serif;
  698. font-weight: normal;
  699. padding: 0;
  700. margin: 0;
  701. Margin: 0;
  702. text-align: left;
  703. line-height: 1.3; }
  704. h1,
  705. h2,
  706. h3,
  707. h4,
  708. h5,
  709. h6 {
  710. color: inherit;
  711. word-wrap: normal;
  712. font-family: Helvetica, Arial, sans-serif;
  713. font-weight: normal;
  714. margin-bottom: 10px;
  715. Margin-bottom: 10px; }
  716. h1 {
  717. font-size: 34px; }
  718. h2 {
  719. font-size: 30px; }
  720. h3 {
  721. font-size: 28px; }
  722. h4 {
  723. font-size: 24px; }
  724. h5 {
  725. font-size: 20px; }
  726. h6 {
  727. font-size: 18px; }
  728. body,
  729. table.body,
  730. p,
  731. td,
  732. th {
  733. font-size: 16px;
  734. line-height: 1.3; }
  735. p {
  736. margin-bottom: 10px;
  737. Margin-bottom: 10px; }
  738. p.lead {
  739. font-size: 20px;
  740. line-height: 1.6; }
  741. p.subheader {
  742. margin-top: 4px;
  743. margin-bottom: 8px;
  744. Margin-top: 4px;
  745. Margin-bottom: 8px;
  746. font-weight: normal;
  747. line-height: 1.4;
  748. color: #8a8a8a; }
  749. small {
  750. font-size: 80%;
  751. color: #cacaca; }
  752. a {
  753. color: #2199e8;
  754. text-decoration: none; }
  755. a:hover {
  756. color: #147dc2; }
  757. a:active {
  758. color: #147dc2; }
  759. a:visited {
  760. color: #2199e8; }
  761. h1 a,
  762. h1 a:visited,
  763. h2 a,
  764. h2 a:visited,
  765. h3 a,
  766. h3 a:visited,
  767. h4 a,
  768. h4 a:visited,
  769. h5 a,
  770. h5 a:visited,
  771. h6 a,
  772. h6 a:visited {
  773. color: #2199e8; }
  774. pre {
  775. background: #f3f3f3;
  776. margin: 30px 0;
  777. Margin: 30px 0; }
  778. pre code {
  779. color: #cacaca; }
  780. pre code span.callout {
  781. color: #8a8a8a;
  782. font-weight: bold; }
  783. pre code span.callout-strong {
  784. color: #ff6908;
  785. font-weight: bold; }
  786. table.hr {
  787. width: 100%; }
  788. table.hr th {
  789. height: 0;
  790. max-width: 580px;
  791. border-top: 0;
  792. border-right: 0;
  793. border-bottom: 1px solid #0a0a0a;
  794. border-left: 0;
  795. margin: 20px auto;
  796. Margin: 20px auto;
  797. clear: both; }
  798. .stat {
  799. font-size: 40px;
  800. line-height: 1; }
  801. p + .stat {
  802. margin-top: -16px;
  803. Margin-top: -16px; }
  804. span.preheader {
  805. display: none !important;
  806. visibility: hidden;
  807. mso-hide: all !important;
  808. font-size: 1px;
  809. color: #f3f3f3;
  810. line-height: 1px;
  811. max-height: 0px;
  812. max-width: 0px;
  813. opacity: 0;
  814. overflow: hidden; }
  815. table.button {
  816. width: auto;
  817. margin: 0 0 16px 0;
  818. Margin: 0 0 16px 0; }
  819. table.button table td {
  820. text-align: left;
  821. color: #fefefe;
  822. background: #2199e8;
  823. border: 2px solid #2199e8; }
  824. table.button table td a {
  825. font-family: Helvetica, Arial, sans-serif;
  826. font-size: 16px;
  827. font-weight: bold;
  828. color: #fefefe;
  829. text-decoration: none;
  830. display: inline-block;
  831. padding: 8px 16px 8px 16px;
  832. border: 0 solid #2199e8;
  833. border-radius: 3px; }
  834. table.button.radius table td {
  835. border-radius: 3px;
  836. border: none; }
  837. table.button.rounded table td {
  838. border-radius: 500px;
  839. border: none; }
  840. table.button:hover table tr td a,
  841. table.button:active table tr td a,
  842. table.button table tr td a:visited,
  843. table.button.tiny:hover table tr td a,
  844. table.button.tiny:active table tr td a,
  845. table.button.tiny table tr td a:visited,
  846. table.button.small:hover table tr td a,
  847. table.button.small:active table tr td a,
  848. table.button.small table tr td a:visited,
  849. table.button.large:hover table tr td a,
  850. table.button.large:active table tr td a,
  851. table.button.large table tr td a:visited {
  852. color: #fefefe; }
  853. table.button.tiny table td,
  854. table.button.tiny table a {
  855. padding: 4px 8px 4px 8px; }
  856. table.button.tiny table a {
  857. font-size: 10px;
  858. font-weight: normal; }
  859. table.button.small table td,
  860. table.button.small table a {
  861. padding: 5px 10px 5px 10px;
  862. font-size: 12px; }
  863. table.button.large table a {
  864. padding: 10px 20px 10px 20px;
  865. font-size: 20px; }
  866. table.button.expand,
  867. table.button.expanded {
  868. width: 100% !important; }
  869. table.button.expand table,
  870. table.button.expanded table {
  871. width: 100%; }
  872. table.button.expand table a,
  873. table.button.expanded table a {
  874. text-align: center;
  875. width: 100%;
  876. padding-left: 0;
  877. padding-right: 0; }
  878. table.button.expand center,
  879. table.button.expanded center {
  880. min-width: 0; }
  881. table.button:hover table td,
  882. table.button:visited table td,
  883. table.button:active table td {
  884. background: #147dc2;
  885. color: #fefefe; }
  886. table.button:hover table a,
  887. table.button:visited table a,
  888. table.button:active table a {
  889. border: 0 solid #147dc2; }
  890. table.button.secondary table td {
  891. background: #777777;
  892. color: #fefefe;
  893. border: 0px solid #777777; }
  894. table.button.secondary table a {
  895. color: #fefefe;
  896. border: 0 solid #777777; }
  897. table.button.secondary:hover table td {
  898. background: #919191;
  899. color: #fefefe; }
  900. table.button.secondary:hover table a {
  901. border: 0 solid #919191; }
  902. table.button.secondary:hover table td a {
  903. color: #fefefe; }
  904. table.button.secondary:active table td a {
  905. color: #fefefe; }
  906. table.button.secondary table td a:visited {
  907. color: #fefefe; }
  908. table.button.success table td {
  909. background: #3adb76;
  910. border: 0px solid #3adb76; }
  911. table.button.success table a {
  912. border: 0 solid #3adb76; }
  913. table.button.success:hover table td {
  914. background: #23bf5d; }
  915. table.button.success:hover table a {
  916. border: 0 solid #23bf5d; }
  917. table.button.alert table td {
  918. background: #ec5840;
  919. border: 0px solid #ec5840; }
  920. table.button.alert table a {
  921. border: 0 solid #ec5840; }
  922. table.button.alert:hover table td {
  923. background: #e23317; }
  924. table.button.alert:hover table a {
  925. border: 0 solid #e23317; }
  926. table.button.warning table td {
  927. background: #ffae00;
  928. border: 0px solid #ffae00; }
  929. table.button.warning table a {
  930. border: 0px solid #ffae00; }
  931. table.button.warning:hover table td {
  932. background: #cc8b00; }
  933. table.button.warning:hover table a {
  934. border: 0px solid #cc8b00; }
  935. table.callout {
  936. margin-bottom: 16px;
  937. Margin-bottom: 16px; }
  938. th.callout-inner {
  939. width: 100%;
  940. border: 1px solid #cbcbcb;
  941. padding: 10px;
  942. background: #fefefe; }
  943. th.callout-inner.primary {
  944. background: #def0fc;
  945. border: 1px solid #444444;
  946. color: #0a0a0a; }
  947. th.callout-inner.secondary {
  948. background: #ebebeb;
  949. border: 1px solid #444444;
  950. color: #0a0a0a; }
  951. th.callout-inner.success {
  952. background: #e1faea;
  953. border: 1px solid #1b9448;
  954. color: #fefefe; }
  955. th.callout-inner.warning {
  956. background: #fff3d9;
  957. border: 1px solid #996800;
  958. color: #fefefe; }
  959. th.callout-inner.alert {
  960. background: #fce6e2;
  961. border: 1px solid #b42912;
  962. color: #fefefe; }
  963. .thumbnail {
  964. border: solid 4px #fefefe;
  965. box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2);
  966. display: inline-block;
  967. line-height: 0;
  968. max-width: 100%;
  969. transition: box-shadow 200ms ease-out;
  970. border-radius: 3px;
  971. margin-bottom: 16px; }
  972. .thumbnail:hover, .thumbnail:focus {
  973. box-shadow: 0 0 6px 1px rgba(33, 153, 232, 0.5); }
  974. table.menu {
  975. width: 580px; }
  976. table.menu td.menu-item,
  977. table.menu th.menu-item {
  978. padding: 10px;
  979. padding-right: 10px; }
  980. table.menu td.menu-item a,
  981. table.menu th.menu-item a {
  982. color: #2199e8; }
  983. table.menu.vertical td.menu-item,
  984. table.menu.vertical th.menu-item {
  985. padding: 10px;
  986. padding-right: 0;
  987. display: block; }
  988. table.menu.vertical td.menu-item a,
  989. table.menu.vertical th.menu-item a {
  990. width: 100%; }
  991. table.menu.vertical td.menu-item table.menu.vertical td.menu-item,
  992. table.menu.vertical td.menu-item table.menu.vertical th.menu-item,
  993. table.menu.vertical th.menu-item table.menu.vertical td.menu-item,
  994. table.menu.vertical th.menu-item table.menu.vertical th.menu-item {
  995. padding-left: 10px; }
  996. table.menu.text-center a {
  997. text-align: center; }
  998. .menu[align="center"] {
  999. width: auto !important; }
  1000. body.outlook p {
  1001. display: inline !important; }
  1002. @media only screen and (max-width: 596px) {
  1003. table.body img {
  1004. width: auto;
  1005. height: auto; }
  1006. table.body center {
  1007. min-width: 0 !important; }
  1008. table.body .container {
  1009. width: 95% !important; }
  1010. table.body .columns,
  1011. table.body .column {
  1012. height: auto !important;
  1013. -moz-box-sizing: border-box;
  1014. -webkit-box-sizing: border-box;
  1015. box-sizing: border-box;
  1016. padding-left: 16px !important;
  1017. padding-right: 16px !important; }
  1018. table.body .columns .column,
  1019. table.body .columns .columns,
  1020. table.body .column .column,
  1021. table.body .column .columns {
  1022. padding-left: 0 !important;
  1023. padding-right: 0 !important; }
  1024. table.body .collapse .columns,
  1025. table.body .collapse .column {
  1026. padding-left: 0 !important;
  1027. padding-right: 0 !important; }
  1028. td.small-1,
  1029. th.small-1 {
  1030. display: inline-block !important;
  1031. width: 8.33333% !important; }
  1032. td.small-2,
  1033. th.small-2 {
  1034. display: inline-block !important;
  1035. width: 16.66667% !important; }
  1036. td.small-3,
  1037. th.small-3 {
  1038. display: inline-block !important;
  1039. width: 25% !important; }
  1040. td.small-4,
  1041. th.small-4 {
  1042. display: inline-block !important;
  1043. width: 33.33333% !important; }
  1044. td.small-5,
  1045. th.small-5 {
  1046. display: inline-block !important;
  1047. width: 41.66667% !important; }
  1048. td.small-6,
  1049. th.small-6 {
  1050. display: inline-block !important;
  1051. width: 50% !important; }
  1052. td.small-7,
  1053. th.small-7 {
  1054. display: inline-block !important;
  1055. width: 58.33333% !important; }
  1056. td.small-8,
  1057. th.small-8 {
  1058. display: inline-block !important;
  1059. width: 66.66667% !important; }
  1060. td.small-9,
  1061. th.small-9 {
  1062. display: inline-block !important;
  1063. width: 75% !important; }
  1064. td.small-10,
  1065. th.small-10 {
  1066. display: inline-block !important;
  1067. width: 83.33333% !important; }
  1068. td.small-11,
  1069. th.small-11 {
  1070. display: inline-block !important;
  1071. width: 91.66667% !important; }
  1072. td.small-12,
  1073. th.small-12 {
  1074. display: inline-block !important;
  1075. width: 100% !important; }
  1076. .columns td.small-12,
  1077. .column td.small-12,
  1078. .columns th.small-12,
  1079. .column th.small-12 {
  1080. display: block !important;
  1081. width: 100% !important; }
  1082. table.body td.small-offset-1,
  1083. table.body th.small-offset-1 {
  1084. margin-left: 8.33333% !important;
  1085. Margin-left: 8.33333% !important; }
  1086. table.body td.small-offset-2,
  1087. table.body th.small-offset-2 {
  1088. margin-left: 16.66667% !important;
  1089. Margin-left: 16.66667% !important; }
  1090. table.body td.small-offset-3,
  1091. table.body th.small-offset-3 {
  1092. margin-left: 25% !important;
  1093. Margin-left: 25% !important; }
  1094. table.body td.small-offset-4,
  1095. table.body th.small-offset-4 {
  1096. margin-left: 33.33333% !important;
  1097. Margin-left: 33.33333% !important; }
  1098. table.body td.small-offset-5,
  1099. table.body th.small-offset-5 {
  1100. margin-left: 41.66667% !important;
  1101. Margin-left: 41.66667% !important; }
  1102. table.body td.small-offset-6,
  1103. table.body th.small-offset-6 {
  1104. margin-left: 50% !important;
  1105. Margin-left: 50% !important; }
  1106. table.body td.small-offset-7,
  1107. table.body th.small-offset-7 {
  1108. margin-left: 58.33333% !important;
  1109. Margin-left: 58.33333% !important; }
  1110. table.body td.small-offset-8,
  1111. table.body th.small-offset-8 {
  1112. margin-left: 66.66667% !important;
  1113. Margin-left: 66.66667% !important; }
  1114. table.body td.small-offset-9,
  1115. table.body th.small-offset-9 {
  1116. margin-left: 75% !important;
  1117. Margin-left: 75% !important; }
  1118. table.body td.small-offset-10,
  1119. table.body th.small-offset-10 {
  1120. margin-left: 83.33333% !important;
  1121. Margin-left: 83.33333% !important; }
  1122. table.body td.small-offset-11,
  1123. table.body th.small-offset-11 {
  1124. margin-left: 91.66667% !important;
  1125. Margin-left: 91.66667% !important; }
  1126. table.body table.columns td.expander,
  1127. table.body table.columns th.expander {
  1128. display: none !important; }
  1129. table.body .right-text-pad,
  1130. table.body .text-pad-right {
  1131. padding-left: 10px !important; }
  1132. table.body .left-text-pad,
  1133. table.body .text-pad-left {
  1134. padding-right: 10px !important; }
  1135. table.menu {
  1136. width: 100% !important; }
  1137. table.menu td,
  1138. table.menu th {
  1139. width: auto !important;
  1140. display: inline-block !important; }
  1141. table.menu.vertical td,
  1142. table.menu.vertical th, table.menu.small-vertical td,
  1143. table.menu.small-vertical th {
  1144. display: block !important; }
  1145. table.menu[align="center"] {
  1146. width: auto !important; }
  1147. table.button.small-expand,
  1148. table.button.small-expanded {
  1149. width: 100% !important; }
  1150. table.button.small-expand table,
  1151. table.button.small-expanded table {
  1152. width: 100%; }
  1153. table.button.small-expand table a,
  1154. table.button.small-expanded table a {
  1155. text-align: center !important;
  1156. width: 100% !important;
  1157. padding-left: 0 !important;
  1158. padding-right: 0 !important; }
  1159. table.button.small-expand center,
  1160. table.button.small-expanded center {
  1161. min-width: 0; } }
  1162. </style>
  1163. <style>
  1164. body,
  1165. html,
  1166. .body {
  1167. background: #f3f3f3 !important;
  1168. }
  1169. .container.header {
  1170. background: #f3f3f3;
  1171. }
  1172. .body-drip {
  1173. border-top: 8px solid #663399;
  1174. }
  1175. </style>
  1176. </head>
  1177. <body>
  1178. <!-- <style> -->
  1179. <table class="body" data-made-with-foundation="">
  1180. <tr>
  1181. <td class="float-center" align="center" valign="top">
  1182. <center data-parsed="">
  1183. <table class="spacer float-center">
  1184. <tbody>
  1185. <tr>
  1186. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1187. </tr>
  1188. </tbody>
  1189. </table>
  1190. <table align="center" class="container header float-center">
  1191. <tbody>
  1192. <tr>
  1193. <td>
  1194. <table class="row collapse">
  1195. <tbody>
  1196. <tr>
  1197. <th class="small-12 large-12 columns first last">
  1198. <table>
  1199. <tr>
  1200. <th> <img src="http://placehold.it/150x30/663399" alt=""> </th>
  1201. <th class="expander"></th>
  1202. </tr>
  1203. </table>
  1204. </th>
  1205. </tr>
  1206. </tbody>
  1207. </table>
  1208. </td>
  1209. </tr>
  1210. </tbody>
  1211. </table>
  1212. <table align="center" class="container body-drip float-center">
  1213. <tbody>
  1214. <tr>
  1215. <td>
  1216. <table class="spacer">
  1217. <tbody>
  1218. <tr>
  1219. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1220. </tr>
  1221. </tbody>
  1222. </table>
  1223. <center data-parsed=""> <img src="http://placehold.it/120/663399" alt="" align="center" class="float-center"> </center>
  1224. <table class="spacer">
  1225. <tbody>
  1226. <tr>
  1227. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1228. </tr>
  1229. </tbody>
  1230. </table>
  1231. <table class="row">
  1232. <tbody>
  1233. <tr>
  1234. <th class="small-12 large-12 columns first last">
  1235. <table>
  1236. <tr>
  1237. <th>
  1238. <h4 class="text-center">Responsive Emails</h4>
  1239. <p class="text-center">15 sections | 567 Min</p>
  1240. </th>
  1241. <th class="expander"></th>
  1242. </tr>
  1243. </table>
  1244. </th>
  1245. </tr>
  1246. </tbody>
  1247. </table>
  1248. <hr>
  1249. <table class="row">
  1250. <tbody>
  1251. <tr>
  1252. <th class="small-12 large-12 columns first last">
  1253. <table>
  1254. <tr>
  1255. <th>
  1256. <p class="text-center">Hey you! It's you! Just a heads up, we just added this hot new class that will teach you how to NOT be a lame as a duck. Not the metaphorical lame duck, either, but a real duck that was actually lame, maybe from stepping
  1257. on a land mine or something. Anyways, Foundation for Emails makes coding HTML emails like calling the Navy SEALS to invade a Pre-school, with pre-schoolers, armed with Crayolas.</p>
  1258. <center data-parsed="">
  1259. <table class="button success float-center">
  1260. <tr>
  1261. <td>
  1262. <table>
  1263. <tr>
  1264. <td><a href="#">Get smarter now &rarrtl;</a></td>
  1265. </tr>
  1266. </table>
  1267. </td>
  1268. </tr>
  1269. </table>
  1270. </center>
  1271. </th>
  1272. <th class="expander"></th>
  1273. </tr>
  1274. </table>
  1275. </th>
  1276. </tr>
  1277. </tbody>
  1278. </table>
  1279. <table class="row collapsed footer">
  1280. <tbody>
  1281. <tr>
  1282. <th class="small-12 large-12 columns first last">
  1283. <table>
  1284. <tr>
  1285. <th>
  1286. <table class="spacer">
  1287. <tbody>
  1288. <tr>
  1289. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1290. </tr>
  1291. </tbody>
  1292. </table>
  1293. <p class="text-center">@copywrite nobody<br> <a href="#">hello@nocopywrite.com</a> | <a href="#">Manage Email Notifications</a> | <a href="#">Unsubscribe</a></p>
  1294. <center data-parsed="">
  1295. <table align="center" class="menu float-center">
  1296. <tr>
  1297. <td>
  1298. <table>
  1299. <tr>
  1300. <th class="menu-item float-center">
  1301. <a href="undefined"><img src="http://placehold.it/25/663399" alt=""></a>
  1302. </th>
  1303. <th class="menu-item float-center">
  1304. <a href="undefined"><img src="http://placehold.it/25/663399" alt=""></a>
  1305. </th>
  1306. <th class="menu-item float-center">
  1307. <a href="undefined"><img src="http://placehold.it/25/663399" alt=""></a>
  1308. </th>
  1309. <th class="menu-item float-center">
  1310. <a href="undefined"><img src="http://placehold.it/25/663399" alt=""></a>
  1311. </th>
  1312. <th class="menu-item float-center">
  1313. <a href="undefined"><img src="http://placehold.it/25/663399" alt=""></a>
  1314. </th>
  1315. </tr>
  1316. </table>
  1317. </td>
  1318. </tr>
  1319. </table>
  1320. </center>
  1321. </th>
  1322. <th class="expander"></th>
  1323. </tr>
  1324. </table>
  1325. </th>
  1326. </tr>
  1327. </tbody>
  1328. </table>
  1329. </td>
  1330. </tr>
  1331. </tbody>
  1332. </table>
  1333. </center>
  1334. </td>
  1335. </tr>
  1336. </table>
  1337. </body>
  1338. </html>