<!-- Blue -->
<div class="location_teaser theme_blue">
<picture class="location_teaser_picture">
<source media="(min-width: 1200px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1440x810/1">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1220x686/1">
<source media="(min-width: 740px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/980x552/1">
<img class="location_teaser_image" src="//images.fastspot.com/columbia-gorge-community-college/740x740/1" alt="" loading="lazy" width="740px" height="740px">
</picture>
<div class="location_teaser_content">
<div class="location_teaser_content_inner">
<div class="location_teaser_title_wrap">
<h3 class="location_teaser_title">
The Dalles Campus
</h3>
</div>
<div class="location_teaser_description">
<p>Study at our <a href="#">Dalles Campus</a> located Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
</div>
</div>
</div>
</div>
<!-- Green -->
<div class="location_teaser theme_green">
<picture class="location_teaser_picture">
<source media="(min-width: 1200px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1440x810/2">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1220x686/2">
<source media="(min-width: 740px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/980x552/2">
<img class="location_teaser_image" src="//images.fastspot.com/columbia-gorge-community-college/740x740/2" alt="" loading="lazy" width="740px" height="740px">
</picture>
<div class="location_teaser_content">
<div class="location_teaser_content_inner">
<div class="location_teaser_title_wrap">
<h3 class="location_teaser_title">
Hood River
</h3>
</div>
<div class="location_teaser_description">
<p>Study at our <a href="#">Dalles Campus</a> located Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
</div>
</div>
</div>
</div>
<!-- Orange -->
<div class="location_teaser theme_orange">
<picture class="location_teaser_picture">
<source media="(min-width: 1200px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1440x810/4">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/1220x686/4">
<source media="(min-width: 740px)" srcset="https://images.fastspot.com/columbia-gorge-community-college/980x552/4">
<img class="location_teaser_image" src="//images.fastspot.com/columbia-gorge-community-college/740x740/4" alt="" loading="lazy" width="740px" height="740px">
</picture>
<div class="location_teaser_content">
<div class="location_teaser_content_inner">
<div class="location_teaser_title_wrap">
<h3 class="location_teaser_title">
Study Online
</h3>
</div>
<div class="location_teaser_description">
<p>Study at our <a href="#">Dalles Campus</a> located Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
</div>
</div>
</div>
</div>
<div class="location_teaser theme_{{ theme }}">
{% include '@partial-picture' with {
class: 'location_teaser',
image: image,
alt: '',
loading: 'lazy',
default: img.square.sml,
sources: {
'1200px': img.wide.xlrg,
'980px': img.wide.lrg,
'740px': img.wide.med
}
} %}
<div class="location_teaser_content">
<div class="location_teaser_content_inner">
<div class="location_teaser_title_wrap">
<h3 class="location_teaser_title">
{{ title }}
</h3>
</div>
<div class="location_teaser_description">
<p>{{ description }}</p>
</div>
</div>
</div>
</div>
No notes defined.