/* @group Slider Widget
------------------------------------ */
.slider-widget { padding: 0 0 15rem; position: relative; }
.slider-widget .splide { padding: 0; }
.slider-widget .splide figure { height: 43rem; }

.slider-widget .splide .splide__list { margin: 0px -1px !important; }
.slider-widget .splide .splide__arrows { position: absolute; bottom: -10rem; right: 3rem; }

.slider-widget .splide .splide__arrows button { display: inline-block; width: 5.45rem; height: 5.45rem; border: .1rem solid var(--forest); border-radius: 100%; position: relative; transform: unset; left: unset; right: unset; opacity: 1; }
.slider-widget .splide .splide__arrows button::after { content: ''; display: inline-block; width: 100%; height: 100%; border: .1rem var(--gilded-age); border-radius: 100%; position: absolute; top: 50%; left: 50%; z-index: 1; transform: translate(-50%, -50%) scale(1); opacity: 0; }
.slider-widget .splide .splide__arrows button:hover::after { opacity: 1; transform: translate(-50%, -50%) scale(1.15); }
.slider-widget .splide .splide__arrows button:first-of-type { margin-right: 7rem; }

.slider-widget .splide .splide__arrows button i { 
    display: inline-block; 
    width: 2.9rem; 
    height: 1rem; 
}

.slider-widget .splide .splide__arrows button i::before,
.slider-widget .splide .splide__arrows button i::after{ 
    content: ''; 
    display: inline-block; 
    width: 2.9rem; 
    height: 1rem; 
}

.slider-widget .splide .splide__arrows button .icon-arrow-right::before { 
    background: url('../../img/layout/globals/splide-arrow-right-green.svg') no-repeat center; 
    background-size: 100% auto; 
}
.slider-widget .splide .splide__arrows button .icon-arrow-left::before { background: url('../../img/layout/globals/splide-arrow-left-green.svg') no-repeat center; background-size: 100% auto; }

.slider-widget .splide .splide__arrows button .icon-arrow-right::after { 
    background: url('../../img/layout/globals/splide-arrow-right-olive.svg') no-repeat center; 
    background-size: 100% auto; 
    opacity: 0; 
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
}
.slider-widget .splide .splide__arrows button .icon-arrow-left::after { 
    background: url('../../img/layout/globals/splide-arrow-left-olive.svg') no-repeat center; 
    background-size: 100% auto; 
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
}

.slider-widget .splide .splide__arrows button,
.slider-widget .splide .splide__arrows button i::after,
.slider-widget .splide .splide__arrows button i::before{
    transition: 0.5s;
}
.slider-widget .splide .splide__arrows button:hover {
    border-color: var(--olive);
}
.slider-widget .splide .splide__arrows button:hover i::before { 
    opacity: 0 !important;
}
.slider-widget .splide .splide__arrows button:hover i::after { 
    opacity: 1 !important;
}



@media only screen
and (min-width : 961px) {
    .slider-widget { padding: 0 0 14rem; }
    .slider-widget .splide figure { height: 51.3rem; }
    .slider-widget .splide .splide__arrows { right: -11.2rem; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; }
    .slider-widget .splide .splide__arrows button { width: 7rem; height: 7rem; }
    .slider-widget .splide .splide__arrows button:first-of-type { margin-bottom: 3.2rem; margin-right: 0; }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
}




/* @group PAGE TEMPLATE: Features & Amenities */
[data-page="amenities"] .slider-widget { background: url('../../img/layout/textures/sandstone.jpeg') bottom no-repeat; background-size: cover; }
[data-page="amenities"] .slider-widget::before { content: ''; width: 100%; height: 100%; background-color: var(--limestone); opacity: .65; position: absolute; top: 0; left: 0; pointer-events: none; }
/* @end Features & Amenities */



/* @group PAGE TEMPLATE: Residences */
[data-page="residences"] .slider-widget { background: url('../../img/layout/textures/seawater.jpg') bottom no-repeat; background-size: cover; }
[data-page="residences"] .slider-widget::before { content: ''; width: 100%; height: 100%; background-color: var(--limestone); opacity: .85; position: absolute; top: 0; left: 0; pointer-events: none; }
@media only screen
and (min-width : 961px) {
    [data-page="residences"] .slider-widget { padding: 0 0 9.1rem; }
}
/* @end Residences */


/* @end */
