I am trying to code a section that works in Outlook as well as other browsers. I have attached the code below, I have run quite a few different VML, but it keeps breaking. Is anyone familiar with making this work in Outlook?
<!--Background Image Section-->
<table class="mktoModule" mktoName="Background Image Section" id="bgImageSection" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td background="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" height="645" style="background:#fffffe url('https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png') no-repeat center center / cover; background-size:cover;background-position:center center;background-repeat:no-repeat;padding:10px 40px 10px 40px;vertical-align:top;height:645px;">
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:100%; height:645px;">
<v:fill type="frame" src="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" color="#fffffe" />
<v:textbox inset="0,0,0,0">
<![endif]-->
<div class="headerText mktoText" id="bgHeaderText1" mktoName="BG Header Text 1">HERE IS YOUR WHITE PAPER</div>
<div style="text-align:center; margin-top:70px; margin-bottom:25px;"><img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/V3_RR_6.8.23_5_Used_EV_Reconditioning_Whitepaper_Autoresponder_Booklet.png?version=0"></div>
<div class="headerText1 mktoText" id="bgHeaderText2" mktoName="BG Header Text 2">Used EV Reconditioning Implications for Auto Dealers</div>
<div style="text-align:center; margin-top:50px; margin-bottom:20px;">
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0" class="mktoText" id="button1" mktoname="Download Button" style="border-collapse:separate;width:225px;line-height:100%;">
<tr>
<td bgcolor="${btn-bgcolor2}" style="border:none;border-radius:60px 60px 60px 60px;cursor:auto;mso-padding-alt:12px 0px 12px 0px;background:#f96e11;" valign="top"><a href="https://my.rapidrecon.com/l/708083/2023-06-14/tz5c8/708083/16867612888EoZj5oz/Used_EV_Recon_Implications_For_Auto_Dealers_v230613.pdf/?utm_medium=email&utm_source=SLX" style="display:inline-block;width:225px;background:#f96e11;color:#ffffff;font-family:Raleway,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:100%;margin:0;text-decoration:none;text-transform:none;padding:12px 0px 12px 0px;mso-padding-alt:0;border-radius:60px 60px 60px 60px;" target="_blank"><span style="font-size:16px;font-family:Raleway,Arial,sans-serif;font-weight:700;color:#ffffff;line-height:119%;">Click Here to Download</span></a></td>
</tr>
</table>
</div>
<!--[if mso]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>
<!--END Background Image Section-->
you will need something like this going before your standard HTML background stuff (you'll need to swap variable names and stuff):
<v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="display: inline-block;width:600px;height:${mkto-campaign-banner-height}px;" src="${mkto-campaign-banner-background}" href="${mkto-cta-ur}" />
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="display: inline-block;position:absolute;width:600px;height:${mkto-campaign-banner-height}px;">
<v:fill opacity="0%" color="${mkto-image-bg-color}" />
<v:textbox inset="0,0,0,0">
and at the end
</v:textbox>
</v:rect>
I make extensive use of Outlook background images. This should work for you
The background is working, but all my text within is broken.
what is it supposed to look like. What did you try after using my snippets?
Can you post your latest code, and a screenshot of the working standard HTML version
Cheers
Jo
Hi @kenmckown, please use this code.
<!--Background Image Section-->
<table class="mktoModule" mktoName="Background Image Section" id="bgImageSection" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td background="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" height="645" style="background:#fffffe url('https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png') no-repeat center center / cover; background-size:cover;background-position:center center;background-repeat:no-repeat;padding:10px 40px 10px 40px;vertical-align:top;">
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:100%; height:645px;">
<v:fill type="frame" src="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" color="#fffffe" />
<v:textbox inset="0,0,0,0">
<![endif]-->
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%;">
<tr>
<td><div class="headerText mktoText" id="bgHeaderText1" mktoName="BG Header Text 1">HERE IS YOUR WHITE PAPER</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="70"> </td></tr>
<tr>
<td style="text-align:center;"><div><img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/V3_RR_6.8.23_5_Used_EV_Reconditioning_Whitepaper_Autoresponder_Booklet.png?version=0"></div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
<tr>
<td><div class="headerText1 mktoText" id="bgHeaderText2" mktoName="BG Header Text 2">Used EV Reconditioning Implications for Auto Dealers</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="50"> </td></tr>
<tr>
<td>
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0" class="mktoText" id="button1" mktoname="Download Button" style="border-collapse:separate;width:225px;line-height:100%;">
<tr>
<td bgcolor="${btn-bgcolor2}" style="border:none;border-radius:60px 60px 60px 60px;cursor:auto;mso-padding-alt:12px 0px 12px 0px;background:#f96e11;" valign="top"><a href="https://my.rapidrecon.com/l/708083/2023-06-14/tz5c8/708083/16867612888EoZj5oz/Used_EV_Recon_Implications_For_Auto_Dealers_v230613.pdf/?utm_medium=email&utm_source=SLX" style="display:inline-block;width:225px;background:#f96e11;color:#ffffff;font-family:Raleway,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:100%;margin:0;text-decoration:none;text-transform:none;padding:12px 0px 12px 0px;mso-padding-alt:0;border-radius:60px 60px 60px 60px;" target="_blank"><span style="font-size:16px;font-family:Raleway,Arial,sans-serif;font-weight:700;color:#ffffff;line-height:119%;">Click Here to Download</span></a></td>
</tr>
</table>
</td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
</table>
<!--[if mso]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>
<!--END Background Image Section-->
Tried that code, and it broke the entire layout.
Hi @kenmckownm, I have added the same code in one of my template. it looks like this:
Please share the entire code to QA the same.
Thanks,
Disha
OK, here is my entire code:
<!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">
<head>
<title>Email</title>
<meta class="mktoColor" id="BodyBGColor" mktoName="Body Background Color" default="#eff0f4" />
<meta class="mktoColor" id="blue_bg_color" mktoName="Background Color" default="#132C65" mktoModuleScope="true">
<meta class="mktoColor" id="grey_bg_color" mktoName="Background Color" default="#f5f5f5" mktoModuleScope="true">
<meta class="mktoColor" id="dark_grey_bg_color" mktoName="Background Color" default="#54565a" mktoModuleScope="true">
<meta class="mktoColor" id="tire_bg_color" mktoName="Background Color" default="#262626" mktoModuleScope="true">
<meta class="mktoColor" id="black_bg_color" mktoName="Background Color" default="#000000" mktoModuleScope="true">
<meta class="mktoColor" id="yellow_bg_color" mktoName="Background Color" default="#ffce01" mktoModuleScope="true">
<meta class="mktoColor" id="red_bg_color" mktoName="Background Color" default="#ef5a2c" mktoModuleScope="true">
<meta mktoModuleScope="true" class="mktoColor" id="whiteBGColor" mktoName="Background Color" default="#ffffff" />
<meta mktoModuleScope="true" class="mktoColor" id="greyBGColor" mktoName="Background Color" default="#4c4d52" />
<meta mktoModuleScope="true" class="mktoColor" id="redBGColor" mktoName="Background Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space1" mktoname="Top Space" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space10" mktoname="Top Space" default="10" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space20" mktoname="Top Space" default="20" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space1" mktoname="Bottom Space" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space10" mktoname="Bottom Space" default="10" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space20" mktoname="Bottom Space" default="20" step="1" min="0" max="100" />
<meta mktomodulescope="true" class="mktoList" id="logo-alignment" mktoName="Logo Alignment" default="center" values="center,right,left">
<meta mktomodulescope="true" class="mktoList" id="logo-alignment-bar" mktoName="Logo Alignment" default="left" values="center,right,left">
<meta mktomodulescope="true" class="mktoList" id="text-alignment" mktoName="Text Alignment" default="left" values="center,right,left">
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor" mktoName="Button BG Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor1" mktoName="Button BG Color" default="#f0f0f0" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor2" mktoName="Button BG Color" default="#f96e11" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color" mktoName="Button Border Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color1" mktoName="Button Border Color" default="#f0f0f0" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color2" mktoName="Button Border Color" default="#f96e11" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-text-color" mktoName="Button Text Color" default="#ffffff" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-text-color1" mktoName="Button Text Color" default="#666666" />
<meta mktoModuleScope="true" class="mktoString" id="btn-cta-url" mktoName="Button Url" default="#" />
<meta mktoModuleScope="true" class="mktoString" id="btn-cta-text" mktoName="Button Text" default="Lorem ipsum dolor sit" />
<meta mktomodulescope="true" class="mktoList" id="btn-alignment" mktoName="Button Alignment" default="center" values="center,right,left">
<meta mktoModuleScope="true" class="mktoColor" id="border-bgcolor" mktoName="Border Color" default="#cac9cf" />
<meta mktoModuleScope="true" class="mktoList" id="border-alignment" mktoname="Border Alignment" default="center" values="left,center,right" />
<meta mktoModuleScope="true" class="mktoNumber" id="border-width" mktoName="Border Width(in %)" default="100" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="border-height" mktoName="Border Height" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="spacer" mktoname="Spacer Height" default="10" step="1" min="0" max="100" />
<meta mktomodulescope="true" class="mktoList" id="social-alignment" mktoName="Social Icons Alignment" default="right" values="center,right,left">
<!--Background Image-->
<meta class="mktoColor" id="SectionID-bg-color" mktoName="Section: BgColor" default="#54565A" mktoModuleScope="true">
<meta class="mktoString" id="SectionID-bg-gradient-1" mktoName="Section: BgGradient 1" default="rgba(84, 86, 90, .85)" mktoModuleScope="true">
<meta class="mktoString" id="SectionID-bg-gradient-2" mktoName="Section: BgGradient 2" default="rgba(84, 86, 90, .85)" mktoModuleScope="true">
<meta class="mktoImg" id="SectionID-bg-image" mktoName="Section: BgImage" default="https://go.autoshopsolutions.com/rs/180-DGD-014/images/Layer 1.png" mktoModuleScope="true">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<meta name="robots" content="noindex,nofollow" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<!--[if mso]>
<style> body,table tr,table td,a, span,table.MsoNormalTable,td,th,div{ font-family: helvetica, sans-serif !important; }</style>
<![endif]-->
<!--[if mso]>
<style>
li {text-align:-webkit-match-parent; display:list-item;text-indent: -1em;}
</style>
<![endif]–->
<!--[if mso]>
<style type="text/css">
ul {
margin: 0 0 0 40px !important;
}
</style>
<![endif]-->
<style media="all">
#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 */
/* iOS BLUE LINKS */
@-ms-viewport {
width: device-width;
}
</style>
<style media="all">
html {
-webkit-text-size-adjust: none;
}
body {
font-family: helvetica, sans-serif;
}
p,
.undoreset div p,
.undoreset p {
margin-top: 14px;
margin-bottom: 14px;
}
img {
border: 0px !important;
}
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;
}
a {
outline: none !important;
text-decoration: none !important;
color:#ef5a2c;
}
.btnLine {
text-decoration: underline !important;
}
.headerText {
text-align: center;
font-size: 36px;
font-family:Open Sans,Arial,sans-serif;
font-weight:800;
line-height:150%;
}
.headerText1 {
text-align: center;
font-size: 24px;
font-family:Open Sans,Arial,sans-serif;
font-weight:800;
line-height:150%;
color: #ffffff;
}
@media only screen and (max-width: 640px) {
.main {
width: 100% !important;
min-width: 100% !important;
}
.inner_table {
width: 90% !important;
margin: 0 auto !important;
}
.res {
width: 100% !important;
display: block;
}
.center {
text-align: center !important;
margin: 0 auto;
}
}
</style>
<style>
.transparentbg {
background-size: cover;
width: 640px;
height: 300px;
}
@media screen and (max-width:640px) {
.block { display: block !important; width: 100% !important; }
}
</style>
</head>
<body style="margin-bottom: 0; -webkit-text-size-adjust: 100%; padding-bottom: 0; margin-top: 0; margin-right: 0; -ms-text-size-adjust: 100%; margin-left: 0; padding-top: 0; padding-right: 0; padding-left: 0; width: 100%;">
<!-- Outer table starts here -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; border-spacing: 0; border-collapse: collapse;margin:0 auto;">
<tr>
<td style="background-color:${BodyBGColor};" bgcolor="${BodyBGColor}">
<table class="main" cellpadding="0" cellspacing="0" align="center" border="0" width="600" style="border-collapse: collapse; margin:0 auto;min-width:600px;">
<tr>
<td class="mktoContainer" id="template-wrapper" style="background-color:${BodyBGColor};" bgcolor="${BodyBGColor}">
<!-- Logo module starts -->
<table class="mktoModule" mktoName="Logo Module" id="Logo-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;">
<tr>
<td height="${top_space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${logo-alignment}" valign="top" style="vertical-align:top;">
<div class="mktoImg" id="logo" mktoName="Logo">
<a target="_blank" style="text-decoration: none;outline: none;" href="#">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/Original_Product_Logos-RGB_RapidRecon_Horizontal1.png" alt="" width="250" border="0" />
</a>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Logo module end -->
<!-- Banner Image -->
<table class="mktoModule" mktoName="Full Width Image Section" id="full-width-img-section" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${blue_bg_color}" align="center" valign="top" style="background-color:${blue_bg_color};vertical-align:top;text-align:center;">
<div class="mktoImg" id="image" mktoname="Image">
<img src="https://via.placeholder.com/640X250.png/ccc/fff" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Banner Image End -->
<!-- Top Tire Image -->
<table class="mktoModule" mktoName="Tire Header" id="full-width-img-section-tire" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${whiteBGColor}" align="center" valign="top" style="background-color:${whiteBGColor};vertical-align:top;text-align:center;">
<div class="mktoImg" id="tireImg" mktoname="Tire Header">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/RR_11.28.22_Open_Road_Video_DIVIDER_2.png" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Top Tire Image End -->
<!-- Black Text module V1 starts -->
<table class="mktoModule" mktoName="Black Text Module V1" id="Black-Text-Module-V1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${tire_bg_color}" style="background-color:${tire_bg_color};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#fff;font-weight: normal;">
<div class="mktoText" id="Text" mktoname="Text">
<div>
<p>Hi,</p>
<p><strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur? Asperiores hic dolor facere reiciendis dolorem, cupiditate consequuntur.</p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V1 end -->
<!-- Bottom Tire Image -->
<table class="mktoModule" mktoName="Tire Bottom" id="full-width-img-section-tire1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${tire_bg_color}" align="center" valign="top" style="background-color:${tire_bg_color};vertical-align:top;text-align:center;">
<div class="mktoImg" id="tireImg1" mktoname="Tire Bottom">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/SLX_5.25.22_trifecta_ad_TiremarksTopGreySolid.png" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Bottom Tire Image End -->
<!--Background Image Section-->
<table class="mktoModule" mktoName="Background Image Section" id="bgImageSection" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td background="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" height="645" style="background:#fffffe url('https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png') no-repeat center center / cover; background-size:cover;background-position:center center;background-repeat:no-repeat;padding:10px 40px 10px 40px;vertical-align:top;">
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:100%; height:645px;">
<v:fill type="frame" src="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" color="#fffffe" />
<v:textbox inset="0,0,0,0">
<![endif]-->
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%;">
<tr>
<td><div class="headerText mktoText" id="bgHeaderText1" mktoName="BG Header Text 1">HERE IS YOUR WHITE PAPER</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="70"> </td></tr>
<tr>
<td style="text-align:center;"><div><img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/V3_RR_6.8.23_5_Used_EV_Reconditioning_Whitepaper_Autoresponder_Booklet.png?version=0"></div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
<tr>
<td><div class="headerText1 mktoText" id="bgHeaderText2" mktoName="BG Header Text 2">Used EV Reconditioning Implications for Auto Dealers</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="50"> </td></tr>
<tr>
<td>
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0" class="mktoText" id="button1" mktoname="Download Button" style="border-collapse:separate;width:225px;line-height:100%;">
<tr>
<td bgcolor="${btn-bgcolor2}" style="border:none;border-radius:60px 60px 60px 60px;cursor:auto;mso-padding-alt:12px 0px 12px 0px;background:#f96e11;" valign="top"><a href="https://my.rapidrecon.com/l/708083/2023-06-14/tz5c8/708083/16867612888EoZj5oz/Used_EV_Recon_Implications_For_Auto_Dealers_v230613.pdf/?utm_medium=email&utm_source=SLX" style="display:inline-block;width:225px;background:#f96e11;color:#ffffff;font-family:Raleway,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:100%;margin:0;text-decoration:none;text-transform:none;padding:12px 0px 12px 0px;mso-padding-alt:0;border-radius:60px 60px 60px 60px;" target="_blank"><span style="font-size:16px;font-family:Raleway,Arial,sans-serif;font-weight:700;color:#ffffff;line-height:119%;">Click Here to Download</span></a></td>
</tr>
</table>
</td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
</table>
<!--[if mso]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>
<!--END Background Image Section-->
<!-- Text module V1 starts -->
<table class="mktoModule" mktoName="Text Module V1" id="Text-Module-V1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="Text1" mktoname="Text">
<div>
<p>Hi,</p>
<p><strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur? Asperiores hic dolor facere reiciendis dolorem, cupiditate consequuntur.</p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V1 end -->
<!-- Button Module starts here -->
<table class="mktoModule" mktoName="Button Module" id="Button-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktoText" id="Button1" mktoname="Button">
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="${btn-bgcolor}" style="border:1px solid ${btn-border-color};background-color:${btn-bgcolor};font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:${btn-text-color};padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:${btn-text-color}; outline: none;" href="${btn-cta-url}">${btn-cta-text}</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Button Module ends here -->
<!-- HTML Button Module starts here -->
<table class="mktoModule" mktoName="HTML Button Module" id="HTMLButton-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktEditable" id="HTMLButton1" mktoname="HTML Button">
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#ff6900" style="border:1px solid #ef5a2c;background-color:#ef5a2c;font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:#ffffff;padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:#ffffff; outline: none;" href="#">HTML TEXT BUTTON</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- HTML Button Module ends here -->
<!-- List module starts -->
<table class="mktoModule" mktoName="List Module" id="List-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="left" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="List" mktoname="List">
<div> <p style="margin-top: 0;">Lorem ipsum dolor sit amet.</p>
<ul>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores veritatis fugiat optio magnam.</li>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores</li>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores</li>
</ul>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- List module end -->
<!-- Button Module Red Background starts here -->
<table class="mktoModule" mktoName="Button Module V2" id="Button-Module-V2" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${red_bg_color}" style="background-color: ${red_bg_color}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:20px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<h1 class="mktoText" id="Button-V2-Text" mktoname="Button" style="color: #ffffff; text-align: center; padding: 20px 0px 30px 0px; font-weight: bold;">
SAMPLE HEADING
</h1>
</td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktoText" id="Button-V2" mktoname="Button">
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="${btn-bgcolor1}" style="border:1px solid ${btn-border-color1};background-color:${btn-bgcolor1};font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:${btn-text-color1};padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:${btn-text-color1}; outline: none;" href="${btn-cta-url}">${btn-cta-text}</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Button Module Red Background ends here -->
<!-- Text module V2 starts -->
<table class="mktoModule" mktoName="Text Module V2" id="Text-Module-V2" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="Text-2" mktoname="Text">
<div> <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus possimus asperiores sunt error accusamus sint id laborum obcaecati nihil totam.
<strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur?
<a class="btnLine" href="#" target="_blank">Lorem, ipsum dolor.</a> Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt, natus. </p>
<p>lorem ipsum</p>
<p>dolor sit</p>
<p><em><strong>Lorem ipsum dolor sit amet consectetur. <a class="btnLine" href="#" target="_blank">Lorem, ipsum</a> Lorem ipsum dolor sit.</strong></em></p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V2 end -->
<!--Spacer Module starts here-->
<table class="mktoModule" mktoName="Spacer Module" id="Spacer-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;">
<tr>
<td height="${spacer}" valign="top" style="vertical-align: top;font-size: 1px;line-height: 1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!--Spacer Module ends here-->
<!-- Border Module start-->
<table class="mktoModule" mktoname="Border Module" id="Border-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tbody>
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<table width="${border-width}%" align="${border-alignment}" border="0" cellpadding="0" cellspacing="0" style="width:${border-width}%;margin:0 auto;">
<tr>
<td height="${border-height}" style="background-color:${border-bgcolor};line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
<!--Border Module ends here-->
<!-- Footer Snippet starts -->
<table class="mktoModule" mktoName="Footer Module" id="footerModule" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="footerText" mktoname="Footer Text">
<div>REPLACE WITH FOOTER SNIPPET</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Footer Snippet end -->
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Outer table ends here -->
</body>
</html>
This is what it is supposed to look like:
Hi @kenmckown, please check the below code
<!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">
<head>
<title>Email</title>
<meta class="mktoColor" id="BodyBGColor" mktoName="Body Background Color" default="#eff0f4" />
<meta class="mktoColor" id="blue_bg_color" mktoName="Background Color" default="#132C65" mktoModuleScope="true">
<meta class="mktoColor" id="grey_bg_color" mktoName="Background Color" default="#f5f5f5" mktoModuleScope="true">
<meta class="mktoColor" id="dark_grey_bg_color" mktoName="Background Color" default="#54565a" mktoModuleScope="true">
<meta class="mktoColor" id="tire_bg_color" mktoName="Background Color" default="#262626" mktoModuleScope="true">
<meta class="mktoColor" id="black_bg_color" mktoName="Background Color" default="#000000" mktoModuleScope="true">
<meta class="mktoColor" id="yellow_bg_color" mktoName="Background Color" default="#ffce01" mktoModuleScope="true">
<meta class="mktoColor" id="red_bg_color" mktoName="Background Color" default="#ef5a2c" mktoModuleScope="true">
<meta mktoModuleScope="true" class="mktoColor" id="whiteBGColor" mktoName="Background Color" default="#ffffff" />
<meta mktoModuleScope="true" class="mktoColor" id="greyBGColor" mktoName="Background Color" default="#4c4d52" />
<meta mktoModuleScope="true" class="mktoColor" id="redBGColor" mktoName="Background Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space1" mktoname="Top Space" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space10" mktoname="Top Space" default="10" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="top_space20" mktoname="Top Space" default="20" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space1" mktoname="Bottom Space" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space10" mktoname="Bottom Space" default="10" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="btm_space20" mktoname="Bottom Space" default="20" step="1" min="0" max="100" />
<meta mktomodulescope="true" class="mktoList" id="logo-alignment" mktoName="Logo Alignment" default="center" values="center,right,left">
<meta mktomodulescope="true" class="mktoList" id="logo-alignment-bar" mktoName="Logo Alignment" default="left" values="center,right,left">
<meta mktomodulescope="true" class="mktoList" id="text-alignment" mktoName="Text Alignment" default="left" values="center,right,left">
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor" mktoName="Button BG Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor1" mktoName="Button BG Color" default="#f0f0f0" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-bgcolor2" mktoName="Button BG Color" default="#f96e11" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color" mktoName="Button Border Color" default="#ef5a2c" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color1" mktoName="Button Border Color" default="#f0f0f0" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-border-color2" mktoName="Button Border Color" default="#f96e11" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-text-color" mktoName="Button Text Color" default="#ffffff" />
<meta mktoModuleScope="true" class="mktoColor" id="btn-text-color1" mktoName="Button Text Color" default="#666666" />
<meta mktoModuleScope="true" class="mktoString" id="btn-cta-url" mktoName="Button Url" default="#" />
<meta mktoModuleScope="true" class="mktoString" id="btn-cta-text" mktoName="Button Text" default="Lorem ipsum dolor sit" />
<meta mktomodulescope="true" class="mktoList" id="btn-alignment" mktoName="Button Alignment" default="center" values="center,right,left">
<meta mktoModuleScope="true" class="mktoColor" id="border-bgcolor" mktoName="Border Color" default="#cac9cf" />
<meta mktoModuleScope="true" class="mktoList" id="border-alignment" mktoname="Border Alignment" default="center" values="left,center,right" />
<meta mktoModuleScope="true" class="mktoNumber" id="border-width" mktoName="Border Width(in %)" default="100" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="border-height" mktoName="Border Height" default="1" step="1" min="0" max="100" />
<meta mktoModuleScope="true" class="mktoNumber" id="spacer" mktoname="Spacer Height" default="10" step="1" min="0" max="100" />
<meta mktomodulescope="true" class="mktoList" id="social-alignment" mktoName="Social Icons Alignment" default="right" values="center,right,left">
<!--Background Image-->
<meta class="mktoColor" id="SectionID-bg-color" mktoName="Section: BgColor" default="#54565A" mktoModuleScope="true">
<meta class="mktoString" id="SectionID-bg-gradient-1" mktoName="Section: BgGradient 1" default="rgba(84, 86, 90, .85)" mktoModuleScope="true">
<meta class="mktoString" id="SectionID-bg-gradient-2" mktoName="Section: BgGradient 2" default="rgba(84, 86, 90, .85)" mktoModuleScope="true">
<meta class="mktoImg" id="SectionID-bg-image" mktoName="Section: BgImage" default="https://go.autoshopsolutions.com/rs/180-DGD-014/images/Layer 1.png" mktoModuleScope="true">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<meta name="robots" content="noindex,nofollow" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<!--[if mso]>
<style> body,table tr,table td,a, span,table.MsoNormalTable,td,th,div{ font-family: helvetica, sans-serif !important; }</style>
<![endif]-->
<!--[if mso]>
<style>
li {text-align:-webkit-match-parent; display:list-item;text-indent: -1em;}
</style>
<![endif]–->
<!--[if mso]>
<style type="text/css">
ul {
margin: 0 0 0 40px !important;
}
</style>
<![endif]-->
<style media="all">
#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 */
/* iOS BLUE LINKS */
@-ms-viewport {
width: device-width;
}
</style>
<style media="all">
html {
-webkit-text-size-adjust: none;
}
body {
font-family: helvetica, sans-serif;
}
p,
.undoreset div p,
.undoreset p {
margin-top: 14px;
margin-bottom: 14px;
}
img {
border: 0px !important;
}
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;
}
a {
outline: none !important;
text-decoration: none !important;
color:#ef5a2c;
}
.btnLine {
text-decoration: underline !important;
}
.headerText {
text-align: center;
font-size: 36px;
font-family:Open Sans,Arial,sans-serif;
font-weight:800;
line-height:150%;
}
.headerText1 {
text-align: center;
font-size: 24px;
font-family:Open Sans,Arial,sans-serif;
font-weight:800;
line-height:150%;
color: #ffffff;
}
@media only screen and (max-width: 640px) {
.main {
width: 100% !important;
min-width: 100% !important;
}
.inner_table {
width: 90% !important;
margin: 0 auto !important;
}
.res {
width: 100% !important;
display: block;
}
.center {
text-align: center !important;
margin: 0 auto;
}
}
</style>
<style>
.transparentbg {
background-size: cover;
width: 640px;
height: 300px;
}
@media screen and (max-width:640px) {
.block { display: block !important; width: 100% !important; }
}
</style>
</head>
<body style="margin-bottom: 0; -webkit-text-size-adjust: 100%; padding-bottom: 0; margin-top: 0; margin-right: 0; -ms-text-size-adjust: 100%; margin-left: 0; padding-top: 0; padding-right: 0; padding-left: 0; width: 100%;">
<!-- Outer table starts here -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; border-spacing: 0; border-collapse: collapse;margin:0 auto;">
<tr>
<td style="background-color:${BodyBGColor};" bgcolor="${BodyBGColor}">
<table class="main" cellpadding="0" cellspacing="0" align="center" border="0" width="600" style="border-collapse: collapse; margin:0 auto;min-width:600px;">
<tr>
<td class="mktoContainer" id="template-wrapper" style="background-color:${BodyBGColor};" bgcolor="${BodyBGColor}">
<!-- Logo module starts -->
<table class="mktoModule" mktoName="Logo Module" id="Logo-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;">
<tr>
<td height="${top_space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${logo-alignment}" valign="top" style="vertical-align:top;">
<div class="mktoImg" id="logo" mktoName="Logo">
<a target="_blank" style="text-decoration: none;outline: none;" href="#">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/Original_Product_Logos-RGB_RapidRecon_Horizontal1.png" alt="" width="250" border="0" />
</a>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Logo module end -->
<!-- Banner Image -->
<table class="mktoModule" mktoName="Full Width Image Section" id="full-width-img-section" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${blue_bg_color}" align="center" valign="top" style="background-color:${blue_bg_color};vertical-align:top;text-align:center;">
<div class="mktoImg" id="image" mktoname="Image">
<img src="https://via.placeholder.com/640X250.png/ccc/fff" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Banner Image End -->
<!-- Top Tire Image -->
<table class="mktoModule" mktoName="Tire Header" id="full-width-img-section-tire" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${whiteBGColor}" align="center" valign="top" style="background-color:${whiteBGColor};vertical-align:top;text-align:center;">
<div class="mktoImg" id="tireImg" mktoname="Tire Header">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/RR_11.28.22_Open_Road_Video_DIVIDER_2.png" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Top Tire Image End -->
<!-- Black Text module V1 starts -->
<table class="mktoModule" mktoName="Black Text Module V1" id="Black-Text-Module-V1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${tire_bg_color}" style="background-color:${tire_bg_color};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#fff;font-weight: normal;">
<div class="mktoText" id="Text" mktoname="Text">
<div>
<p>Hi,</p>
<p><strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur? Asperiores hic dolor facere reiciendis dolorem, cupiditate consequuntur.</p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V1 end -->
<!-- Bottom Tire Image -->
<table class="mktoModule" mktoName="Tire Bottom" id="full-width-img-section-tire1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td class="full-width" bgcolor="${tire_bg_color}" align="center" valign="top" style="background-color:${tire_bg_color};vertical-align:top;text-align:center;">
<div class="mktoImg" id="tireImg1" mktoname="Tire Bottom">
<img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/SLX_5.25.22_trifecta_ad_TiremarksTopGreySolid.png" width="640" alt="" />
</div>
</td>
</tr>
</table>
<!-- Bottom Tire Image End -->
<!--Background Image Section-->
<table class="mktoModule" mktoName="Background Image Section" id="bgImageSection" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td background="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" style="background-color:#fffffe; background-image: url('https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png'); background-size:cover;background-position:center center;background-repeat:no-repeat;vertical-align:top;">
<!--[if gte mso 9]>
<v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style=" border: 0;display: inline-block; width: 600px; height: 645px;" src="https://my.rapidrecon.com/l/708083/2023-03-07/skwfk/708083/1678206081z2ncTDUE/RR_3.7.23_5_Ways_to_Nurture_Whitepaper_Autoresponder_bg.png" />
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style=" border: 0;display: inline-block;position: absolute; width: 600px; height: 645px;">
<v:fill opacity="0%" color="#fffffe" />
<v:textbox inset="0,0,0,0">
<![endif]-->
<table align="center" border="0" cellpadding="0" cellspacing="0" width="90%" style="margin:0 auto;">
<tr><td style="font-size:1px; line-height:1px;" height="30"> </td></tr>
<tr>
<td style="text-align: center; font-size: 36px; font-family: Open Sans, Arial, sans-serif; font-weight: 800; line-height: 150%;"><div class="headerText mktoText" id="bgHeaderText1" mktoName="BG Header Text 1">HERE IS YOUR WHITE PAPER</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="70"> </td></tr>
<tr>
<td style="text-align:center;"><div><img src="https://go.autoshopsolutions.com/rs/180-DGD-014/images/V3_RR_6.8.23_5_Used_EV_Reconditioning_Whitepaper_Autoresponder_Booklet.png?version=0"></div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
<tr>
<td style="text-align: center; font-size: 24px; font-family: Open Sans, Arial, sans-serif;font-weight: 800; line-height: 150%; color: #ffffff;"><div class="headerText1 mktoText" id="bgHeaderText2" mktoName="BG Header Text 2">Used EV Reconditioning Implications for Auto Dealers</div></td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="50"> </td></tr>
<tr>
<td>
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0" class="mktoText" id="button1" mktoname="Download Button" style="border-collapse:separate;width:225px;line-height:100%;">
<tr>
<td bgcolor="${btn-bgcolor2}" style="border:none;border-radius:60px 60px 60px 60px;cursor:auto;mso-padding-alt:12px 0px 12px 0px;background:#f96e11; text-align:center;" valign="top"><a href="https://my.rapidrecon.com/l/708083/2023-06-14/tz5c8/708083/16867612888EoZj5oz/Used_EV_Recon_Implications_For_Auto_Dealers_v230613.pdf/?utm_medium=email&utm_source=SLX" style="display:inline-block;width:225px;background:#f96e11;color:#ffffff;font-family:Raleway,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:100%;margin:0;text-decoration:none;text-transform:none;padding:12px 0px 12px 0px;mso-padding-alt:0;border-radius:60px 60px 60px 60px;" target="_blank"><span style="font-size:16px;font-family:Raleway,Arial,sans-serif;font-weight:700;color:#ffffff;line-height:119%;">Click Here to Download</span></a></td>
</tr>
</table>
</td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20"> </td></tr>
</table>
<!--[if gte mso 9]>
</v:textbox>
</v:fill>
</v:rect>
</v:image>
<![endif]-->
</td>
</tr>
</table>
<!--END Background Image Section-->
<!-- Text module V1 starts -->
<table class="mktoModule" mktoName="Text Module V1" id="Text-Module-V1" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="Text1" mktoname="Text">
<div>
<p>Hi,</p>
<p><strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur? Asperiores hic dolor facere reiciendis dolorem, cupiditate consequuntur.</p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V1 end -->
<!-- Button Module starts here -->
<table class="mktoModule" mktoName="Button Module" id="Button-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktoText" id="Button1" mktoname="Button">
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="${btn-bgcolor}" style="border:1px solid ${btn-border-color};background-color:${btn-bgcolor};font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:${btn-text-color};padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:${btn-text-color}; outline: none;" href="${btn-cta-url}">${btn-cta-text}</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Button Module ends here -->
<!-- HTML Button Module starts here -->
<table class="mktoModule" mktoName="HTML Button Module" id="HTMLButton-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktEditable" id="HTMLButton1" mktoname="HTML Button">
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#ff6900" style="border:1px solid #ef5a2c;background-color:#ef5a2c;font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:#ffffff;padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:#ffffff; outline: none;" href="#">HTML TEXT BUTTON</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- HTML Button Module ends here -->
<!-- List module starts -->
<table class="mktoModule" mktoName="List Module" id="List-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="left" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="List" mktoname="List">
<div> <p style="margin-top: 0;">Lorem ipsum dolor sit amet.</p>
<ul>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores veritatis fugiat optio magnam.</li>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores</li>
<li>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem obcaecati maiores</li>
</ul>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- List module end -->
<!-- Button Module Red Background starts here -->
<table class="mktoModule" mktoName="Button Module V2" id="Button-Module-V2" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%!important;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${red_bg_color}" style="background-color: ${red_bg_color}">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:20px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<h1 class="mktoText" id="Button-V2-Text" mktoname="Button" style="color: #ffffff; text-align: center; padding: 20px 0px 30px 0px; font-weight: bold;">
SAMPLE HEADING
</h1>
</td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<div class="mktoText" id="Button-V2" mktoname="Button">
<table align="${btn-alignment}" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="${btn-bgcolor1}" style="border:1px solid ${btn-border-color1};background-color:${btn-bgcolor1};font-family:helvetica, sans-serif;font-size: 14px;text-align: center; color:${btn-text-color1};padding: 12px 18px;line-height:16px;display:block;font-weight:normal;" valign="top">
<a target="_blank" style="text-decoration: none;color:${btn-text-color1}; outline: none;" href="${btn-cta-url}">${btn-cta-text}</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="${btm_space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Button Module Red Background ends here -->
<!-- Text module V2 starts -->
<table class="mktoModule" mktoName="Text Module V2" id="Text-Module-V2" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="Text-2" mktoname="Text">
<div> <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus possimus asperiores sunt error accusamus sint id laborum obcaecati nihil totam.
<strong>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, minus.</strong>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perferendis non, praesentium iusto in sint dignissimos dolore accusamus cupiditate autem qui totam consequatur?
<a class="btnLine" href="#" target="_blank">Lorem, ipsum dolor.</a> Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt, natus. </p>
<p>lorem ipsum</p>
<p>dolor sit</p>
<p><em><strong>Lorem ipsum dolor sit amet consectetur. <a class="btnLine" href="#" target="_blank">Lorem, ipsum</a> Lorem ipsum dolor sit.</strong></em></p>
</div>
</div>
</td>
</tr>
<tr>
<td height="${btm_space1}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Text module V2 end -->
<!--Spacer Module starts here-->
<table class="mktoModule" mktoName="Spacer Module" id="Spacer-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color: ${whiteBGColor}">
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;">
<tr>
<td height="${spacer}" valign="top" style="vertical-align: top;font-size: 1px;line-height: 1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
<!--Spacer Module ends here-->
<!-- Border Module start-->
<table class="mktoModule" mktoname="Border Module" id="Border-Module" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tbody>
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td height="${top_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td valign="top" style="vertical-align:top;">
<table width="${border-width}%" align="${border-alignment}" border="0" cellpadding="0" cellspacing="0" style="width:${border-width}%;margin:0 auto;">
<tr>
<td height="${border-height}" style="background-color:${border-bgcolor};line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="${btm_space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
<!--Border Module ends here-->
<!-- Footer Snippet starts -->
<table class="mktoModule" mktoName="Footer Module" id="footerModule" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="width: 100%;margin: 0 auto;border-spacing: 0;border-collapse: collapse;">
<tr>
<td bgcolor="${whiteBGColor}" style="background-color:${whiteBGColor};">
<table class="inner_table" width="600" align="center" border="0" cellpadding="0" cellspacing="0" style="width:600px;margin:0 auto;">
<tr>
<td align="${text-alignment}" valign="top" style="vertical-align: top;font-size: 14px;line-height: 20px;font-family:helvetica, sans-serif;color:#4c4d52;font-weight: normal;">
<div class="mktoText" id="footerText" mktoname="Footer Text">
<div>REPLACE WITH FOOTER SNIPPET</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Footer Snippet end -->
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Outer table ends here -->
</body>
</html>