<div class="actions_callout js-actions-callout">
<div class="fs-row">
<div class="fs-cell">
<div class="actions_callout_inner">
<header class="actions_callout_head">
<div class="fs-row">
<div class="fs-cell fs-xl-7">
<h2 class="actions_callout_title">
There’s a place for you at CU, where do you want to start?
</h2>
</div>
</div>
</header>
<div class="actions_callout_cols fs-row">
<div class="actions_callout_col is_left fs-cell fs-md-6 fs-lg-4 fs-xl-3">
<div class="actions_callout_description_wrap">
<div class="actions_callout_icon">
<svg class="icon icon_chat_group">
<use href="/images/icons.svg#chat_group" />
</svg>
</div>
<div class="actions_callout_description">
<p>Our democracy relies on each of us living like citizens and inspiring others to do as well. We all have power to make positive change in our communities—and the responsibility to try.</p>
</div>
</div>
</div>
<div class="actions_callout_col is_right fs-cell fs-md-6 fs-lg-8 fs-xl-8 fs-xl-push-1">
<div class="actions_callout_action_items">
<div class="actions_callout_action_item theme_yellow" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_ is_pill">
<span class="button_text">
I want to <strong>build civic power</strong>
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
<div class="actions_callout_action_item theme_soft_red" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_ is_pill">
<span class="button_text">
I want to <strong>create a mutual aid network</strong>
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
<div class="actions_callout_action_item theme_gold" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_ is_pill">
<span class="button_text">
I want to <strong>activate people in my community</strong>
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
<div class="actions_callout_action_item theme_light_blue" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_ is_pill">
<span class="button_text">
I want to <strong>understand citizenship</strong>
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
<div class="actions_callout_action_item theme_blue" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_ is_pill">
<span class="button_text">
I want to <strong>host my own Civic Saturday</strong>
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
</div>
<div class="actions_callout_utility_items_wrap">
<div class="actions_callout_utility_items">
<div class="actions_callout_utility_item" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_white is_bold ">
<span class="button_text">
More ways to participate
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
<div class="actions_callout_utility_item" data-anim="full-threshold" data-anim-type="fade-in">
<a href="" class="button theme_white is_bold ">
<span class="button_text">
Explore our programs
</span>
<span class="button_icon">
<svg class="icon icon_arrow_right">
<use href="/images/icons.svg#arrow_right" />
</svg>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="actions_callout js-actions-callout">
<div class="fs-row">
<div class="fs-cell">
<div class="actions_callout_inner">
<header class="actions_callout_head">
<div class="fs-row">
<div class="fs-cell fs-xl-7">
<h2 class="actions_callout_title">
{{ title }}
</h2>
</div>
</div>
</header>
<div class="actions_callout_cols fs-row">
<div class="actions_callout_col is_left fs-cell fs-md-6 fs-lg-4 fs-xl-3">
<div class="actions_callout_description_wrap">
<div class="actions_callout_icon">
{{ icon(icon) }}
</div>
<div class="actions_callout_description">
<p>{{ desc }}</p>
</div>
</div>
</div>
<div class="actions_callout_col is_right fs-cell fs-md-6 fs-lg-8 fs-xl-8 fs-xl-push-1">
<div class="actions_callout_action_items">
{% for index, item in action_ctas %}
<div class="actions_callout_action_item theme_{{ action_cta_themes[index % action_cta_themes|length] }}" data-anim="full-threshold" data-anim-type="fade-in">
{% include "@component-button" with {
modifier: 'is_pill',
icon: 'arrow_right',
text: item.text
} %}
</div>
{% endfor %}
</div>
<div class="actions_callout_utility_items_wrap">
<div class="actions_callout_utility_items">
{% for index, item in utility_ctas %}
<div class="actions_callout_utility_item" data-anim="full-threshold" data-anim-type="fade-in">
{% include "@component-button" with {
theme: "white is_bold",
modifier: '',
icon: 'arrow_right',
text: item.text
} %}
</div>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
No notes defined.