Style Outgoing Emails

Outgoing emails will be sent by Shopify or Titan Pro depending on whether the client will be using Titan Pro to manage order processing and customer service.

Shopify Templates

Please install the following on all Shopify sites, even if emails may be later generated by Titan Pro.

Upload Graphics

There are several graphics that need to be uploaded for the email templates.

To upload files into a Shopify store:

  1. Go to Settings > Files in the store back-end.
  2. Upload the files described below.
The first ones are for fallback purposes when email clients don't honor CSS3 styles. Download these files to your computer and upload into the Shopify store. Additionally, you need upload the email version of the site logo, which should be stored within the store DropBox folder.
  1. Find the [Store_Code]-email.png file.
  2. Copy the file to your computer and rename email-logo.png.
  3. Upload the file to the Shopify store.

Replace Email Templates

Now that the graphics are in place, we need to copy and paste the HTML code for each of the emails in Shopify:
  1. Go to Settings > Notifications in the store backend.
  2. Click on the email you wish to update.
  3. Click HTML email tab.
  4. Delete All the HTML code shown.
  5. Copy the appropriate code from the appropriate template below.
  6. Paste the code into the HTML email tab.
  7. Click Save.

You may also click Preview to verify that the code you pasted is working properly.

The following are the various HTML code snippets to use for each of the Notification emails that need to be updated.

Abandoned Checkout Notification

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Complete your Purchase</title>
<style type="text/css">
body {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
}
a, #outlook a {
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
	display: inline-block;
}
a, a span {
	text-decoration: none;
}
a img {
	border: none;
}
img {
	height: auto;
	width: auto;
	line-height: 100%;
	outline: none;
	text-decoration: none;
	-ms-interpolation-mode: bicubic;
}
.imageFix {
	display: block;
}
table {
	mso-table-lspace: 0pt;
	mso-table-rspace: 0pt;
}
table, td {
	border-collapse: collapse;
	border-spacing: 0;
}
.ExternalClass {
	display: block !important;
	width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
	line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
	width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
	-webkit-text-size-adjust : none;
	font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 5px;
}
p, p.MsoNormal {
	margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
	text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
	margin-left: auto;
	margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
	text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
	margin-left: 0;
	margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
	text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
	margin-left: auto;
	margin-right: 0;
}
.desktopHide {
	display: none;
	font-size: 0;
	max-height: 0;
	width: 0;
	line-height: 0;
	overflow: hidden;
	mso-hide: all;
}
body, #emailBody, .emailBodyCell {
	height: 100%;
	width: 100%;
	min-height: 1000px;
}
.emailBodyCell {
	padding-top: 0;
	padding-bottom: 32px;
	padding-left: 0;
	padding-right: 0;
}
.emailSummary {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
	line-height: 0 !important;
	font-size: 0 !important;
	padding-bottom: 0;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
	height: 16px;
	width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
	padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
	padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
	padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
	padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
	padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
	padding-left: 16px;
}
.width246, .width448 {
	text-align: left;
	vertical-align: top;
	width: 246px;
}
.eBox {
	width: 100%;
	min-width: 576px;
}
.blank {
	width: 544px;
}
.bottomCorners {
	height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
	min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
	font-size: 0 !important;
	line-height: 100%;
	width: 4px;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
	text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
	vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
	vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
	font-size: 0 !important;
	line-height: 0 !important;
	width: 4px;
	height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
	margin-left: 0;
	margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
	margin-left: auto;
	margin-right: 0;
}
.eBox .btnMain {
	padding-right: 18px;
	padding-left: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
	height: 20px;
	font-size: 18px;
	line-height: 20px;
	mso-line-height-rule: exactly;
	text-align: center;
	vertical-align: middle;
}
.mainBtn td {
	padding-bottom: 0;
}
.mainBtn a {
	font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
	width: 2px;
	height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
	width: 2px;
	height: 2px;
}
.tag .tagName {
	font-size: 11px;
	text-transform: uppercase;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	white-space: nowrap;
}
.tag .tag_space {
	background-color: transparent;
	font-size: 0 !important;
	line-height: 100%;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
	width: 512px;
}
.highlight, .eBody {
	padding-top: 16px;
	padding-bottom: 0;
	padding-left: 16px;
	padding-right: 16px;
}
.eHeader {
	padding-top: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-bottom: 16px;
}
.eHeaderLogo {
	height: 100px;
	font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
	height: 100px;
	text-align: left;
	font-size: 18px;
	font-weight: bold;
}
.eHeaderLogo a {
	line-height: 0;
}
.eHeaderLogo img {
	vertical-align: top;
}
.eHeaderLogoText {
	text-align: left;
	vertical-align: top;
	padding-top: 10px;
	padding-bottom: 0;
}
.eHeaderLogoText a {
	text-align: left;
	font-size: 26px;
	line-height: 32px;
	font-weight: bold;
}
.eFooter {
	text-align: center;
	font-size: 12px;
	line-height: 21px;
	padding-top: 14px;
	width: 544px;
}
.eFooter a, .eFooter a span {
	text-decoration: underline;
}
.highlight {
	text-align: center;
}
h1 {
	font-size: 24px;
	line-height: 36px;
	font-weight: bold;
}
.highlight p {
	font-size: 14px;
	line-height: 22px;
}
.eBody p, .eBody li {
	font-size: 14px;
	line-height: 22px;
	text-align: left;
}
.eBody p a span {
	font-weight: bold;
}
h2 {
	font-size: 18px;
	line-height: 26px;
	margin-bottom: 5px;
	font-weight: normal;
}
h2 span {
	font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
	text-align: left;
	font-size: 12px;
}
.invoiceHead p {
	line-height: 19px;
}
h4 {
	font-size: 14px;
	font-weight: bold;
}
h4 span {
	font-size: 12px;
	font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
	padding-top: 14px;
	padding-bottom: 14px;
	padding-left: 16px;
	padding-right: 16px;
	font-size: 14px;
	line-height: 19px;
}
.invoiceTable2 th {
	padding-top: 6px;
	padding-bottom: 6px;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	text-transform: uppercase;
}
.invoiceTable2 .subTotal {
	font-size: 14px;
	line-height: 22px;
}
.eTotal .amount {
	font-size: 16px;
	font-weight: bold;
}
.invoiceTable2 .prodDesc {
	width: 280px;
	font-size: 12px;
	line-height: 18px;
	padding-right: 0;
	text-align: left;
	vertical-align: top;
}
.invoiceTable2 .alignRight {
	text-align: right;
	vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
	padding-top: 16px;
}
.invoiceTable2 .mobileHide {
	padding-right: 0;
}
.invoiceTable2 .prodImg {
	padding-right: 0;
	width: 80px;
}
a, a span {
	color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
	color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
	color: #ffffff;
}
.eFooter {
	color: #b2b2b2;
}
.eFooter a, .eFooter a span {
	color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
	color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
	color: #465059;
}
.amount {
	color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
	background-color: #fff;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
	background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
	background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
	background-color: #f6f6f7;
}
.mainBtn td {
	background-color: #7fbe56;
}
.tag td {
	background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
	border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
td[class=btnLfTp] {
	-webkit-border-radius: 4px 0 0 0 !important;
	border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
	-webkit-border-radius: 0 4px 0 0 !important;
	border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
	-webkit-border-radius: 0 0 4px 0 !important;
	border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 4px !important;
	border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
	padding: 0 !important;
}
td[class=btnMain] a {
	display: block !important;
	padding: 10px 18px !important;
	line-height: 26px !important;
}
table[class=tag] td {
	border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
	font-size: 11px !important;
	line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
	-webkit-border-radius: 2px 0 0 0 !important;
	border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
	-webkit-border-radius: 0 2px 0 0 !important;
	border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
	-webkit-border-radius: 0 0 2px 0 !important;
	border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 2px !important;
	border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
	min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	display: none !important;
	width: 0 !important;
	font-size: 0 !important;
	overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	display: block !important;
	width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
	width: 100% !important;
	display: block !important;
	padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
	font-size: 28px !important;
	line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
	font-size: 22px !important;
	line-height: 30px !important;
	margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
	font-size: 20px !important;
	line-height: 24px !important;
}
td[class=btnMain] a {
	font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
	font-size: 18px !important;
	line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
	font-size: 16px !important;
	line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
	margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
	font-size: 14px !important;
	line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
	width: 100% !important;
	margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
	-webkit-box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	box-sizing: border-box !important;
	text-align: left !important;
	padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
	width: 100% !important;
	display: block !important;
	height: 1px !important;
	position: relative !important;
	overflow: visible !important;
	padding: 0 !important;
}
td[class~=prodImg] img {
	position: absolute !important;
	right: 16px !important;
	top: 16px !important;
}
table[class~=invoiceTable2] td {
	padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
	padding-right: 112px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
	padding-right: 16px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
	border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
	padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	font-size: 14px !important;
	line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
	padding-top: 16px !important;
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
	display: block !important;
	padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
	display: inline-block !important;
	font-size: inherit !important;
	max-height: none !important;
	line-height: inherit !important;
	padding-right: 6px !important;
	overflow: visible !important;
	width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
	display: none !important;
	font-size: 0 !important;
	width: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;min-height: 1000px;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Complete your Purchase</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;min-height: 1000px;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;min-height: 1000px;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #fff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #fff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #fff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #f6f6f7;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #f6f6f7;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Complete your Purchase</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #f6f6f7;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Hey{% if billing_address.name %} {{ billing_address.name }}{% endif %},<br>
              Your shopping cart at {{ shop_name }} has been reserved and is waiting for your return!</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">In your cart, you left:</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
              <tr>
                <th colspan="2" class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
                <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
              </tr>
              {% for line in line_items %}
              <tr>
                <td class="alignLeft prodImg" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 80px;"><img src="{{ line.product.featured_image | product_img_url: 'small' }}" width="80" alt="{{ line.title }}" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: auto;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;"></td>
                <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.title }}</h4>
                  Quantity: {{ line.quantity }}<br>
                  Price: {{ line.price | money }} </td>
                <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_price | money }}</span></td>
              </tr>
              {% endfor %}
            </table></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignCenter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 14px;line-height: 22px;">But it's not too late! To complete your purchase, click the button below.</p>
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: auto;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td width="4" height="8" align="left" valign="top" class="btnLfTp" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 100%;width: 4px;height: 4px;text-align: left;vertical-align: top;font-size: 0 !important;"><img src="images/mainBtn_lftp.png" width="4" height="4" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 4px;width: 4px;line-height: 0 !important;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;font-size: 0 !important;"></td>
                <td class="emptyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 0 !important;font-size: 0 !important;"> </td>
                <td width="4" height="8" align="right" valign="top" class="btnRgTp" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 100%;width: 4px;height: 4px;text-align: right;vertical-align: top;font-size: 0 !important;"><img src="images/mainBtn_rgtp.png" width="4" height="4" style="margin-top: 0;margin-left: auto;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 4px;width: 4px;line-height: 0 !important;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;font-size: 0 !important;"></td>
              </tr>
              <tr>
                <td class="emptyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 0 !important;font-size: 0 !important;"> </td>
                <td class="btnMain" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 8px;padding-bottom: 8px;padding-left: 18px;padding-right: 18px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;height: 20px;font-size: 18px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;"><a href="{{ url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-weight: bold;"><span style="text-decoration: none;color: #ffffff;">Complete your Purchase</span></a></td>
                <td class="emptyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 0 !important;font-size: 0 !important;"> </td>
              </tr>
              <tr>
                <td align="left" valign="bottom" class="btnLfBt" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 100%;width: 4px;height: 4px;text-align: left;vertical-align: bottom;font-size: 0 !important;"><img src="images/mainBtn_lfbt.png" width="4" height="4" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 4px;width: 4px;line-height: 0 !important;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;font-size: 0 !important;"></td>
                <td class="emptyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 0 !important;font-size: 0 !important;"> </td>
                <td align="right" valign="bottom" class="btnRgBt" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;line-height: 100%;width: 4px;height: 4px;text-align: right;vertical-align: bottom;font-size: 0 !important;"><img src="images/mainBtn_rgbt.png" width="4" height="4" style="margin-top: 0;margin-left: auto;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 4px;width: 4px;line-height: 0 !important;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;font-size: 0 !important;"></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 14px;line-height: 22px;"></p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 14px;line-height: 22px;">Thanks for shopping!<br>
              {{ shop.name }}</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"> </td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 Customer Account Activation

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Account Activation</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #f6f6f7;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Account Activation</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Account Activation</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;">{% if customer.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ customer.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">An account has been created for you at the shop {{ shop.name }}.</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Please click the button below to activate your account and set your password.</p>
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 8px;padding-bottom: 8px;padding-left: 18px;padding-right: 18px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;height: 20px;font-size: 18px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ customer.account_activation_url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-weight: bold;"><span style="text-decoration: none;color: #ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Activate Account</span></a></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"></p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">If the account was created in error, you can visit the link above and select "Decline" to decline this invitation.</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

Customer Account Welcome

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Account Confirmation</title>
<style type="text/css">
body {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
}
a, #outlook a {
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
	display: inline-block;
}
a, a span {
	text-decoration: none;
}
a img {
	border: none;
}
img {
	height: auto;
	width: auto;
	line-height: 100%;
	outline: none;
	text-decoration: none;
	-ms-interpolation-mode: bicubic;
}
.imageFix {
	display: block;
}
table {
	mso-table-lspace: 0pt;
	mso-table-rspace: 0pt;
}
table, td {
	border-collapse: collapse;
	border-spacing: 0;
}
.ExternalClass {
	display: block !important;
	width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
	line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
	width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
	-webkit-text-size-adjust : none;
	font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 5px;
}
p, p.MsoNormal {
	margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
	text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
	margin-left: auto;
	margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
	text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
	margin-left: 0;
	margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
	text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
	margin-left: auto;
	margin-right: 0;
}
.desktopHide {
	display: none;
	font-size: 0;
	max-height: 0;
	width: 0;
	line-height: 0;
	overflow: hidden;
	mso-hide: all;
}
body, #emailBody, .emailBodyCell {
	height: 100%;
	width: 100%;
}
.emailBodyCell {
	padding-top: 0;
	padding-bottom: 32px;
	padding-left: 0;
	padding-right: 0;
}
.emailSummary {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
	line-height: 0 !important;
	font-size: 0 !important;
	padding-bottom: 0;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
	height: 16px;
	width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
	padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
	padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
	padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
	padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
	padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
	padding-left: 16px;
}
.width246, .width448 {
	text-align: left;
	vertical-align: top;
	width: 246px;
}
.eBox {
	width: 100%;

	min-width: 576px;
}
.blank {
	width: 544px;
}
.bottomCorners {
	height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
	min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
	font-size: 0 !important;
	line-height: 100%;
	width: 4px;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
	text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
	vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
	vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
	font-size: 0 !important;
	line-height: 0 !important;
	width: 4px;
	height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
	margin-left: 0;
	margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
	margin-left: auto;
	margin-right: 0;
}
.eBox .btnMain {
	padding-right: 18px;
	padding-left: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
	height: 20px;
	font-size: 18px;
	line-height: 20px;
	mso-line-height-rule: exactly;
	text-align: center;
	vertical-align: middle;
}
.mainBtn td {
	padding-bottom: 0;
}
.mainBtn a {
	font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
	width: 2px;
	height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
	width: 2px;
	height: 2px;
}
.tag .tagName {
	font-size: 11px;
	text-transform: uppercase;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	white-space: nowrap;
}
.tag .tag_space {
	background-color: transparent;
	font-size: 0 !important;
	line-height: 100%;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
	width: 512px;
}
.highlight, .eBody {
	padding-top: 16px;
	padding-bottom: 0;
	padding-left: 16px;
	padding-right: 16px;
}
.eHeader {
	padding-top: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-bottom: 16px;
}
.eHeaderLogo {
	height: 100px;
	font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
	height: 48px;
	text-align: left;
	font-size: 18px;
	font-weight: bold;
}
.eHeaderLogo a {
	line-height: 0;
}
.eHeaderLogo img {
	vertical-align: top;
}
.eHeaderLogoText {
	text-align: left;
	vertical-align: top;
	padding-top: 10px;
	padding-bottom: 0;
}
.eHeaderLogoText a {
	text-align: left;
	font-size: 26px;
	line-height: 32px;
	font-weight: bold;
}
.eFooter {
	text-align: center;
	font-size: 12px;
	line-height: 21px;
	padding-top: 14px;
	width: 544px;
}
.eFooter a, .eFooter a span {
	text-decoration: underline;
}
.highlight {
	text-align: center;
}
h1 {
	font-size: 24px;
	line-height: 36px;
	font-weight: bold;
}
.highlight p {
	font-size: 14px;
	line-height: 22px;
}
.eBody p, .eBody li {
	font-size: 14px;
	line-height: 22px;
	text-align: left;
}
.eBody p a span {
	font-weight: bold;
}
h2 {
	font-size: 18px;
	line-height: 26px;
	margin-bottom: 5px;
	font-weight: normal;
}
h2 span {
	font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
	text-align: left;
	font-size: 12px;
}
.invoiceHead p {
	line-height: 19px;
}
h4 {
	font-size: 14px;
	font-weight: bold;
}
h4 span {
	font-size: 12px;
	font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
	padding-top: 14px;
	padding-bottom: 14px;
	padding-left: 16px;
	padding-right: 16px;
	font-size: 14px;
	line-height: 19px;
}
.invoiceTable2 th {
	padding-top: 6px;
	padding-bottom: 6px;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	text-transform: uppercase;
}
.invoiceTable2 .subTotal {
	font-size: 14px;
	line-height: 22px;
}
.eTotal .amount {
	font-size: 16px;
	font-weight: bold;
}
.invoiceTable2 .prodDesc {
	width: 280px;
	font-size: 12px;
	line-height: 18px;
	padding-right: 0;
	text-align: left;
	vertical-align: top;
}
.invoiceTable2 .alignRight {
	text-align: right;
	vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
	padding-top: 16px;
}
.invoiceTable2 .mobileHide {
	padding-right: 0;
}
.invoiceTable2 .prodImg {
	padding-right: 0;
	width: 80px;
}
a, a span {
	color: #f6f6f7;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
	color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
	color: #ffffff;
}
.eFooter {
	color: #b2b2b2;
}
.eFooter a, .eFooter a span {
	color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
	color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
	color: #465059;
}
.amount {
	color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
	/*background-color: #f6f6f7;*/
	background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
	background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
	background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
	/*background-color: #f6f6f7;*/
	background-color: #ffffff !important;
}
.mainBtn td {
	background-color: #7fbe56;
}
.tag td {
	background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
	border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
td[class=btnLfTp] {
	-webkit-border-radius: 4px 0 0 0 !important;
	border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
	-webkit-border-radius: 0 4px 0 0 !important;
	border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
	-webkit-border-radius: 0 0 4px 0 !important;
	border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 4px !important;
	border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
	padding: 0 !important;
}
td[class=btnMain] a {
	display: block !important;
	padding: 10px 18px !important;
	line-height: 26px !important;
}
table[class=tag] td {
	border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
	font-size: 11px !important;
	line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
	-webkit-border-radius: 2px 0 0 0 !important;
	border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
	-webkit-border-radius: 0 2px 0 0 !important;
	border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
	-webkit-border-radius: 0 0 2px 0 !important;
	border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 2px !important;
	border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
	min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	display: none !important;
	width: 0 !important;
	font-size: 0 !important;
	overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	display: block !important;
	width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
	width: 100% !important;
	display: block !important;
	padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
	font-size: 28px !important;
	line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
	font-size: 22px !important;
	line-height: 30px !important;
	margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
	font-size: 20px !important;
	line-height: 24px !important;
}
td[class=btnMain] a {
	font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
	font-size: 18px !important;
	line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
	font-size: 16px !important;
	line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
	margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
	font-size: 14px !important;
	line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
	width: 100% !important;
	margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
	-webkit-box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	box-sizing: border-box !important;
	text-align: left !important;
	padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
	width: 100% !important;
	display: block !important;
	height: 1px !important;
	position: relative !important;
	overflow: visible !important;
	padding: 0 !important;
}
td[class~=prodImg] img {
	position: absolute !important;
	right: 16px !important;
	top: 16px !important;
}
table[class~=invoiceTable2] td {
	padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
	padding-right: 112px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
	padding-right: 16px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
	border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
	padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	font-size: 14px !important;
	line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
	padding-top: 16px !important;
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
	display: block !important;
	padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
	display: inline-block !important;
	font-size: inherit !important;
	max-height: none !important;
	line-height: inherit !important;
	padding-right: 6px !important;
	overflow: visible !important;
	width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
	display: none !important;
	font-size: 0 !important;
	width: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Account Confirmation</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Account Confirmation</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;">{% if customer.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ customer.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">The next time you shop at {{ shop.name }}, you can save time at checkout by logging into your account. This will prefill your address information at the checkout. </p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Thank you,<br>
              {{ shop.name }}</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"> </td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

Customer Password Reset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Account Password Reset</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}

.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Account Password Reset</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Account Password Reset</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;">{% if customer.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ customer.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">You have requested to have your password reset for your account at {{ shop.name }}</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Please click the button below to reset your password. </p>            
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 15px;padding-bottom: 15px;padding-left: 18px;padding-right: 18px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;height: 20px;font-size: 18px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ customer.reset_password_url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-weight: bold;"><span style="text-decoration: none;color: #ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Reset Password</span></a></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"></p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">If you received this email in error, you can safely ignore this email.</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

Fulfillment Request

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Order Fulfillment Request for {{ shop_name }}</title>
<style type="text/css">
body {
 -webkit-text-size-adjust: 100%;
 -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
 margin-top: 0;
 margin-left: 0;
 margin-right: 0;
 margin-bottom: 0;
 padding-top: 0;
 padding-bottom: 0;
 padding-left: 0;
 padding-right: 0;
}
a, #outlook a {
 padding-top: 0;
 padding-bottom: 0;
 padding-left: 0;
 padding-right: 0;
 display: inline-block;
}
a, a span {
 text-decoration: none;
}
a img {
 border: none;
}
img {
 height: auto;
 width: auto;
 line-height: 100%;
 outline: none;
 text-decoration: none;
 -ms-interpolation-mode: bicubic;
}
.imageFix {
 display: block;
}
table {
 mso-table-lspace: 0pt;
 mso-table-rspace: 0pt;
}
table, td {
 border-collapse: collapse;
 border-spacing: 0;
}
.ExternalClass {
 display: block !important;
 width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
 line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
 width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
 -webkit-text-size-adjust : none;
 font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
 margin-bottom: 5px;
}
p, p.MsoNormal {
 margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
 text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
 margin-left: auto;
 margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
 text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
 margin-left: 0;
 margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
 text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
 margin-left: auto;
 margin-right: 0;
}
.desktopHide {
 display: none;
 font-size: 0;
 max-height: 0;
 width: 0;
 line-height: 0;
 overflow: hidden;
 mso-hide: all;
}
body, #emailBody, .emailBodyCell {
 height: 100%;
 width: 100%; 
}
.emailBodyCell {
 padding-top: 0;
 padding-bottom: 32px;
 padding-left: 0;
 padding-right: 0;
}
.emailSummary {
 display: none !important;
 font-size: 0 !important;
 max-height: 0 !important;
 line-height: 0 !important;
 padding: 0 !important;
 mso-hide: all;
 overflow: hidden !important;
 float: none !important;
 width: 0 !important;
 height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
 line-height: 0 !important;
 font-size: 0 !important;
 padding-bottom: 0;
 padding-top: 0;
 padding-left: 0;
 padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
 height: 16px;
 width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
 padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
 padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
 padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
 padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
 padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
 padding-left: 16px;
}
.width246, .width448 {
 text-align: left;
 vertical-align: top;
 width: 246px;
}
.eBox {
 width: 100%;
 min-width: 576px;
}
.blank {
 width: 544px;
}
.bottomCorners {
 height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
 min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
 font-size: 0 !important;
 line-height: 100%;
 width: 4px;
 height: 4px;
 text-align: left;
 padding-top: 0;
 padding-left: 0;
 padding-right: 0;
 padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
 text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
 vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
 vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
 font-size: 0 !important;
 line-height: 0 !important;
 width: 4px;
 height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
 margin-left: 0;
 margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
 margin-left: auto;
 margin-right: 0;
}
.eBox .btnMain {
 padding-right: 18px;
 padding-left: 18px;
 padding-top: 8px;
 padding-bottom: 8px;
 height: 20px;
 font-size: 18px;
 line-height: 20px;
 mso-line-height-rule: exactly;
 text-align: center;
 vertical-align: middle;
}
.mainBtn td {
 padding-bottom: 0;
}
.mainBtn a {
 font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
 width: 2px;
 height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
 width: 2px;
 height: 2px;
}
.tag .tagName {
 font-size: 11px;
 text-transform: uppercase;
 padding-left: 4px;
 padding-right: 4px;
 padding-top: 2px;
 padding-bottom: 2px;
 white-space: nowrap;
}
.tag .tag_space {
 background-color: transparent;
 font-size: 0 !important;
 line-height: 100%;
 height: 4px;
 text-align: left;
 padding-top: 0;
 padding-left: 0;
 padding-right: 0;
 padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
 width: 512px;
}
.highlight, .eBody {
 padding-top: 16px;
 padding-bottom: 0;
 padding-left: 16px;
 padding-right: 16px;
}
.eHeader {
 padding-top: 16px;
 padding-left: 16px;
 padding-right: 16px;
 padding-bottom: 16px;
}
.eHeaderLogo {
 height: 100px;
 font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
 height: 100px;
 text-align: left;
 font-size: 18px;
 font-weight: bold;
}
.eHeaderLogo a {
 line-height: 0;
}
.eHeaderLogo img {
 vertical-align: top;
}
.eHeaderLogoText {
 text-align: left;
 vertical-align: top;
 padding-top: 10px;
 padding-bottom: 0;
}
.eHeaderLogoText a {
 text-align: left;
 font-size: 26px;
 line-height: 32px;
 font-weight: bold;
}
.eFooter {
 text-align: center;
 font-size: 12px;
 line-height: 21px;
 padding-top: 14px;
 width: 544px;
}
.eFooter a, .eFooter a span {
 text-decoration: underline;
}
.highlight {
 text-align: center;
}
h1 {
 font-size: 24px;
 line-height: 36px;
 font-weight: bold;
}
.highlight p {
 font-size: 14px;
 line-height: 22px;
}
.eBody p, .eBody li {
 font-size: 14px;
 line-height: 22px;
 text-align: left;
}
.eBody p a span {
 font-weight: bold;
}
h2 {
 font-size: 18px;
 line-height: 26px;
 margin-bottom: 5px;
 font-weight: normal;
}
h2 span {
 font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
 text-align: left;
 font-size: 12px;
}
.invoiceHead p {
 line-height: 19px;
}
h4 {
 font-size: 14px;
 font-weight: bold;
}
h4 span {
 font-size: 12px;
 font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
 padding-top: 14px;
 padding-bottom: 14px;
 padding-left: 16px;
 padding-right: 16px;
 font-size: 14px;
 line-height: 19px;
}
.invoiceTable2 th {
 padding-top: 6px;
 padding-bottom: 6px;
 font-size: 12px;
 line-height: 16px;
 font-weight: bold;
 text-transform: uppercase;
}
.invoiceTable2 .subTotal {
 font-size: 14px;
 line-height: 22px;
}
.eTotal .amount {
 font-size: 16px;
 font-weight: bold;
}
.invoiceTable2 .prodDesc {
 width: 280px;
 font-size: 12px;
 line-height: 18px;
 padding-right: 0;
 text-align: left;
 vertical-align: top;
}
.invoiceTable2 .alignRight {
 text-align: right;
 vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
 padding-top: 16px;
}
.invoiceTable2 .mobileHide {
 padding-right: 0;
}
.invoiceTable2 .prodImg {
 padding-right: 0;
 width: 80px;
}
a, a span {
 color: #f6f6f7;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
 color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
 color: #ffffff;
}
.eFooter {
 color: #b2b2b2;
}
.eFooter a, .eFooter a span {
 color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
 color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
 color: #465059;
}
.amount {
 color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
 /*background-color: #f6f6f7;*/
	background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
 background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
 background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
 background-color: #f6f6f7;
}
.mainBtn td {
 background-color: #7fbe56;
}
.tag td {
 background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
 border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
 display: none !important;
 font-size: 0 !important;
 max-height: 0 !important;
 line-height: 0 !important;
 padding: 0 !important;
 mso-hide: all;
 overflow: hidden !important;
 float: none !important;
 width: 0 !important;
 height: 0 !important;
}
td[class=btnLfTp] {
 -webkit-border-radius: 4px 0 0 0 !important;
 border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
 -webkit-border-radius: 0 4px 0 0 !important;
 border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
 -webkit-border-radius: 0 0 4px 0 !important;
 border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
 -webkit-border-radius: 0 0 0 4px !important;
 border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
 padding: 0 !important;
}
td[class=btnMain] a {
 display: block !important;
 padding: 10px 18px !important;
 line-height: 26px !important;
}
table[class=tag] td {
 border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
 line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
 line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
 font-size: 11px !important;
 line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
 -webkit-border-radius: 2px 0 0 0 !important;
 border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
 -webkit-border-radius: 0 2px 0 0 !important;
 border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
 -webkit-border-radius: 0 0 2px 0 !important;
 border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
 -webkit-border-radius: 0 0 0 2px !important;
 border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
 min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
 min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
 display: none !important;
 width: 0 !important;
 font-size: 0 !important;
 overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
 display: block !important;
 width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
 overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
 width: 100% !important;
 display: block !important;
 padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
 font-size: 28px !important;
 line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
 font-size: 22px !important;
 line-height: 30px !important;
 margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
 font-size: 20px !important;
 line-height: 24px !important;
}
td[class=btnMain] a {
 font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
 font-size: 18px !important;
 line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
 font-size: 16px !important;
 line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
 margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
 font-size: 14px !important;
 line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
 padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
 width: 100% !important;
 padding: 0 !important;
 margin: 0 !important;
 float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
 width: 100% !important;
 margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
 -webkit-box-sizing: border-box !important;
 -moz-box-sizing: border-box !important;
 box-sizing: border-box !important;
 text-align: left !important;
 padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
 width: 100% !important;
 display: block !important;
 height: 1px !important;
 position: relative !important;
 overflow: visible !important;
 padding: 0 !important;
}
td[class~=prodImg] img {
 position: absolute !important;
 right: 16px !important;
 top: 16px !important;
}
table[class~=invoiceTable2] td {
 padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
 padding-right: 112px !important;
 border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
 padding-right: 16px !important;
 border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
 border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
 padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
 padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
 font-size: 14px !important;
 line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
 padding-top: 16px !important;
 padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
 display: block !important;
 padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
 display: inline-block !important;
 font-size: inherit !important;
 max-height: none !important;
 line-height: inherit !important;
 padding-right: 6px !important;
 overflow: visible !important;
 width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
 display: none !important;
 font-size: 0 !important;
 width: 0 !important;
 max-height: 0 !important;
 line-height: 0 !important;
 padding: 0 !important;
 overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Order Fulfillment Request for {{ shop_name }}</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
	<tr>
		<td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
				<tr>
					<td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
							<tr>
								<td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
								<!-- end .eHeaderLogo--> 
							</tr>
						</table></td>
					<td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
				</tr>
				<tr>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{{ service_name }},<br>
							Please fulfill order {{ name }}.</p>
						<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Total number of items: {{ fulfillment.item_count }}</p>
						<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Unique items: {{ fulfillment.fulfillment_line_items.size }}</p></td>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<!-- end .eBody--> 
				</tr>
				<tr>
					<td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
					<td class="highlight invoiceHead alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;font-size: 12px;color: #a1a2a5;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
							<tr> {% if shipping_address %}
								<td class="width246 pdRg16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;vertical-align: top;width: 246px;font-size: 12px;color: #a1a2a5;"><table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Shipping Address</td>
              </tr>
            </table>
									<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;">{{ shipping_address.name }}<br>
										{% if shipping_address.company %}
										{{ shipping_address.company }}<br>
										{% endif %}
										{{ shipping_address.address1 }}<br>
										{% if shipping_address.address2 %} {{ shipping_address.address2 }}<br>
										{% endif %}
										{{ shipping_address.city }}, {{ shipping_address.province }}<br>
										{{ shipping_address.zip }}<br>
										{{ shipping_address.country }}<br>
										{% if shipping_address.phone %}Phone: {{ shipping_address.phone }}{% endif %}</p></td>
								{% endif %}
								<td class="width246" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;vertical-align: top;width: 246px;font-size: 12px;color: #a1a2a5;"><table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Shipping Method</td>
              </tr>
            </table>
									<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;">{% if shipping_method %}{{ shipping_method.title }}{% else %}None{% endif %}</p>
									<table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">TRACKING NUMBER</td>
              </tr>
            </table>
									<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;">{% if fulfillment.tracking_number %}{{ fulfillment.tracking_number }}{% else %}None{% endif %}</p>
									<table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">CUSTOMER EMAIL</td>
              </tr>
            </table>
									<p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;"><a href="mailto:{{ email }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;"><span style="text-decoration: none;color: #ffffff;">{{ email }}</span></a></p></td>
							</tr>
						</table></td>
					<td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
					<!-- end .highlight--> 
				</tr>
				<tr>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
							<tr>
								<th colspan="2" class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
								<th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">SKU</th>
							</tr>
							{% for line in fulfillment.fulfillment_line_items %}
							<tr>
								<td class="alignLeft prodImg" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 80px;"><img src="{{ line.product.featured_image | product_img_url: 'small' }}" width="80" alt="{{ line.title }}" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: auto;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;"></td>
								<td class="alignLeft prodDesc pdLf16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.line_item.title }}</h4>
									Quantity: {{ line.quantity }}<br>
									Grams: {{ line.line_item.grams }}<br>
									Vendor: {{ line.line_item.vendor }} </td>
								<td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">SKU: </span>{{ line.line_item.sku }}</td>
							</tr>
							{% endfor %}
						</table></td>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<!-- end .eBody--> 
				</tr>
				<tr>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Thank you,<br>
							{{ shop_name }}</p></td>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<!-- end .eBody--> 
				</tr>
				<tr>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
					<td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"> </td>
					<td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
				</tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
			</table>
			
			<!-- end .eBox --></td>
		<!-- end .emailBodyCell --> 
	</tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 Gift Card Notification

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Gift Card Notification</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}

.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Gift Card Notification</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">{{ gift_card.initial_value | money_without_trailing_zeros }} Gift Card</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Hi{% if gift_card.customer %} {{ gift_card.customer.first_name }}{% endif %},</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Here is your <a href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #235daa;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;"><span style="text-decoration: none;color: #235daa;font-weight: bold;">{{ shop.name }}</span></a> gift card for {{ gift_card.initial_value | money_without_trailing_zeros }}.</p>
            {% if gift_card.initial_value != gift_card.balance %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">You have {{ gift_card.balance | money_without_trailing_zeros }} left on this gift card.</p>
            {% endif %}            
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 15px;padding-bottom: 15px;padding-left: 18px;padding-right: 18px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;height: 20px;font-size: 18px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ gift_card.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-weight: bold;"><span style="text-decoration: none;color: #ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">View or Print Your Gift Card</span></a></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"></p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Purchased this gift card for someone else? Feel free to forward them this email.</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Thank you for shopping at <a href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #235daa;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;"><span style="text-decoration: none;color: #235daa;font-weight: bold;">{{ shop.name }}</span></a>!</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 New Order Notification

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Order {{ name }} placed by {{ billing_address.name }}{% if has_high_risks? %} (Risk of fraud){% endif %}</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Order {{ name }} placed by {{ billing_address.name }}{% if has_high_risks? %} (Risk of fraud){% endif %}</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">New Order</span></h1>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;color: #a1a2a5;">Order {{ name }} placed by {{ billing_address.name }}{% if has_high_risks? %} <strong>(Risk of fraud)</strong>{% endif %}</p></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Hello {{ shop_name }},<br>
              {% if customer.name %}{{ customer.name }}{% else %}Someone{% endif %} placed a new order with you today, {{ date | date: "%b %d %I:%M%p" }}.</p>
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 15px;padding-bottom: 15px;padding-left: 18px;padding-right: 18px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #7fbe56;height: 20px;font-size: 18px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ shop.url }}/admin/orders/{{ id }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-weight: bold;"><span style="text-decoration: none;color: #ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">View order {{order_name}}</span></a></td>
              </tr>
            </table>
            </td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
              <tr>
                <th colspan="2" class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
                <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
              </tr>
              {% for line in line_items %}
              <tr>
                <td class="alignLeft prodImg" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 80px;"><img src="{{ line.product.featured_image | product_img_url: 'small' }}" width="80" alt="{{ line.title }}" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: auto;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;"></td>
                <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.title }}</h4>
                  Quantity: {{ line.quantity }}<br>
                  Price: {{ line.price | money }} </td>
                <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_price | money }}</span></td>
              </tr>
              {% endfor %}
            </table></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"> {% if fulfillment_aborted %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">The above order was not automatically fulfilled because it was flagged as suspicious.</p>
            {% endif %}
            
            {% if has_high_risks? %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"><b>Security check</b><br>
              This order has a risk of being fraudulent. Review the order in your store's admin and contact the customer to verify their information.</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"><b>Payment processing method</b><br>
              {% if gateway %} {{ gateway }} {% else %}{% for tx_gateway in unique_gateways %} {{ tx_gateway }}{% endfor %}{% endif %}</p>
            {% if requires_shipping and shipping_address %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"><b>Delivery method</b><br>
              {% for shipping_method in shipping_methods %}
              {{ shipping_method.title }} {% endfor %} </p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"><b>Shipping address</b><br>
              {{ shipping_address.name }}<br>
              {{ shipping_address.street }}<br>
              {{ shipping_address.city }}, {{ shipping_address.province }}  {{ shipping_address.zip }}<br>
              {{ shipping_address.country }}<br>
              {{ shipping_address.phone }}</p>
            {% endif %} </td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 Order Cancelled

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Order {{ name }} cancelled</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Order {{ name }} cancelled</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Order {{ name }} cancelled</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"> {% if billing_address.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ billing_address.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Your order {{ name }} was cancelled {% case cancel_reason %}{% when 'customer' %}at your request.{% when 'inventory' %}because we did not have enough stock to fulfill your order.{% when 'fraud' %}because we suspect it is fraudulent.{% when 'other' %}due to unforseen circumstances.{% endcase %}</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{% if financial_status == 'voided' %}Your payment has been voided.{% elsif financial_status == 'credited' %}Your payment has been refunded.{% endif %}</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Please reply to this email if you have any questions or concerns.</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Sincerely,<br>
              {{shop_name}}</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 Order Confirmation

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Confirmation for order {{name}}</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    background-color: #f6f6f7;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Confirmation for order {{name}}</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;">Order Confirmation</h1>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Thank you for placing your order with {{ shop_name }}!</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight invoiceHead alignLeft pdBt5" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 5px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;font-size: 12px;color: #a1a2a5;background-color: #f6f6f7;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">Order {{name}} <span style="font-size: 12px;font-weight: normal;color: #a1a2a5;">{{ date | date: "%m/%d/%Y" }}</span></h4></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight invoiceHead alignLeft pdTp0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;font-size: 12px;color: #a1a2a5;background-color: #f6f6f7;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr> {% if requires_shipping and shipping_address %}
                <td class="width246" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;vertical-align: top;width: 246px;font-size: 12px;color: #a1a2a5;"><table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Shipping Address</td>
              </tr>
            </table>
                  <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;">{{ shipping_address.name }}<br>
                    {{ shipping_address.street }}<br>
                    {{ shipping_address.city }}<br>
                    {{ shipping_address.province }}
                    {{ shipping_address.zip }}<br>
                    {{ shipping_address.country }}</p></td>
                {% endif %}
                {% if billing_address %}
                <td class="width246 pdRg16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;vertical-align: top;width: 246px;font-size: 12px;color: #a1a2a5;"><table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 5px;padding-bottom: 5px;padding-left: 5px;padding-right: 5px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;color: #ffffff;background-color: #3cbff3;font-size: 11px;line-height: 20px;mso-line-height-rule: exactly;text-align: center;vertical-align: middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">Billing Address</td>
              </tr>
            </table>
                  <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 12px;line-height: 19px;text-align: left;color: #a1a2a5;">{{ billing_address.name }}<br>
                    {{ billing_address.street }}<br>
                    {{ billing_address.city }}<br>
                    {{ billing_address.province }}
                    {{ billing_address.zip }}<br>
                    {{ billing_address.country }}</p></td>
                {% endif %} </tr>
            </table></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
              <tr>
                <th colspan="2" class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
                <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
              </tr>
              {% for line in line_items %}
              <tr>
                <td class="alignLeft prodImg" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 80px;"><img src="{{ line.product.featured_image | product_img_url: 'small' }}" width="80" alt="{{ line.title }}" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: auto;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;"></td>
                <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.title }}</h4>
                  Quantity: {{ line.quantity }}<br>
                  Price: {{ line.price | money }} </td>
                <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_price | money }}</span></td>
              </tr>
              {% endfor %}
              <tr>
                <td colspan="2" class="subTotal alignRight mobileHide" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 22px;color: #a1a2a5;background-color: #f6f6f7;border-bottom: 1px solid #ebebeb;vertical-align: top;"> {% if discounts %}Discounts<br>
                  {% endif %}
                  Subtotal<br>
                  {% for tax_line in tax_lines %}{{ tax_line.title }} {{tax_line.rate_percentage}}%<br>
                  {% endfor %}
                  {% if requires_shipping %}Shipping{% endif %}</td>
                <td class="subTotal alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 22px;color: #a1a2a5;background-color: #f6f6f7;border-bottom: 1px solid #ebebeb;vertical-align: top;">{% if discounts %}<span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Discounts: </span><span class="amount" style="color: #54565c;">{{ discounts_savings | money_with_currency  }}</span><br>
                  {% endif %} <span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #54565c;">{{ subtotal_price | money_with_currency }}</span><br>
                  {% for tax_line in tax_lines %}<span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">{{ tax_line.title }} {{tax_line.rate_percentage}}%</span> <span class="amount" style="color: #54565c;">{{tax_line.price | money_with_currency }}</span><br>
                  {% endfor %}
                  {% if requires_shipping %}<span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Shipping: </span> <span class="amount" style="color: #54565c;">{{ shipping_price | money_with_currency }}</span> {% endif %}</td>
              </tr>
              <tr>
                <td colspan="2" class="eTotal alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;border-bottom: 1px solid #ebebeb;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;vertical-align: top;"><strong>Total</strong></td>
                <td class="eTotal alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;border-bottom: 1px solid #ebebeb;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;vertical-align: top;"><span class="amount" style="color: #3cbff3;font-size: 16px;font-weight: bold;">{{ total_price | money_with_currency }}</span></td>
              </tr>
            </table></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><br /><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

Refund Notification

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Refund Notification</title>
<style type="text/css">
body {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
}
a, #outlook a {
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
	display: inline-block;
}
a, a span {
	text-decoration: none;
}
a img {
	border: none;
}
img {
	height: auto;
	width: auto;
	line-height: 100%;
	outline: none;
	text-decoration: none;
	-ms-interpolation-mode: bicubic;
}
.imageFix {
	display: block;
}
table {
	mso-table-lspace: 0pt;
	mso-table-rspace: 0pt;
}
table, td {
	border-collapse: collapse;
	border-spacing: 0;
}
.ExternalClass {
	display: block !important;
	width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
	line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
	width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
	-webkit-text-size-adjust : none;
	font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 5px;
}
p, p.MsoNormal {
	margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
	text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
	margin-left: auto;
	margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
	text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
	margin-left: 0;
	margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
	text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
	margin-left: auto;
	margin-right: 0;
}
.desktopHide {
	display: none;
	font-size: 0;
	max-height: 0;
	width: 0;
	line-height: 0;
	overflow: hidden;
	mso-hide: all;
}
body, #emailBody, .emailBodyCell {
	height: 100%;
	width: 100%;
}
.emailBodyCell {
	padding-top: 0;
	padding-bottom: 32px;
	padding-left: 0;
	padding-right: 0;
}
.emailSummary {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
	line-height: 0 !important;
	font-size: 0 !important;
	padding-bottom: 0;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
	height: 16px;
	width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
	padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
	padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
	padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
	padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
	padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
	padding-left: 16px;
}
.width246, .width448 {
	text-align: left;
	vertical-align: top;
	width: 246px;
}
.eBox {
	width: 100%;

	min-width: 576px;
}
.blank {
	width: 544px;
}
.bottomCorners {
	height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
	min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
	font-size: 0 !important;
	line-height: 100%;
	width: 4px;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
	text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
	vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
	vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
	font-size: 0 !important;
	line-height: 0 !important;
	width: 4px;
	height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
	margin-left: 0;
	margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
	margin-left: auto;
	margin-right: 0;
}
.eBox .btnMain {
	padding-right: 18px;
	padding-left: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
	height: 20px;
	font-size: 18px;
	line-height: 20px;
	mso-line-height-rule: exactly;
	text-align: center;
	vertical-align: middle;
}
.mainBtn td {
	padding-bottom: 0;
}
.mainBtn a {
	font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
	width: 2px;
	height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
	width: 2px;
	height: 2px;
}
.tag .tagName {
	font-size: 11px;
	text-transform: uppercase;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	white-space: nowrap;
}
.tag .tag_space {
	background-color: transparent;
	font-size: 0 !important;
	line-height: 100%;
	height: 4px;
	text-align: left;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
	width: 512px;
}
.highlight, .eBody {
	padding-top: 16px;
	padding-bottom: 0;
	padding-left: 16px;
	padding-right: 16px;
}
.eHeader {
	padding-top: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-bottom: 16px;
}
.eHeaderLogo {
	height: 100px;
	font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
	height: 48px;
	text-align: left;
	font-size: 18px;
	font-weight: bold;
}
.eHeaderLogo a {
	line-height: 0;
}
.eHeaderLogo img {
	vertical-align: top;
}
.eHeaderLogoText {
	text-align: left;
	vertical-align: top;
	padding-top: 10px;
	padding-bottom: 0;
}
.eHeaderLogoText a {
	text-align: left;
	font-size: 26px;
	line-height: 32px;
	font-weight: bold;
}
.eFooter {
	text-align: center;
	font-size: 12px;
	line-height: 21px;
	padding-top: 14px;
	width: 544px;
}
.eFooter a, .eFooter a span {
	text-decoration: underline;
}
.highlight {
	text-align: center;
}
h1 {
	font-size: 24px;
	line-height: 36px;
	font-weight: bold;
}
.highlight p {
	font-size: 14px;
	line-height: 22px;
}
.eBody p, .eBody li {
	font-size: 14px;
	line-height: 22px;
	text-align: left;
}
.eBody p a span {
	font-weight: bold;
}
h2 {
	font-size: 18px;
	line-height: 26px;
	margin-bottom: 5px;
	font-weight: normal;
}
h2 span {
	font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
	text-align: left;
	font-size: 12px;
}
.invoiceHead p {
	line-height: 19px;
}
h4 {
	font-size: 14px;
	font-weight: bold;
}
h4 span {
	font-size: 12px;
	font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
	padding-top: 14px;
	padding-bottom: 14px;
	padding-left: 16px;
	padding-right: 16px;
	font-size: 14px;
	line-height: 19px;
}
.invoiceTable2 th {
	padding-top: 6px;
	padding-bottom: 6px;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	text-transform: uppercase;
}
.invoiceTable2 .subTotal {
	font-size: 14px;
	line-height: 22px;
}
.eTotal .amount {
	font-size: 16px;
	font-weight: bold;
}
.invoiceTable2 .prodDesc {
	width: 280px;
	font-size: 12px;
	line-height: 18px;
	padding-right: 0;
	text-align: left;
	vertical-align: top;
}
.invoiceTable2 .alignRight {
	text-align: right;
	vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
	padding-top: 16px;
}
.invoiceTable2 .mobileHide {
	padding-right: 0;
}
.invoiceTable2 .prodImg {
	padding-right: 0;
	width: 80px;
}
a, a span {
	color: #f6f6f7;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
	color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
	color: #ffffff;
}
.eFooter {
	color: #b2b2b2;
}
.eFooter a, .eFooter a span {
	color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
	color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
	color: #465059;
}
.amount {
	color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
	/*background-color: #f6f6f7;*/
	background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
	background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
	background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
	/*background-color: #f6f6f7;*/
	background-color: #ffffff !important;
}
.mainBtn td {
	background-color: #7fbe56;
}
.tag td {
	background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
	border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
	display: none !important;
	font-size: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	mso-hide: all;
	overflow: hidden !important;
	float: none !important;
	width: 0 !important;
	height: 0 !important;
}
td[class=btnLfTp] {
	-webkit-border-radius: 4px 0 0 0 !important;
	border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
	-webkit-border-radius: 0 4px 0 0 !important;
	border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
	-webkit-border-radius: 0 0 4px 0 !important;
	border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 4px !important;
	border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
	padding: 0 !important;
}
td[class=btnMain] a {
	display: block !important;
	padding: 10px 18px !important;
	line-height: 26px !important;
}
table[class=tag] td {
	border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
	line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
	font-size: 11px !important;
	line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
	-webkit-border-radius: 2px 0 0 0 !important;
	border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
	-webkit-border-radius: 0 2px 0 0 !important;
	border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
	-webkit-border-radius: 0 0 2px 0 !important;
	border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
	-webkit-border-radius: 0 0 0 2px !important;
	border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
	min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
	display: none !important;
	width: 0 !important;
	font-size: 0 !important;
	overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	display: block !important;
	width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
	width: 100% !important;
	display: block !important;
	padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
	font-size: 28px !important;
	line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
	font-size: 22px !important;
	line-height: 30px !important;
	margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
	font-size: 20px !important;
	line-height: 24px !important;
}
td[class=btnMain] a {
	font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
	font-size: 18px !important;
	line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
	font-size: 16px !important;
	line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
	margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
	font-size: 14px !important;
	line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
	padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
	width: 100% !important;
	margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
	-webkit-box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	box-sizing: border-box !important;
	text-align: left !important;
	padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
	width: 100% !important;
	display: block !important;
	height: 1px !important;
	position: relative !important;
	overflow: visible !important;
	padding: 0 !important;
}
td[class~=prodImg] img {
	position: absolute !important;
	right: 16px !important;
	top: 16px !important;
}
table[class~=invoiceTable2] td {
	padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
	padding-right: 112px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
	padding-right: 16px !important;
	border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
	border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
	padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
	font-size: 14px !important;
	line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
	padding-top: 16px !important;
	padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
	display: block !important;
	padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
	display: inline-block !important;
	font-size: inherit !important;
	max-height: none !important;
	line-height: inherit !important;
	padding-right: 6px !important;
	overflow: visible !important;
	width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
	display: none !important;
	font-size: 0 !important;
	width: 0 !important;
	max-height: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}
}
</style>

<style type="text/css"></style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Refund Notification</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
      <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;">
    <table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
      <tr>
        <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
            <tr>
              <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
              <!-- end .eHeaderLogo--> 
            </tr>
          </table></td>
        <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
      </tr>
      <tr>
        <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
        <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Refund Notification</span></h1></td>
        <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
        <!-- end .highlight--> 
      </tr>
      <tr>
        <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;">{% if customer.name %}
          <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ customer.name }},</p>
          {% endif %}
          <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{{ shop_name }} has refunded your order ({{ name }}){% if amount > 0 %} a total of {{ amount | money_with_currency }}{% endif %}{% if refund_line_items.size > 0 %} for:</p></td>
        <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        <!-- end .eBody--> 
      </tr>
      <tr>
        <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 invoiceTable3 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
            <tr>
              <th class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
              <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
            </tr>
            {% for line in refund_line_items %}
            <tr>
              <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.line_item.title }}</h4>
                Quantity: {{ line.line_item.quantity }}<br>
                Price: {{ line.line_item.price | money }} </td>
              <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_item.line_price | money }}</span></td>
            </tr>
            {% endfor %}
          </table></td>
        <!-- end order body -->
        <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
      </tr>
      {% else %}
        </p>
      
        </td>
      
      
        <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        <!-- end .eBody--> 
      </tr>
      {% endif %}
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><br /><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
    </table>
    
    <!-- end .eBox -->
      </td>
    
    <!-- end .emailBodyCell --> 
    
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

Shipping confirmation

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Shipping confirmation for order {{ name }}</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*&background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Shipping confirmation for order {{ name }}</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Shipping confirmation for order {{ name }}</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"> {% if billing_address.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ billing_address.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{% if fulfillment.item_count == item_count %}All{% elsif fulfillment_status == 'fulfilled' %}The last{% else %}Some{% endif %} of the items from order {{ name }} have now been shipped:</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 invoiceTable3 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
              <tr>
                <th class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
                <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
              </tr>
              {% for line in fulfillment.fulfillment_line_items %}
              <tr>
                <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.line_item.title }}</h4>
                  Quantity: {{ line.line_item.quantity }}<br>
                  Price: {{ line.line_item.price | money }} </td>
                <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_item.line_price | money }}</span></td>
              </tr>
              {% endfor %}
            </table></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;color: #54565c;background-color: #ffffff;">{% if requires_shipping %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">They are being shipped {% if fulfillment.tracking_company %}via {{ fulfillment.tracking_company }} {% endif %}to the following address: </p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{{ shipping_address.name }}<br>
              {{ shipping_address.street }}<br>
              {{ shipping_address.city }}<br>
              {{ shipping_address.province }}
              {{ shipping_address.zip }}<br>
              {{ shipping_address.country }}</p>
            {% if fulfillment.tracking_numbers.size > 0 %}
            {% if fulfillment.tracking_numbers.size == 1 %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">The tracking number for these items is {{ fulfillment.tracking_numbers.first }}.</p>            
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top:0;margin-left:0;margin-right:0;margin-bottom:0;padding-top:12px;padding-bottom:12px;padding-left:18px;padding-right:18px;border-collapse:collapse;border-spacing:0;font-family:Arial,Helvetica,sans-serif;background-color:#235daa;height:20px;font-size:18px;line-height:20px;text-align:center;vertical-align:middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ fulfillment.tracking_url }}" style="padding-top:0;padding-bottom:0;padding-left:0;padding-right:0;display:inline-block;text-decoration:none;color:#ffffff;font-family:Arial,Helvetica,sans-serif-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><span style="text-decoration:none;color:#ffffff">Click here to see the status of your shipment</span></a></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"></p>
            {% else %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">The tracking details for these items are as follows:</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{% for tracking_number in fulfillment.tracking_numbers %} {{ tracking_number }}<br>
              {% endfor %}</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Click the links below for shipping status on these items:</p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">{% for tracking_url in fulfillment.tracking_urls %} <a href="{{ tracking_url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #235daa;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;">{{ tracking_url }}</a><br>
              {% endfor %}</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Please allow some time for the status of the shipment to correctly display at the above address.</p>
            {% endif %}
            
            {% endif %}
            
            {% if fulfillment_status != 'fulfilled' %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">You will receive a confirmation email when more items from your order have been shipped.</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Thank you for ordering from {{ shop_name }}!</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>

 Shipping Update

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<meta name="format-detection" content="address=no;email=no;telephone=no">
<title>Shipping update for order {{ name }}</title>
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
body, #emailBody, .emailBodyCell {
    background-color: #ebebeb;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    /*background-color: #f6f6f7;*/
    background-color: #ffffff !important;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {
    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>
<style type="text/css">
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100%;width: 100%;background-color: #ebebeb;">
<div class="emailSummary" style="mso-hide: all;display: none !important;font-size: 0 !important;max-height: 0 !important;line-height: 0 !important;padding: 0 !important;overflow: hidden !important;float: none !important;width: 0 !important;height: 0 !important;">Shipping update for order {{ name }}</div>
<table id="emailBody" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;height: 100%;width: 100%;background-color: #ebebeb;">
  <tr>
    <td align="center" valign="top" class="emailBodyCell" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 32px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100%;width: 100%;background-color: #ebebeb;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="eBox" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;width: 100%;min-width: 576px;">
        <tr>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eHeader" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;background-color: #ffffff;"><table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
                <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;"><a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a></td>
                <!-- end .eHeaderLogo--> 
              </tr>
            </table></td>
          <td class="eHeader_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
        <tr>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <td class="highlight pdTp32 pdBt16" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 32px;padding-bottom: 16px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;text-align: center;background-color: #ffffff;"><h1 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 24px;line-height: 36px;font-weight: bold;color: #465059;"><span style="color: #465059;">Shipping update for order {{ name }}</span></h1></td>
          <td class="highlight_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;background-color: #ffffff;"> </td>
          <!-- end .highlight--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody alignLeft" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;width: 512px;color: #54565c;background-color: #ffffff;"> {% if billing_address.name %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Dear {{ billing_address.name }},</p>
            {% endif %}
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">The following shipped items from order {{ name }} have been updated with new shipping information:</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="blank" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 544px;"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="invoiceTable2 invoiceTable3 bottomLine" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">
              <tr>
                <th class="alignLeft pdLf16" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;padding-left: 16px;padding-top: 6px;padding-bottom: 6px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;">Item</th>
                <th class="alignRight" style="-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;padding-top: 6px;padding-bottom: 6px;padding-left: 16px;padding-right: 16px;font-size: 12px;line-height: 16px;font-weight: bold;text-transform: uppercase;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;">Subtotal</th>
              </tr>
              {% for line in fulfillment.fulfillment_line_items %}
              <tr>
                <td class="alignLeft prodDesc" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: left;font-size: 12px;line-height: 18px;color: #a1a2a5;background-color: #ffffff;border-bottom: 1px solid #ebebeb;width: 280px;vertical-align: top;"><h4 style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 5px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #54565c;">{{ line.line_item.title }}</h4>
                  Quantity: {{ line.line_item.quantity }}<br>
                  Price: {{ line.line_item.price | money }} </td>
                <td class="alignRight" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 14px;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: right;font-size: 14px;line-height: 19px;color: #54565c;background-color: #ffffff;border-bottom: 1px solid #ebebeb;vertical-align: top;"><span class="desktopHide" style="display: none;font-size: 0;max-height: 0;width: 0;line-height: 0;overflow: hidden;mso-hide: all;">Subtotal: </span><span class="amount" style="color: #3cbff3;">{{ line.line_item.line_price | money }}</span></td>
              </tr>
              {% endfor %}
            </table></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="eBody" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 16px;padding-bottom: 0;padding-left: 16px;padding-right: 16px;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;width: 512px;color: #54565c;background-color: #ffffff;"><p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">They are being shipped{% if fulfillment.tracking_company %} via {{ fulfillment.tracking_company }}{% endif %} with tracking number {{ fulfillment.tracking_number }}.</p>            
            <table border="0" cellpadding="0" cellspacing="0" class="mainBtn" style="margin-top: 0;margin-left: 0;margin-right: auto;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;border-spacing: 0;">
              <tr>
               <td style="margin-top:0;margin-left:0;margin-right:0;margin-bottom:0;padding-top:12px;padding-bottom:12px;padding-left:18px;padding-right:18px;border-collapse:collapse;border-spacing:0;font-family:Arial,Helvetica,sans-serif;background-color:#235daa;height:20px;font-size:18px;line-height:20px;text-align:center;vertical-align:middle;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><a href="{{ fulfillment.tracking_url }}" style="padding-top:0;padding-bottom:0;padding-left:0;padding-right:0;display:inline-block;text-decoration:none;color:#ffffff;font-family:Arial,Helvetica,sans-serif-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;"><span style="text-decoration:none;color:#ffffff">Click here to see the status of your shipment</span></a></td>
              </tr>
            </table>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;"></p>
            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;font-size: 14px;line-height: 22px;text-align: left;">Please allow some time for the status of the shipment to correctly display at the above address.</p></td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <!-- end .eBody--> 
        </tr>
        <tr>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
          <td class="bottomCorners" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 20px;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 16px;background-color: #ffffff;"><strong>Note: </strong>Your transaction will appear as "ONELIVE" on your statement.</td>
          <td class="eBody_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;background-color: #ffffff;"> </td>
        </tr>
       <tr>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Need Help?</a> <a style="font-size: 14px;" href="{{ shop.url }}/pages/contact-us">Comments?</a><br /><br />© 2016 {{ shop.name }}. All Rights Reserved.<br /><br /><a href="{{ shop.url }}" title="Online Store"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a></td>
          <td class="eFooter_stretch" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;min-width: 16px;"> </td>
        </tr>
      </table>
      
      <!-- end .eBox --></td>
    <!-- end .emailBodyCell --> 
  </tr>
</table>
<!-- end #emailBody -->
</body>
</html>
POS and Mobile Receipt
<!-- Put the Hex code for the  header font colour here -->
{% assign header_font_color = '#FFFFFF' %}
<!-- Put the Hex code for the header background colour here -->
{% assign header_bg_color = '#479ccf' %}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="format-detection" content="telephone=no">
    <title>Thanks for your recent purchase!</title>
    
<style type="text/css">
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body, p, h1, h2, h3, h4, h5, h6, img, table, td, #emailBody {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
a, #outlook a {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
}
a, a span {
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    width: auto;
    line-height: 100%;
    outline: none;
    text-decoration: none;
    -ms-interpolation-mode: bicubic;
}
.imageFix {
    display: block;
}
table {
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}
table, td {
    border-collapse: collapse;
    border-spacing: 0;
}
.ExternalClass {
    display: block !important;
    width: 100%;
}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
    line-height: 100%;
}
.ReadMsgBody, .ExternalClass {
    width: 100%;
}
td, th, p, a, li, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust : none;
    font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 5px;
}
p, p.MsoNormal {
    margin-bottom: 24px;
}
.alignCenter, .eBody .alignCenter, .alignCenter p, .eBody.alignCenter p, .eBody .alignCenter p {
    text-align: center;
}
table.alignCenter, .alignCenter table, .alignCenter img {
    margin-left: auto;
    margin-right: auto;
}
.alignLeft, .eBody .alignLeft, .eBody.alignLeft p, .eBody .alignLeft p, .highlight.alignLeft, .invoiceTable2 .alignLeft {
    text-align: left;
}
table.alignLeft, .alignLeft table, .alignLeft img {
    margin-left: 0;
    margin-right: auto;
}
.alignRight, .eBody .alignRight, .eBody.alignRight p, .eBody .alignRight p, .highlight.alignRight, .invoiceTable2 .alignRight {
    text-align: right;
}
table.alignRight, .alignRight table, .alignRight a {
    margin-left: auto;
    margin-right: 0;
}
.desktopHide {
    display: none;
    font-size: 0;
    max-height: 0;
    width: 0;
    line-height: 0;
    overflow: hidden;
    mso-hide: all;
}
body, #emailBody, .emailBodyCell {
    height: 100%;
    width: 100%;    
}
.emailBodyCell {
    padding-top: 0;
    padding-bottom: 32px;
    padding-left: 0;
    padding-right: 0;
}
.emailSummary {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
.emptyCell, .eBody .emptyCell, .highlight .emptyCell, .invoiceHead .space16, .emptyCell {
    line-height: 0 !important;
    font-size: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}
.eBody .space16, .invoiceHead .space16 {
    height: 16px;
    width: 16px;
}
.pdTp0, .eBox .pdTp0, .highlight.pdTp0, .eBody.pdTp0, .invoiceTable2 .pdTp0 {
    padding-top: 0px;
}
.pdTp32, .eBox .pdTp32, .highlight.pdTp32, .eBody.pdTp32, .invoiceTable2 .pdTp32 {
    padding-top: 32px;
}
.pdBt5, .eBox .pdBt5, .highlight.pdBt5, .eBody.pdBt5, .eBox .pdBt5, .invoiceTable2 .pdBt5 {
    padding-bottom: 5px;
}
.pdBt16, .eBox .pdBt16, .highlight.pdBt16, .eBody.pdBt16, .eBox .pdBt16, .invoiceTable2 .pdBt16 {
    padding-bottom: 16px;
}
.pdRg16, .eBox .pdRg16, .highlight.pdRg16, .eBody.pdRg16, .eBody .pdRg16, .invoiceTable2 .pdRg16 {
    padding-right: 16px;
}
.pdLf16, .eBox .pdLf16, .highlight.pdLf16, .eBody.pdLf16, .invoiceTable2 .pdLf16 {
    padding-left: 16px;
}
.width246, .width448 {
    text-align: left;
    vertical-align: top;
    width: 246px;
}
.eBox {
    width: 100%;
    min-width: 576px;
}
.blank {
    width: 544px;
}
.bottomCorners {
    height: 16px;
}
.eHeader_stretch, .eBody_stretch, .eFooter_stretch {
    min-width: 16px;
}
.eBox .btnLfTp, .eBox .btnLfBt, .eBox .btnRgTp, .eBox .btnRgBt {
    font-size: 0 !important;
    line-height: 100%;
    width: 4px;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eBox .btnRgTp, .eBox .btnRgBt {
    text-align: right;
}
.eBox .btnLfTp, .eBox .btnRgTp {
    vertical-align: top;
}
.eBox .btnLfBt, .eBox .btnRgBt {
    vertical-align: bottom;
}
.eBox .btnLfTp img, .eBox .btnLfBt img, .eBox .btnRgTp img, .eBox .btnRgBt img {
    font-size: 0 !important;
    line-height: 0 !important;
    width: 4px;
    height: 4px;
}
.eBox .btnLfTp img, .eBox .btnLfBt img {
    margin-left: 0;
    margin-right: auto;
}
.eBox .btnRgTp img, .eBox .btnRgBt img {
    margin-left: auto;
    margin-right: 0;
}
.eBox .btnMain {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 8px;
    padding-bottom: 8px;
    height: 20px;
    font-size: 18px;
    line-height: 20px;
    mso-line-height-rule: exactly;
    text-align: center;
    vertical-align: middle;
}
.mainBtn td {
    padding-bottom: 0;
}
.mainBtn a {
    font-weight: bold;
}
.tag .btnLfTp, .tag .btnLfBt, .tag .btnRgTp, .tag .btnRgBt {
    width: 2px;
    height: 2px;
}
.tag .btnLfTp img, .tag .btnLfBt img, .tag .btnRgTp img, .tag .btnRgBt img {
    width: 2px;
    height: 2px;
}
.tag .tagName {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    white-space: nowrap;
}
.tag .tag_space {
    background-color: transparent;
    font-size: 0 !important;
    line-height: 100%;
    height: 4px;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.eHeader, .highlight, .eBody {
    width: 512px;
}
.highlight, .eBody {
    padding-top: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    padding-right: 16px;
}
.eHeader {
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
}
.eHeaderLogo {
    height: 100px;
    font-size: 0 !important;
}
.eHeaderLogo, .eHeaderLogo a {
    height: 100px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
}
.eHeaderLogo a {
    line-height: 0;
}
.eHeaderLogo img {
    vertical-align: top;
}
.eHeaderLogoText {
    text-align: left;
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 0;
}
.eHeaderLogoText a {
    text-align: left;
    font-size: 26px;
    line-height: 32px;
    font-weight: bold;
}
.eFooter {
    text-align: center;
    font-size: 12px;
    line-height: 21px;
    padding-top: 14px;
    width: 544px;
}
.eFooter a, .eFooter a span {
    text-decoration: underline;
}
.highlight {
    text-align: center;
}
h1 {
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
}
.highlight p {
    font-size: 14px;
    line-height: 22px;
}
.eBody p, .eBody li {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
}
.eBody p a span {
    font-weight: bold;
}
h2 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 5px;
    font-weight: normal;
}
h2 span {
    font-weight: bold;
}
.invoiceHead, .invoiceHead td, .invoiceHead p {
    text-align: left;
    font-size: 12px;
}
.invoiceHead p {
    line-height: 19px;
}
h4 {
    font-size: 14px;
    font-weight: bold;
}
h4 span {
    font-size: 12px;
    font-weight: normal;
}
.invoiceTable2 th, .invoiceTable2 td {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 19px;
}
.invoiceTable2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    text-transform: uppercase;
}
.invoiceTable2 .subTotal {
    font-size: 14px;
    line-height: 22px;
}
.eTotal .amount {
    font-size: 16px;
    font-weight: bold;
}
.invoiceTable2 .prodDesc {
    width: 280px;
    font-size: 12px;
    line-height: 18px;
    padding-right: 0;
    text-align: left;
    vertical-align: top;
}
.invoiceTable2 .alignRight {
    text-align: right;
    vertical-align: top;
}
.invoiceTable2 .subTotal, .invoiceTable2 .eTotal {
    padding-top: 16px;
}
.invoiceTable2 .mobileHide {
    padding-right: 0;
}
.invoiceTable2 .prodImg {
    padding-right: 0;
    width: 80px;
}
a, a span {
    color: #235daa;
}
.entryBox p, .eBody, .invoiceTable2 th, .invoiceTable2 td, .invoiceTable2 p, h4, .subTotal .amount {
    color: #54565c;
}
.eHeaderLogo, .eHeaderLogo a, .eHeaderLogoText, .eHeaderLogoText a, .eHeaderLogoText span, .mainBtn a, .mainBtn a span, .tag .tagName, .defaultBtn a, .defaultBtn a span {
    color: #ffffff;
}
.eFooter {
    color: #b2b2b2;
}
.eFooter a, .eFooter a span {
    color: #808080;
}
.highlight p, .invoiceHead, .invoiceHead td, .invoiceHead p, .invoiceTable2 .subTotal, h4 span, .invoiceTable2 th, .invoiceTable2 .prodDesc, .label {
    color: #a1a2a5;
}
h1, h1 span, h2, h2 span {
    color: #465059;
}
.amount {
    color: #3cbff3;
}
.topCorners, .eHeader, .btnLfTp, .btnLfBt, .btnRgTp, .btnRgBt, .defaultBtn td, .eHeader_stretch {
    /*background-color: #235daa;*/
    background-color: #ffffff !important;
}
.bottomCorners, .ReadMsgBody, .ExternalClass, .eBody, .invoiceTable2, .invoiceTable2 td, .invoiceTable2 th, .eBody_stretch {
    background-color: #ffffff;
}
.highlight, .invoiceTable2 .subTotal, .highlight_stretch {
    background-color: #f6f6f7;
}
.mainBtn td {
    background-color: #7fbe56;
}
.tag td {
    background-color: #3cbff3;
}
.bottomLine, .invoiceTable2 th, .invoiceTable2 td, .eTotal {
    border-bottom: 1px solid #ebebeb;
}
@media only screen {
td[class=btnLfTp] img, td[class=btnRgTp] img, td[class=btnLfBt] img, td[class=btnRgBt] img {
    display: none !important;
    font-size: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    mso-hide: all;
    overflow: hidden !important;
    float: none !important;
    width: 0 !important;
    height: 0 !important;
}
td[class=btnLfTp] {
    -webkit-border-radius: 4px 0 0 0 !important;
    border-radius: 4px 0 0 0 !important;
}
td[class=btnRgTp] {
    -webkit-border-radius: 0 4px 0 0 !important;
    border-radius: 0 4px 0 0 !important;
}
td[class=btnRgBt] {
    -webkit-border-radius: 0 0 4px 0 !important;
    border-radius: 0 0 4px 0 !important;
}
td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 4px !important;
    border-radius: 0 0 0 4px !important;
}
td[class=btnMain] {
    padding: 0 !important;
}
td[class=btnMain] a {
    display: block !important;
    padding: 10px 18px !important;
    line-height: 26px !important;
}
table[class=tag] td {
    border-collapse: separate !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
table[class=tag] td[class=btnLfTp], table[class=tag] td[class=btnRgTp], table[class=tag] td[class=btnLfBt], table[class=tag] td[class=btnRgBt] {
    line-height: 2px !important;
}
td[class=tagName], td[class~=invoiceHead] td[class=tagName] {
    font-size: 11px !important;
    line-height: 14px !important;
}
table[class=tag] td[class=btnLfTp] {
    -webkit-border-radius: 2px 0 0 0 !important;
    border-radius: 2px 0 0 0 !important;
}
table[class=tag] td[class=btnRgTp] {
    -webkit-border-radius: 0 2px 0 0 !important;
    border-radius: 0 2px 0 0 !important;
}
table[class=tag] td[class=btnRgBt] {
    -webkit-border-radius: 0 0 2px 0 !important;
    border-radius: 0 0 2px 0 !important;
}
table[class=tag] td[class=btnLfBt] {
    -webkit-border-radius: 0 0 0 2px !important;
    border-radius: 0 0 0 2px !important;
}
}
@media only screen and (max-width: 576px) {
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    min-width: 0 !important;
}
}
@media only screen and (max-width: 560px) {
table[class=eBox] {
    min-width: 0 !important;
}
td[class=eHeader_stretch], td[class=highlight_stretch], td[class=eBody_stretch], td[class=eFooter_stretch] {
    display: none !important;
    width: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
}
table[id=emailBody], td[class=emailBodyCell], table[class=eBox], td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    display: block !important;
    width: auto !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    overflow: hidden !important;
}
td[class=width246], td[class~=width246], td[class~=subTotal], table[class=entryBox] td[class=alignLeft], td[class~=invoiceHead] table, td[class~=invoiceHead] td[class=alignLeft], td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight], td[class~=highlight] td[class=alignLeft] {
    width: 100% !important;
    display: block !important;
    padding-right: 0 !important;
}
td[class=highlight] h1, td[class~=highlight] h1 {
    font-size: 28px !important;
    line-height: 36px !important;
}
td[class=eBody] h2, td[class~=eBody] h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    margin-bottom: 8px !important;
}
strong[class=amount], td[class~=eTotal] span[class=amount] {
    font-size: 20px !important;
    line-height: 24px !important;
}
td[class=btnMain] a {
    font-size: 20px;
}
td[class~=invoiceHead] p[class=amount] {
    font-size: 18px !important;
    line-height: 26px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p, table[class=invoiceTable2] td, table[class~=invoiceTable2] td, h4, td[class~=highlight] h4 {
    font-size: 16px !important;
    line-height: 24px !important;
}
td[class=eBody] p, td[class~=eBody] p, td[class=highlight] p, td[class~=highlight] p {
    margin-bottom: 18px;
}
td[class~=invoiceHead] td, td[class~=invoiceHead] p, td[class~=highlight] h4 span {
    font-size: 14px !important;
    line-height: 21px !important;
}
td[class=highlight], td[class~=highlight], td[class=eBody], td[class~=eBody] {
    padding-top: 16px !important;
}
table[class=invoiceTable2], table[class~=invoiceTable2] {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left !important;
}
table[class=mainBtn], table[class~=mainBtn], table[class=defaultBtn], table[class~=defaultBtn] {
    width: 100% !important;
    margin: 0 !important;
}
table[class=invoiceTable2] td, table[class~=invoiceTable2] td {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    text-align: left !important;
    padding-right: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodImg] {
    width: 100% !important;
    display: block !important;
    height: 1px !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}
td[class~=prodImg] img {
    position: absolute !important;
    right: 16px !important;
    top: 16px !important;
}
table[class~=invoiceTable2] td {
    padding-left: 16px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc], table[class~=invoiceTable2] td[class~=alignRight] {

    padding-right: 112px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc], table[class~=invoiceTable3] td[class~=alignRight] {
    padding-right: 16px !important;
    border-bottom: 0 !important;
}
table[class~=invoiceTable3] td[class~=prodDesc] {
    border-top: 1px solid #ebebeb !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=alignRight] {
    padding-top: 4px !important;
}
table[class~=invoiceTable2] td[class~=prodDesc] {
    font-size: 14px !important;
    line-height: 21px !important;
}
table[class~=invoiceTable2] td[class~=eTotal] {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
table[class~=invoiceTable2] td[class~=eTotal] span[class=amount] {
    display: block !important;
    padding-bottom: 16px !important;
}
td[class=highlight pdBt16 alignLeft] td[class=alignLeft] {
 padding-right: 0 !important;
 text-align: center !important;
}
span[class=desktopHide] {
    display: inline-block !important;
    font-size: inherit !important;
    max-height: none !important;
    line-height: inherit !important;
    padding-right: 6px !important;
    overflow: visible !important;
    width: auto !important;
}
td[class=mobileHide], td[class~=mobileHide], table[class~=invoiceTable2] th {
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
}
</style>

    
    <style type="text/css">
      @media only screen and (max-width: 640px){
        [class=appleLinks] a {color:#000000 !important; text-decoration: none;}
        span[class=appleLinksWhite] a {color:#ffffff !important; text-decoration: none !important;}
        td[class=shop-info] h1 { font-size:80px !important;line-height:84px !important;}
        td[class=shop-info] {font-size:30px !important; font-weight:normal !important; line-height:34px !important; color:#ffffff !important;}
        td[class=top-msg] {height:35px !important; font-weight:normal !important;}
        table[class=container] { width:100% !important;}
        table[class=container] td[class=total-top]{ font-size:24px !important; font-weight:normal !important;}
        table[class=container] span[class=total-amt]{ font-size:80px !important;}
        td[class=product] {min-width:640px !important;}
        table[class=product-photo] {width:86px !important; height:86px !important;display:none;}
        table[class=product-photo] td {max-width:86px !important;}
        table[class=product-photo] td img {height:86px !important;}
        table[class=product-name] {width:440px !important; height:86px !important; }
        table[class=product-name] td {font-size:30px !important;line-height:34px !important; font-weight:normal !important;}
        table[class=product-name] td span[class=product-variants] {font-size:28px !important; line-height:32px; font-weight:300 !important;}
        table[class=product-modifier] {width:640px !important; height:50px !important;}
        table[class=product-modifier] td{ padding:0 0 0 25px !important; font-size:26px !important; font-weight:300 !important;}
        table[class=product-price] {width:200px !important; height:86px !important;}
        table[class=product-price] td{font-size:30px !important; line-height:34px !important; font-weight:normal !important;}
        table[class=payment] {width:640px !important;}
        table[class=payment-icon] {display:none !important;}
        table[class=subtotal-desc], table[class=payment-desc], table[class=due-desc] {width:440px !important;}
        table[class=subtotal-amt], table[class=payment-amt], table[class=due-amt] {width:200px !important;}
        table[class=subtotal-desc] td, table[class=payment-desc] td, table[class=due-desc] td{font-size:28px !important;line-height:32px !important;font-weight:normal !important;}
        table[class=subtotal-amt] td, table[class=payment-amt] td, table[class=due-amt] td{font-size:30px !important;line-height:34px !important;font-weight:normal !important;}
        span[class=payment-details] {font-size:20px  !important;line-height:22px !important;}
        table[class=footer] td[class=shop-callout] {font-size:28px !important;line-height:32px !important;padding:25px 0 0 !important; font-weight:300 !important;}
        table[class=footer] a[class=shop-url] {font-size:30px !important;line-height:32px !important;padding:25px 0 0 !important; font-weight:normal !important;}
        table[class=footer] td img{height:45px;}
        table[class=footer] td span[class=shopify-callout] {line-height:50px!important;}
      }
    </style>
  </head>
  <body style="padding:0;margin:0;">

        <table class="receipt" width="100%" align="center" border="0" cellpadding="0" cellspacing="0">         
          <tr>
            <td class="eHeaderLogo" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 0 !important;font-weight: bold;color: #ffffff;text-align: center;">
<a class="logo" href="{{ shop.url }}" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;display: inline-block;text-decoration: none;color: #ffffff;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;height: 100px;text-align: left;font-size: 18px;font-weight: bold;line-height: 0;"><img class="imageFix" src="{{ 'email-logo.png' | file_url }}" alt="{{ shop_name }}" height="100" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;height: 100px;width: auto;line-height: 100%;outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;vertical-align: top;"></a>
              {% if location.address1 != blank %}
              <span class="appleLinksWhite" style="color:{{ header_font_color }} !important; text-decoration: none !important;" >{{ location.address1 }}<br/>{% if location.address2 != blank %}{{ location.address2 }}<br/>{% endif %}{{ location.city }}, {{ location.province }}<br/>{{ location.zip }}</span>
              {% endif %}
              </td>
          </tr>

          <tr>
            <td>
            <table class="container" width="800" align="center" border="0" cellpadding="0" cellspacing="0" >
              <tr><td>&nbsp;</td></tr>
              <tr><td>            <p style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 24px;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;-webkit-text-size-adjust: none;  color: #000000 !important;  font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif;  font-size: 20px;  font-weight: 200;text-align: center;">Thanks for your recent purchase with {{ shop_name }}!</p></td></tr>
              <tr>
                <td class="total-top" style="padding:50px 0; text-align:center; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size: 18px;" >
                  TOTAL
                <br/>
                <span class="total-amt" style="padding:20px; color:{{ header_bg_color }}; font-size:60px;font-weight:200; line-height:66px;">
                  {{ total_price | money }}
                </span>
                </td>
              </tr>

              <!-- PRODUCTS -->
              {% for line in line_items %}
              <tr>
                <td class="product" style="border-top:1px solid #dddddd;min-width:800px;">
                  {% assign totalLineDiscount = 0 %}
                  {% for line_discount in line.applied_discounts %}
                  {% assign totalLineDiscount = totalLineDiscount | plus: line_discount.amount %}
                  {% endfor %}

                  {% assign line_total = (line.price | times: line.quantity) %}
                  <!-- PRODUCT PHOTO -->
                  <table class="product-photo" width="100" align="left" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                      <td valign="middle" style="max-width:100px; overflow:hidden;">
                        <img src="{{ line | img_url: 'small' }}" alt="{{ line.product.title }}" height="100px"/>
                      </td>
                    </tr>
                  </table>
                  <!-- PRODUCT NAME -->
                  <table class="product-name" width="500" height="100" align="left" border="0" cellpadding="0" cellspacing="0" >
                    <tr>
                      <td valign="middle" style="padding-left:25px;text-align:left; color:#000000 !important; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:20px;font-weight:200; line-height:26px;" >
                        {{ line.product.title | default: line.title }}
                        {% if line.variant.title != 'Default Title' %}<br/>
                        <!-- PRODUCT VARIANTS -->
                        <span class="product-variants" style="font-size:18px;color:#666666;">{{ line.variant.title }}</span>
                        {% endif %}
                      </td>
                    </tr>
                  </table>
                  <!-- PRODUCT PRICE -->
                  <table class="product-price" width="200" height="100" align="left" border="0" cellpadding="0" cellspacing="0" >
                      <tr>
                        <td valign="middle" style="padding-right:30px;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:28px;">
                          {{ line_total | minus: totalLineDiscount | money }}
                        </td>
                      </tr>
                  </table>
                </td>
              </tr>
                  <!-- PRODUCT MODIFIER -->
              {% if line.quantity > 1  or line.applied_discounts.size > 0%}
              <tr>
                <td>
                  <table class="product-modifier" width="800" height="30" align="left" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                      <td valign="middle" style=" background-color:#f3f3f3; padding-left:125px;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; text-align:left; color:#4c4c4c; font-size:16px;font-weight:200; line-height:20px;">
                        {% if line.quantity > 1 %}
                        ({{ line.quantity }} @ {{ line.price | money }})
                        {% endif %}

                        {% for discount in line.applied_discounts %}
                        {% if discount.description != "" %}{{ discount.description }} -{{ discount.amount | money }} {% else %} -{{ discount.amount | money }} {% endif %}
                        {% endfor %}
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              {% endif %}

              {% endfor %}

              <!-- SUBTOTAL INFO -->

              <tr>
                <td style="border-top:1px solid #dddddd;padding:40px 0 10px !important;">
                  <table class="subtotal"  align="center" border="0" cellpadding="0" cellspacing="0" >

                      <!-- CART DISCOUNTS -->
                      {% if discounts %}
                      <tr>
                        <td>
                            <table class="subtotal-desc" width="600" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                              <tr>
                                <td valign="top" style="padding-top:3px;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                                  DISCOUNT ({{ discounts.first.code }})
                                </td>
                              </tr>
                            </table>
                            <table class="subtotal-amt" width="200" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                              <tr>
                                <td valign="top" width="200" style="padding-right:30px;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:28px;">
                                  {{ discounts_savings | money }}
                                </td>
                              </tr>
                            </table>
                          </td>
                      </tr>
                      {% endif %}

                      <!-- SUBTOTAL -->
                      <tr>
                        <td>
                            <table class="subtotal-desc" width="600" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                              <tr>
                                <td valign="top" style="padding-top:3px;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                                  SUBTOTAL
                                </td>
                              </tr>
                            </table>
                            <table class="subtotal-amt" width="200" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                              <tr>
                                <td valign="top" width="200" style="padding-right:30px;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:28px;">
                                  {{ subtotal_price | money }}
                                </td>
                              </tr>
                            </table>
                        </td>
                      </tr>

                      <!-- TAXES -->
                      {% for tax_line in tax_lines %}
                      <tr>
                        <td>
                          <table class="subtotal-desc" width="600" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td valign="top" style="padding-top:3px;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                                {{ tax_line.title }} ({{tax_line.rate | times:100}}%)
                              </td>
                            </tr>
                          </table>
                          <table class="subtotal-amt" width="200" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td valign="top" width="200" style="padding-right:30px;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:28px;">
                                {{ tax_line.price | money }}
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      {% endfor %}

                      <!-- TOTAL -->
                      <tr>
                        <td>
                          <table class="subtotal-desc" width="600" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td valign="top" style="padding-top:3px;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                                TOTAL
                              </td>
                            </tr>
                          </table>
                          <table class="subtotal-amt" width="200" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td valign="top" width="200" style="padding-right:30px;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:28px;">
                                {{ total_price | money }}
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>

                  </table>
                </td>
              </tr>

              <!-- PAYMENT INFO -->
              {% assign has_been_refunded = false %}
              {% if transactions != blank %}

              <tr>
                <td style="border-top:1px solid #dddddd;padding:45px 0 0px;">
                    {% assign total_paid = 0 %}
                    {% assign change_info = '' %}

                    {% for transaction in transactions %}

                          {% if transaction.status == 'success' or transaction.status == null %}
                            {% assign card = null %}

                          {% if transaction.kind == 'refund' %}
                            {% assign kind = 'refunded' %}
                            {% assign has_been_refunded = true %}
                          {% else %}
                            {% assign kind = transaction.kind %}
                          {% endif %}

                          {% if transaction.kind == 'sale' or transaction.kind == 'capture' %}
                            {% assign total_paid = total_paid | plus: transaction.amount %}
                          {% elsif transaction.kind == 'change' or transaction.kind == 'refund' %}
                            {% assign total_paid = total_paid | minus: transaction.amount %}
                          {% endif %}

                          {% if transaction.gateway == 'shopify_payments' %}

                            {% assign payment = transaction.receipt.card.type %}
                            {% assign card = transaction.receipt.card.last4 %}

                            {% if kind == 'sale' %}
                              {% assign kind = 'approved' %}
                            {% endif %}

                          {% else %}

                            {% case transaction.gateway %}
                              {% when 'external-credit' %}
                                {% assign payment = transaction.receipt.payment_details.credit_card_company %}
                              {% when 'external-debit' %}
                                {% assign payment = 'debit' %}
                              {% else %}
                                {% assign payment = transaction.gateway %}
                            {% endcase %}

                            {% if kind == 'sale' %}
                              {% assign kind = null %}
                            {% endif %}

                          {% endif %}

                          {% assign transaction_img = '' %}
                          {% assign paymentTypeLower = (payment | downcase) %}

                          {% if paymentTypeLower == 'store-credit' %}
                            {% assign transaction_img = 'mobile-receipt-storecredit.png' | file_url %}
                          {% elsif paymentTypeLower == 'visa' %}
                            {% assign transaction_img = 'mobile-receipt-visa.png' | file_url %}
                          {% elsif paymentTypeLower == 'mastercard' %}
                            {% assign transaction_img = 'mobile-receipt-mastercard.png' | file_url %}
                          {% elsif paymentTypeLower == 'amex' or paymentTypeLower == 'american express' %}
                            {% assign transaction_img = 'mobile-receipt-amex.png' | file_url %}
                          {% elsif paymentTypeLower == 'discover' %}
                            {% assign transaction_img = 'mobile-receipt-discover.png' | file_url %}
                          {% elsif paymentTypeLower == 'diners-club' or paymentTypeLower == 'diners club' %}
                            {% assign transaction_img = 'mobile-receipt-dinersclub.png' | file_url %}
                          {% elsif paymentTypeLower == 'jcb' %}
                            {% assign transaction_img = 'mobile-receipt-credit.png' | file_url %}
                          {% elsif paymentTypeLower == 'debit' %}
                            {% assign transaction_img = 'mobile-receipt-debit.png' | file_url %}
                          {% endif %}

                          {% capture table_cell %}
                          <table class="payment" width="800" height="60" align="center" border="0" cellpadding="0" cellspacing="0" >
                            <tr>
                              <td valign="top" style="padding:0 0 15px 0;">

                                <table class="payment-icon" width="360" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                                  <tr>
                                    <td valign="top" style="text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                                      {% if transaction_img != '' %}<img style="padding:0" alt="{{payment}} Icon" src='{{transaction_img}}' />{% endif %}
                                    </td>
                                  </tr>
                                </table>
                                <table class="payment-desc" width="240" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                                  <tr>
                                    <td valign="top" style="padding:2px 0 0 0;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">{% if kind == 'change' %}CHANGE DUE{% else %}{{payment|upcase}}{% endif %}
                                      {%if transaction.gateway == 'external-credit' or transaction.gateway == 'shopify_payments'%}<span class="payment-details" style="font-size:16px;line-height:20px;color:#4c4c4c;">{% if card %}<br/>Ends in {{ card }}{% endif %}<br/>{{ transaction.created_at | date: "%d/%m/%y %H:%M:%S %Z" }}
                                      </span>
                                      {% endif %}
                                    </td>
                                  </tr>
                                </table>
                                <table class="payment-amt" width="200" height="60" align="left" border="0" cellpadding="0" cellspacing="0">
                                  <tr>
                                    <td valign="top" width="200" style="padding:0 30px 0 0;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:22px;">
                                      {% if transaction.kind == 'refund'%}
                                      -{{ transaction.amount | money }}
                                      {% else %}
                                      {{ transaction.amount | money }}
                                      {% endif %}
                                    </td>
                                  </tr>
                                </table>
                          </td>
                        </tr>
                      </table>
                          {% endcapture %}
                            {% if kind != 'change' %}

                                  {{ table_cell }}

                            {% else %}
                              {% assign change_info = table_cell %}
                            {% endif %}
                          {% endif %}
                    {% endfor %}
                </td>
              </tr>

              <!-- CHANGE OR AMOUNT DUE -->
              {% if has_been_refunded == false %}
                {% assign balance_due = total_price | minus: total_paid %}
                {% if financial_status == 'partially_paid' or balance_due > 0 or change_info != '' %}
                <tr>
                  <td style="border-top:1px solid #dddddd;padding:45px 0 0;">
                    {% if change_info != '' %}
                      {{ change_info }}
                    {% elsif financial_status == 'partially_paid' or balance_due %}
                      <table class="due-desc" width="600" height="100" align="left" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                          <td valign="top"  style="padding:3px 0 0;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                            BALANCE DUE
                          </td>
                        </tr>
                      </table>
                      <table class="due-amt" width="200" height="100" align="left" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                          <td valign="top" width="200" style="padding:0 30px 0 0;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:22px;">
                            {{ balance_due | money }}
                          </td>
                        </tr>
                      </table>

                    {% endif %}
                  </td>
                </tr>
                {% endif %}
              {% endif %}
              {% else %}
              <tr>
                <td style="border-top:1px solid #dddddd;padding:45px 0 0;">
                    <table class="due-desc" width="600" height="100" align="left" border="0" cellpadding="0" cellspacing="0">
                      <tr>
                        <td valign="top"  style="padding:3px 0 0;text-align:right; color:#4c4c4c;font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:18px;font-weight:200; line-height:22px;">
                          BALANCE DUE
                        </td>
                      </tr>
                    </table>
                    <table class="due-amt" width="200" height="100" align="left" border="0" cellpadding="0" cellspacing="0">
                      <tr>
                        <td valign="top" width="200" style="padding:0 30px 0 0;text-align:right; color:#4c4c4c; font-family: Helvetica Neue, Helvetica, Proxima Nova, Arial, sans-serif; font-size:24px;font-weight:200; line-height:22px;">
                          {{ total_price | money }}
                        </td>
                      </tr>
                    </table>
                </td>
              </tr>
              {% endif %}
               <!-- FOOTER -->
              
            </table>
          </td>
        </tr>
        <tr>
                <td style="padding:60px 0 0 0;">
                  <table class="footer" width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="background-color: #f3f3f3;  text-align: center;">
        <tr>
          <td class="eFooter" style="margin-top: 0;margin-left: 0;margin-right: 0;margin-bottom: 0;padding-top: 14px;padding-bottom: 0;padding-left: 0;padding-right: 0;border-collapse: collapse;border-spacing: 0;-webkit-text-size-adjust: none;font-family: Arial, Helvetica, sans-serif;text-align: center;font-size: 12px;line-height: 21px;width: 544px;color: #b2b2b2;"><a href="http://www.ONELIVEMedia.com" title="ONELIVE Media Website"><img src="{{ 'OLM-Email-Blk-200w.png' | file_url }}" title="ONELIVE Media" alt="ONELIVE Media" /></a><br /><br />&copy; 2016 {{ shop.name }}. All Rights Reserved.</td>

        </tr>
                    
                  </table>
                </td>
              </tr>
      </table>
  </body>
</html>

Leave a comment