<h1>Our Team</h1>
<p>
    Our team is made up of experienced professionals who are passionate about digital accessibility. 
    Here are a few of our key team members:
</p>
<ul>
    <% 
        people.forEach(
            (person) => { 
    %>
        <li>
            <div class="side-by-side">
                <div class="side-by-side-item" style="padding: 1rem">
            <% 
                if (typeof(person.image) !== 'undefined') {
            %>
                    <img src="img/<%= person.image %>" alt="A photo of <%= person.fname %> <%= person.lname %>">
            <%
                }
                else {
            %>
                    <i class="fa-solid fa-user fa-3x"></i>
            <%
                }
            %>
                </div>
                <div class="side-by-side-item">
                    <h3><%= person.fname %> <%= person.lname %></h3>
                    <p><%= person.position %></p>
                <% 
                    if (typeof(person.bio) !== 'undefined') {
                %>
                    <p><%= person.bio %></p>
                <%
                    }
                %>
                <% 
                    if (typeof(person.website) !== 'undefined') {
                %>
                    <a href="<%= person.website %>"><i class="fa-solid fa-globe"></i> Website</a>
                <%
                    }
                %>
                <% 
                    if (typeof(person.email) !== 'undefined') {
                %>
                    <a href="mailto:<%= person.email %>"><i class="fa-solid fa-envelope"></i> Email</a>
                <%
                    }
                %>
                <% 
                    if (typeof(person.phone) !== 'undefined') {
                %>
                    <a href="tel:<%= person.phone %>"><i class="fa-solid fa-phone"></i> Call</a>
                <%
                    }
                %>
                </div>
            </div>
        </li>
    <% 
            }
        ); 
    %>
</ul>