<div class="feat_upcoming_event has_description">
<div class="fs-row">
<div class="fs-cell">
<div class="feat_upcoming_event_inner">
<header class="feat_upcoming_event_header">
<div class="feat_upcoming_event_header_content_wrap">
<div class="feat_upcoming_event_title">
Events and Speaker Series
</div>
<div class="feat_upcoming_event_desc">
Our in-person and virtual events bridge the knowledge gap between researchers, clinicians, educators, parents, and families. See all events.
</div>
</div>
</header>
<div class="feat_upcoming_event_content">
<div class="feat_upcoming_event_grid">
<div class="feat_upcoming_event_grid_item is_left">
<div class="feat_upcoming_event_card_wrap">
<div class="card type_bare theme_light">
<div class="card_content">
<div class="card_category">Ask the Experts</div>
<h3 class="card_title">
<a href="#" class="card_title_link">
On Boredom: Screen Time. Free Time. and Child Development
</a>
</h3>
<div class="card_time_wrap">
<time class="card_time" datetime="">
<span class="card_time_date">June 16</span>
<span class="card_time_time">8:00 PM UTC</span>
</time>
</div>
<div class="card_desc">
<p>What *is* boredom exactly and what role does it play in cognition and development? What are the benefits and harms of “bored time” for children and has digital media displaced the space to let minds wander?</p>
</div>
<div class="card_topics_wrap">
<div class="pill_list theme_yellow">
<div class="pill_item">
<div class="pill">
Mental & Behavioral Health
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="feat_upcoming_event_grid_item is_right">
<div class="feat_upcoming_event_speakers_polygon_wrap">
<div class="speakers_feature js-speakers-polygon" data-speakers-polygon='{"color_pattern":["yellow","salmon","light_green","pink","light_blue","dark_green"]}'>
<div class="speakers_feature_icon_wrap js-icon-wrap">
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500">
<circle cx="250" cy="250" r="249" stroke="#F3D159" stroke-width="2" />
</svg>
<div class="speakers_feature_title_wrap">
<h3 class="speakers_feature_title">
Speakers
</h3>
</div>
</div>
<div class="speakers_feature_items">
<div id="speakers_feature-1_1_item" class="speakers_feature_item theme_yellow js-item">
<div id="speakers_feature-1_1_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_1_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_1_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_1_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/1 300w, https://images.fastspot.com/framework/100x100/1 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
<div id="speakers_feature-1_2_item" class="speakers_feature_item theme_salmon js-item">
<div id="speakers_feature-1_2_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_2_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_2_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_2_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/2 300w, https://images.fastspot.com/framework/100x100/2 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/2" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
<div id="speakers_feature-1_3_item" class="speakers_feature_item theme_light_green js-item">
<div id="speakers_feature-1_3_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_3_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_3_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_3_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/3 300w, https://images.fastspot.com/framework/100x100/3 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/3" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
<div id="speakers_feature-1_4_item" class="speakers_feature_item theme_pink js-item">
<div id="speakers_feature-1_4_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_4_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_4_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_4_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/4 300w, https://images.fastspot.com/framework/100x100/4 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/4" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
<div id="speakers_feature-1_5_item" class="speakers_feature_item theme_light_blue js-item">
<div id="speakers_feature-1_5_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_5_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_5_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_5_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/1 300w, https://images.fastspot.com/framework/100x100/1 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
<div id="speakers_feature-1_6_item" class="speakers_feature_item theme_dark_green js-item">
<div id="speakers_feature-1_6_tooltip" role="tooltip" class="speakers_feature_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_feature-1_6_title" class="speakers_feature_tooltip_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_feature_tooltip_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_feature_item_btn js-btn js-swap" data-swap-target="#speakers_feature-1_6_item" data-swap-group="speakers_feature-1" aria-controls="speakers_feature-1_6_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<div class="speakers_feature_item_magnetize js-magnetize">
<div class="speakers_feature_item_magnetize_target js-magnetize-target"></div>
<figure class="speakers_feature_item_figure">
<img class="speakers_feature_item_image" srcset="https://images.fastspot.com/framework/300x300/2 300w, https://images.fastspot.com/framework/100x100/2 100w" sizes="136px" src="https://images.fastspot.com/framework/100x100/2" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
</button>
</div>
</div>
</div>
</div>
<div class="feat_upcoming_event_speakers_inline_wrap">
<div class="speakers_list show_count">
<div class="speakers_list_title">
Speakers
</div>
<div class="speakers_list_grid_items">
<div class="speakers_list_grid_item theme_yellow">
<div id="speakers_list_item-2_1_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_1_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_1_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_1_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_1_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
<div class="speakers_list_grid_item theme_salmon">
<div id="speakers_list_item-2_2_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_2_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_2_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_2_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_2_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/2" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
<div class="speakers_list_grid_item theme_light_green">
<div id="speakers_list_item-2_3_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_3_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_3_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_3_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_3_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/3" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
<div class="speakers_list_grid_item theme_pink">
<div id="speakers_list_item-2_4_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_4_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_4_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_4_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_4_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/4" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
<div class="speakers_list_grid_item theme_light_blue">
<div id="speakers_list_item-2_5_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_5_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_5_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_5_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_5_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
<div class="speakers_list_grid_item theme_dark_green">
<div id="speakers_list_item-2_6_item" class="speakers_list_item js-speaker-tooltip">
<div id="speakers_list_item-2_6_tooltip" role="tooltip" class="speakers_list_item_tooltip js-tooltip">
<button type="button" class="js-btn-tooltip-close visually_hide">Close tooltip</button>
<h4 id="speakers_list_item-2_6_title" class="speakers_list_item_title">
dolore elit velit nulla mollit
</h4>
<div class="speakers_list_item_desc">
<p>Dolore in do Lorem nostrud sit laborum aute sint nostrud sunt in minim minim.</p>
</div>
</div>
<button type="button" class="speakers_list_item_btn js-btn js-swap" data-swap-target="#speakers_list_item-2_6_item" data-swap-group="speakers_list_item-2" aria-controls="speakers_list_item-2_6_tooltip" aria-label="Open tooltip for speaker dolore elit velit nulla mollit">
<figure class="speakers_list_item_figure">
<img class="speakers_list_item_image" sizes="76px" src="https://images.fastspot.com/framework/100x100/2" alt="" loading="lazy" width="100" height="100">
</figure>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="feat_upcoming_event {% if description %}has_description{% endif %}">
<div class="fs-row">
<div class="fs-cell">
<div class="feat_upcoming_event_inner">
<header class="feat_upcoming_event_header">
<div class="feat_upcoming_event_header_content_wrap">
<div class="feat_upcoming_event_title">
{{ title }}
</div>
{% if description %}
<div class="feat_upcoming_event_desc">
{{ description }}
</div>
{% endif %}
</div>
</header>
<div class="feat_upcoming_event_content">
<div class="feat_upcoming_event_grid">
<div class="feat_upcoming_event_grid_item is_left">
<div class="feat_upcoming_event_card_wrap">
{% include "@partial-card" with {
type: "bare",
theme: "light",
pill_theme: "yellow",
item: card,
sources: [
img.wide.sml,
img.wide.xsml,
img.wide.xxsml
],
sizes: [
'(min-width: 500px) 400px',
'50vw'
]
} %}
</div>
</div>
<div class="feat_upcoming_event_grid_item is_right">
<div class="feat_upcoming_event_speakers_polygon_wrap">
{% include "@partial-speakers-feature" with speakers_list %}
</div>
<div class="feat_upcoming_event_speakers_inline_wrap">
{% include "@partial-speakers-list" with speakers_list %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
No notes defined.