<div class="contact_info is_type_single component_has_radius">
    <script type="application/ld+json">
        {
            '@context': 'http://schema.org',
            '@type': 'Person',
            'email': 'mailto:',
            'jobTitle': '',
            'name': '',
            'telephone': '',
            'url': '#'
        }
    </script>

    <div class="fs-row">
        <div class="fs-cell">
            <div class="contact_info_inner">
                <div class="contact_info_grid">
                    <div class="contact_info_grid_item is_header">
                        <header class="contact_info_header">
                            <h2 class="contact_info_title">
                                Contact Us
                            </h2>
                        </header>
                    </div>

                    <div class="contact_info_grid_item is_content">
                        <ul class="contact_info_rows">
                            <li class="contact_info_row">
                                <div class="contact_info_item_grid">
                                    <div class="contact_info_item_grid_item is_header">
                                        <h3 class="contact_info_item_name">
                                            Person or Office Name
                                        </h3>

                                        <div class="contact_info_item_titles_wrap">
                                            <div class="contact_info_item_title">
                                                Optional Title Goes Here
                                            </div>
                                            <div class="contact_info_item_title">
                                                Another optional Title Goes Here
                                            </div>
                                        </div>
                                    </div>

                                    <div class="contact_info_item_grid_item is_meta">
                                        <div class="contact_info_item_meta_items">
                                            <div class="contact_info_item_meta_item">
                                                <div class="contact_info_item_meta_label">
                                                    phone
                                                </div>

                                                <div class="contact_info_item_meta_value">
                                                    <a class="contact_info_item_meta_link" href="tel:410-444-4444">
                                                        410-444-4444
                                                    </a>
                                                </div>
                                            </div>

                                            <div class="contact_info_item_meta_item">
                                                <div class="contact_info_item_meta_label">
                                                    email
                                                </div>

                                                <div class="contact_info_item_meta_value">
                                                    <a class="contact_info_item_meta_link" href="mailto:email@email.com">
                                                        email@email.com
                                                    </a>
                                                </div>
                                            </div>

                                            <div class="contact_info_item_meta_item">
                                                <div class="contact_info_item_meta_label">
                                                    location
                                                </div>

                                                <div class="contact_info_item_meta_value">
                                                    Appleseed Library<br>Room 214
                                                </div>
                                            </div>

                                            <div class="contact_info_item_meta_item">
                                                <div class="contact_info_item_meta_label">
                                                    office hours
                                                </div>

                                                <div class="contact_info_item_meta_value">
                                                    Monday 9am - 5pm<br> Wednesday 11am-12pm </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{#
	{% include '@component-contact-info' with {
		item: {
			name: 'Full Name',
			job_title: 'Director of Department',
			image: '1',
			phone_numbers: [
				{
					label: 'mobile',
					type: 'telephone',
					number: '(410) 555-1234'
				}
			],
			email: 'name@university.edu',
			location: '1234 Maple Bacon Ln.<br>Baltimore, MD 21211',
			office_hours: [
				{
					label: 'Monday',
					hours: '9am - 5pm'
				}
			],
			social_links: [
				{
					title: 'LinkedIn',
					url: '#'
				}
			]
		}
	} %}
#}

{% set type = items|length > 1 ? "multiple" : "single" %}

<div class="contact_info is_type_{{ type }} component_has_radius">
	<script type="application/ld+json">
		{
			'@context': 'http://schema.org',
			'@type': 'Person',
			'email': 'mailto:{{ item.email_address }}',
			'jobTitle': '{{ item.titles|join(", ") }}',
			'name': '{{ item.name }}',
			'telephone': '{{ item.phone_number }}',
			'url': '#'
		}
	</script>

	<div class="fs-row">
		<div class="fs-cell">
			<div class="contact_info_inner">
				<div class="contact_info_grid">
					<div class="contact_info_grid_item is_header">
						<header class="contact_info_header">
							<h2 class="contact_info_title">
								{{ title }}
							</h2>
						</header>
					</div>

					<div class="contact_info_grid_item is_content">
						<ul class="contact_info_rows">
							{% for item in items %}
								<li class="contact_info_row">
									<div class="contact_info_item_grid">
										<div class="contact_info_item_grid_item is_header">
											<h3 class="contact_info_item_name">
												{{ item.name }}
											</h3>

											{% if item.titles %}
												<div class="contact_info_item_titles_wrap">
													{% for title in item.titles %}
														<div class="contact_info_item_title">
															{{ title }}
														</div>
													{% endfor %}
												</div>
											{% endif %}
										</div>

										<div class="contact_info_item_grid_item is_meta">
											<div class="contact_info_item_meta_items">
												{% if item.phone_number %}
													<div class="contact_info_item_meta_item">
														<div class="contact_info_item_meta_label">
															phone
														</div>

														<div class="contact_info_item_meta_value">
															<a class="contact_info_item_meta_link" href="tel:{{ item.phone_number }}">
																{{ item.phone_number }}
															</a>
														</div>
													</div>
												{% endif %}

												<div class="contact_info_item_meta_item">
													<div class="contact_info_item_meta_label">
														email
													</div>

													<div class="contact_info_item_meta_value">
														<a class="contact_info_item_meta_link" href="mailto:{{ item.email_address }}">
															{{ item.email_address }}
														</a>
													</div>
												</div>

												{% if item.location %}
													<div class="contact_info_item_meta_item">
														<div class="contact_info_item_meta_label">
															location
														</div>

														<div class="contact_info_item_meta_value">
															{{ item.location }}
														</div>
													</div>
												{% endif %}

												{% if item.office_hours %}
													<div class="contact_info_item_meta_item">
														<div class="contact_info_item_meta_label">
															office hours
														</div>

														<div class="contact_info_item_meta_value">
															{% for office_hour in item.office_hours %}
																{{ office_hour.label }} {{ office_hour.hours }}{% if not loop.last %}<br>{% endif %}
															{% endfor %}
														</div>
													</div>
												{% endif %}
											</div>
										</div>
									</div>
								</li>
							{% endfor %}
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

No notes defined.