{% set pageSlug = "home" %}
{% extends "_layout.html" %}

{% block content %}
<section class="hero" style="background: linear-gradient(rgba(0, 0, 0, 0.2),rgba(0, 0, 0, 0.2)),url(https://cdn.mjsmedia.co.uk/coffin-club/images/home-hero.jpg)">
    <div class="container">
        <div class="row">
            <div class="col-12 text-center">
                <h1>Welcome aboard the funeral revolution!</h1>
            </div>
        </div>
    </div>
</section>

<section>
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-6 col-lg-3">
                <a class="feature-box__link" href="/about">
                    <div class="feature-box feature-box--yellow">
                        <i class="fas fa-question-circle"></i>
                        <p>What is <br>Coffin Club UK?</p>
                    </div>
                </a>
            </div>
            <div class="col-12 col-md-6 col-lg-3">
                <a class="feature-box__link" href="/events">
                    <div class="feature-box feature-box--green">
                        <i class="far fa-calendar-alt"></i>
                        <p>Upcoming <br>Events</p>
                    </div>
                </a>
            </div>
            <div class="col-12 col-md-6 col-lg-3">
                <a class="feature-box__link" href="/coffins">
                    <div class="feature-box feature-box--blue">
                        <img src="/assets/coffin-icon.png" style="margin-bottom: 10px;">
                        <p>Our <br>Coffins</p>
                    </div>
                </a>
            </div>
            <div class="col-12 col-md-6 col-lg-3">
                <a class="feature-box__link" href="/press">
                    <div class="feature-box feature-box--purple">
                        <i class="far fa-newspaper"></i>
                        <p>Press <br>Information</p>
                    </div>
                </a>
            </div>
        </div>
    </div>
</section>

{% include '_pageSections.html' %}
<section class="call-to-action" style="background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)),url(https://cdn.mjsmedia.co.uk/coffin-club/images/home-cta.jpg)">
    <div class="container">
        <div class="row">
            <div class="col-12 text-center">
                <h3>Want to join the Coffin Club?</h3>
                <p class="lead mb-4">Get in touch and let us know!</p>
                <a href="/contact" class="button button--white">Contact us</a>
            </div>
        </div>
    </div>
</section>
{% endblock %}