{% load static imagefit %}
<div class="container three-reasons text-center">
    <div class="row">
        <div class="col-lg-8 offset-lg-2">
            <div class="row">
                <div class="col-md-12">
                    <h1>3 reasons to try Hook Coffee</h1>
                </div>
            </div>
            <div class="row mb-3">
                <div class="card shadow-sm">
                    <div class="row no-gutters">
                        <div class="col-3 card-media">
                            <img src="{{ "landing/Different1.png"|resize:"100x100" }}" class="img-fluid">
                        </div>
                        <div class="col-9 text-left">
                            <div class="card-body ">
                                <div class="row">
                                    <div class="col-12">
                                        <h4 class="text-uppercase">Quality & Freshness</h4>
                                    </div>
                                    <div class="col-12">
                                        <p>
                                            We source the world’s best coffees and ship your coffee within 7 days of
                                            roasting.
                                            Freshness guaranteed.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row mb-3">
                <div class="card shadow-sm">
                    <div class="row no-gutters">
                        <div class="col-3 card-media">
                            <img src="{{ "landing/Different2.png"|resize:"100x100" }}" class="img-fluid">
                        </div>
                        <div class="col-9 text-left">
                            <div class="card-body ">
                                <div class="row">
                                    <div class="col-12">
                                        <h4 class="text-uppercase">Save Money</h4>
                                    </div>
                                    <div class="col-12">
                                        <p>
                                            Save money while getting your caffeine fix by brewing your own cup of joe.
                                            You don’t have to be a barista to make great coffee.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row mb-3">
                <div class="card shadow-sm">
                    <div class="row no-gutters">
                        <div class="col-3 card-media">
                            <img src="{{ "landing/Different3.png"|resize:"100x100" }}" class="img-fluid">
                        </div>
                        <div class="col-9 text-left">
                            <div class="card-body ">
                                <div class="row">
                                    <div class="col-12">
                                        <h4 class="text-uppercase">Convenience</h4>
                                    </div>
                                    <div class="col-12">
                                        <p>
                                            We get it, life can be hectic. We help by delivering fresh coffees to your
                                            mailbox. Just tell us what you’d like and how often.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>