<!-- Header -->
<header class="js-header header header_inspirations" id="header">
<noscript>
<iframe src="//www.googletagmanager.com/ns.html?id=GTM-K6P58WP" height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<a class="skip_link skip_main" id="skip_main_link" href="#page_title">Skip Main Navigation</a>
<div class="js-alert-wrapper">
</div>
<div class="js-cookie-wrapper">
</div>
<div class="js-header-primary header_primary">
<div class="fs-row">
<div class="fs-cell">
<div class="header_primary_inner">
<div class="header_logo">
<div class="logo logo_header logo_icon">
<a class="logo_link" href="page-home.html">
<span class="logo_link_label">VCUarts</span>
<span class="logo_link_icon">
<svg class="icon icon_logo">
<use href="/images/icons.svg#logo" />
</svg>
</span>
</a>
</div>
</div>
<div class="header_controls">
<div class="js-header-controls-navs header_controls_navs">
<div class="header_controls_navs_inner">
<div class="header_departments_nav">
<div class="js-nav-toggle-group js-departments-nav-group js-departments-nav-group-head toggle_nav_group departments_nav_group departments_nav_group_head">
<button class="js-departments-nav-toggle js-nav-toggle-button js-swap departments_nav_toggle button_toggle" data-swap-target=".js-departments-nav-group" data-swap-linked="departments">
<span class="departments_nav_toggle_inner_default departments_nav_toggle_inner button_toggle_inner_default button_toggle_inner">
<span class="departments_nav_toggle_label_default departments_nav_toggle_label button_toggle_label_default button_toggle_label">Departments</span>
<span class="departments_nav_toggle_icon_default departments_nav_toggle_icon button_toggle_icon_default button_toggle_icon" aria-hidden="true">
<svg class="icon icon_chevron_down">
<use href="/images/icons.svg#chevron_down" />
</svg>
</span>
</span>
<span class="departments_nav_toggle_inner_active departments_nav_toggle_inner button_toggle_inner_active button_toggle_inner">
<span class="departments_nav_toggle_label_active departments_nav_toggle_label button_toggle_label_active button_toggle_label">Departments</span>
<span class="departments_nav_toggle_icon_active departments_nav_toggle_icon button_toggle_icon_active button_toggle_icon" aria-hidden="true">
<svg class="icon icon_close">
<use href="/images/icons.svg#close" />
</svg>
</span>
</span>
</button>
<div class="js-nav-toggle-panel js-departments-nav-panel js-departments-nav-panel-head toggle_nav_panel departments_nav_panel departments_nav_panel_head">
<nav class="js-nav-toggle js-departments-nav js-departments-nav-head toggle_nav departments_nav departments_nav_head" aria-labelledby="toggle_nav_title-69">
<div class="toggle_nav_header departments_nav_header">
<h2 class="toggle_nav_title departments_nav_title" id="toggle_nav_title-69">Departments</h2>
</div>
<ul class="js-nav-toggle-list js-departments-nav-list toggle_nav_list departments_nav_list" aria-labelledby="toggle_nav_title-69">
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Art Education</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Art History</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Cinema</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Communication Arts</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Craft</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Dance & Choreography</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Fashion Design + Merchandising</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Graphic Design</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Interior Design</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Kinetic Imaging</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Music</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Painting + Printmaking</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Photography + Film</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Sculpture + Extended Media</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-departments-nav-item toggle_nav_item departments_nav_item">
<a class="js-nav-toggle-link js-departments-nav-link toggle_nav_link departments_nav_link" href="#">
<div class="toggle_nav_link_inner departments_nav_link_inner">
<span class="departments_nav_link_label">Theatre</span>
</div>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="header_audience_nav">
<div class="js-nav-toggle-group js-audience-nav-group js-audience-nav-group-head toggle_nav_group audience_nav_group audience_nav_group_head">
<button class="js-audience-nav-toggle js-nav-toggle-button js-swap audience_nav_toggle button_toggle" data-swap-target=".js-audience-nav-group" data-swap-linked="audience">
<span class="audience_nav_toggle_inner_default audience_nav_toggle_inner button_toggle_inner_default button_toggle_inner">
<span class="audience_nav_toggle_label_default audience_nav_toggle_label button_toggle_label_default button_toggle_label">Resources for</span>
<span class="audience_nav_toggle_icon_default audience_nav_toggle_icon button_toggle_icon_default button_toggle_icon" aria-hidden="true">
<svg class="icon icon_chevron_down">
<use href="/images/icons.svg#chevron_down" />
</svg>
</span>
</span>
<span class="audience_nav_toggle_inner_active audience_nav_toggle_inner button_toggle_inner_active button_toggle_inner">
<span class="audience_nav_toggle_label_active audience_nav_toggle_label button_toggle_label_active button_toggle_label">Resources for</span>
<span class="audience_nav_toggle_icon_active audience_nav_toggle_icon button_toggle_icon_active button_toggle_icon" aria-hidden="true">
<svg class="icon icon_close">
<use href="/images/icons.svg#close" />
</svg>
</span>
</span>
</button>
<div class="js-nav-toggle-panel js-audience-nav-panel js-audience-nav-panel-head toggle_nav_panel audience_nav_panel audience_nav_panel_head">
<nav class="js-nav-toggle js-audience-nav js-audience-nav-head toggle_nav audience_nav audience_nav_head" aria-labelledby="toggle_nav_title-70">
<div class="toggle_nav_header audience_nav_header">
<h2 class="toggle_nav_title audience_nav_title" id="toggle_nav_title-70">Audience</h2>
</div>
<ul class="js-nav-toggle-list js-audience-nav-list toggle_nav_list audience_nav_list" aria-labelledby="toggle_nav_title-70">
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Current Students</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Faculty & Staff</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Admitted Students</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Families & Parents</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Alumni</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Donors</span>
</div>
</a>
</li>
<li class="js-nav-toggle-item js-audience-nav-item toggle_nav_item audience_nav_item">
<a class="js-nav-toggle-link js-audience-nav-link toggle_nav_link audience_nav_link" href="#">
<div class="toggle_nav_link_inner audience_nav_link_inner">
<span class="audience_nav_link_label">Press & Vendors</span>
</div>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
<div class="js-header-menu-toggle header_menu_toggle">
<a href="#menu" class="menu_toggle js-menu-toggle js-swap" data-swap-target=".menu" data-swap-linked="menu">
<span class="menu_toggle_inner_default menu_toggle_inner">
<span class="menu_toggle_label_default menu_toggle_label">Menu</span>
<span class="menu_toggle_icon_default menu_toggle_icon" aria-hidden="true">
<svg class="icon icon_menu">
<use href="/images/icons.svg#menu" />
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="header_secondary">
<div class="header_secondary_intro">
<div class="fs-row">
<div class="fs-cell">
<div class="header_secondary_intro_inner">
<div class="header_secondary_intro_meta">
<div class="header_secondary_intro_group">
<div class="header_secondary_breadcrumb">
<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">/</span>
</li>
<li class="breadcrumb_item">
<a class="breadcrumb_pill breadcrumb_pill_link" href="#">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">Inspirations</span>
</span>
</a>
<span class="breadcrumb_divider" aria-hidden="true">/</span>
</li>
<li class="breadcrumb_item">
<span class="breadcrumb_pill">
<span class="breadcrumb_pill_inner">
<span class="breadcrumb_pill_label">Inclusion & Representation</span>
</span>
</span>
</li>
</ol>
</nav>
</div>
</div>
<h1 class="header_secondary_title" id="page_title" tabindex="-1">
<span class="header_secondary_title_prefix">Inspiration </span>
<span class="header_secondary_title_label">Inclusion & Representation</span>
</h1>
</div>
<p class="header_secondary_description">The arts have the power to bring people together, celebrate difference and togetherness, and inform the human experience.</p>
</div>
</div>
</div>
</div>
</div>
<div class="header_secondary_media">
<div class="header_secondary_media_inner">
<figure class="header_secondary_figure">
<img class="header_secondary_image" srcset="https://images.fastspot.com/vcuarts/1440x810/20 1440w, https://images.fastspot.com/vcuarts/1220x686/20 1220w, https://images.fastspot.com/vcuarts/980x552/20 980w, https://images.fastspot.com/vcuarts/740x416/20 740w, https://images.fastspot.com/vcuarts/500x282/20 500w, https://images.fastspot.com/vcuarts/300x169/20 300w" sizes="100vw" src="https://images.fastspot.com/vcuarts/300x169/20" alt="" loading="eager" width="300" height="169">
</figure>
</div>
</div>
</div>
<div class="inspiration_toggle_bar">
<div class="inspiration_toggle_bar_inner js-inspiration-toggle-bar-inner">
<a href="#inspiration_menu" class="inspiration_menu_toggle js-inspiration-menu-toggle js-swap" data-swap-target=".inspiration_menu" data-swap-linked="inspiration_menu">
<span class="inspiration_menu_toggle_inner_default inspiration_menu_toggle_inner">
<span class="inspiration_menu_toggle_label_default inspiration_menu_toggle_label">Explore Inspirations</span>
</span>
</a>
</div>
</div>
</header>
<!-- END: Header -->
<!-- Header -->
<header class="js-header header header_inspirations" id="header">
<noscript>
<iframe src="//www.googletagmanager.com/ns.html?id=GTM-K6P58WP" height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<a class="skip_link skip_main" id="skip_main_link" href="#page_title">Skip Main Navigation</a>
<div class="js-alert-wrapper">
{% if page.alert == true %}
{% set alert_path = page.alert_path|default('/components/render/partial-alert') %}
<!-- WordPress / Drupal, use AlertURL to target the script that returns this content. For BigTree, enter the alert markup here. -->
<script>
var AlertURL = "{{ alert_path|path }}";
</script>
{% endif %}
</div>
<div class="js-cookie-wrapper">
{% if page.cookie == true %}
{% set cookie_path = page.cookie_path|default('/components/render/partial-cookie') %}
<!-- WordPress / Drupal, use CookieURL to target the script that returns this content. For BigTree, enter the cookie markup here. -->
<script>
var CookieURL = "{{ cookie_path|path }}";
</script>
{% endif %}
</div>
<div class="js-header-primary header_primary">
<div class="fs-row">
<div class="fs-cell">
<div class="header_primary_inner">
<div class="header_logo">
{% include '@partial-logo' with {
modifier: 'header',
icon: 'logo',
print: ''
} %}
</div>
<div class="header_controls">
<div class="js-header-controls-navs header_controls_navs">
<div class="header_controls_navs_inner">
<div class="header_departments_nav">
{% include '@navigation-toggle' with {
class: 'departments',
modifier: 'head',
title: 'Departments',
links: navigation.departments,
icon: '',
child_icon: '',
toggle: {
title: 'Departments',
icon: 'chevron_down',
title_active: 'Departments',
icon_active: 'close',
swap_target: '.js-departments-nav-group',
swap_link: 'departments'
}
} %}
</div>
<div class="header_audience_nav">
{% include '@navigation-toggle' with {
class: 'audience',
modifier: 'head',
title: 'Audience',
links: navigation.audience,
icon: '',
child_icon: '',
toggle: {
title: 'Resources for',
icon: 'chevron_down',
title_active: 'Resources for',
icon_active: 'close',
swap_target: '.js-audience-nav-group',
swap_link: 'audience'
}
} %}
</div>
</div>
</div>
<div class="js-header-menu-toggle header_menu_toggle">
{% include '@partial-link-toggle' with {
class: 'menu',
js: true,
title: 'Menu',
url: '#menu',
icon: 'menu',
swap_target: '.menu',
swap_link: 'menu'
} %}
</div>
</div>
</div>
</div>
</div>
</div>
<div class="header_secondary">
<div class="header_secondary_intro">
<div class="fs-row">
<div class="fs-cell">
<div class="header_secondary_intro_inner">
<div class="header_secondary_intro_meta">
<div class="header_secondary_intro_group">
<div class="header_secondary_breadcrumb">
{% render '@navigation-breadcrumb' with {
page: page,
modifier: '',
links: page.breadcrumbNav,
icon_home: '',
icon_divider: '',
icon_end: ''
} %}
</div>
<h1 class="header_secondary_title" id="page_title" tabindex="-1">
<span class="header_secondary_title_prefix">Inspiration </span>
<span class="header_secondary_title_label">{{ page.title }}</span>
</h1>
</div>
{% if page.description %}
<p class="header_secondary_description">{{ page.description }}</p>
{% endif %}
</div>
</div>
</div>
</div>
</div>
<div class="header_secondary_media">
<div class="header_secondary_media_inner">
<figure class="header_secondary_figure">
{% include '@partial-image' with {
class: 'header_secondary',
alt: page.alt,
image: page.image,
loading: 'eager',
sources: [
img.wide.xlrg,
img.wide.lrg,
img.wide.med,
img.wide.sml,
img.wide.xsml,
img.wide.xxsml
],
sizes: [
'100vw'
]
} %}
</figure>
</div>
</div>
</div>
<div class="inspiration_toggle_bar">
<div class="inspiration_toggle_bar_inner js-inspiration-toggle-bar-inner">
{% include '@partial-link-toggle' with {
class: 'inspiration_menu',
js: true,
title: 'Explore Inspirations',
url: '#inspiration_menu',
icon: '',
swap_target: '.inspiration_menu',
swap_link: 'inspiration_menu'
} %}
</div>
</div>
</header>
<!-- END: Header -->
No notes defined.