order.html 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522
  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. </style>
  1170. </head>
  1171. <body>
  1172. <!-- <style> -->
  1173. <table class="body" data-made-with-foundation="">
  1174. <tr>
  1175. <td class="float-center" align="center" valign="top">
  1176. <center data-parsed="">
  1177. <table class="spacer float-center">
  1178. <tbody>
  1179. <tr>
  1180. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1181. </tr>
  1182. </tbody>
  1183. </table>
  1184. <table align="center" class="container float-center">
  1185. <tbody>
  1186. <tr>
  1187. <td>
  1188. <table class="spacer">
  1189. <tbody>
  1190. <tr>
  1191. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1192. </tr>
  1193. </tbody>
  1194. </table>
  1195. <table class="row">
  1196. <tbody>
  1197. <tr>
  1198. <th class="small-12 large-12 columns first last">
  1199. <table>
  1200. <tr>
  1201. <th>
  1202. <h1>Thanks for your order.</h1>
  1203. <p>Thanks for shopping with us! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad earum ducimus, non, eveniet neque dolores voluptas architecto sed, voluptatibus aut dolorem odio. Cupiditate a recusandae, illum
  1204. cum voluptatum modi nostrum.</p>
  1205. <table class="spacer">
  1206. <tbody>
  1207. <tr>
  1208. <td height="16px" style="font-size:16px;line-height:16px;">&#xA0;</td>
  1209. </tr>
  1210. </tbody>
  1211. </table>
  1212. <table class="callout">
  1213. <tr>
  1214. <th class="callout-inner secondary">
  1215. <table class="row">
  1216. <tbody>
  1217. <tr>
  1218. <th class="small-12 large-6 columns first">
  1219. <table>
  1220. <tr>
  1221. <th>
  1222. <p> <strong>Payment Method</strong><br> Dubloons </p>
  1223. <p> <strong>Email Address</strong><br> thecapn@pirates.org </p>
  1224. <p> <strong>Order ID</strong><br> 239235983749636 </p>
  1225. </th>
  1226. </tr>
  1227. </table>
  1228. </th>
  1229. <th class="small-12 large-6 columns last">
  1230. <table>
  1231. <tr>
  1232. <th>
  1233. <p> <strong>Shipping Method</strong><br> Boat (1&ndash;2 weeks)<br> <strong>Shipping Address</strong><br> Captain Price<br> 123 Maple Rd<br> Campbell, CA 95112 </p>
  1234. </th>
  1235. </tr>
  1236. </table>
  1237. </th>
  1238. </tr>
  1239. </tbody>
  1240. </table>
  1241. </th>
  1242. <th class="expander"></th>
  1243. </tr>
  1244. </table>
  1245. <h4>Order Details</h4>
  1246. <table>
  1247. <tr>
  1248. <th>Item</th>
  1249. <th>#</th>
  1250. <th>Price</th>
  1251. </tr>
  1252. <tr>
  1253. <td>Ship's Cannon</td>
  1254. <td>2</td>
  1255. <td>$100</td>
  1256. </tr>
  1257. <tr>
  1258. <td>Ship's Cannon</td>
  1259. <td>2</td>
  1260. <td>$100</td>
  1261. </tr>
  1262. <tr>
  1263. <td>Ship's Cannon</td>
  1264. <td>2</td>
  1265. <td>$100</td>
  1266. </tr>
  1267. <tr>
  1268. <td colspan="2"><b>Subtotal:</b></td>
  1269. <td>$600</td>
  1270. </tr>
  1271. </table>
  1272. <hr>
  1273. <h4>What's Next?</h4>
  1274. <p>Our carrier raven will prepare your order for delivery. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi necessitatibus itaque debitis laudantium doloribus quasi nostrum distinctio suscipit, magni soluta
  1275. eius animi voluptatem qui velit eligendi quam praesentium provident culpa?</p>
  1276. </th>
  1277. </tr>
  1278. </table>
  1279. </th>
  1280. </tr>
  1281. </tbody>
  1282. </table>
  1283. <table class="row footer text-center">
  1284. <tbody>
  1285. <tr>
  1286. <th class="small-12 large-3 columns first">
  1287. <table>
  1288. <tr>
  1289. <th> <img src="http://placehold.it/170x30" alt=""> </th>
  1290. </tr>
  1291. </table>
  1292. </th>
  1293. <th class="small-12 large-3 columns">
  1294. <table>
  1295. <tr>
  1296. <th>
  1297. <p> Call us at 800.555.1923<br> Email us at support@discount.boat </p>
  1298. </th>
  1299. </tr>
  1300. </table>
  1301. </th>
  1302. <th class="small-12 large-3 columns last">
  1303. <table>
  1304. <tr>
  1305. <th>
  1306. <p> 123 Maple Rd<br> Campbell, CA 95112 </p>
  1307. </th>
  1308. </tr>
  1309. </table>
  1310. </th>
  1311. </tr>
  1312. </tbody>
  1313. </table>
  1314. </td>
  1315. </tr>
  1316. </tbody>
  1317. </table>
  1318. </center>
  1319. </td>
  1320. </tr>
  1321. </table>
  1322. </body>
  1323. </html>