preview (image)
<!doctype html>
<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>
</title>
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--<![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
#outlook a {
padding: 0;
}
body {
margin: 0;
padding: 0;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
table,
td {
border-collapse: collapse;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
img {
border: 0;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
p {
display: block;
margin: 13px 0;
}
.footerLink {
display:inline-block;
color:#ffffff;
text-decoration:none;
text-transform:uppercase;
}
.footerLink:hover {
color: #FE8D00;
}
@media only screen and (max-width: 480px) {
.reassuranceItem {
display: block!important;
margin-bottom: 40px!important;
padding: 0!important;
}
#footerNavigation {
margin-bottom: 20px!important;
}
.footerLinkWrapper {
display: inline-block !important;
padding: 0 !important;
}
.footerLink {
padding: 5px !important;
}
#headerNavigationWrapper {
padding: 20px 0;
}
.headerLinkWrapper {
display: inline-block !important;
padding: 0 !important;
}
.headerLink {
padding: 5px !important;
}
.footerGarageContent {
padding-left: 20px!important;
padding-right: 20px!important;
}
#vehicleInfos {
margin-bottom: 20px;
}
.vehicleInfosCol {
display: block!important;
}
.vehicleInfosCol-right {
padding-bottom: 20px;
}
.invoiceCol {
display: block!important;
}
.invoiceCol-right {
padding-top: 20px!important;
}
}
</style>
<!--[if mso]>
<noscript>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
</noscript>
<![endif]-->
</head>
<body style="word-spacing:normal; background-color: #0144AA; font-family: Arial, Helvetica, sans-serif; color: #222A51;">
<div style="max-width: 600px; margin: 0 auto; ">
<div>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="max-width: 600px;width: 100%;">
<tr>
<td style="text-align: center; padding: 27px 0"><a href="https://tressol.yeah.agency" target="_blank" style="display: inline-block"><img src="https://tressol.yeah.agency/assets/medias/emailing/logo-white.png" alt="Logo Tressol Chabrier" width="230" height="33"></a></td>
</tr>
</table>
</div>
<div id="headerNavigationWrapper" style="text-align: center;background-color: #ffffff;">
<table id="headerNavigation" role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="background-color: #ffffff;">
<tr>
<td class="headerLinkWrapper" style="padding:15px 10px;">
<a class="headerLink" href="https://tressol.yeah.agency/voiture" target="_blank" style="display:inline-block;color:#434b72;font-family:Arial, sans-serif;font-size:13px;font-weight:700;line-height:22px;text-decoration:none;text-transform:uppercase;padding:15px 10px;"> Acheter/Louer </a>
</td>
<td class="headerLinkWrapper" style="padding:15px 10px;">
<a class="headerLink" href="https://tressol.yeah.agency/estimation-voiture" target="_blank" style="display:inline-block;color:#434b72;font-family:Arial, sans-serif;font-size:13px;font-weight:700;line-height:22px;text-decoration:none;text-transform:uppercase;padding:15px 10px;"> Estimer </a>
</td>
<td class="headerLinkWrapper" style="padding:15px 10px;">
<a class="headerLink" href="https://tressol.yeah.agency/entretien-voiture" target="_blank" style="display:inline-block;color:#434b72;font-family:Arial, sans-serif;font-size:13px;font-weight:700;line-height:22px;text-decoration:none;text-transform:uppercase;padding:15px 10px;"> Entretenir </a>
</td>
<td class="headerLinkWrapper" style="padding:15px 10px;">
<a class="headerLink" href="https://tressol.yeah.agency/pre/login" target="_blank" style="display:inline-block;color:#FE8D00;font-family:Arial, sans-serif;font-size:13px;font-weight:700;line-height:22px;text-decoration:none;text-transform:uppercase;padding:15px 10px;"> Garage en ligne </a>
</td>
</tr>
</table>
</div>
<div style="background-color: #ffffff;padding: 0 20px;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="background-image: url('https://tressol.yeah.agency/assets/medias/emailing/welcome-1.png');background-size: cover; width: 100%;max-width: 560px;">
<tr>
<td style="font-family:Arial, sans-serif; color: #ffffff; font-size: 30px; font-weight: 700; padding: 0 20px; height: 178px; text-align: center">Confirmation<br>de réservation</td>
</tr>
</table>
</div>
<div style="background-color: #ffffff;padding: 0 20px;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="width: 100%;max-width: 560px; background-color: #ffffff;">
<tr>
<td style="text-align:center; padding-top: 30px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-50.png" alt=""></td>
</tr>
<tr>
<td style="font-family:Arial, sans-serif; font-size: 24px; font-weight: 700; color: #434b72; padding-top: 15px; text-align: center">Bonjour [Prénom]</td>
</tr>
<tr>
<td style="font-family:Arial, sans-serif; font-size: 15px; line-height: 22px; font-weight: 400; color: #434b72; padding: 24px 30px 0; text-align: center">Nous avons le plaisir de vous confirmer la prise en compte de votre réservation</td>
</tr>
<tr>
<td style="font-family:Arial, sans-serif; font-size: 18px; line-height: 28px; font-weight: 700; color: #434b72; padding-top: 25px; text-align: center">Résumé de votre réservation</td>
</tr>
<tr>
<td style="padding-top: 26px;">
<div style="border: 1px solid #DEE0E7; border-radius: 15px; padding: 30px;">
<table id="vehicleInfos" width="100%" style="width: 100%">
<tr style="vertical-align: top">
<td class="vehicleInfosCol" style="padding-right: 30px; width: 129px; padding-bottom: 10px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/car.png" alt="Voiture" width="129px" height="95px"></td>
<td class="vehicleInfosCol vehicleInfosCol-right" style="font-family:Arial, sans-serif;">
<div style="color:#222A51; font-size: 20px; font-weight: 700;">Peugeot 3008</div>
<div style="font-weight: 700;font-size: 16px;line-height: 22px;color: #434B72;">1.6 BlueHDi120 Active</div>
<ul style="list-style-type: none; font-size: 16px; line-height: 24px; color: #434b72; padding-left: 0;">
<li><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-14.png" alt="" style="margin-right: 10px;">Peugeot Auch</li>
<li style="padding-top: 4px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-14.png" alt="" style="margin-right: 10px;">25 750 km</li>
<li style="padding-top: 4px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-14.png" alt="" style="margin-right: 10px;">Essence</li>
<li style="padding-top: 4px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-14.png" alt="" style="margin-right: 10px;">Automatique</li>
</ul>
<div style="font-weight: 700;font-size: 16px;line-height: 22px;color: #222A51;">Montant réservation</div>
<div style="padding-top: 3px;color:#FE8D00; font-size: 20px; font-weight: 700; padding-bottom: 20px;">500 €</div>
</td>
</tr>
<tr><td style="border-bottom: 1px solid #DEE0E7;" colspan="2"></td></tr>
</table>
<table id="invoice" width="100%" style="width: 100%; margin-top: 20px;">
<tr style="vertical-align: top">
<td class="invoiceCol" style="font-family:Arial, sans-serif;">
<div style="font-weight: 700;font-size: 16px;line-height: 22px;color: #222A51;">Adresse de facturation</div>
<div style="padding-top: 5px; font-size: 14px;line-height: 21px; color: #434b72;">
M. John Steinbeck
<br>25 rue d’Aigebelle
<br>83230 Bormes les mimosas
</div>
</td>
<td class="invoiceCol invoiceCol-right">
<button style="border: 1px solid #8697B0;background: none; color: #8697B0; font-weight: 500; padding: 11px 14px; border-radius: 40px">Voir ma facture</button>
<div style="font-size: 14px;line-height: 21px;padding-top: 10px;">Réglé par carte le 25/05/2023</div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<div style="background-color: #37465C; margin-top: 5px; padding: 0 20px;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="width: 100%;max-width: 560px; background-color: #37465C; color: #FFFFFF;text-align: center;">
<tr>
<td style="font-size: 24px; font-weight: 700; padding-top: 50px;">Et maintenant ?</td>
</tr>
<tr>
<td style="font-size: 16px; padding-top: 34px;">
<div style="background: #FFFFFF; color: #434b72; padding: 30px; border-radius: 15px">
<table role="presentation" border="0" cellpadding="0" cellspacing="25px" align="center" style="width: 100%;max-width: 500px; text-align: left; line-height: 19px;">
<tr>
<td width="20"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-blue-20.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;">Le service commercial de Peugeot Auch va vous contacter pour convenir d’un rendez-vous</td>
</tr>
<tr>
<td width="20" style="padding-top: 20px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/checkmark-blue-20.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;padding-top: 20px;">Gagnez du temps et téléchargez dans votre coffre fort les documents nécessaires pour valider votre dossier</td>
</tr>
<tr>
<td colspan="2" style="padding: 20px 20px 0 40px;">
<table role="presentation" border="0" cellpadding="0" cellspacing="25px" align="center" style="width: 100%;max-width: 440px; text-align: left; line-height: 19px;">
<tr>
<td width="20" style=""><img src="https://tressol.yeah.agency/assets/medias/emailing/uncheck-16.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;">Justificatif de domicile</td>
</tr>
<tr>
<td width="20" style="padding-top: 5px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/uncheck-16.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;padding-top: 5px;">Copie de pièce d’identité recto verso</td>
</tr>
<tr>
<td width="20" style="padding-top: 5px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/uncheck-16.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;padding-top: 5px;">Dernier avis d’imposition</td>
</tr>
<tr>
<td width="20" style="padding-top: 5px;"><img src="https://tressol.yeah.agency/assets/medias/emailing/uncheck-16.png" alt="" width="20" height="19" style="display: block"></td>
<td style="padding-left: 20px;padding-top: 5px;">3 derniers bulletins de salaire</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<div style="background-color: #37465C; padding: 65px 40px 50px; color: #FFFFFF; font-weight: 400;">
<table id="reassurance" role="presentation" border="0" cellpadding="0" cellspacing="25px" align="center" style="width: 100%;max-width: 520px; background-color: #37465C;">
<tr style="vertical-align: top">
<td class="reassuranceItem" style="padding-right: 10px;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-1.png" alt="" width="50" height="50" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 16px;">Tableau de bord</div>
<div style="font-size: 14px; padding-top: 15px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempor nunc id enim maximus</div>
</td>
<td class="reassuranceItem" style="padding: 0 10px;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-2.png" alt="" width="50" height="50" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 16px;">Carnet de santé</div>
<div style="font-size: 14px; padding-top: 15px;">Donec non pretium felis. Integer nunc nisi, fringilla non risus eu. Curabitur ipsum lacus.</div>
</td>
<td class="reassuranceItem" style="padding-left: 10px;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-3.png" alt="" width="50" height="51" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 15px;">Coffre fort</div>
<div style="font-size: 14px; padding-top: 15px;">Suspendisse quis fringilla felis. Integer pretium metus ligula, scelerisque aliquet leo</div>
</td>
</tr>
<tr style="vertical-align: top;">
<td class="reassuranceItem" style="padding-right: 10px; padding-top: 35px;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-4.png" alt="" width="50" height="50" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 16px;">Checklist projet</div>
<div style="font-size: 14px; padding-top: 15px;">Tableau de bord <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</td>
<td class="reassuranceItem" style="padding: 35px 10px 0;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-5.png" alt="" width="50" height="51" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 15px;">Offres & avantages</div>
<div style="font-size: 14px; padding-top: 15px;">Donec non pretium felis. Integer nunc nisi, fringilla non risus eu, finibus iaculis mauris. Vivamus convallis</div>
</td>
<td class="reassuranceItem" style="padding-left: 10px; padding-top: 35px; margin-bottom: 0!important;">
<img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-6.png" alt="" width="50" height="50" style="display: block;">
<div style="font-size: 18px; font-weight: 700; padding-top: 16px;">Aide et assitance</div>
<div style="font-size: 14px; padding-top: 15px;">Tableau de bord <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</td>
</tr>
<tr style="text-align:center;">
<td colspan="3" style="padding-top: 40px;"><a style="background-color: #FE8D00; color: #ffffff; padding: 11px 32px; border-radius: 15px; font-size: 16px; line-height: 28px; letter-spacing: -0.48px; font-weight: 700; text-decoration:none; display:inline-block;" href="#">Voir mon garage en ligne</a></td>
</tr>
</table>
</div>
<div style="text-align: center;">
<table id="footerNavigation" role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="max-width:535px;width: 100%;margin: 30px auto 5px; font-size: 13px; font-weight: 700;line-height: 22px;">
<tr>
<td style="padding:0 10px;" class="footerLinkWrapper">
<a href="https://tressol.yeah.agency/voiture" target="_blank" class="footerLink" style="padding:15px 10px;"> Acheter/Louer </a>
</td>
<td style="padding:0 10px;" class="footerLinkWrapper">
<a href="https://tressol.yeah.agency/estimation-voiture" target="_blank" class="footerLink" style="padding:15px 10px;"> Estimer </a>
</td>
<td style="padding:0 10px;" class="footerLinkWrapper">
<a href="https://tressol.yeah.agency/entretien-voiture" target="_blank" class="footerLink" style="padding:15px 10px;"> Entretenir </a>
</td>
<td style="padding:0 10px;" class="footerLinkWrapper">
<a href="https://tressol.yeah.agency/pre/login" target="_blank" class="footerLink" style="padding:15px 10px;"> Garage en ligne </a>
</td>
</tr>
</table>
</div>
<div>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="max-width: 600px;width: 100%;">
<tr>
<td style="text-align: center; padding: 0 0 10px;"><a href="https://tressol.yeah.agency" target="_blank" style="display:inline-block;"><img src="https://tressol.yeah.agency/assets/medias/emailing/logo-white.png" alt="Tressol Chabrier" width="230" height="33"></a></td>
</tr>
<tr>
<td style="text-align:center;font-family:Arial, sans-serif; font-size: 16px;line-height: 19px; color: #ffffff;">Votre garage en ligne</td>
</tr>
<tr>
<td style="padding-top: 30px">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" style="max-width: 178px;width: 100%;">
<tr>
<td><a href="https://www.facebook.com/TressolChabrier"><img src="https://tressol.yeah.agency/assets/medias/emailing/social-facebook.png" alt="Facebook" height="45" width="44"></a></td>
<td style="padding: 0 20px;"><a href="https://twitter.com/TressolChabrier"><img src="https://tressol.yeah.agency/assets/medias/emailing/social-twitter.png" alt="Twitter" height="45" width="44"></a></td>
<td><a href="https://www.linkedin.com/company/groupetressolchabrier/?originalSubdomain=fr"><img src="https://tressol.yeah.agency/assets/medias/emailing/social-linkedin.png" alt="Twitter" height="45" width="44"></a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="padding-top: 30px; padding-bottom: 70px; font-family:Arial, sans-serif; font-size: 14px; color: #ffffff; line-height: 21px; text-align: center;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce turpis nunc, rutrum eget purus id, ultricies posuere turpis. Etiam eleifend eget eros in condimentum. Suspendisse potenti.
</td>
</tr>
</table>
</div>
</div>
</body>
</html>