Emailing - Simulation financement

preview (image)
  • template
<!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;
            }
        }
    </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 style="background-color: #ffffff; padding: 50px 50px 60px;">
        <table role="presentation" border="0" cellpadding="0" cellspacing="25px" align="center" style="max-width: 500px;width: 100%; background-color: #FFFFFF;">
            <tr>
                <td><h1 style="color: #434B72; font-size: 30px; line-height: 30px; text-align:center; font-weight: 700; margin: 0;">Simulation de financement</h1></td>
            </tr>
            <tr>
                <td style="padding-top: 30px; color: #222A51; font-weight: 700; font-size: 18px; text-align:center;">Bonjour [Prénom],</td>
            </tr>
            <tr>
                <td style="color: #434b72; font-size: 16px; font-weight: 400; text-align: center; padding-top: 16px;">
                    Nous avons bien reçu votre demande de simulation de financement et nous vous en remercions.
                </td>
            </tr>
            <tr>
                <td style="color: #434b72; font-size: 16px; font-weight: 400; text-align: center; padding-top: 16px;">
                    Vous pouvez retrouver votre configuration et les demandes en cours dans votre garage en ligne Tressol Chabrier
                </td>
            </tr>
            <tr>
                <td style="text-align:center; padding: 27px 0">
                    <a href="#" style="background-color: #FE8D00; color: #ffffff; padding: 11px 32px; border-radius: 15px; font-size: 16px; line-height: 28px; letter-spacing: 0.048px;font-family:Arial, sans-serif; font-weight: 700; text-decoration:none; display:inline-block;">Voir mon garage en ligne</a>
                </td>
            </tr>
            <tr>
                <td style="font-weight: 400;font-size: 16px; color: #434b72; text-align:center;">A bientôt en ligne <br><span style="font-weight: 700;">Votre équipe Tressol Chabrier</span></td>
            </tr>
        </table>
    </div>
    <div style="background-color: #37465C;padding: 65px 40px 50px; margin-top: 5px;">
        <table id="reassurance" role="presentation" border="0" cellpadding="0" cellspacing="25px" align="center" style="max-width: 520px;width: 100%; 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="">
                    <div style="font-family:Arial, sans-serif; font-size: 18px; font-weight: 700; color: #ffffff; padding-top: 16px;">Tableau de bord</div>
                    <div style="font-family:Arial, sans-serif; font-size: 14px; font-weight: 400; color: #ffffff; 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="">
                    <div style="font-family:Arial, sans-serif; font-size: 18px; font-weight: 700; color: #ffffff; padding-top: 16px;">Carnet de santé</div>
                    <div style="font-family:Arial, sans-serif; font-size: 14px; font-weight: 400; color: #ffffff; 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; margin-bottom: 0 !important;">
                    <img src="https://tressol.yeah.agency/assets/medias/emailing/reassurance-3.png" alt="">
                    <div style="font-family:Arial, sans-serif; font-size: 18px; font-weight: 700; color: #ffffff; padding-top: 16px;">Coffre fort</div>
                    <div style="font-family:Arial, sans-serif; font-size: 14px; font-weight: 400; color: #ffffff; padding-top: 15px;">Suspendisse quis fringilla felis. Integer pretium metus ligula, scelerisque aliquet leo</div>
                </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>