{% extends 'base.html.twig' %}

{% block content %}
<div class="main-container">
    <section class="text-center imagebg space--md" data-overlay="3">
        <div class="background-image-holder">
            <img alt="background" src="img/banner_colours.jpg" />
        </div>
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-lg-6">
                    <h1>Gallery</h1>
                </div>
            </div>
            <!--end of row-->
        </div>
        <!--end of container-->
    </section>
    <section>
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="masonry">
                        <div class="masonry__container">
                            
                             <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/01.jpg" />
                            </div>

                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/02.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/03.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/10.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/04.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/05.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/06.jpg" />
                            </div>

                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/07.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/08.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/09.jpg" />
                            </div>
                            <div class="col-md-4 masonry__item">
                                <img alt="pic" src="/img/gallery/11.jpg" />
                            </div>

                            
                            
                        </div>
                    </div>
                </div>
            </div>
            <!--end of row-->
        </div>
        <!--end of container-->
    </section>
</div>
{% endblock content %}