<!-- Portfolio Grid Section -->
    <section id="portfolio" class="bg-light-gray">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Portfolio</h2>
                    <h3 class="section-subheading text-muted"></h3>
                </div>
            </div>
            <div class="row">
            {% for post in site.posts %}
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal{{ post.modal-id }}" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/{{ post.thumbnail }}" class="img-responsive img-centered" alt="post.alt">
                    </a>
                    <div class="portfolio-caption">
                        <h4>{{ post.title }}</h4>
                        <p class="text-muted">{{ post.subtitle }}</p>
                    </div>
                </div>
            {% endfor %}
            </div>
        </div>
    </section>
