BCC (comma-separated)
tbd
From Name
[[VENUE NAME]]
From Email
tbd
Global Email Header
<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,initial-scale=1">
<title>Thank you for your Order: {{order_confirmation_no}}</title>
<style type="text/css">
@import url("https://fonts.googleapis.com/css?family=Work+Sans:100,300,400,500,600,700,800,900");
* {
font-family: "Work Sans", Helvetica, sans-serif;
}
/* /\/\/\/\/\/\/\/\/ CLIENT-SPECIFIC STYLES /\/\/\/\/\/\/\/\/ */
#outlook a {
padding: 0;
} /* Force Outlook to provide a "view in browser" message */
.ReadMsgBody {
width: 100%;
}
.ExternalClass {
width: 100%;
} /* Force Hotmail to display emails at full width */
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
} /* Force Hotmail to display normal line spacing */
body,
table,
td,
p,
a,
li,
blockquote {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
} /* Prevent WebKit and Windows mobile changing default text sizes */
table,
td {
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
} /* Remove spacing between tables in Outlook 2007 and up */
img {
-ms-interpolation-mode: bicubic;
} /* Allow smoother rendering of resized image in Internet Explorer */
/* /\/\/\/\/\/\/\/\/ RESET STYLES /\/\/\/\/\/\/\/\/ */
body {
margin: 0;
padding: 0;
}
img {
border: 0;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
}
table {
border-collapse: collapse !important;
}
body,
#bodyTable,
#bodyCell {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
}
.barcode {
display: block;
}
.barcodeLabel {
display: block;
}
/* /\/\/\/\/\/\/\/\/ TEMPLATE STYLES /\/\/\/\/\/\/\/\/ */
/* ========== Page Styles ========== */
#bodyCell {
padding: 20px;
}
#templateContainer {
width: 600px;
}
/**
* @tab Page
* @section background style
* @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
* @theme page
*/
body,
#bodyTable {
/*@editable*/
background-color: #efefef;
}
/**
* @tab Page
* @section background style
* @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
* @theme page
*/
#bodyCell {
}
/**
* @tab Page
* @section email border
* @tip Set the border for your email.
*/
#templateContainer {
/*@editable*/
border: 1px solid #bbbbbb;
background: #ffffff;
}
/**
* @tab Page
* @section heading 1
* @tip Set the styling for all first-level headings in your emails. These should be the largest of your headings.
* @style heading 1
*/
h1 {
/*@editable*/
color: #2a2a2a !important;
display: block;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 32px;
/*@editable*/
font-style: normal;
/*@editable*/
font-weight: 900;
/*@editable*/
line-height: 100%;
/*@editable*/
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
/*@editable*/
text-align: left;
}
/**
* @tab Page
* @section heading 2
* @tip Set the styling for all second-level headings in your emails.
* @style heading 2
*/
h2 {
/*@editable*/
color: #404040 !important;
display: block;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 20px;
/*@editable*/
font-style: normal;
/*@editable*/
font-weight: bold;
/*@editable*/
line-height: 100%;
/*@editable*/
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
/*@editable*/
text-align: left;
}
/**
* @tab Page
* @section heading 3
* @tip Set the styling for all third-level headings in your emails.
* @style heading 3
*/
h3 {
/*@editable*/
color: #606060 !important;
display: block;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 16px;
/*@editable*/
font-style: normal;
/*@editable*/
font-weight: bold;
/*@editable*/
line-height: 100%;
/*@editable*/
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
/*@editable*/
text-align: left;
}
/**
* @tab Page
* @section heading 4
* @tip Set the styling for all fourth-level headings in your emails. These should be the smallest of your headings.
* @style heading 4
*/
h4 {
/*@editable*/
color: #808080 !important;
display: block;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 14px;
/*@editable*/
font-style: italic;
/*@editable*/
font-weight: normal;
/*@editable*/
line-height: 100%;
/*@editable*/
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
/*@editable*/
text-align: left;
}
h1,
h2,
h3,
h4 {
line-height: 1.4em;
}
.bodyContent .btn:link,
.bodyContent .btn:visited,
.bodyContent .btn .yshortcuts {
background: #da4a3b;
color: #ffffff;
padding: 7px 20px;
display: inline-block;
text-decoration: none;
border-radius: 20px;
}
.btn {
display: inline-block;
font-weight: 400;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
padding: 0.375rem 0.75rem;
font-size: 1rem;
line-height: 1.5;
border-radius: 20px;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
text-decoration: none;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
}
.btn-primary {
background-color: #474747;
border-color: #474747;
color: #fff;
}
.salesReport {
padding-left: 20px;
}
/* ========== Header Styles ========== */
/**
* @tab Header
* @section header style
* @tip Set the background color and borders for your email's header area.
* @theme header
*/
#headerContainer {
/*@editable*/
background-color: #ffffff;
/*@editable*/
border-top: 1px solid #ffffff;
}
/**
* @tab Header
* @section header text
* @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
*/
.headerContent {
background: #2a2a2a;
/*@editable*/
color: #2a2a2a;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 20px;
/*@editable*/
font-weight: bold;
/*@editable*/
line-height: 100%;
/*@editable*/
padding-top: 0;
/*@editable*/
padding-right: 0;
/*@editable*/
padding-bottom: 0;
/*@editable*/
padding-left: 0;
/*@editable*/
text-align: left;
/*@editable*/
vertical-align: middle;
padding: 20px;
}
/**
* @tab Header
* @section header link
* @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
*/
.headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */ {
/*@editable*/
color: #474747;
/*@editable*/
font-weight: normal;
/*@editable*/
text-decoration: underline;
}
#headerImage {
/* height: auto;
max-width: 600px; */
max-height: 100px;
max-width: 400px;
}
/* ========== Body Styles ========== */
/**
* @tab Body
* @section body style
* @tip Set the background color and borders for your email's body area.
*/
#templateBody {
/*@editable*/
background-color: #ffffff;
}
/**
* @tab Body
* @section body text
* @tip Set the styling for your email's main content text. Choose a size and color that is easy to read.
* @theme main
*/
.bodyContent {
/*@editable*/
color: #2a2a2a;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 16px;
/*@editable*/
line-height: 150%;
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
/*@editable*/
text-align: left;
}
/**
* @tab Body
* @section body link
* @tip Set the styling for your email's main content links. Choose a color that helps them stand out from your text.
*/
.bodyContent a:link, .bodyContent a:visited, /* Yahoo! Mail Override */ .bodyContent a .yshortcuts /* Yahoo! Mail Override */ {
/*@editable*/
color: #474747;
/*@editable*/
font-weight: normal;
/*@editable*/
text-decoration: underline;
}
.bodyContent img {
display: inline;
height: auto;
max-width: 560px;
}
/* ========== Order Summary ========== */
#orderSummaryContainerWrapper {
padding: 0 20px;
}
#orderSummaryContainer {
border: 1px solid #2a2a2a;
}
/* ========== Directions ========== */
.directionsContainerWrapper {
padding: 0 20px;
padding-top: 30px;
}
.directionsHeader {
background: #16253a;
/*@editable*/
color: #ffffff;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 18px;
/*@editable*/
line-height: 150%;
text-align: center;
padding-top: 7px;
padding-right: 20px;
padding-bottom: 7px;
padding-left: 20px;
/*@editable*/
text-align: center;
}
.directionsMap img {
max-width: 100%;
}
/* ========== Column Styles ========== */
.leftColumnContainer {
width: 230px;
}
.rightColumnContainer {
width: 290px;
}
/**
* @tab Columns
* @section column style
* @tip Set the background color and borders for your email's column area.
*/
#templateColumns {
/*@editable*/
background-color: #ffffff;
}
/**
* @tab Columns
* @section left column text
* @tip Set the styling for your email's left column content text. Choose a size and color that is easy to read.
*/
.leftColumnContent {
/*@editable*/
color: #2a2a2a;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 14px;
/*@editable*/
line-height: 150%;
padding-top: 0;
padding-right: 20px;
padding-bottom: 0;
padding-left: 20px;
/*@editable*/
text-align: left;
}
/**
* @tab Columns
* @section left column link
* @tip Set the styling for your email's left column content links. Choose a color that helps them stand out from your text.
*/
.leftColumnContent a:link, .leftColumnContent a:visited, /* Yahoo! Mail Override */ .leftColumnContent a .yshortcuts /* Yahoo! Mail Override */ {
/*@editable*/
color: #474747;
/*@editable*/
font-weight: normal;
/*@editable*/
text-decoration: underline;
}
/**
* @tab Columns
* @section right column text
* @tip Set the styling for your email's right column content text. Choose a size and color that is easy to read.
*/
.rightColumnContent {
/*@editable*/
color: #2a2a2a;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 14px;
/*@editable*/
line-height: 150%;
padding-top: 0;
padding-right: 20px;
padding-bottom: 0;
padding-left: 20px;
/*@editable*/
text-align: left;
}
/**
* @tab Columns
* @section right column link
* @tip Set the styling for your email's right column content links. Choose a color that helps them stand out from your text.
*/
.rightColumnContent a:link, .rightColumnContent a:visited, /* Yahoo! Mail Override */ .rightColumnContent a .yshortcuts /* Yahoo! Mail Override */ {
/*@editable*/
color: #474747;
/*@editable*/
font-weight: normal;
/*@editable*/
text-decoration: underline;
}
.leftColumnContent img,
.rightColumnContent img {
display: inline;
height: auto;
max-width: 260px;
}
/* /\/\/\/\/\/\/\/\/ MOBILE STYLES /\/\/\/\/\/\/\/\/ */
@media only screen and (max-width: 480px) {
/* /\/\/\/\/\/\/ CLIENT-SPECIFIC MOBILE STYLES /\/\/\/\/\/\/ */
body,
table,
td,
p,
a,
li,
blockquote {
-webkit-text-size-adjust: none !important;
} /* Prevent Webkit platforms from changing default text sizes */
body {
width: 100% !important;
min-width: 100% !important;
} /* Prevent iOS Mail from adding padding to the body */
/* /\/\/\/\/\/\/ MOBILE RESET STYLES /\/\/\/\/\/\/ */
#bodyCell {
padding: 10px !important;
}
/* /\/\/\/\/\/\/ MOBILE TEMPLATE STYLES /\/\/\/\/\/\/ */
/* ======== Page Styles ======== */
/**
* @tab Mobile Styles
* @section template width
* @tip Make the template fluid for portrait or landscape view adaptability. If a fluid layout doesn't work for you, set the width to 300px instead.
*/
#templateContainer {
max-width: 600px !important;
/*@editable*/
width: 100% !important;
}
/**
* @tab Mobile Styles
* @section heading 1
* @tip Make the first-level headings larger in size for better readability on small screens.
*/
h1 {
/*@editable*/
font-size: 24px !important;
/*@editable*/
line-height: 100% !important;
}
/**
* @tab Mobile Styles
* @section heading 2
* @tip Make the second-level headings larger in size for better readability on small screens.
*/
h2 {
/*@editable*/
font-size: 20px !important;
/*@editable*/
line-height: 100% !important;
}
/**
* @tab Mobile Styles
* @section heading 3
* @tip Make the third-level headings larger in size for better readability on small screens.
*/
h3 {
/*@editable*/
font-size: 18px !important;
/*@editable*/
line-height: 100% !important;
}
/**
* @tab Mobile Styles
* @section heading 4
* @tip Make the fourth-level headings larger in size for better readability on small screens.
*/
h4 {
/*@editable*/
font-size: 16px !important;
/*@editable*/
line-height: 100% !important;
}
/* ======== Header Styles ======== */
#templatePreheader {
display: none !important;
} /* Hide the template preheader to save space */
/**
* @tab Mobile Styles
* @section header image
* @tip Make the main header image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
*/
#headerImage {
/* height: auto !important; */
/*@editable*/
/* max-width: 600px !important; */
max-height: 100px;
max-width: 400px;
}
/**
* @tab Mobile Styles
* @section header text
* @tip Make the header content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
*/
.headerContent {
/*@editable*/
font-size: 20px !important;
/*@editable*/
line-height: 125% !important;
}
/* ======== Body Styles ======== */
/**
* @tab Mobile Styles
* @section body text
* @tip Make the body content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
*/
.bodyContent {
/*@editable*/
font-size: 18px !important;
/*@editable*/
line-height: 125% !important;
}
/* ======== Column Styles ======== */
.leftColumnContainer {
display: block !important;
width: 100% !important;
padding-bottom: 20px;
}
.rightColumnContainer {
display: block !important;
width: 100% !important;
}
/**
* @tab Mobile Styles
* @section column image
* @tip Make the column image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
*/
.columnImage {
height: auto !important;
/*@editable*/
max-width: 480px !important;
/*@editable*/
width: 100% !important;
}
/**
* @tab Mobile Styles
* @section left column text
* @tip Make the left column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
*/
.leftColumnContent {
/*@editable*/
font-size: 16px !important;
/*@editable*/
line-height: 125% !important;
}
/**
* @tab Mobile Styles
* @section right column text
* @tip Make the right column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
*/
.rightColumnContent {
/*@editable*/
font-size: 16px !important;
/*@editable*/
line-height: 125% !important;
}
}
/* /\/\/\/\/\/\/\/\/\/\ STANDARD STYLING: FOOTER /\/\/\/\/\/\/\/\/\/\ */
/**
* @tab Footer
* @section footer style
* @tip Set the background color and top border for your email's footer area.
* @theme footer
*/
#templateFooter {
/*@editable*/
background-color: #ffffff;
/*@editable*/
border-top: 0;
}
/**
* @tab Footer
* @section footer text
* @tip Set the styling for your email's footer text. Choose a size and color that is easy to read.
* @theme footer
*/
#templateFooter {
}
.templateFooterContainer {
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
border-top: 1px solid #cccccc;
}
.footerContent {
/*@editable*/
color: #707070;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 12px;
/*@editable*/
line-height: 125%;
/*@editable*/
text-align: center;
/*@editable*/
color: #2a2a2a;
/*@editable*/
font-family: "Work Sans", Helvetica, sans-serif;
/*@editable*/
font-size: 14px;
/*@editable*/
line-height: 150%;
/*@editable*/
text-align: left;
}
/**
* @tab Footer
* @section footer link
* @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
*/
.footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts /* Yahoo! Mail Override */ {
/*@editable*/
color: #336699;
/*@editable*/
font-weight: normal;
/*@editable*/
text-decoration: underline;
}
.footerContent img {
display: inline;
}
/**
* @tab Footer
* @section utility bar style
* @tip Set the background color and border for your email's footer utility bar.
* @theme footer
*/
#utility {
/*@editable*/
background-color: #ffffff;
/*@editable*/
border: 0;
}
/**
* @tab Footer
* @section utility bar style
* @tip Set the background color and border for your email's footer utility bar.
*/
#utility div {
/*@editable*/
text-align: center;
}
#monkeyRewards img {
max-width: 190px;
}
</style>
</head>
<body
leftmargin="0"
marginwidth="0"
topmargin="0"
marginheight="0"
offset="0"
>
<center>
<table
align="center"
border="0"
cellpadding="0"
cellspacing="0"
height="100%"
width="100%"
id="bodyTable"
>
<tbody>
<tr>
<td align="center" valign="top" id="bodyCell">
<!-- BEGIN TEMPLATE // -->
<table
border="0"
cellpadding="0"
cellspacing="0"
id="templateContainer"
>
<!-- Begin Header // -->
<tbody>
<tr>
<td align="center" valign="top">
<table
border="0"
cellpadding="0"
cellspacing="0"
width="100%"
id="headerContainer"
>
<tbody>
<tr>
<td valign="top" class="headerContent">
<img
src="https://www.tessera-tickets.com/wp-content/uploads/2022/02/cropped-tessera-logo.png"
id="headerImage"
/>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<!-- // End Header -->
Global Email Footer
<tr>
<td align="center" valign="top" id="" class="">
<table
border="0"
cellpadding="0"
cellspacing="0"
width="100%"
id=""
>
<tbody>
<tr mc:repeatable="">
<td align="center" valign="top" class="">
<table
border="0"
cellpadding="20"
cellspacing="0"
width="100%"
>
<tbody>
<tr>
<td style="padding-top: 30px;">
<div>
<strong style="color: #474747;"
>[[VENUE NAME]]</strong
>
</div>
<a
href="https://goo.gl/maps/EUA3iJoJEASsVuJp8"
style="color: #474747;"
>
[[VENUE STREET ADDRESS]]<br>
[[VENUE CITY, STATE ZIP]]<br /></a
><br /><br />
<a
href="tel:8779876487"
style="color: #474747;"
>[[VENUE PHONE]]</a
><br /><br />
<div>
<a
href="https://www.facebook.com/[[VENUE HANDLE]]/"
><img
src="https://www.tessera-tickets.com/wp-content/uploads/2022/05/footer-facebook.png"
alt="Facebook"
/></a>
<a
href="https://www.instagram.com/[[VENUE HANDLE]]/"
><img
src="https://www.tessera-tickets.com/wp-content/uploads/2022/05/footer-instagram.png"
alt="Instagram"
/></a>
<a href="https://twitter.com/[[VENUE HANDLE]]/"
><img
src="https://www.tessera-tickets.com/wp-content/uploads/2022/05/footer-twitter.png"
alt="Twitter"
/></a>
</div>
</td>
</tr>
<tr>
<td colspan="3">
<span
style="font-size: 12px; font-weight: 300; color: #2a2a2a;"
>© {{current_year}} [[VENUE NAME]]
</span
>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- // END TEMPLATE -->
</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
