<!-- Page Content -->
<div class="page_content">
<!-- Full Width Callouts -->
<div class="full_width_callouts">
<div class="news_related">
<div class="news_related_header">
<div class="fs-row">
<div class="fs-cell">
<div class="news_related_header_inner">
<div class="news_related_header_inner_item is_content">
<div class="news_related_title_wrapper">
<h2 class="news_related_title">Related News</h2>
</div>
<div class="news_related_description">
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auct.</p>
</div>
</div>
<div class="news_related_header_inner_item is_cta">
<div class="news_related_header_cta_wrap">
<a href="#" class="basic_link theme_white">
<span class="basic_link_inner">
<span class="basic_link_label">Explore All News</span><span class="icon_nowrap basic_link_icon" aria-hidden="true">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="news_related_body">
<div class="fs-row">
<div class="fs-cell">
<div class="news_related_items js-carousel" data-carousel-options='{ "maxWidth": "979px" }' aria-label="Related News">
<div class="news_related_item">
<figure class="news_related_item_figure">
<a class="news_related_item_figure_link" href="page-news-detail.html" aria-label="Read more about In Enim Justo Rhoncus Ut Lorem" tabindex="-1">
<img class="news_item_image" srcset="https://images.fastspot.com/jhu-odi/500x334/6 500w, https://images.fastspot.com/jhu-odi/300x200/6 300w" src="https://images.fastspot.com/jhu-odi/300x200/6" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
<div class="news_related_item_wrapper">
<div class="news_related_item_header">
<h2 class="news_related_item_title">
<a href="page-news-detail.html" class="news_related_item_title_link">
<span class="news_related_item_title_link_inner">
<span class="news_related_item_title_link_label">In Enim Justo Rhoncus Ut Lorem</span>
</span>
</a>
</h2>
<div class="news_related_item_meta">
<time class="news_related_item_date" datetime="Feb 17">Feb 17</time>
</div>
</div>
</div>
</div>
<div class="news_related_item">
<figure class="news_related_item_figure">
<a class="news_related_item_figure_link" href="page-news-detail.html" aria-label="Read more about Lorem ipsum dolor sit amet, consectetuer adipiscing elit" tabindex="-1">
<img class="news_item_image" srcset="https://images.fastspot.com/jhu-odi/500x334/2 500w, https://images.fastspot.com/jhu-odi/300x200/2 300w" src="https://images.fastspot.com/jhu-odi/300x200/2" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
<div class="news_related_item_wrapper">
<div class="news_related_item_header">
<h2 class="news_related_item_title">
<a href="page-news-detail.html" class="news_related_item_title_link">
<span class="news_related_item_title_link_inner">
<span class="news_related_item_title_link_label">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</span>
</span>
</a>
</h2>
<div class="news_related_item_meta">
<time class="news_related_item_date" datetime="Jan 13">Jan 13</time>
</div>
</div>
</div>
</div>
<div class="news_related_item">
<figure class="news_related_item_figure">
<a class="news_related_item_figure_link" href="page-news-detail.html" aria-label="Read more about Etiam ultricies nisi vel augue" tabindex="-1">
<img class="news_item_image" srcset="https://images.fastspot.com/jhu-odi/500x334/3 500w, https://images.fastspot.com/jhu-odi/300x200/3 300w" src="https://images.fastspot.com/jhu-odi/300x200/3" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
<div class="news_related_item_wrapper">
<div class="news_related_item_header">
<h2 class="news_related_item_title">
<a href="page-news-detail.html" class="news_related_item_title_link">
<span class="news_related_item_title_link_inner">
<span class="news_related_item_title_link_label">Etiam ultricies nisi vel augue</span>
</span>
</a>
</h2>
<div class="news_related_item_meta">
<time class="news_related_item_date" datetime="Jan 18">Jan 18</time>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Related News -->
<div class="visual_cta">
<div class="fs-row">
<div class="fs-cell">
<div class="visual_cta_inner">
<div class="visual_cta_grid fs-row fs-lg-align-center">
<div class="visual_cta_grid_item fs-cell fs-lg-6">
<figure class="visual_cta_figure">
<img class="visual_cta_image" srcset="https://images.fastspot.com/jhu-odi/980x654/6 980w, https://images.fastspot.com/jhu-odi/740x494/6 740w, https://images.fastspot.com/jhu-odi/500x334/6 500w, https://images.fastspot.com/jhu-odi/300x200/6 300w" sizes="(min-width: 1220px) 549px, (min-width: 980px) 439px, (min-width: 740px) 689px, 90vw" src="https://images.fastspot.com/jhu-odi/300x200/6" alt="" loading="lazy" width="300" height="200">
</figure>
</div>
<div class="visual_cta_grid_item fs-cell fs-lg-6">
<div class="visual_cta_body">
<div class="visual_cta_pretitle">
Realizing Our Promise
</div>
<h2 class="visual_cta_title">
The Second JHU Roadmap on Diversity, Equity, and Inclusion
</h2>
<div class="visual_cta_desc typography">
<p>This Roadmap represents the next iteration of the university’s key strategic framework for advancing diversity, equity, and inclusion, with 24 goals designed to strengthen and expand our DEI commitments.</p>
</div>
<div class="visual_cta_links">
<div class="visual_cta_link_wrap">
<a href="#" class="basic_link">
<span class="basic_link_inner">
<span class="basic_link_label">Diversity Roadmap Text</span><span class="icon_nowrap basic_link_icon" aria-hidden="true">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</span>
</a>
</div>
<div class="visual_cta_link_wrap">
<a href="#" class="basic_link">
<span class="basic_link_inner">
<span class="basic_link_label">Our Goals in Progress</span><span class="icon_nowrap basic_link_icon" aria-hidden="true">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</span>
</a>
</div>
<div class="visual_cta_link_wrap">
<a href="#" class="basic_link">
<span class="basic_link_inner">
<span class="basic_link_label">History of D&I and JHU</span><span class="icon_nowrap basic_link_icon" aria-hidden="true">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="about_cta">
<div class="fs-row">
<div class="fs-cell">
<div class="about_cta_inner">
<div class="about_cta_grid fs-row fs-lg-align-center">
<div class="about_cta_grid_item fs-cell fs-lg-6">
<figure class="about_cta_figure">
<img class="about_cta_image" srcset="https://images.fastspot.com/jhu-odi/740x740/2 740w, https://images.fastspot.com/jhu-odi/500x500/2 500w, https://images.fastspot.com/jhu-odi/300x300/2 300w" sizes="(min-width: 1220px) 629px, (min-width: 980px) 439px, 90vw" src="https://images.fastspot.com/jhu-odi/300x300/2" alt="" loading="lazy" width="300" height="300">
</figure>
</div>
<div class="about_cta_grid_item fs-cell fs-lg-6">
<div class="about_cta_content">
<h2 class="about_cta_title">
The Office of Diversity and Inclusion
</h2>
<div class="about_cta_desc">
<p>As innovators and change agents, the Office of Diversity and Inclusion will set the standard for excellence in cultivating inclusive, equitable, and just environments in higher education.</p>
</div>
<div class="about_cta_link_wrap">
<a href="#" class="button_link theme_brand_blue">
<span class="button_link_inner">
<span class="button_link_label">Learn About ODI</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Full Width Callouts -->
</div>
<!-- Page Content -->
<div class="page_content">
<!-- Full Width Callouts -->
<div class="full_width_callouts">
{% render "@component-related-news" %}
{% render "@component-visual-call-to-action" %}
{% render "@component-about-cta" %}
</div>
<!-- END: Full Width Callouts -->
</div>
No notes defined.