pos-be/assets/email-template/redesign/invoice-midtrans.html

2038 lines
91 KiB
HTML

<!--
* This email was built using Tabular.
* For more information, visit https://tabular.email
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
lang="en"
>
<head>
<title>Invoice Midtrans</title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--[if !mso]>-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="x-apple-disable-message-reformatting" content="" />
<meta content="target-densitydpi=device-dpi" name="viewport" />
<meta content="true" name="HandheldFriendly" />
<meta content="width=device-width" name="viewport" />
<meta
name="format-detection"
content="telephone=no, date=no, address=no, email=no, url=no"
/>
<style type="text/css">
table {
border-collapse: separate;
table-layout: fixed;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
table td {
border-collapse: collapse;
}
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
body,
a,
li,
p,
h1,
h2,
h3 {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
html {
-webkit-text-size-adjust: none !important;
}
body,
#innerTable {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#innerTable img + div {
display: none;
display: none !important;
}
img {
margin: 0;
padding: 0;
-ms-interpolation-mode: bicubic;
}
h1,
h2,
h3,
p,
a {
line-height: inherit;
overflow-wrap: normal;
white-space: normal;
word-break: break-word;
}
a {
text-decoration: none;
}
h1,
h2,
h3,
p {
min-width: 100% !important;
width: 100% !important;
max-width: 100% !important;
display: inline-block !important;
border: 0;
padding: 0;
margin: 0;
}
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
u + #body a {
color: inherit;
text-decoration: none;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
line-height: inherit;
}
a[href^='mailto'],
a[href^='tel'],
a[href^='sms'] {
color: inherit;
text-decoration: none;
}
img,
p {
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 16px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h1 {
margin: 0;
margin: 0;
font-family: Roboto, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 34px;
font-weight: 400;
font-style: normal;
font-size: 28px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h2 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 30px;
font-weight: 400;
font-style: normal;
font-size: 24px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h3 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 26px;
font-weight: 400;
font-style: normal;
font-size: 20px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
</style>
<style type="text/css">
@media (min-width: 481px) {
.hd {
display: none !important;
}
}
</style>
<style type="text/css">
@media (max-width: 480px) {
.hm {
display: none !important;
}
}
</style>
<style type="text/css">
@media (min-width: 481px) {
h1,
img,
p {
margin: 0;
margin: 0;
}
img,
p {
font-family: Poppins, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 16px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h1 {
font-family: Roboto, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 34px;
font-weight: 400;
font-style: normal;
font-size: 28px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h2,
h3 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
font-weight: 400;
font-style: normal;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h2 {
line-height: 30px;
font-size: 24px;
}
h3 {
line-height: 26px;
font-size: 20px;
}
.t78 {
padding-left: 60px !important;
padding-right: 60px !important;
width: 510px !important;
}
.t26,
.t28,
.t34,
.t40,
.t42 {
width: 448px !important;
}
.t23,
.t25,
.t33,
.t38,
.t4,
.t44,
.t50,
.t55,
.t60,
.t65,
.t7 {
font-size: 16px !important;
}
.t20,
.t76 {
width: 510px !important;
}
.t19,
.t74 {
text-align: left !important;
}
.t73 {
max-width: 844px !important;
}
.t72 {
padding-left: 22px !important;
padding-right: 22px !important;
}
.t51,
.t57,
.t62,
.t67 {
width: 466px !important;
}
.t18 {
width: 30.89514% !important;
max-width: 356px !important;
}
.t11,
.t17 {
padding-left: 3px !important;
padding-right: 3px !important;
}
.t12 {
width: 69.10486% !important;
max-width: 806px !important;
}
.t1,
.t5 {
width: 346.43px !important;
}
.t0 {
font-size: 20px !important;
}
.t48 {
width: 482px !important;
}
}
</style>
<style type="text/css">
@media (min-width: 481px) {
[class~='x_t78'] {
padding-left: 60px !important;
padding-right: 60px !important;
width: 510px !important;
}
[class~='x_t28'] {
width: 448px !important;
}
[class~='x_t26'] {
width: 448px !important;
}
[class~='x_t25'] {
font-size: 16px !important;
}
[class~='x_t42'] {
width: 448px !important;
}
[class~='x_t34'] {
width: 448px !important;
}
[class~='x_t33'] {
font-size: 16px !important;
}
[class~='x_t40'] {
width: 448px !important;
}
[class~='x_t38'] {
font-size: 16px !important;
}
[class~='x_t23'] {
font-size: 16px !important;
}
[class~='x_t44'] {
font-size: 16px !important;
}
[class~='x_t76'] {
width: 510px !important;
}
[class~='x_t74'] {
text-align: left !important;
}
[class~='x_t73'] {
max-width: 844px !important;
}
[class~='x_t72'] {
padding-left: 22px !important;
padding-right: 22px !important;
}
[class~='x_t51'] {
width: 466px !important;
}
[class~='x_t50'] {
font-size: 16px !important;
}
[class~='x_t20'] {
width: 510px !important;
}
[class~='x_t19'] {
text-align: left !important;
}
[class~='x_t18'] {
width: 30.89514% !important;
max-width: 356px !important;
}
[class~='x_t17'] {
padding-left: 3px !important;
padding-right: 3px !important;
}
[class~='x_t12'] {
width: 69.10486% !important;
max-width: 806px !important;
}
[class~='x_t11'] {
padding-left: 3px !important;
padding-right: 3px !important;
}
[class~='x_t5'] {
width: 346.43px !important;
}
[class~='x_t4'] {
font-size: 16px !important;
}
[class~='x_t7'] {
font-size: 16px !important;
}
[class~='x_t1'] {
width: 346.43px !important;
}
[class~='x_t0'] {
font-size: 20px !important;
}
[class~='x_t48'] {
width: 482px !important;
}
[class~='x_t67'] {
width: 466px !important;
}
[class~='x_t65'] {
font-size: 16px !important;
}
[class~='x_t57'] {
width: 466px !important;
}
[class~='x_t55'] {
font-size: 16px !important;
}
[class~='x_t62'] {
width: 466px !important;
}
[class~='x_t60'] {
font-size: 16px !important;
}
}
</style>
<style type="text/css" media="screen and (min-width:481px)">
.moz-text-html img,
.moz-text-html p {
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 16px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
.moz-text-html h1 {
margin: 0;
margin: 0;
font-family: Roboto, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 34px;
font-weight: 400;
font-style: normal;
font-size: 28px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
.moz-text-html h2 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 30px;
font-weight: 400;
font-style: normal;
font-size: 24px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
.moz-text-html h3 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 26px;
font-weight: 400;
font-style: normal;
font-size: 20px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
.moz-text-html .t78 {
padding-left: 60px !important;
padding-right: 60px !important;
width: 510px !important;
}
.moz-text-html .t26,
.moz-text-html .t28 {
width: 448px !important;
}
.moz-text-html .t25 {
font-size: 16px !important;
}
.moz-text-html .t34,
.moz-text-html .t42 {
width: 448px !important;
}
.moz-text-html .t33 {
font-size: 16px !important;
}
.moz-text-html .t40 {
width: 448px !important;
}
.moz-text-html .t23,
.moz-text-html .t38,
.moz-text-html .t44 {
font-size: 16px !important;
}
.moz-text-html .t76 {
width: 510px !important;
}
.moz-text-html .t74 {
text-align: left !important;
}
.moz-text-html .t73 {
max-width: 844px !important;
}
.moz-text-html .t72 {
padding-left: 22px !important;
padding-right: 22px !important;
}
.moz-text-html .t51 {
width: 466px !important;
}
.moz-text-html .t50 {
font-size: 16px !important;
}
.moz-text-html .t20 {
width: 510px !important;
}
.moz-text-html .t19 {
text-align: left !important;
}
.moz-text-html .t18 {
width: 30.89514% !important;
max-width: 356px !important;
}
.moz-text-html .t17 {
padding-left: 3px !important;
padding-right: 3px !important;
}
.moz-text-html .t12 {
width: 69.10486% !important;
max-width: 806px !important;
}
.moz-text-html .t11 {
padding-left: 3px !important;
padding-right: 3px !important;
}
.moz-text-html .t5 {
width: 346.43px !important;
}
.moz-text-html .t4,
.moz-text-html .t7 {
font-size: 16px !important;
}
.moz-text-html .t1 {
width: 346.43px !important;
}
.moz-text-html .t0 {
font-size: 20px !important;
}
.moz-text-html .t48 {
width: 482px !important;
}
.moz-text-html .t67 {
width: 466px !important;
}
.moz-text-html .t65 {
font-size: 16px !important;
}
.moz-text-html .t57 {
width: 466px !important;
}
.moz-text-html .t55 {
font-size: 16px !important;
}
.moz-text-html .t62 {
width: 466px !important;
}
.moz-text-html .t60 {
font-size: 16px !important;
}
</style>
<!--[if !mso]>-->
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&amp;display=swap"
rel="stylesheet"
type="text/css"
/>
<!--<![endif]-->
<!--[if mso]>
<style type="text/css">
img,
p {
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 16px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h1 {
margin: 0;
margin: 0;
font-family: Roboto, BlinkMacSystemFont, Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 34px;
font-weight: 400;
font-style: normal;
font-size: 28px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h2 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 30px;
font-weight: 400;
font-style: normal;
font-size: 24px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
h3 {
margin: 0;
margin: 0;
font-family: Lato, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 26px;
font-weight: 400;
font-style: normal;
font-size: 20px;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
direction: ltr;
color: #333;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
}
td.t78 {
padding-left: 60px !important;
padding-right: 60px !important;
}
p.t23,
p.t25,
p.t33,
p.t38,
p.t44 {
font-size: 16px !important;
}
div.t74 {
text-align: left !important;
}
div.t73 {
max-width: 844px !important;
}
div.t72 {
padding-left: 22px !important;
padding-right: 22px !important;
}
p.t50 {
font-size: 16px !important;
}
div.t19 {
text-align: left !important;
}
div.t18 {
width: 30.89514% !important;
max-width: 356px !important;
}
div.t17 {
padding-left: 3px !important;
padding-right: 3px !important;
}
div.t12 {
width: 69.10486% !important;
max-width: 806px !important;
}
div.t11 {
padding-left: 3px !important;
padding-right: 3px !important;
}
p.t4,
p.t7 {
font-size: 16px !important;
}
p.t0 {
font-size: 20px !important;
}
p.t55,
p.t60,
p.t65 {
font-size: 16px !important;
}
</style>
<![endif]-->
<!--[if mso]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG />
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
</head>
<body
id="body"
class="t82"
style="
min-width: 100%;
margin: 0px;
padding: 0px;
background-color: #fafafa;
"
>
<div class="t81" style="background-color: #fafafa">
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
border="0"
align="center"
>
<tr>
<td
class="t80"
style="
font-size: 0;
line-height: 0;
mso-line-height-rule: exactly;
background-color: #fafafa;
"
valign="top"
align="center"
>
<!--[if mso]>
<v:background
xmlns:v="urn:schemas-microsoft-com:vml"
fill="true"
stroke="false"
>
<v:fill color="#FAFAFA" />
</v:background>
<![endif]-->
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
border="0"
align="center"
id="innerTable"
>
<tr>
<td align="center">
<table
class="t79"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="630" class="t78" style="background-color:#FFFFFF;padding:40px 30px 40px 30px;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t78"
style="
background-color: #ffffff;
width: 420px;
padding: 40px 30px 40px 30px;
"
>
<!--<![endif]-->
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
style="width: 100% !important"
>
<tr>
<td align="center">
<table
class="t21"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="510" class="t20" style="border-bottom:2px solid #EEEEEE;padding:25px 0 25px 0;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t20"
style="
border-bottom: 2px solid #eeeeee;
width: 420px;
padding: 25px 0 25px 0;
"
>
<!--<![endif]-->
<div
class="t19"
style="
display: inline-table;
width: 100%;
text-align: center;
vertical-align: middle;
"
>
<!--[if mso]>
<table role="presentation" cellpadding="0" cellspacing="0" align="left" valign="middle" width="510"><tr><td class="t8" style="width:3px;" width="3"></td><td width="346.43478" valign="middle"><![endif]-->
<div
class="t12"
style="
display: inline-table;
text-align: initial;
vertical-align: inherit;
width: 72.72727%;
max-width: 800px;
"
>
<div class="t11">
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
class="t10"
style="width: 100% !important"
>
<tr>
<td class="t9">
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
style="width: 100% !important"
>
<tr>
<td align="center">
<table
class="t2"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="346.4347826086956" class="t1">
<![endif]-->
<!--[if !mso]>-->
<td
class="t1"
style="
width: 305.45px;
"
>
<!--<![endif]-->
<p
class="t0"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 18px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 1px;
"
>
Dear,
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t3"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 3px;
line-height: 3px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t6"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="346.4347826086956" class="t5">
<![endif]-->
<!--[if !mso]>-->
<td
class="t5"
style="
width: 305.45px;
"
>
<!--<![endif]-->
<p
class="t4"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
{{customer_name}}
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center">
<p
class="t7"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
{{customer_phone}}
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<!--[if mso]>
</td><td class="t8" style="width:3px;" width="3"></td><td class="t14" style="width:3px;" width="3"></td><td width="151.56522" valign="middle"><![endif]-->
<div
class="t18"
style="
display: inline-table;
text-align: initial;
vertical-align: inherit;
width: 27.27273%;
max-width: 300px;
"
>
<div class="t17">
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
class="t16"
style="width: 100% !important"
>
<tr>
<td class="t15">
<div style="font-size: 0px">
<img
class="t13"
style="
display: block;
border: 0;
height: auto;
width: 100%;
margin: 0;
max-width: 100%;
"
width="151.56521739130434"
height="71.75"
alt=""
src="https://8234824b-7f15-48c8-b777-3f32f923a08d.b-cdn.net/e/4351c2e0-39c5-41f2-9de8-6f6b26ce62cb/a433c5fd-47d6-4c22-a90e-45cb28085a4a.png"
/>
</div>
</td>
</tr>
</table>
</div>
</div>
<!--[if mso]>
</td><td class="t14" style="width:3px;" width="3"></td>
</tr></table>
<![endif]-->
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t22"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 34px;
line-height: 34px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<p
class="t23"
style="
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont,
Segoe UI, Helvetica Neue, Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
Thank you for choosing us! We&#39;re absolutely
thrilled and can&#39;t wait to embark on this
exciting day with you. See you soon for fun
times ahead.
</p>
</td>
</tr>
<tr>
<td>
<div
class="t24"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 34px;
line-height: 34px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t29"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="510" class="t28" style="border:1px solid #E3E3E3;overflow:hidden;padding:20px 30px 20px 30px;border-radius:6px 6px 0 0;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t28"
style="
border: 1px solid #e3e3e3;
overflow: hidden;
width: 358px;
padding: 20px 30px 20px 30px;
border-radius: 6px 6px 0 0;
"
>
<!--<![endif]-->
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
style="width: 100% !important"
>
<tr>
<td align="center">
<table
class="t27"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="448" class="t26">
<![endif]-->
<!--[if !mso]>-->
<td
class="t26"
style="width: 358px"
>
<!--<![endif]-->
<p
class="t25"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
INVOICE RECAP
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center">
<table
class="t43"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="510" class="t42" style="border:1px solid #E3E3E3;padding:20px 30px 20px 30px;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t42"
style="
border: 1px solid #e3e3e3;
width: 358px;
padding: 20px 30px 20px 30px;
"
>
<!--<![endif]-->
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
style="width: 100% !important"
>
<tr>
<td align="center">
<table
class="t35"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="448" class="t34">
<![endif]-->
<!--[if !mso]>-->
<td
class="t34"
style="width: 358px"
>
<!--<![endif]-->
<p
class="t33"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
<span
class="t30"
style="
margin: 0;
margin: 0;
font-weight: 400;
mso-line-height-rule: exactly;
"
>Booking Date:</span
><span
class="t31"
style="
margin: 0;
margin: 0;
font-weight: bold;
mso-line-height-rule: exactly;
"
>
</span
><span
class="t32"
style="
margin: 0;
margin: 0;
font-weight: 700;
mso-line-height-rule: exactly;
"
>{{booking_date}}</span
>
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t39"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 10px;
line-height: 10px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t41"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="448" class="t40">
<![endif]-->
<!--[if !mso]>-->
<td
class="t40"
style="width: 358px"
>
<!--<![endif]-->
<p
class="t38"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI, Helvetica Neue,
Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
<span
class="t36"
style="
margin: 0;
margin: 0;
font-weight: 400;
mso-line-height-rule: exactly;
"
>Total Invoice: </span
><span
class="t37"
style="
margin: 0;
margin: 0;
font-weight: 700;
mso-line-height-rule: exactly;
"
>{{payment_total}}</span
>
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t45"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 34px;
line-height: 34px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<p
class="t44"
style="
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont,
Segoe UI, Helvetica Neue, Arial, sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
To keep things running smoothly, please ensure
your payment is completed.
</p>
</td>
</tr>
<tr>
<td>
<div
class="t46"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 34px;
line-height: 34px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t49"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="510" class="t48" style="background-color:#054FBF;overflow:hidden;text-align:center;line-height:24px;mso-line-height-rule:exactly;mso-text-raise:2px;padding:14px 14px 14px 14px;border-radius:4px 4px 4px 4px;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t48"
style="
background-color: #054fbf;
overflow: hidden;
width: 392px;
text-align: center;
line-height: 24px;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
padding: 14px 14px 14px 14px;
border-radius: 4px 4px 4px 4px;
"
>
<!--<![endif]-->
<a
class="t47"
href="{{payment_midtrans_url}}"
target="_blank"
style="
display: block;
margin: 0;
margin: 0;
font-family: Poppins, BlinkMacSystemFont,
Segoe UI, Helvetica Neue, Arial,
sans-serif;
line-height: 24px;
font-weight: 700;
font-style: normal;
font-size: 18px;
text-decoration: none;
direction: ltr;
color: #ffffff;
text-align: center;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>Click Here to Pay</a
>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t75"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 34px;
line-height: 34px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t77"
role="presentation"
cellpadding="0"
cellspacing="0"
style="margin-left: auto; margin-right: auto"
>
<tr>
<!--[if mso]>
<td width="510" class="t76" style="border-top:2px solid #EEEEEE;padding:25px 0 25px 0;">
<![endif]-->
<!--[if !mso]>-->
<td
class="t76"
style="
border-top: 2px solid #eeeeee;
width: 420px;
padding: 25px 0 25px 0;
"
>
<!--<![endif]-->
<div
class="t74"
style="
display: inline-table;
width: 100%;
text-align: center;
vertical-align: middle;
"
>
<!--[if mso]>
<table role="presentation" cellpadding="0" cellspacing="0" align="left" valign="middle" width="510"><tr><td class="t69" style="width:22px;" width="22"></td><td width="466" valign="middle"><![endif]-->
<div
class="t73"
style="
display: inline-table;
text-align: initial;
vertical-align: inherit;
width: 100%;
max-width: 810px;
"
>
<div
class="t72"
style="padding: 0 5px 0 5px"
>
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
class="t71"
style="width: 100% !important"
>
<tr>
<td class="t70">
<table
role="presentation"
width="100%"
cellpadding="0"
cellspacing="0"
style="width: 100% !important"
>
<tr>
<td align="center">
<table
class="t52"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="466" class="t51">
<![endif]-->
<!--[if !mso]>-->
<td
class="t51"
style="width: 600px"
>
<!--<![endif]-->
<p
class="t50"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 400;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
If you have any
questions or need
assistance, feel
free to reach out
to our support
team at:
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t53"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 14px;
line-height: 14px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td>
<div
class="t56"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 3px;
line-height: 3px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t58"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="466" class="t57">
<![endif]-->
<!--[if !mso]>-->
<td
class="t57"
style="width: 600px"
>
<!--<![endif]-->
<p
class="t55"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
<span
class="t54"
style="
margin: 0;
margin: 0;
font-weight: 400;
mso-line-height-rule: exactly;
"
>Customer
Service:</span
>
+62
823-2555-8803&nbsp;
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t61"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 3px;
line-height: 3px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t63"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="466" class="t62">
<![endif]-->
<!--[if !mso]>-->
<td
class="t62"
style="width: 600px"
>
<!--<![endif]-->
<p
class="t60"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
<span
class="t59"
style="
margin: 0;
margin: 0;
font-weight: 400;
mso-line-height-rule: exactly;
"
>Sales An
Pauji:</span
>
+62
813-3007-3660&nbsp;
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div
class="t66"
style="
mso-line-height-rule: exactly;
mso-line-height-alt: 3px;
line-height: 3px;
font-size: 1px;
display: block;
"
>
&nbsp;&nbsp;
</div>
</td>
</tr>
<tr>
<td align="center">
<table
class="t68"
role="presentation"
cellpadding="0"
cellspacing="0"
style="
margin-left: auto;
margin-right: auto;
"
>
<tr>
<!--[if mso]>
<td width="466" class="t67">
<![endif]-->
<!--[if !mso]>-->
<td
class="t67"
style="width: 600px"
>
<!--<![endif]-->
<p
class="t65"
style="
margin: 0;
margin: 0;
font-family: Poppins,
BlinkMacSystemFont,
Segoe UI,
Helvetica Neue,
Arial,
sans-serif;
line-height: 22px;
font-weight: 700;
font-style: normal;
font-size: 14px;
text-decoration: none;
text-transform: none;
direction: ltr;
color: #454545;
text-align: left;
mso-line-height-rule: exactly;
mso-text-raise: 2px;
"
>
<span
class="t64"
style="
margin: 0;
margin: 0;
font-weight: 400;
mso-line-height-rule: exactly;
"
>Sales An
Yudha:</span
>
+62 896-5531-8303
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<!--[if mso]>
</td><td class="t69" style="width:22px;" width="22"></td>
</tr></table>
<![endif]-->
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>