<div class="sights_sounds js-sights-sounds" data-uuid="sights-sounds-1" style="--overlay-opacity: 1;">
<div class="sights_sounds_bg_media_wrap">
<div class="sights_sounds_figure">
<picture class="sights_sounds_bg_picture">
<source media="(min-width: 1200px)" srcset="https://images.fastspot.com/paul-smiths-college/1440x810/1" width="1440" height="810">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/paul-smiths-college/1220x686/1" width="1220" height="686">
<img class="sights_sounds_bg_image" src="//images.fastspot.com/paul-smiths-college/814x1220/1" alt="" loading="lazy" width="814" height="1220">
</picture>
<div class="sights_sounds_bg_lazy_video lazy_video js-video-lazy-load " data-video-lazy-load='{"id":"1019467073","type":"vimeo","title":null,"display":"background","autoplay":false,"load_strategy":"none","playerVars":{}}'>
<a class="lazy_video_toggle_btn js-play-btn" href="https://vimeo.com/1019467073" aria-label="Play ">
<svg class="icon icon_play_triangle">
<use href="/images/icons.svg#play_triangle" />
</svg>
</a>
<div class="lazy_video_iframe_wrap">
<div class="lazy_video_iframe_target js-iframe-target"></div>
</div>
</div>
</div>
</div>
<div class="sights_sounds_body">
<div class="fs-row fs-xl-justify-center">
<div class="fs-cell fs-xl-10">
<div class="sights_sounds_body_inner">
<header class="sights_sounds_head">
<h1 class="visually_hide" id="header_title">The College of the Adirondacks</h1>
<div class="sights_sounds_title_icon_wrap">
<svg class="icon icon_text_the_college_of_the_adirondacks">
<use href="/images/icons.svg#text_the_college_of_the_adirondacks" />
</svg>
</div>
</header>
<div class="js-carousel-embla">
<div class="sights_sounds_content">
<div class="sights_sounds_content_grid">
<div class="sights_sounds_content_grid_item is_btn_toggle">
<div class="sights_sounds_btn_group">
<button class="sights_sounds_item_btn" data-js="bg-btn-pause" aria-label="Pause Video">
<svg class="icon icon_carousel_pause">
<use href="/images/icons.svg#carousel_pause" />
</svg>
</button>
<button class="sights_sounds_item_btn is_active" data-js="bg-btn-play" aria-label="Play Video">
<svg class="icon icon_carousel_play">
<use href="/images/icons.svg#carousel_play" />
</svg>
</button>
</div>
</div>
<div class="sights_sounds_content_grid_item is_slides">
<a href="#sights-sounds-pagination-1" class="visually_hide" aria-label="Skip to Pagination"></a>
<a href="#sights-sounds-dots-1" class="visually_hide" aria-label="Skip to Dots"></a>
<div class="embla" data-carousel-embla='{"slidesToScroll":1}'>
<div id="sights-sounds-viewport-1" class="embla__viewport" data-js="viewport">
<ul class="embla__container" data-js="container">
<li class="embla__slide" data-js="slide" data-uniqid="sights-sounds-slide-1">
<div class="sights_sounds_item ">
<div class="sights_sounds_item_grid">
<div class="sights_sounds_item_grid_item is_left">
<div class="sights_sounds_item_content">
<div class="sights_sounds_item_label">Sights & Sounds</div>
<h2 class="sights_sounds_item_title">
At the Shores of Lower St. Regis Lake
</h2>
<div class="sights_sounds_item_desc">
<div class="typography">
<p>Did you know that you could canoe or kayak from our lakeside campus all of the way to the Statue of Liberty in New York City? Within a few miles of our residence halls lie 240 lakes, streams and beaches offering world-class water sports and prime picnic spots.</p>
</div>
</div>
</div>
</div>
<div class="sights_sounds_item_grid_item is_right">
<figure class="sights_sounds_item_figure">
<picture class="sights_sounds_item_picture">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/paul-smiths-college/915x1220/2" width="915" height="1220">
<img class="sights_sounds_item_image" src="//images.fastspot.com/paul-smiths-college/980x552/2" alt="" loading="lazy" width="980" height="552">
</picture>
<div class="sights_sounds_item_lazy_video lazy_video js-video-lazy-load " data-video-lazy-load='{"id":"8L2x7aGNmD0","type":"youtube","title":null,"display":"background","autoplay":false,"load_strategy":"none","playerVars":{}}'>
<a class="lazy_video_toggle_btn js-play-btn" href="https://www.youtube.com/watch?v=8L2x7aGNmD0" aria-label="Play ">
<svg class="icon icon_play_triangle">
<use href="/images/icons.svg#play_triangle" />
</svg>
</a>
<div class="lazy_video_iframe_wrap">
<div class="lazy_video_iframe_target js-iframe-target"></div>
</div>
</div>
<div class="sights_sounds_item_btn_group">
<button class="sights_sounds_item_btn" data-js="btn-pause" aria-label="Pause Video">
<svg class="icon icon_carousel_pause">
<use href="/images/icons.svg#carousel_pause" />
</svg>
</button>
<button class="sights_sounds_item_btn is_active" data-js="btn-play" aria-label="Play Video">
<svg class="icon icon_carousel_play">
<use href="/images/icons.svg#carousel_play" />
</svg>
</button>
</div>
</figure>
</div>
</div>
</div>
</li>
<li class="embla__slide" data-js="slide" data-uniqid="sights-sounds-slide-2">
<div class="sights_sounds_item ">
<div class="sights_sounds_item_grid">
<div class="sights_sounds_item_grid_item is_left">
<div class="sights_sounds_item_content">
<div class="sights_sounds_item_label">Sights & Sounds</div>
<h2 class="sights_sounds_item_title">
Incididunt esse aute eu ea nulla et.
</h2>
<div class="sights_sounds_item_desc">
<div class="typography">
<p>Voluptate veniam quis ipsum officia nulla sint in sit sit irure excepteur nulla cillum anim. Incididunt esse eiusmod veniam nostrud ipsum duis.</p>
</div>
</div>
</div>
</div>
<div class="sights_sounds_item_grid_item is_right">
<figure class="sights_sounds_item_figure">
<picture class="sights_sounds_item_picture">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/paul-smiths-college/915x1220/3" width="915" height="1220">
<img class="sights_sounds_item_image" src="//images.fastspot.com/paul-smiths-college/980x552/3" alt="" loading="lazy" width="980" height="552">
</picture>
</figure>
</div>
</div>
</div>
</li>
<li class="embla__slide" data-js="slide" data-uniqid="sights-sounds-slide-3">
<div class="sights_sounds_item ">
<div class="sights_sounds_item_grid">
<div class="sights_sounds_item_grid_item is_left">
<div class="sights_sounds_item_content">
<div class="sights_sounds_item_label">Sights & Sounds</div>
<h2 class="sights_sounds_item_title">
Quis irure eiusmod proident velit
</h2>
<div class="sights_sounds_item_desc">
<div class="typography">
<p>In labore et magna excepteur quis veniam. Reprehenderit consequat eiusmod adipisicing ex ut do id voluptate excepteur et non exercitation.</p>
</div>
</div>
</div>
</div>
<div class="sights_sounds_item_grid_item is_right">
<figure class="sights_sounds_item_figure">
<picture class="sights_sounds_item_picture">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/paul-smiths-college/915x1220/4" width="915" height="1220">
<img class="sights_sounds_item_image" src="//images.fastspot.com/paul-smiths-college/980x552/4" alt="" loading="lazy" width="980" height="552">
</picture>
<div class="sights_sounds_item_lazy_video lazy_video js-video-lazy-load " data-video-lazy-load='{"id":"qa3Qo6wgiuw","type":"youtube","title":null,"display":"background","autoplay":false,"load_strategy":"none","playerVars":{}}'>
<a class="lazy_video_toggle_btn js-play-btn" href="https://www.youtube.com/watch?v=qa3Qo6wgiuw" aria-label="Play ">
<svg class="icon icon_play_triangle">
<use href="/images/icons.svg#play_triangle" />
</svg>
</a>
<div class="lazy_video_iframe_wrap">
<div class="lazy_video_iframe_target js-iframe-target"></div>
</div>
</div>
<div class="sights_sounds_item_btn_group">
<button class="sights_sounds_item_btn" data-js="btn-pause" aria-label="Pause Video">
<svg class="icon icon_carousel_pause">
<use href="/images/icons.svg#carousel_pause" />
</svg>
</button>
<button class="sights_sounds_item_btn is_active" data-js="btn-play" aria-label="Play Video">
<svg class="icon icon_carousel_play">
<use href="/images/icons.svg#carousel_play" />
</svg>
</button>
</div>
</figure>
</div>
</div>
</div>
</li>
<li class="embla__slide" data-js="slide" data-uniqid="sights-sounds-slide-4">
<div class="sights_sounds_item is_audio_only">
<div class="sights_sounds_item_grid">
<div class="sights_sounds_item_grid_item is_left">
<div class="sights_sounds_item_content">
<div class="sights_sounds_item_label">Sights & Sounds</div>
<h2 class="sights_sounds_item_title">
Officia anim duis aliquip labore officia
</h2>
<div class="sights_sounds_item_desc">
<div class="typography">
<p>Labore aliqua aute proident voluptate sit.</p>
</div>
</div>
</div>
</div>
<div class="sights_sounds_item_grid_item is_right">
<figure class="sights_sounds_item_figure">
<picture class="sights_sounds_item_picture">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/paul-smiths-college/915x1220/5" width="915" height="1220">
<img class="sights_sounds_item_image" src="//images.fastspot.com/paul-smiths-college/980x552/5" alt="" loading="lazy" width="980" height="552">
</picture>
<div class="sights_sounds_item_lazy_video lazy_video js-video-lazy-load " data-video-lazy-load='{"id":"L6jiezlsbhs","type":"youtube","title":null,"display":"background","autoplay":false,"load_strategy":"none","playerVars":{}}'>
<a class="lazy_video_toggle_btn js-play-btn" href="https://www.youtube.com/watch?v=L6jiezlsbhs" aria-label="Play ">
<svg class="icon icon_play_triangle">
<use href="/images/icons.svg#play_triangle" />
</svg>
</a>
<div class="lazy_video_iframe_wrap">
<div class="lazy_video_iframe_target js-iframe-target"></div>
</div>
</div>
<div class="sights_sounds_item_audio_btn_group">
<button type="button" class="sights_sounds_item_audio_btn" data-js="btn-pause" aria-label="Pause Audio">
<span class="sights_sounds_item_audio_btn_icon">
<svg class="icon icon_carousel_mute">
<use href="/images/icons.svg#carousel_mute" />
</svg>
</span>
<span class="sights_sounds_item_audio_btn_label">
Hear sounds from Lower St. Regis Lake
</span>
</button>
<button type="button" class="sights_sounds_item_audio_btn" data-js="btn-play" aria-label="Play Audio">
<span class="sights_sounds_item_audio_btn_icon">
<svg class="icon icon_carousel_unmute">
<use href="/images/icons.svg#carousel_unmute" />
</svg>
</span>
<span class="sights_sounds_item_audio_btn_label">
Hear sounds from Lower St. Regis Lake
</span>
</button>
</div>
</figure>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="sights_sounds_content_grid_item is_controls">
<div id="sights-sounds-pagination-1" class="embla__controls">
<button class="embla__button embla__button--prev" type="button" data-js="btn-prev" aria-label="Previous Slide" aria-controls="sights-sounds-viewport-1">
<svg class="icon icon_arrow_carousel_left">
<use href="/images/icons.svg#arrow_carousel_left" />
</svg>
</button>
<button class="embla__button embla__button--next" type="button" data-js="btn-next" aria-label="Next Slide" aria-controls="sights-sounds-viewport-1">
<svg class="icon icon_arrow_carousel_right">
<use href="/images/icons.svg#arrow_carousel_right" />
</svg>
</button>
</div>
</div>
<div class="sights_sounds_content_grid_item is_dots">
<div id="sights-sounds-dots-1" class="embla__dots" data-js="dots" role="navigation" aria-controls="sights-sounds-viewport-1"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% set carousel_json = {
slidesToScroll: 1
}|json_encode %}
{% set uuid = uniqid("sights-sounds") %}
{% set uuid_viewport = uniqid("sights-sounds-viewport") %}
{% set uuid_title = uniqid("sights-sounds-title") %}
{% set uuid_pagination = uniqid("sights-sounds-pagination") %}
{% set uuid_dots = uniqid("sights-sounds-dots") %}
<div class="sights_sounds js-sights-sounds" data-uuid="{{ uuid }}" style="--overlay-opacity: {{ overlay_opacity }};">
<div class="sights_sounds_bg_media_wrap">
<div class="sights_sounds_figure">
{% include '@partial-picture' with {
class: 'sights_sounds_bg',
image: background_image,
alt: '',
loading: 'lazy',
default: img.portraitClassic.lrg,
sources: {
'1200px': img.wide.xlrg,
'980px': img.wide.lrg
}
} %}
{% if background_video.id %}
{% include "@partial-lazy-video" with {
class: "sights_sounds_bg",
id: background_video.id,
type: background_video.type,
display: "background",
autoplay: background_video.autoplay|default(false),
title: background_video.title,
load_strategy: "none",
playerVars: {}
} %}
{% endif %}
</div>
</div>
<div class="sights_sounds_body">
<div class="fs-row fs-xl-justify-center">
<div class="fs-cell fs-xl-10">
<div class="sights_sounds_body_inner">
<header class="sights_sounds_head">
<h1 class="visually_hide" id="header_title">The College of the Adirondacks</h1>
<div class="sights_sounds_title_icon_wrap">
{{ icon("text_the_college_of_the_adirondacks") }}
</div>
</header>
<div class="js-carousel-embla">
<div class="sights_sounds_content">
<div class="sights_sounds_content_grid">
<div class="sights_sounds_content_grid_item is_btn_toggle">
<div class="sights_sounds_btn_group">
<button class="sights_sounds_item_btn" data-js="bg-btn-pause" aria-label="Pause Video">
{{ icon("carousel_pause") }}
</button>
<button class="sights_sounds_item_btn is_active" data-js="bg-btn-play" aria-label="Play Video">
{{ icon("carousel_play") }}
</button>
</div>
</div>
<div class="sights_sounds_content_grid_item is_slides">
<a href="#{{ uuid_pagination }}" class="visually_hide" aria-label="Skip to Pagination"></a>
<a href="#{{ uuid_dots }}" class="visually_hide" aria-label="Skip to Dots"></a>
<div
class="embla"
data-carousel-embla='{{ carousel_json }}'
>
<div
id="{{ uuid_viewport }}"
class="embla__viewport"
data-js="viewport"
>
<ul class="embla__container" data-js="container">
{% for item in items %}
{% set uuid_slide = uniqid("sights-sounds-slide") %}
<li class="embla__slide" data-js="slide" data-uniqid="{{ uuid_slide }}">
{% include "@partial-sights-sounds-item" with {
item: item,
items_label: items_label
} %}
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="sights_sounds_content_grid_item is_controls">
<div id="{{ uuid_pagination }}" class="embla__controls">
<button class="embla__button embla__button--prev" type="button" data-js="btn-prev" aria-label="Previous Slide" aria-controls="{{ uuid_viewport }}">
{{ icon("arrow_carousel_left") }}
</button>
<button class="embla__button embla__button--next" type="button" data-js="btn-next" aria-label="Next Slide" aria-controls="{{ uuid_viewport }}">
{{ icon("arrow_carousel_right") }}
</button>
</div>
</div>
<div class="sights_sounds_content_grid_item is_dots">
<div id="{{ uuid_dots }}" class="embla__dots" data-js="dots" role="navigation" aria-controls="{{ uuid_viewport }}"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
No notes defined.