<!-- Link Group -->
<div class="icon_group has_image">
<figure class="icon_group_figure" aria-hidden="true">
<span class="lazy_image_wrapper icon_group_image_wrapper">
<picture class="icon_group_picture">
<source media="(min-width: 1220px)" srcset="../../../images/placeholder.png" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/1440x810/2">
<source media="(min-width: 980px)" srcset="../../../images/placeholder.png" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/1220x686/2">
<source media="(min-width: 740px)" srcset="../../../images/placeholder.png" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/980x552/2">
<source media="(min-width: 500px)" srcset="../../../images/placeholder.png" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/980x980/2">
<img class="js-lazy js-lazyload icon_group_image" src="../../../images/placeholder.png" data-src="https://images.fastspot.com/mdot-zero-deaths-md/740x740/2" alt="">
</picture>
</span>
<noscript>
<picture class="icon_group_picture">
<source media="(min-width: 1220px)" srcset="https://images.fastspot.com/mdot-zero-deaths-md/1440x810/2">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/mdot-zero-deaths-md/1220x686/2">
<source media="(min-width: 740px)" srcset="https://images.fastspot.com/mdot-zero-deaths-md/980x552/2">
<source media="(min-width: 500px)" srcset="https://images.fastspot.com/mdot-zero-deaths-md/980x980/2">
<img class="icon_group_image" src="https://images.fastspot.com/mdot-zero-deaths-md/740x740/2" alt="">
</picture>
</noscript>
</figure>
<div class="fs-row">
<div class="fs-cell">
<div class="icon_group_inner">
<div class="icon_group_header_wrapper">
<div class="icon_group_header">
<h2 class="icon_group_title">Road Safety
<span class="icon_group_highlighted_text">
can save lives.
</span>
</h2>
</div>
<div class="icon_group_description">
<p class="icon_group_description_text">We are working to improve road safety for everyone. Explore the links to the right to learn more and find helpful resources.</p>
</div>
<div class="link_group_link_item">
<span class="link_group_link_button">
<a href="/" class="link_group_button_link">
<span class="link_group_button_link_inner">
<span class="link_group_button_link_label">Explore Road Safety</span>
<span class="link_group_button_link_icon" aria-hidden="true">
<span class="link_group_button_link_icon_inner">
<span class="link_group_button_link_icon_space"></span>
<svg class="icon icon_arrow_right">
<use xlink:href="/images/icons.svg#arrow_right"></use>
</svg>
</span>
</span>
</span>
</a>
</span>
</div>
</div>
<div class="icon_group_list_wrapper">
<ul class="icon_group_list">
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_speed">
<use href="/images/icons.svg#speed" />
</svg>
</span>
<span class="icon_group_link_label">Speed/Agressive Driving</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_bicycle">
<use href="/images/icons.svg#bicycle" />
</svg>
</span>
<span class="icon_group_link_label">Pedestrian & Bicycle Safety</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_car">
<use href="/images/icons.svg#car" />
</svg>
</span>
<span class="icon_group_link_label">Distracted Driving</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_seatbelt">
<use href="/images/icons.svg#seatbelt" />
</svg>
</span>
<span class="icon_group_link_label">Seat Belts & Car Seats</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_drinks">
<use href="/images/icons.svg#drinks" />
</svg>
</span>
<span class="icon_group_link_label">Impaired Driving</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_couple">
<use href="/images/icons.svg#couple" />
</svg>
</span>
<span class="icon_group_link_label">Older Driving Safety</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_motorcycle">
<use href="/images/icons.svg#motorcycle" />
</svg>
</span>
<span class="icon_group_link_label">Motorcycle Safety</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_teenagers">
<use href="/images/icons.svg#teenagers" />
</svg>
</span>
<span class="icon_group_link_label">Young Driver Safety</span>
</span>
</a>
</li>
<li class="icon_group_item">
<a class="icon_group_link" href="#" target="_blank" itemprop="relatedLink">
<span class="icon_group_link_inner">
<span class="icon_group_link_icon">
<svg class="icon icon_baby_carriage">
<use href="/images/icons.svg#baby_carriage" />
</svg>
</span>
<span class="icon_group_link_label">Child Passenger Safety</span>
</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- END: Link Group -->
<!-- Link Group -->
<div class="icon_group {% if image %} has_image{% endif %}">
{% if image %}
<figure class="icon_group_figure" aria-hidden="true">
{% render "@partial-picture" with {
class: "icon_group",
alt: "",
itemprop: "",
image: image,
default: img.square.sml,
sources: {
"1220px": img.wide.xlrg,
"980px": img.wide.lrg,
"740px": img.wide.med,
"500px": img.square.med
}
} %}
</figure>
{% else %}
<div class="cta_bg"></div>
{% endif %}
<div class="fs-row">
<div class="fs-cell">
<div class="icon_group_inner">
<div class="icon_group_header_wrapper">
<div class="icon_group_header">
<h2 class="icon_group_title">{{ title|title }}
{% if highlighted_text %}
<span class="icon_group_highlighted_text">
{{ highlighted_text }}
</span>
{% endif %}
</h2>
</div>
<div class="icon_group_description">
<p class="icon_group_description_text">{{ description }}</p>
</div>
<div class="link_group_link_item">
<span class="link_group_link_button">
{% render "@partial-link" with {
class: "link_group_button",
title: link_title,
url: link_url,
icon: 'arrow_right'
} %}
</span>
</div>
</div>
<div class="icon_group_list_wrapper">
<ul class="icon_group_list">
{% for item in items %}
<li class="icon_group_item">
<a class="icon_group_link" href="{{ item.url }}" {% if item.icon %} target="_blank" {% endif %} itemprop="relatedLink">
<span class="icon_group_link_inner">
{% if item.icon %}
<span class="icon_group_link_icon">{{ icon(item.icon) }}</span>
{% endif %}
<span class="icon_group_link_label">{{ item.title }}</span>
</span>
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- END: Link Group -->
No notes defined.