<!-- Contact Info -->
<div class="contact_block">
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Person",
"email": "mailto:",
"image": "",
"jobTitle": "",
"name": "",
"telephone": "",
"url": "#"
}
</script>
<div class="fs-row">
<div class="fs-cell fs-lg-10 fs-lg-justify-center">
<div class="contact_items_header">
<div class="contact_items_header_group">
<h2 class="contact_items_title">
<span class="contact_items_title_label">
Get in Touch
</span>
</h2>
<div class="contact_items_description">
<p>
Includes Garrett County, Allegany County, and Washington County.
</p>
</div>
</div>
<div class="contact_items_map">
<div class="contact_items_map_inner">
<svg class="icon icon_maryland-region-capital">
<use href="/images/icons.svg#maryland-region-capital" />
</svg>
</div>
</div>
</div>
<div class="contact_block_inner">
<div class="contact">
<div class="contact_body">
<div class="contact_details">
<div class="contact_detail">
<h3 class="contact_name">
<a class="contact_name_link" href="#">
<span class="contact_name_label">Full Name</span>
<span class="contact_name_link_icon">
<svg class="icon icon_arrow-right">
<use href="/images/icons.svg#arrow-right" />
</svg>
</span>
</a>
</h3>
<div class="contact_title">
Director of Department
</div>
</div>
<!-- Contact Details -->
<div class="contact_detail is_email">
<div class="contact_detail_label">
Email
</div>
<div class="contact_detail_item">
<div class="contact_detail_hint">
Email Address
</div>
<a class="contact_detail_info" href="mailto:somelongemailaddress@university.edu" itemprop="email">
somelongemailaddress@university.edu
</a>
</div>
</div>
<div class="contact_detail">
<div class="contact_detail_label">
Phone
</div>
<div class="contact_detail_item">
<div class="contact_detail_hint">
</div>
<a class="contact_detail_info" itemprop="telephone" href="tel:4105551234">
(410) 555-1234
</a>
</div>
</div>
<!-- END: Contact Details -->
<div class="contact_detail">
<figure class="contact_figure">
<span class="lazy_image_wrapper contact_image_wrapper">
<img class="js-lazy js-lazyload contact_image" data-sizes="auto" src="/images/placeholder.png" data-src="https://images.fastspot.com/mdot-zero-deaths-md/100x100/1" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/100x100/1 100w, https://images.fastspot.com/mdot-zero-deaths-md/300x300/1 300w" alt="">
</span>
<noscript>
<img class="contact_image" src="https://images.fastspot.com/mdot-zero-deaths-md/300x300/1" srcset="https://images.fastspot.com/mdot-zero-deaths-md/300x300/1 300w, https://images.fastspot.com/mdot-zero-deaths-md/100x100/1 100w" sizes="100vw" alt="">
</noscript>
</figure>
</div>
</div>
</div>
</div>
<div class="contact">
<div class="contact_body">
<div class="contact_details">
<div class="contact_detail">
<h3 class="contact_name">
<span class="contact_name_label">John Doe</span>
</h3>
<div class="contact_title">
Director of Department
</div>
</div>
<!-- Contact Details -->
<div class="contact_detail is_email">
<div class="contact_detail_label">
Email
</div>
<div class="contact_detail_item">
<div class="contact_detail_hint">
Email Address
</div>
<a class="contact_detail_info" href="mailto:anotherlongemailaddress@university.edu" itemprop="email">
anotherlongemailaddress@university.edu
</a>
</div>
</div>
<!-- END: Contact Details -->
<div class="contact_detail">
<figure class="contact_figure">
<span class="lazy_image_wrapper contact_image_wrapper">
<img class="js-lazy js-lazyload contact_image" data-sizes="auto" src="/images/placeholder.png" data-src="https://images.fastspot.com/mdot-zero-deaths-md/100x100/1" data-srcset="https://images.fastspot.com/mdot-zero-deaths-md/100x100/1 100w, https://images.fastspot.com/mdot-zero-deaths-md/300x300/1 300w" alt="">
</span>
<noscript>
<img class="contact_image" src="https://images.fastspot.com/mdot-zero-deaths-md/300x300/1" srcset="https://images.fastspot.com/mdot-zero-deaths-md/300x300/1 300w, https://images.fastspot.com/mdot-zero-deaths-md/100x100/1 100w" sizes="100vw" alt="">
</noscript>
</figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Contact Info -->
<!-- Contact Info -->
<div class="contact_block">
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Person",
"email": "mailto:{{ item.email }}",
"image": "{{ item.image }}",
"jobTitle": "{{ item.title }}",
"name": "{{ item.name }}",
"telephone": "{{ item.phone_numbers[0].number }}",
"url": "#"
}
</script>
<div class="fs-row">
<div class="fs-cell fs-lg-10 fs-lg-justify-center">
{% if title or description or region %}
<div class="contact_items_header">
{% if title or description %}
<div class="contact_items_header_group">
{% endif %}
{% if title %}
<h2 class="contact_items_title">
<span class="contact_items_title_label">
{{ title }}
</span>
</h2>
{% endif %}
{% if description %}
<div class="contact_items_description">
<p>
{{ description }}
</p>
</div>
{% endif %}
{% if title or description %}
</div>
{% endif %}
{% if region %}
<div class="contact_items_map">
<div class="contact_items_map_inner">
{{ icon("maryland-region-" ~ region) }}
</div>
</div>
{% endif %}
</div>
{% endif %}
<div class="contact_block_inner">
{% for item in items %}
<div class="contact">
<div class="contact_body">
<div class="contact_details">
<div class="contact_detail">
<h3 class="contact_name">
{% if item.link %}
<a class="contact_name_link" href="{{ item.link }}">
{% endif %}
<span class="contact_name_label">{{ item.name }}</span>
{% if item.link %}
<span class="contact_name_link_icon">{{ icon("arrow-right") }}</span>
</a>
{% endif %}
</h3>
{% if item.title %}
<div class="contact_title">
{{ item.title }}
</div>
{% endif %}
</div>
{% render '@partial-contact-details'
with
{
item: item
}
%}
<div class="contact_detail">
{% if item.image %}
<figure class="contact_figure">
{% include '@partial-image' with {
class: 'contact',
alt: '',
image: item.image,
sources: [
img.square.xxsml,
img.square.thumb
]
} %}
</figure>
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<!-- END: Contact Info -->
No notes defined.