<div class="events_featured theme_white">
<div class="section_header events_featured_header">
<div class="fs-row">
<div class="fs-cell">
<div class="section_header_inner">
<div class="section_header_content">
<h2 class="section_header_title">Latest From Us</h2>
<p class="section_header_description">Lorem ipsum dolor sit amet consectetur. Sodales tristique dui pulvinar tellus porta. Vel at tempus nunc vitae.</p>
</div>
<div class="section_header_link_wrapper">
<a href="#" class="button button_shadow section_header_link theme_accent">
<span class="button_inner section_header_link_inner">
<span class="button_label section_header_link_label">More Events</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="events_featured_body">
<div class="fs-row">
<div class="fs-cell">
<div class="events_featured_body_inner">
<div class="embla embla__default-controls js-carousel-embla" data-carousel-embla='{"align":"center","watchDrag":true,"containScroll":false,"duration":40,"plugins":["fade"]}'>
<div id="events-featured-viewport-2" class="embla__viewport js-carousel-embla-viewport">
<ul class="events_featured_list embla__container js-carousel-embla-container">
<li class="events_featured_item embla__slide">
<!-- Event Feature -->
<div class="event_feature theme_accent">
<div class="event_feature_inner">
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_sm">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Breaking the Glass Ceiling: Women in Health and Research" tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/980x735/1 980w, https://images.fastspot.com/generic/740x555/1 740w, https://images.fastspot.com/generic/500x375/1 500w, https://images.fastspot.com/generic/300x225/1 300w" sizes="(min-width: 780px) 691px, (min-width: 380px) calc(96.05vw - 39px), calc(31.67vw + 193px)" src="https://images.fastspot.com/generic/300x225/1" alt="" loading="lazy" width="300" height="225">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
<div class="event_feature_figure_date">
<time class="event_date theme_white_blue" datetime="2024-09-31 17:00:00">
<span class="event_date_from">From</span>
<span class="event_date_start">
<span class="event_date_month">
Oct
</span>
<span class="event_date_day">
01
</span>
</span>
</time>
</div>
</div>
<div class="event_feature_wrapper">
<div class="event_feature_content_date">
<time class="event_date theme_white_blue" datetime="2024-09-31 17:00:00">
<span class="event_date_from">From</span>
<span class="event_date_start">
<span class="event_date_month">
Oct
</span>
<span class="event_date_day">
01
</span>
</span>
</time>
</div>
<div class="event_feature_location">
In-Person
|
Hopkins Lobby
</div>
<h3 class="event_feature_title">
<a href="#" class="event_feature_title_link">
<span class="event_feature_title_link_inner">
<span class="event_feature_title_link_label">Breaking the Glass Ceiling: Women in Health and Research</span>
</span>
</a>
</h3>
<p class="event_feature_description">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus.</p>
</div>
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_lg">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Breaking the Glass Ceiling: Women in Health and Research" tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/735x980/1 735w, https://images.fastspot.com/generic/555x740/1 555w, https://images.fastspot.com/generic/375x500/1 375w, https://images.fastspot.com/generic/225x300/1 225w" sizes="(min-width: 1400px) 659px, (min-width: 1220px) 575px, (min-width: 980px) 460px, 0px" src="https://images.fastspot.com/generic/225x300/1" alt="" loading="lazy" width="225" height="300">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
</div>
</div>
</div>
<!-- END: Event Feature -->
</li>
<li class="events_featured_item embla__slide">
<!-- Event Feature -->
<div class="event_feature theme_accent">
<div class="event_feature_inner">
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_sm">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Etiam in fringilla lacus. Sed." tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/980x735/2 980w, https://images.fastspot.com/generic/740x555/2 740w, https://images.fastspot.com/generic/500x375/2 500w, https://images.fastspot.com/generic/300x225/2 300w" sizes="(min-width: 780px) 691px, (min-width: 380px) calc(96.05vw - 39px), calc(31.67vw + 193px)" src="https://images.fastspot.com/generic/300x225/2" alt="" loading="lazy" width="300" height="225">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
<div class="event_feature_figure_date">
<time class="event_date theme_white_blue" datetime="2024-09-31 17:00:00">
<span class="event_date_start">
<span class="event_date_month">
Oct
</span>
<span class="event_date_day">
01
</span>
</span>
</time>
</div>
</div>
<div class="event_feature_wrapper">
<div class="event_feature_content_date">
<time class="event_date theme_white_blue" datetime="2024-09-31 17:00:00">
<span class="event_date_start">
<span class="event_date_month">
Oct
</span>
<span class="event_date_day">
01
</span>
</span>
</time>
</div>
<div class="event_feature_location">
In-Person
|
Hopkins Lobby
</div>
<h3 class="event_feature_title">
<a href="#" class="event_feature_title_link">
<span class="event_feature_title_link_inner">
<span class="event_feature_title_link_label">Etiam in fringilla lacus. Sed.</span>
</span>
</a>
</h3>
<p class="event_feature_description">Donec et facilisis sem, at lobortis nibh. Aenean bibendum venenatis.</p>
</div>
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_lg">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Etiam in fringilla lacus. Sed." tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/735x980/2 735w, https://images.fastspot.com/generic/555x740/2 555w, https://images.fastspot.com/generic/375x500/2 375w, https://images.fastspot.com/generic/225x300/2 225w" sizes="(min-width: 1400px) 659px, (min-width: 1220px) 575px, (min-width: 980px) 460px, 0px" src="https://images.fastspot.com/generic/225x300/2" alt="" loading="lazy" width="225" height="300">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
</div>
</div>
</div>
<!-- END: Event Feature -->
</li>
<li class="events_featured_item embla__slide">
<!-- Event Feature -->
<div class="event_feature theme_accent">
<div class="event_feature_inner">
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_sm">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Vestibulum nec nibh hendrerit, mollis arcu at, accumsan justo. Praesent." tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/980x735/3 980w, https://images.fastspot.com/generic/740x555/3 740w, https://images.fastspot.com/generic/500x375/3 500w, https://images.fastspot.com/generic/300x225/3 300w" sizes="(min-width: 780px) 691px, (min-width: 380px) calc(96.05vw - 39px), calc(31.67vw + 193px)" src="https://images.fastspot.com/generic/300x225/3" alt="" loading="lazy" width="300" height="225">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
<div class="event_feature_figure_date">
<time class="event_date theme_white_blue" datetime="2024-12-31 17:00:00">
<span class="event_date_start">
<span class="event_date_month">
Dec
</span>
<span class="event_date_day">
31
</span>
</span>
</time>
</div>
</div>
<div class="event_feature_wrapper">
<div class="event_feature_content_date">
<time class="event_date theme_white_blue" datetime="2024-12-31 17:00:00">
<span class="event_date_start">
<span class="event_date_month">
Dec
</span>
<span class="event_date_day">
31
</span>
</span>
</time>
</div>
<div class="event_feature_location">
In-Person
|
Hopkins Lobby
</div>
<h3 class="event_feature_title">
<a href="#" class="event_feature_title_link">
<span class="event_feature_title_link_inner">
<span class="event_feature_title_link_label">Vestibulum nec nibh hendrerit, mollis arcu at, accumsan justo. Praesent.</span>
</span>
</a>
</h3>
<p class="event_feature_description">Suspendisse ac massa suscipit, tincidunt diam a, suscipit sapien. Sed et condimentum magna. Morbi sodales purus vitae nulla fermentum elementum.</p>
</div>
<div class="event_feature_figure_wrapper event_feature_figure_wrapper_lg">
<figure class="event_feature_figure">
<a class="event_feature_figure_link" href="#" aria-label="Read more about Vestibulum nec nibh hendrerit, mollis arcu at, accumsan justo. Praesent." tabindex="-1">
<img class="event_feature_image" srcset="https://images.fastspot.com/generic/735x980/3 735w, https://images.fastspot.com/generic/555x740/3 555w, https://images.fastspot.com/generic/375x500/3 375w, https://images.fastspot.com/generic/225x300/3 225w" sizes="(min-width: 1400px) 659px, (min-width: 1220px) 575px, (min-width: 980px) 460px, 0px" src="https://images.fastspot.com/generic/225x300/3" alt="" loading="lazy" width="225" height="300">
<span class="event_feature_figure_note">Happening in Washington D.C.</span>
</a>
</figure>
</div>
</div>
</div>
<!-- END: Event Feature -->
</li>
</ul>
</div>
<div class="events_featured_controls embla__controls theme_accent" aria-controls="events-featured-viewport-2">
<div class="embla__dots js-carousel-embla-dots" role="navigation"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% set carousel_json = {
align: 'center',
watchDrag: true,
containScroll: false,
duration: 40,
plugins: ['fade'],
}|json_encode %}
{% set theme = theme|default(page.theme == 'dark' ? 'blue' : 'white') %}
{% set event_theme = event_theme|default(page.theme == 'dark' ? 'white' : 'accent') %}
{% set uuid_viewport = uniqid("events-featured-viewport") %}
<div class="events_featured theme_{{ theme }}">
{% if title %}
{% include "@partial-section-header" with {
class: 'events_featured_header',
title: title,
description: description,
link: link,
link_theme: theme == 'blue' ? 'white' : 'accent',
} %}
{% endif %}
<div class="events_featured_body">
<div class="fs-row">
<div class="fs-cell">
<div class="events_featured_body_inner">
<div class="embla embla__default-controls js-carousel-embla" data-carousel-embla='{{ carousel_json }}'>
<div
id="{{ uuid_viewport }}"
class="embla__viewport js-carousel-embla-viewport"
>
<ul class="events_featured_list embla__container js-carousel-embla-container">
{% for item in items %}
<li class="events_featured_item embla__slide">
{% include "@partial-event-feature" with {
item: item,
heading_level: 'h3',
theme: event_theme,
} %}
</li>
{% endfor %}
</ul>
</div>
<div class="events_featured_controls embla__controls theme_{{ event_theme }}" aria-controls="{{ uuid_viewport }}">
<div class="embla__dots js-carousel-embla-dots" role="navigation"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
No notes defined.