<!-- Menu -->
<dialog class="menu" id="menu" data-js-modal='{ "scrollLock": true }' aria-labelledby="menu__title">
<div class="menu__inner">
<div class="menu__header">
<div class="fw-container">
<div class="menu__header-inner">
<h1 class="menu__title" id="menu__title">Site Menu</h1>
</div>
</div>
</div>
<div class="menu__primary">
<div class="fw-container">
<div class="menu__primary-inner">
<div class="menu__search">
<div class="site-search site-search--menu" id="site-search-2" itemscope itemtype="https://schema.org/WebSite">
<meta itemprop="url" content="http://static.example.dev.fastspot.com">
<form class="site-search__form" action="/components/preview/template-search" itemprop="potentialAction" itemscope itemtype="http://schema.org/SearchAction">
<meta itemprop="target" content="http://static.example.dev.fastspot.com/components/preview/template-search?q={q}">
<label class="site-search__label" for="site-search-2__input">
Search
</label>
<div class="site-search__field">
<input class="site-search__input" id="site-search-2__input" itemprop="query-input" type="search" name="q" required>
<div class="site-search__submit">
<button class="button-bordered
" id="site-search-2__button" type="submit">
<span class="button-bordered__inner"> <span class="button-bordered__label">Submit Search</span>
<span class="button-bordered__icon" aria-hidden="true"><svg class="icon icon--search">
<use href="/images/icons.svg?1.0.0#search" />
</svg></span>
</span>
</button>
</div>
</div>
</form>
</div>
</div>
<div class="menu__main-nav">
<nav class="
disclosure-nav
main-disclosure-collapse
disclosure-collapse-nav" id="disclosure-nav-2" data-js-nav-disclosure aria-labelledby="disclosure-nav-2__title">
<div class="
disclosure-nav__header
main-disclosure-collapse__header
">
<h2 class="disclosure-nav__title main-disclosure-collapse__title" id="disclosure-nav-2__title">Main Site Links</h2>
</div>
<ul class="
disclosure-nav__list
main-disclosure-collapse__list
" id="disclosure-nav-2_list" aria-labelledby="disclosure-nav-2__title">
<li class="
disclosure-nav__item
main-disclosure-collapse__item
main-disclosure-collapse__item--has-children
" id="disclosure-nav-2__item-1" data-js-nav-disclosure-item>
<div class="
disclosure-nav__item-inner
main-disclosure-collapse__item-inner
">
<a class="
disclosure-nav__item-link
main-disclosure-collapse__item-link
" id="disclosure-nav-2__item-1-link" href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__item-link-label
main-disclosure-collapse__item-link-label
">About</span>
</div>
</a>
<button class="main-disclosure-collapse__item-toggle
disclosure-nav__item-toggle button-bordered" data-js-nav-disclosure-button="" aria-labelledby="disclosure-nav-2__item-1-link" aria-controls="disclosure-nav-2__children-1">
<span class="main-disclosure-collapse__item-toggle-inner"> <span class="main-disclosure-collapse__item-toggle-icon" aria-hidden="true"><svg class="icon icon--caret-down">
<use href="/images/icons.svg?1.0.0#caret-down" />
</svg></span>
</span>
</button>
</div>
<ul class="
disclosure-nav__children
main-disclosure-collapse__children
" id="disclosure-nav-2__children-1" data-js-nav-disclosure-panel aria-labelledby="disclosure-nav-2__item-1-link" hidden>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Lorem ipsum</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Consectetuer Adipiscing Elit</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aenean Commodo</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Penatibus et Magnis dis Parturient Montes Sapien ut Liber</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aenean Massa</span>
</div>
</a>
</li>
</ul>
</li>
<li class="
disclosure-nav__item
main-disclosure-collapse__item
main-disclosure-collapse__item--has-children
" id="disclosure-nav-2__item-2" data-js-nav-disclosure-item>
<div class="
disclosure-nav__item-inner
main-disclosure-collapse__item-inner
">
<a class="
disclosure-nav__item-link
main-disclosure-collapse__item-link
" id="disclosure-nav-2__item-2-link" href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__item-link-label
main-disclosure-collapse__item-link-label
">Academics</span>
</div>
</a>
<button class="main-disclosure-collapse__item-toggle
disclosure-nav__item-toggle button-bordered" data-js-nav-disclosure-button="" aria-labelledby="disclosure-nav-2__item-2-link" aria-controls="disclosure-nav-2__children-2">
<span class="main-disclosure-collapse__item-toggle-inner"> <span class="main-disclosure-collapse__item-toggle-icon" aria-hidden="true"><svg class="icon icon--caret-down">
<use href="/images/icons.svg?1.0.0#caret-down" />
</svg></span>
</span>
</button>
</div>
<ul class="
disclosure-nav__children
main-disclosure-collapse__children
" id="disclosure-nav-2__children-2" data-js-nav-disclosure-panel aria-labelledby="disclosure-nav-2__item-2-link" hidden>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Nam Quam Nunc</span>
</div>
</a>
</li>
</ul>
</li>
<li class="
disclosure-nav__item
main-disclosure-collapse__item
main-disclosure-collapse__item--is-open
main-disclosure-collapse__item--has-children
" id="disclosure-nav-2__item-3" data-js-nav-disclosure-item>
<div class="
disclosure-nav__item-inner
main-disclosure-collapse__item-inner
">
<a class="
disclosure-nav__item-link
main-disclosure-collapse__item-link
main-disclosure-collapse__item-link--is-active
" id="disclosure-nav-2__item-3-link" href="#" aria-current="page">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__item-link-label
main-disclosure-collapse__item-link-label
">Admissions</span>
</div>
</a>
<button class="main-disclosure-collapse__item-toggle
disclosure-nav__item-toggle button-bordered" data-js-nav-disclosure-button="" aria-labelledby="disclosure-nav-2__item-3-link" aria-controls="disclosure-nav-2__children-3">
<span class="main-disclosure-collapse__item-toggle-inner"> <span class="main-disclosure-collapse__item-toggle-icon" aria-hidden="true"><svg class="icon icon--caret-down">
<use href="/images/icons.svg?1.0.0#caret-down" />
</svg></span>
</span>
</button>
</div>
<ul class="
disclosure-nav__children
main-disclosure-collapse__children
" id="disclosure-nav-2__children-3" data-js-nav-disclosure-panel aria-labelledby="disclosure-nav-2__item-3-link" hidden>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Nam quam nunc</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Blandit Vel</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Donec Vitae Sapien</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Ut Libero</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Venenatis Faucibus</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Nullam Quis Ante</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Orci Eget Eros Faucibus Tincidunt Maecenas Tempus Tellus Eget Condimentum</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Sed Fringilla Mauris Sit</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Amet Nibh</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Donec Sodales Sagittis</span>
</div>
</a>
</li>
</ul>
</li>
<li class="
disclosure-nav__item
main-disclosure-collapse__item
main-disclosure-collapse__item--has-children
" id="disclosure-nav-2__item-4" data-js-nav-disclosure-item>
<div class="
disclosure-nav__item-inner
main-disclosure-collapse__item-inner
">
<a class="
disclosure-nav__item-link
main-disclosure-collapse__item-link
" id="disclosure-nav-2__item-4-link" href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__item-link-label
main-disclosure-collapse__item-link-label
">Financial Aid</span>
</div>
</a>
<button class="main-disclosure-collapse__item-toggle
disclosure-nav__item-toggle button-bordered" data-js-nav-disclosure-button="" aria-labelledby="disclosure-nav-2__item-4-link" aria-controls="disclosure-nav-2__children-4">
<span class="main-disclosure-collapse__item-toggle-inner"> <span class="main-disclosure-collapse__item-toggle-icon" aria-hidden="true"><svg class="icon icon--caret-down">
<use href="/images/icons.svg?1.0.0#caret-down" />
</svg></span>
</span>
</button>
</div>
<ul class="
disclosure-nav__children
main-disclosure-collapse__children
" id="disclosure-nav-2__children-4" data-js-nav-disclosure-panel aria-labelledby="disclosure-nav-2__item-4-link" hidden>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aliquam Lorem Ante</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Quisque Rutrum</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aeneanimperdiet</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Tellus Eget Condimentum</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Duis Leo</span>
</div>
</a>
</li>
</ul>
</li>
<li class="
disclosure-nav__item
main-disclosure-collapse__item
main-disclosure-collapse__item--has-children
" id="disclosure-nav-2__item-5" data-js-nav-disclosure-item>
<div class="
disclosure-nav__item-inner
main-disclosure-collapse__item-inner
">
<a class="
disclosure-nav__item-link
main-disclosure-collapse__item-link
" id="disclosure-nav-2__item-5-link" href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__item-link-label
main-disclosure-collapse__item-link-label
">Student Life</span>
</div>
</a>
<button class="main-disclosure-collapse__item-toggle
disclosure-nav__item-toggle button-bordered" data-js-nav-disclosure-button="" aria-labelledby="disclosure-nav-2__item-5-link" aria-controls="disclosure-nav-2__children-5">
<span class="main-disclosure-collapse__item-toggle-inner"> <span class="main-disclosure-collapse__item-toggle-icon" aria-hidden="true"><svg class="icon icon--caret-down">
<use href="/images/icons.svg?1.0.0#caret-down" />
</svg></span>
</span>
</button>
</div>
<ul class="
disclosure-nav__children
main-disclosure-collapse__children
" id="disclosure-nav-2__children-5" data-js-nav-disclosure-panel aria-labelledby="disclosure-nav-2__item-5-link" hidden>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aenean Vulputate Eleifend Tellus</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Nascetur</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Ridiculus Mus</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Pellentesque Eu</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Vivamus Elementum Semper</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aenean Vulputate</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Aenean Leo Ligula</span>
</div>
</a>
</li>
<li class="
disclosure-nav__child-item
main-disclosure-collapse__child-item
" data-js-nav-disclosure-child-item>
<a class="
disclosure-nav__child-link
main-disclosure-collapse__child-link
" data-js-nav-disclosure-child-link href="#">
<div class="
disclosure-nav__item-link-inner
main-disclosure-collapse__item-link-inner
">
<span class="
disclosure-nav__child-link-label
main-disclosure-collapse__child-link-label
">Semper Libero</span>
</div>
</a>
</li>
</ul>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
<div class="menu__ribbon">
<div class="fw-container">
<div class="menu__ribbon-inner">
<div class="menu__audience-nav">
<!-- Toggle Navigation -->
<div class="
audience-nav
audience-nav--menu
" id="audience-nav-11" data-js-disclosure>
<div class="audience-nav__button">
<button class="button-bordered
" data-js-disclosure-button="" aria-controls="audience-nav-11__panel">
<span class="button-bordered__inner"> <span class="button-bordered__label">Audience</span>
<span class="button-bordered__icon" aria-hidden="true"><svg class="icon icon--plus">
<use href="/images/icons.svg?1.0.0#plus" />
</svg></span>
</span>
</button>
</div>
<div class="audience-nav__panel" id="audience-nav-11__panel" data-js-disclosure-panel hidden>
<nav class="audience-nav
" id="audience-nav-12" aria-labelledby="audience-nav-12__title">
<div class="audience-nav__header">
<h2 class="audience-nav__title" id="audience-nav-12__title">Audience Links</h2>
</div>
<ul class="audience-nav__list" aria-labelledby="audience-nav-12__title">
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-1item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Faculty</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-2item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Staff</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-3item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Current Students</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-4item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Prospective Student</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-5item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Alumni</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-6item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Parents & Families</span>
</div>
</a>
</li>
<li class="
audience-nav__item
">
<a class="
audience-nav__item-link
" id="audience-nav-12__link-7item-link" href="#">
<div class="audience-nav__item-link-inner">
<span class="audience-nav__item-link-label">Visitors</span>
</div>
</a>
</li>
</ul>
</nav>
</div>
</div>
<!-- END: Toggle Navigation -->
</div>
<div class="menu__secondary-nav">
<nav class="secondary-nav
" id="secondary-nav-2" aria-labelledby="secondary-nav-2__title">
<div class="secondary-nav__header">
<h2 class="secondary-nav__title" id="secondary-nav-2__title">Secondary Links</h2>
</div>
<ul class="secondary-nav__list" aria-labelledby="secondary-nav-2__title">
<li class="
secondary-nav__item
">
<a class="
secondary-nav__item-link
" id="secondary-nav-2__link-1item-link" href="#">
<div class="secondary-nav__item-link-inner">
<span class="secondary-nav__item-link-label">News</span>
</div>
</a>
</li>
<li class="
secondary-nav__item
">
<a class="
secondary-nav__item-link
" id="secondary-nav-2__link-2item-link" href="#">
<div class="secondary-nav__item-link-inner">
<span class="secondary-nav__item-link-label">Events</span>
</div>
</a>
</li>
<li class="
secondary-nav__item
">
<a class="
secondary-nav__item-link
" id="secondary-nav-2__link-3item-link" href="#">
<div class="secondary-nav__item-link-inner">
<span class="secondary-nav__item-link-label">Directory</span>
</div>
</a>
</li>
<li class="
secondary-nav__item
">
<a class="
secondary-nav__item-link
" id="secondary-nav-2__link-4item-link" href="#">
<div class="secondary-nav__item-link-inner">
<span class="secondary-nav__item-link-label">Giving</span>
</div>
</a>
</li>
<li class="
secondary-nav__item
">
<a class="
secondary-nav__item-link
" id="secondary-nav-2__link-5item-link" href="#">
<div class="secondary-nav__item-link-inner">
<span class="secondary-nav__item-link-label">Visit</span>
</div>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
<div class="menu__close">
<div class="fw-container">
<div class="menu__close-inner">
<div class="menu__close-button">
<button class="
button-toggle
button-bordered
" data-js-modal-close="" autofocus="">
<span class="
button-toggle__inner
button-toggle__inner--default
button-bordered__inner
"> <span class="button-toggle__label button-bordered__label">Close</span>
<span class="button-toggle__icon button-bordered__icon" aria-hidden="true">
<svg class="icon icon--close">
<use href="/images/icons.svg?1.0.0#close" />
</svg>
</span>
</span> <span class="
button-toggle__inner
button-toggle__inner--active
button-bordered__inner
">
<span class="button-toggle__label button-bordered__label">Close</span>
<span class="button-toggle__icon button-bordered__icon" aria-hidden="true">
<svg class="icon icon--close">
<use href="/images/icons.svg?1.0.0#close" />
</svg>
</span>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
</dialog>
<!-- END: Menu -->
{% set group_title = group_title|default('Site Menu') %}
{% set has_group_title = group_title is not empty %}
{% set heading_level = heading_level ?? 1 %}
{% set group_heading_tag = 'h' ~ (heading_level) %}
{% set item_heading_level = has_group_title ? heading_level + 1 : heading_level %}
<!-- Menu -->
<dialog
class="menu"
id="menu"
data-js-modal='{ "scrollLock": true }'
aria-labelledby="menu__title"
>
<div class="menu__inner">
<div class="menu__header">
<div class="fw-container">
<div class="menu__header-inner">
<{{ group_heading_tag }}
class="menu__title"
id="menu__title"
>
{{- group_title -}}
</{{ group_heading_tag }}>
</div>
</div>
</div>
<div class="menu__primary">
<div class="fw-container">
<div class="menu__primary-inner">
<div class="menu__search">
{% include '@partial-search' with {
modifier: 'menu',
label: 'Search',
placeholder: '',
button_text: 'Submit Search'
} %}
</div>
<div class="menu__main-nav">
{% include '@navigation-disclosure-nav' with {
classes: {
base: 'main-disclosure-collapse',
modifiers: [],
utility: 'disclosure-collapse-nav'
},
title: 'Main Site Links',
toggle: {
classes: {
utility: 'button-bordered'
},
icon: 'caret-down'
},
heading_level: item_heading_level,
links: navigation.main,
settings: {}
} %}
</div>
</div>
</div>
</div>
<div class="menu__ribbon">
<div class="fw-container">
<div class="menu__ribbon-inner">
<div class="menu__audience-nav">
{% include '@navigation-toggle' with {
classes: {
base: 'audience-nav',
modifiers: ['menu'],
utility: ''
},
title: 'Audience Links',
heading_level: item_heading_level,
links: navigation.audience,
button: {
classes: {
base: 'button-bordered'
},
title: 'Audience',
icon: 'plus'
},
settings: {}
} %}
</div>
<div class="menu__secondary-nav">
{% include '@navigation-basic' with {
classes: {
base: 'secondary-nav',
modifiers: [],
utility: ''
},
title: 'Secondary Links',
heading_level: item_heading_level,
links: navigation.secondary
} %}
</div>
</div>
</div>
</div>
<div class="menu__close">
<div class="fw-container">
<div class="menu__close-inner">
<div class="menu__close-button">
{% include '@partial-button-toggle' with {
classes: {
base: 'button-bordered'
},
attributes: {
'data-js-modal-close': '',
'autofocus': '',
},
default: {
title: 'Close',
icon: 'close'
},
active: {
title: 'Close',
icon: 'close'
}
} only %}
</div>
</div>
</div>
</div>
</div>
</dialog>
<!-- END: Menu -->
No notes defined.