<!-- Accordion -->
<div class="js-accordion accordion">
    <div class="fs-row">
        <div class="fs-cell fs-lg-10 fs-xl-8 fs-lg-justify-center">
            <div class="accordion_inner">
                <div class="accordion_header">
                    <h2 class="accordion_title">
                        <span class="accordion_title_label">Ways to Give</span>
                    </h2>
                    <div class="accordion_description">
                        <p>We offer four ways to support India's pandemic response.</p>
                    </div>
                </div>

                <div class="accordion_items">
                    <div class="js-accordion-item js-accordion-item-1-1 accordion_item">
                        <h3 class="accordion_item_heading">
                            <button class="js-accordion-swap js-swap accordion_item_button" data-swap-target=".js-accordion-item-1-1">
                                <span class="accordion_item_heading_inner">
                                    <span class="accordion_item_heading_label">
                                        <span class="accordion_item_heading_title">JHII's Covid relief for India</span>
                                        <span class="accordion_item_heading_subtitle">Supports urgent needs identified by Johns Hopkins' collaborators in India.</span>
                                    </span>
                                    <span class="accordion_item_heading_icon"></span>
                                </span>
                            </button>
                        </h3>
                        <div class="js-accordion-content accordion_item_content typography" aria-label="JHII's Covid relief for India Supports urgent needs identified by Johns Hopkins' collaborators in India.">
                            Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod. <a href='#'>Donec ullamcorper nulla</a> non metus auctor fringilla.
                        </div>
                    </div>
                    <div class="js-accordion-item js-accordion-item-1-2 accordion_item">
                        <h3 class="accordion_item_heading">
                            <button class="js-accordion-swap js-swap accordion_item_button" data-swap-target=".js-accordion-item-1-2">
                                <span class="accordion_item_heading_inner">
                                    <span class="accordion_item_heading_label">
                                        <span class="accordion_item_heading_title">JHU Partners in India</span>
                                    </span>
                                    <span class="accordion_item_heading_icon"></span>
                                </span>
                            </button>
                        </h3>
                        <div class="js-accordion-content accordion_item_content typography" aria-label="JHU Partners in India">
                            Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod. <a href='#'>Donec ullamcorper nulla</a> non metus auctor fringilla.
                        </div>
                    </div>
                    <div class="js-accordion-item js-accordion-item-1-3 accordion_item">
                        <h3 class="accordion_item_heading">
                            <button class="js-accordion-swap js-swap accordion_item_button" data-swap-target=".js-accordion-item-1-3">
                                <span class="accordion_item_heading_inner">
                                    <span class="accordion_item_heading_label">
                                        <span class="accordion_item_heading_title">Johns Hopkins India Foundation</span>
                                    </span>
                                    <span class="accordion_item_heading_icon"></span>
                                </span>
                            </button>
                        </h3>
                        <div class="js-accordion-content accordion_item_content typography" aria-label="Johns Hopkins India Foundation">
                            The Johns Hopkins India Foundation is a section 12A/80G non-profit company registered in India, and its website is forthcoming. The Foundation is accepting donations, from Indian citizens residing in India only, to support areas of greatest need in COVID response, which could include provision of equipment or services to facilities and organizations in need, support for research and surveillance, and other impactful needs or opportunities as they arise.
                        </div>
                    </div>
                    <div class="js-accordion-item js-accordion-item-1-4 accordion_item">
                        <h3 class="accordion_item_heading">
                            <button class="js-accordion-swap js-swap accordion_item_button" data-swap-target=".js-accordion-item-1-4">
                                <span class="accordion_item_heading_inner">
                                    <span class="accordion_item_heading_label">
                                        <span class="accordion_item_heading_title">Other Relief Organizations</span>
                                    </span>
                                    <span class="accordion_item_heading_icon"></span>
                                </span>
                            </button>
                        </h3>
                        <div class="js-accordion-content accordion_item_content typography" aria-label="Other Relief Organizations">
                            Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod. <a href='#'>Donec ullamcorper nulla</a> non metus auctor fringilla.
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END: Accordion -->
{% set id = uniqid("js-accordion-item") %}
{% set group_id = uniqid("accordion-group") %}

<!-- Accordion -->
<div class="js-accordion accordion">
	<div class="fs-row">
		<div class="fs-cell {{ cell }}">
			<div class="accordion_inner">
				{% if title or description %}
					<div class="accordion_header">
						{% if title %}
							<h2 class="accordion_title">
								<span class="accordion_title_label">{{ title }}</span>
							</h2>
						{% endif %}
						{% if description %}
							<div class="accordion_description">
								<p>{{ description }}</p>
							</div>
						{% endif %}
					</div>
				{% endif %}

				{% if items|length %}
					<div class="accordion_items">
						{% for item in items %}
							<div class="js-accordion-item {{ id }}-{{ loop.index }} accordion_item">
								{% if item.title %}
									<h3 class="accordion_item_heading">
									{% else %}
										<h2 class="accordion_item_heading">
										{% endif %}
										<button class="js-accordion-swap js-swap accordion_item_button" data-swap-target=".{{ id }}-{{ loop.index }}" {% if grouped %} data-swap-group="{{ group_id }}" {% endif %}>
											<span class="accordion_item_heading_inner">
												<span class="accordion_item_heading_label">
													<span class="accordion_item_heading_title">{{ item.title }}</span>
													{% if item.subtitle %}
														<span class="accordion_item_heading_subtitle">{{ item.subtitle }}</span>
													{% endif %}
												</span>
												<span class="accordion_item_heading_icon"></span>
											</span>
										</button>
										{% if item.title %}
										</h3>
								{% else %}
									</h2>
								{% endif %}
								<div class="js-accordion-content accordion_item_content typography" aria-label="{{ item.title }}{% if item.subtitle %} {{ item.subtitle }}{% endif %}">
									{{ item.description }}
								</div>
							</div>
						{% endfor %}
					</div>
				{% endif %}
			</div>
		</div>
	</div>
</div>
<!-- END: Accordion -->

No notes defined.