<!-- Topic Row -->
<div class="js-anim topics_row component_theme_blue_cloud component_alignment_right">
<div class="js-card-row topics_row_block">
<div class="topics_row_frame">
<div class="fs-row">
<div class="fs-cell">
<div class="topics_row_inner">
<div class="topics_row_header">
<h2 class="topics_row_title">
<span class="topics_row_title_label">Master of Science in Counseling</span>
</h2>
<div class="topics_row_description">
<p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Aenean lacinia bibendum nulla sed consectetur. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
</div>
<div class="topics_row_action">
<a class="topics_row_action_link" href="#">Master of Science in Counseling</a>
</div>
</div>
<div class="topics_row_cards">
<div class="topics_row_card">
<!-- Image Card -->
<div class="card card_image card_type_contained">
<div class="card_inner card_image_inner">
<figure class="card_image_figure">
<img class="card_image_image" srcset="https://images.fastspot.com/jhusoe/735x980/14 735w, https://images.fastspot.com/jhusoe/555x740/14 555w, https://images.fastspot.com/jhusoe/375x500/14 375w, https://images.fastspot.com/jhusoe/225x300/14 225w" sizes="(min-width: 1394px) 290px, (min-width: 1220px) 265px, (min-width: 980px) 250px, (min-width: 600px) 332px, 290px" src="https://images.fastspot.com/jhusoe/225x300/14" alt="" loading="lazy" width="225" height="300">
</figure>
</div>
</div>
<!-- END: Image Card -->
</div>
<div class="topics_row_card">
<!-- Quote Card -->
<div class="card card_quote card_type_contained">
<div class="card_inner card_quote_inner">
<figure class="card_quote_figure">
<blockquote class="card_quote_blockquote">
<span class="card_quote_blockquote_icon">“</span>
<p class="card_quote_blockquote_text">The real difference is the faculty. You have access to internationally known leaders who can talk you through situations based on a depth of real-life experience.</p>
</blockquote>
<figcaption class="card_quote_caption">
<span class="card_quote_caption_name">Evan Velleman, MS '18</span>
<span class="card_quote_caption_title">Counselor, Henderson-Hopkins School, Baltimore, Md.</span>
</figcaption>
</figure>
</div>
<figure class="card_quote_media">
<img class="card_quote_image" srcset="https://images.fastspot.com/jhusoe/300x300/8 300w, https://images.fastspot.com/jhusoe/100x100/8 100w" sizes="110px" src="https://images.fastspot.com/jhusoe/100x100/8" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
<!-- END: Quote Card -->
</div>
</div>
</div>
</div>
</div>
<div class="topics_row_carousel">
<div class="js-slick-row carousel_row" data-slick='{"regionLabel": "Master of Science in Counseling", "arrows": false, "dots": true, "infinite": false, "variableWidth": true}'>
<div class="carousel_row_card">
<!-- Image Card -->
<div class="card card_image card_type_contained">
<div class="card_inner card_image_inner">
<figure class="card_image_figure">
<img class="card_image_image" srcset="https://images.fastspot.com/jhusoe/735x980/14 735w, https://images.fastspot.com/jhusoe/555x740/14 555w, https://images.fastspot.com/jhusoe/375x500/14 375w, https://images.fastspot.com/jhusoe/225x300/14 225w" sizes="(min-width: 1394px) 290px, (min-width: 1220px) 265px, (min-width: 980px) 250px, (min-width: 600px) 332px, 290px" src="https://images.fastspot.com/jhusoe/225x300/14" alt="" loading="lazy" width="225" height="300">
</figure>
</div>
</div>
<!-- END: Image Card -->
</div>
<div class="carousel_row_card">
<!-- Quote Card -->
<div class="card card_quote card_type_contained">
<div class="card_inner card_quote_inner">
<figure class="card_quote_figure">
<blockquote class="card_quote_blockquote">
<span class="card_quote_blockquote_icon">“</span>
<p class="card_quote_blockquote_text">The real difference is the faculty. You have access to internationally known leaders who can talk you through situations based on a depth of real-life experience.</p>
</blockquote>
<figcaption class="card_quote_caption">
<span class="card_quote_caption_name">Evan Velleman, MS '18</span>
<span class="card_quote_caption_title">Counselor, Henderson-Hopkins School, Baltimore, Md.</span>
</figcaption>
</figure>
</div>
<figure class="card_quote_media">
<img class="card_quote_image" srcset="https://images.fastspot.com/jhusoe/300x300/8 300w, https://images.fastspot.com/jhusoe/100x100/8 100w" sizes="110px" src="https://images.fastspot.com/jhusoe/100x100/8" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
<!-- END: Quote Card -->
</div>
</div>
<div class="js-carousel-row-pagination carousel_row_pagination carousel_pagination topics_row_carousel_pagination"></div>
</div>
</div>
</div>
</div>
<!-- END: Topic Row -->
{#
{% include '@component-topic-row' with {
theme: 'white',
group_title: 'Title',
group_description: 'Description',
cards: [
{
card_type: 'Card type',
items: ''
}
]
} %}
#}
<!-- Topic Row -->
<div class="js-anim topics_row component_theme_{{ theme ?: 'white' }} component_alignment_{{ card_alignment ?: 'right' }}">
<div class="js-card-row topics_row_block">
<div class="topics_row_frame">
<div class="fs-row">
<div class="fs-cell">
<div class="topics_row_inner">
<div class="topics_row_header">
<h2 class="topics_row_title">
<span class="topics_row_title_label">{{ group_title }}</span>
</h2>
<div class="topics_row_description">
<p>{{ group_description }}</p>
</div>
{% if group_link %}
<div class="topics_row_action">
<a class="topics_row_action_link" href="{{ group_link.url }}">{{ group_link.label }}</a>
</div>
{% endif %}
</div>
<div class="topics_row_cards">
{% for card in cards %}
<div class="topics_row_card">
{% include '@partial-' ~ card.card_type ~ '-card' with {
item: card.item
} %}
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<div class="topics_row_carousel">
<div class="js-slick-row carousel_row" data-slick='{"regionLabel": "{{ group_title }}", "arrows": false, "dots": true, "infinite": false, "variableWidth": true}'>
{% for card in cards %}
<div class="carousel_row_card">
{% include '@partial-' ~ card.card_type ~ '-card' with {
item: card.item
} %}
</div>
{% endfor %}
</div>
<div class="js-carousel-row-pagination carousel_row_pagination carousel_pagination topics_row_carousel_pagination"></div>
</div>
</div>
</div>
</div>
<!-- END: Topic Row -->
No notes defined.