team.html

---
layout: page
title: Our Team
description: Learn about our team.
background: '/img/bg-about.jpg'
---

{% assign teamMembers = site.data.team %}

<!-- Team Section-->
<section class="page-section portfolio my-0">
    <div class="container my-0">
        <!-- Team Section Heading-->
        <h2 class="page-section-heading text-center text-uppercase mb-3">Our Team</h2>
        <!-- Icon Divider-->
        <div class="divider-custom mb-3">
            <div class="divider-custom-line"></div>
            <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
            <div class="divider-custom-line"></div>
        </div>
        <!-- Team Grid Items-->
        <div class="row justify-content-center mb-0">
            <!-- Team Item 1-->
            {% for member in teamMembers.team %}
            <div class="col-6 col-md-4 mb-3">
                <div class="portfolio-item mx-auto" data-toggle="modal" data-target="#{{member.html_id}}">
                    <img class="img-fluid rounded mb-2" src="{{member.img}}" alt="..." />
                    <h6 class="text-center">{{member.name}}</h6>
                    <h6 class="small text-center">{{member.role}}</h6>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
  </section>

{% for member in teamMembers.team %}
<!-- Team Modal-->
<div class="portfolio-modal modal fade" id="{{member.html_id}}" tabindex="-1" aria-labelledby="{{member.html_id}}" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header border-0"><button class="btn-close" type="button" data-dismiss="modal" aria-label="Close"></button></div>
            <div class="modal-body text-center pb-5">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col">
                            <h3>{{member.name}}</h4>
                            <p class="small text-left">
                                {{member.description}}
                            </p>
                            <button class="btn btn-primary" data-dismiss="modal">
                                <i class="fas fa-xmark fa-fw"></i>
                                Close Window
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
  </div>
{% endfor %}