<odoo>
<template id="s_comparisons" name="Comparisons">
    <section class="s_comparisons pt48 pb48 o_mail_snippet_general" data-vcss="001" data-vxml="001">
        <div class="container">
            <div class="row gap-4 gap-md-0">
                <div class="col-12 col-md-6" data-name="Plan">
                    <div class="card h-100 my-0">
                        <div class="card-body">
                            <h3 class="card-title h5-fs">Beginner</h3>
                            <div class="my-2">
                                <p>
                                    <span class="h2-fs"><strong>$ 15.00</strong></span>
                                    <span class="o_small-fs">/ month</span>
                                </p>
                            </div>
                            <p class="card-text small">Ideal for newcomers. Essential features to kickstart sales and marketing. Perfect for small teams.</p>
                            <p><a href="#" class="btn btn-outline-primary w-100">Start Now</a></p>
                            <ul class="list-group list-group-flush text-start">
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Sales &amp; marketing for 2</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Account management</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-times text-danger" role="img"/>  No customization</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-times text-danger" role="img"/>  No support</li>
                            </ul>
                        </div>
                        <div class="card-footer text-center">
                            <p class="mb-0" style="text-align: center;">
                                <span class="o_small-fs">Instant setup, satisfied or reimbursed.</span>
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6" data-name="Plan">
                    <div class="card h-100 my-0">
                        <div class="card-body">
                            <h3 class="card-title h5-fs">Professional</h3>
                            <div class="my-2">
                                <p>
                                    <span class="h2-fs"><strong>$ 25.00</strong></span>
                                    <span class="o_small-fs">/ month</span>
                                </p>
                            </div>
                            <p class="card-text small">Comprehensive tools for growing businesses. Optimize your processes and productivity across your team.</p>
                            <p><a href="#" class="btn btn-primary w-100">Start Now</a></p>
                            <ul class="list-group list-group-flush text-start">
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Complete CRM for any team</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Access all modules</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Limited customization</li>
                                <li class="list-group-item px-0 bg-transparent"><span class="fa fa-check text-success" role="img"/>  Email support</li>
                            </ul>
                        </div>
                        <div class="card-footer text-center">
                            <p class="mb-0" style="text-align: center;">
                                <span class="o_small-fs">Instant setup, satisfied or reimbursed.</span>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</template>

<template name="Showcase" id="s_showcase">
    <section class="s_showcase o_mail_snippet_general pt48 pb48" data-vxml="001">
        <div class="container">
            <div class="row s_nb_column_fixed">
                <div class="col-12 pb32 oe_unmovable">
                    <h3>Features showcase</h3>
                    <p class="lead">A features section highlights your product's key attributes, engaging visitors and boosting conversions.</p>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="container">
                        <div class="row">
                            <div class="ps-0 col-md-1 col-2 o_not_editable" style="text-align: center;">
                                <span style="padding: 5px 15px" class="align-self-start fa fa-star-o rounded float-start bg-o-color-3 o_editable_media" role="img"></span>
                            </div>
                            <div data-name="Feature" class="px-0 col-md-11 col-10 o_colored_level">
                                <h3 class="s_showcase_title h4-fs">Highlights Key Attributes</h3>
                                <p>A feature section allows you to clearly showcase the main benefits and unique aspects of your product.</p>
                            </div>
                        </div>
                        <div class="row">
                            <div class="ps-0 col-md-1 col-2 o_not_editable" style="text-align: center;">
                                <span style="padding: 5px 15px" class="align-self-start fa fa-user-o rounded float-start bg-o-color-3 o_editable_media" role="img"></span>
                            </div>
                            <div data-name="Feature" class="px-0 col-md-11 col-10 o_colored_level">
                                <h3 class="s_showcase_title h4-fs">Engages Visitors</h3>
                                <p>It captures your visitors' attention and helps them quickly understand the value of your product.</p>
                            </div>
                        </div>
                        <div class="row">
                            <div class="ps-0 col-md-1 col-2 o_not_editable" style="text-align: center;">
                                <span style="padding: 5px 15px" class="align-self-start fa fa-heart-o rounded float-start bg-o-color-3 o_editable_media" role="img"></span>
                            </div>
                            <div data-name="Feature" class="px-0 col-md-11 col-10 o_colored_level">
                                <h3 class="s_showcase_title h4-fs">Boosts Conversions</h3>
                                <p>Organizing and presenting key information effectively increases the likelihood of turning your visitors into customers.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row s_nb_column_fixed">
                <div class="col-12 pt8 pb8 oe_unmovable" style="text-align: center;" align="center">
                    <t t-call="mass_mailing.s_hr"/>
                    <p class="mb-0">
                        <a href="#">Discover all the features</a>
                    </p>
                </div>
            </div>
        </div>
    </section>
</template>

<template id="s_call_to_action" name="Call to Action">
    <section class="s_call_to_action o_mail_snippet_general bg-black pt48 pb24" data-vxml="001">
        <div class="container">
            <div class="row">
                <div class="col-md-9 col-9">
                    <h3><font style="color: white;"><strong>50,000+ companies</strong> run Odoo.</font></h3>
                    <p><font style="color: white;">Join us and make your company a better place.</font></p>
                </div>
                <div class="col-md-3 col-3" style="text-align: center;">
                    <p>
                        <a href="#" class="btn btn-secondary btn-lg">Contact us</a>
                    </p>
                </div>
            </div>
        </div>
    </section>
</template>

<template id="s_coupon_code" name="Promo Code">
    <section class="s_discount2 o_mail_block_discount2 o_mail_snippet_general pt32 pb32" style="padding-left: 15px; padding-right: 15px;" data-vxml="001">
        <h2 style="text-align: center;"><span><font style="font-weight: bolder;">GET $20 OFF</font></span></h2>
        <p style="text-align: center;">
            Here's your coupon code - but hurry! Ends 9/28
        </p>
        <table border="0" cellpadding="0" data-name="Promo Ticket" cellspacing="0" align="center" class="border" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
            <tr>
                <td width="50" data-name="Icon Cell" height="50" align="center" class="mx-auto o_cc o_cc3" style="width:50px !important; min-width: 50px; max-width:5.6rem; text-align: center;"><span class="fa fa-2x fa-ticket"/></td>
                <td width="200" data-name="Code Cell" height="50" align="center" class="o_cc" style="font-size: 15px; line-height: 22px; font-weight: 700; min-width: 150px; width: 200px; text-align: center;"><p class="mb0">ENDOFSUMMER20</p></td>
            </tr>
        </table>
        <div class="s_hr o_mail_snippet_general o_not_editable o_colored_level pt8 pb8" data-name="Separator">
            <hr class="w-100 mx-auto" style="border-top-width: 0px !important;"/>
        </div>
        <p style="text-align:center;">
            <a role="button" href="#" class="btn btn-primary">Use now</a>
        </p>
    </section>
</template>
</odoo>
