<div class="page_header_people">
<div class="fs-row">
<div class="fs-cell">
<div class="page_header_people_inner">
<div class="page_header_people_breadcrumb">
<div class="page_breadcrumb">
<div class="page_breadcrumb_inner">
<div class="breadcrumb">
<nav class="breadcrumb_nav" aria-labelledby="breadcrumb_nav_title">
<div class="breadcrumb_nav_header">
<h2 class="breadcrumb_nav_title" id="breadcrumb_nav_title">You are here:</h2>
</div>
<ol class="breadcrumb_list" aria-labelledby="breadcrumb_nav_title">
<li class="breadcrumb_item breadcrumb_item_home">
<a class="breadcrumb_pill breadcrumb_pill_link" href="page-home.html">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">Home</span>
</span>
</a>
<span class="breadcrumb_divider" aria-hidden="true">
<svg class="icon icon_forward_slash">
<use href="/images/icons.svg#forward_slash" />
</svg>
</span>
</li>
<li class="breadcrumb_item">
<a class="breadcrumb_pill breadcrumb_pill_link" href="#">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">Flint School of Performing Arts</span>
</span>
</a>
<span class="breadcrumb_divider" aria-hidden="true">
<svg class="icon icon_forward_slash">
<use href="/images/icons.svg#forward_slash" />
</svg>
</span>
</li>
<li class="breadcrumb_item">
<a class="breadcrumb_pill breadcrumb_pill_link" href="#">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">Faculty & Staff</span>
</span>
</a>
<span class="breadcrumb_divider" aria-hidden="true">
<svg class="icon icon_forward_slash">
<use href="/images/icons.svg#forward_slash" />
</svg>
</span>
</li>
<li class="breadcrumb_item">
<span class="breadcrumb_pill">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">People Detail</span>
</span>
</span>
<span class="breadcrumb_end" aria-hidden="true">
<svg class="icon icon_forward_slash">
<use href="/images/icons.svg#forward_slash" />
</svg>
</span>
</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="page_header_people_body">
<div class="page_header_people_grid">
<div class="page_header_people_grid_item is_content">
<div class="page_page_people_content">
<div class="page_page_people_content_top">
<div class="page_header_people_item_program">Flint School of Performing Arts</div>
<header class="page_header_people_item_header">
<h1 class="page_header_people_item_title" id="people_item_title">
Tara Gragg
</h1>
</header>
<div class="page_header_people_titles">
Hengten Honors | Woodwind Chambers Group | Clarinet
</div>
</div>
<div class="page_header_people_meta_wrap">
<!-- Person Meta -->
<div class="people_meta" id="meta" data-type="entity" data-category="">
<div class="fs-row">
<div class="fs-cell">
<div class="people_meta_inner">
<div class="people_meta_body">
<div class="people_meta_rows">
<div class="people_meta_row">
<div class="people_meta_row_label">
Contact
</div>
<div class="people_meta_row_content">
<div class="people_meta_row_values">
<div class="people_meta_row_value">
(410) 555-1234
<strong>ext. 1234</strong>
</div>
<div class="people_meta_row_value">
<a href="mailto:email@fim.edu">
email@fim.edu
</a>
</div>
</div>
</div>
</div>
<div class="people_meta_row">
<div class="people_meta_row_label">
Department
</div>
<div class="people_meta_row_content">
<div class="people_meta_row_values">
<div class="people_meta_row_value">
<a href="#">
Performance Ensemble
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Person Meta -->
</div>
<div class="page_header_people_item_footer">
<div class="page_header_people_item_footer_action">
<a href="#" class="page_header_people_item_footer_link">
<span class="page_header_people_item_footer_link_inner">
<span class="page_header_people_item_footer_link_label">Contact FSPA</span>
<span class="page_header_people_item_footer_link_icon" aria-hidden="true">
<svg class="icon icon_chevron_right">
<use href="/images/icons.svg#chevron_right" />
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
<div class="page_header_people_grid_item is_media">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{#
{% include '@partial-page-header' with {
page: page
} %}
#}
<div class="page_header_people">
<div class="fs-row">
<div class="fs-cell">
<div class="page_header_people_inner">
<div class="page_header_people_breadcrumb">
<div class="page_breadcrumb">
<div class="page_breadcrumb_inner">
{% render '@navigation-breadcrumb' with {
page: page,
modifier: '',
links: page.breadcrumbNav,
icon_home: '',
icon_divider: 'forward_slash',
icon_end: 'forward_slash'
} %}
</div>
</div>
</div>
<div class="page_header_people_body">
<div class="page_header_people_grid">
<div class="page_header_people_grid_item is_content">
<div class="page_page_people_content">
<div class="page_page_people_content_top">
<div class="page_header_people_item_program">{{ item.program }}</div>
<header class="page_header_people_item_header">
<h1 class="page_header_people_item_title" id="people_item_title">
{{ item.name }}
</h1>
</header>
{% if item.job_titles|length %}
<div class="page_header_people_titles">
{{ item.job_titles|join(" | ") }}
</div>
{% endif %}
</div>
<div class="page_header_people_meta_wrap">
{% include "@partial-people-meta" with {
item: item
} %}
</div>
<div class="page_header_people_item_footer">
<div class="page_header_people_item_footer_action">
{% include '@partial-link' with {
class: 'page_header_people_item_footer',
title: 'Contact FSPA',
url: '#',
icon: 'chevron_right',
} %}
</div>
</div>
</div>
</div>
<div class="page_header_people_grid_item is_media">
{% if page.image %}
<figure class="page_header_people_item_figure">
{% include '@partial-image' with {
class: 'page_header_people_item',
alt: '',
image: page.image,
loading: 'lazy',
sources: [
img.full.med,
img.full.sml,
img.full.xsml,
img.full.xxsml
]
} %}
</figure>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
No notes defined.