/*
* Size of content item holder (customizable)
*/

.slideplus-slot {
width: 200px;  /* preferred width for items */
aspect-ratio: 1 / 1;
}

/*
* Caption area (customizable)
*/

.slideplus-slot.slideplus-above,
.slideplus-above > .slideplus-content {
padding-top: 40px;  /* extra vertical space reserved for captions, use same value as below */
}

.slideplus-slot.slideplus-below,
.slideplus-below > .slideplus-content {
padding-bottom: 40px;  /* extra vertical space reserved for captions, use same value as above */
}

.slideplus-above > .slideplus-caption,
.slideplus-below > .slideplus-caption {
height: 40px;  /* caption height, use the same value as for "padding-top" and "padding-bottom" above */
}

.slideplus-top .slideplus-caption,
.slideplus-bottom .slideplus-caption {
color: white;
background-color: rgba(0,0,0,0.4);  /* background color for overlay captions */
}

.slideplus-top .slideplus-caption a,
.slideplus-bottom .slideplus-caption a {
color: white;
}

/*
* Item alignment (customizable)
*/

.slideplus-content {
align-items: center;  /* vertical alignment of item in sliding strip item container */
justify-content: center;  /* horizontal alignment of item in sliding strip item container */
}

/*
* Navigation bar (customizable)
*/

.slideplus-navigation.slideplus-top {
/* display: none;  /* uncomment to hide top navigation bar */
}

.slideplus-navigation.slideplus-bottom {
/* display: none;  /* uncomment to hide bottom navigation bar */
}

/*
* JavaScript disabled mode (customizable)
*/

noscript.slideplus > ul > li {
width: 200px;
height: 200px;
}

/*
* Viewport and viewport elements
*/

.slideplus-container {
contain: layout paint style;
display: inline-block;
max-width: 100%;
}

.slideplus-viewport {
display: block;
position: relative;
max-width: 100%;
overflow: hidden;
}

.slideplus-stripe {
display: block;
position: relative;
max-width: 100%;
animation-duration: 3s;
animation-timing-function: linear;
}

.slideplus-stripe.slideplus-successor {
position: absolute;
}

.slideplus-stripe > div {
display: flex;
}

.slideplus-slot {
contain: layout paint size style;
display: inline-block;
position: relative;
}

.slideplus-content, .slideplus-caption {
left: 0;
right: 0;
position: absolute;
}

.slideplus-content {
display: flex;
top: 0;
bottom: 0;
}

.slideplus-content > div {
display: flex;
position: relative;
max-width: 100%;
max-height: 100%;
min-height: 85px;  /* make sure navigation buttons and spinner icon are visible */
overflow-wrap: break-word;
}

.slideplus-top .slideplus-content > div {
align-items: flex-start;
}

.slideplus-bottom .slideplus-content > div {
align-items: flex-end;
}

.slideplus-caption {
box-sizing: border-box;
padding: 4px;
max-height: 100%;
overflow-x: hidden;
overflow-y: auto;
overflow-wrap: break-word;
text-align: center;
}

.slideplus-top .slideplus-caption,
.slideplus-bottom .slideplus-caption {
pointer-events: none;
visibility: hidden;
}

@media (hover) and (pointer: fine), (-moz-touch-enabled: 0) {  /* rules for desktop devices */
.slideplus-top .slideplus-caption,
.slideplus-bottom .slideplus-caption {
pointer-events: auto;
}
}

.slideplus-top:hover .slideplus-caption,
.slideplus-bottom:hover .slideplus-caption {
visibility: visible;
}

.slideplus-above > .slideplus-caption,
.slideplus-top .slideplus-caption {
top: 0;
}

.slideplus-bottom .slideplus-caption,
.slideplus-below > .slideplus-caption {
bottom: 0;
}

noscript.slideplus > ul > li img,
.slideplus-content > div img {
max-width: 100%;
height: auto;
object-fit: scale-down;
}

/*
* Progress indicator
*/

.loadplus-progress {
display: inline-block;
position: absolute;
box-sizing: border-box;
width: 80px;
height: 80px;
top: 50%;
left: 50%;
margin: -40px 0 0 -40px;
border-radius: 100%;
border: 10px solid rgba(64, 64, 64, 0.2);
border-top-color: #000;
animation: spin 1s infinite linear;
}

@keyframes spin {
100% { transform: rotate(360deg); }
}

.loadplus-hidden {
visibility: hidden;
}

/**
* Overlay navigation buttons
*/

.slideplus-viewport > .slideplus-button {
position: absolute;
background: transparent no-repeat center center;
}

.slideplus-viewport.slideplus-horizontal > .slideplus-button {
width: 58px;
}

.slideplus-container[dir=ltr] > .slideplus-viewport.slideplus-horizontal > .slideplus-previous,
.slideplus-container[dir=rtl] > .slideplus-viewport.slideplus-horizontal > .slideplus-next {
left: 0;
right: auto;
top: 0;
bottom: 0;
background-image: url('button-left.svg');
}

.slideplus-container[dir=ltr] > .slideplus-viewport.slideplus-horizontal > .slideplus-next,
.slideplus-container[dir=rtl] > .slideplus-viewport.slideplus-horizontal > .slideplus-previous {
left: auto;
right: 0;
top: 0;
bottom: 0;
background-image: url('button-right.svg');
}

.slideplus-viewport.slideplus-vertical > .slideplus-button {
height: 58px;
}

.slideplus-viewport.slideplus-vertical > .slideplus-previous {
top: 0;
left: 0;
right: 0;
background-image: url('button-up.svg');
}

.slideplus-viewport.slideplus-vertical > .slideplus-next {
bottom: 0;
left: 0;
right: 0;
background-image: url('button-down.svg');
}

/*
* Navigation bar
*/

.slideplus-navigation {
display: flex;
justify-content: center;
}

.slideplus-navigation > a,
.slideplus-paging > a {
width: 1.4em;
height: 1.4em;
background-size: 1.4em 1.4em;
background-repeat: no-repeat;
overflow: hidden;
}

.slideplus-navigation > span {
flex-grow: 1;
width: 0;
}

.slideplus-navigation[dir=ltr] > .slideplus-first,
.slideplus-navigation[dir=rtl] > .slideplus-last {
background-image: url('icon-first.svg');
}

.slideplus-navigation[dir=ltr] > .slideplus-previous,
.slideplus-navigation[dir=rtl] > .slideplus-next {
background-image: url('icon-previous.svg');
}

.slideplus-navigation[dir=ltr] > .slideplus-next,
.slideplus-navigation[dir=rtl] > .slideplus-previous {
background-image: url('icon-next.svg');
}

.slideplus-navigation[dir=ltr] > .slideplus-last,
.slideplus-navigation[dir=rtl] > .slideplus-first {
background-image: url('icon-last.svg');
}

.slideplus-first.slideplus-hidden,
.slideplus-previous.slideplus-hidden,
.slideplus-next.slideplus-hidden,
.slideplus-last.slideplus-hidden {
display: unset;
visibility: hidden;
}

.slideplus-paging {
text-align: center;
}

.slideplus-pager {
display: inline-block;
box-sizing: border-box;
border: 1px solid gray;
border-radius: 100%;
padding: 0;
color: inherit;
}

.slideplus-pager,
.slideplus-pager:active,
.slideplus-pager:focus,
.slideplus-pager:hover,
.slideplus-pager:visited {
text-decoration: none;
}

.slideplus-pager.slideplus-current {
color: white;
background-color: gray;
}

.slideplus-pager > span {
font-size: smaller;
vertical-align: text-top;
}

/*
* Navigation animation sequence
*/

.slideplus-fade-in {
animation-name: slideplus-fade-in;
}

@keyframes slideplus-fade-in {
0% { opacity: 0.0; }
100% { opacity: 1.0; }
}

.slideplus-fade-out {
animation-name: slideplus-fade-out;
}

@keyframes slideplus-fade-out {
0% { opacity: 1.0; }
100% { opacity: 0.0; }
}

/* https://easings.net/ */
.slideplus-timing-linear, .slideplus-timing-elastic, .slideplus-timing-bounce {
animation-timing-function: linear;
}
.slideplus-timing-sine {
animation-timing-function: cubic-bezier(0.37, 0, 0.63, 1);
}
.slideplus-timing-quad {
animation-timing-function: cubic-bezier(0.45, 0, 0.55, 1);
}
.slideplus-timing-cubic {
animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
}
.slideplus-timing-quart {
animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
}
.slideplus-timing-quint {
animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1);
}
.slideplus-timing-expo {
animation-timing-function: cubic-bezier(0.87, 0, 0.13, 1);
}
.slideplus-timing-circ {
animation-timing-function: cubic-bezier(0.85, 0, 0.15, 1);
}
.slideplus-timing-back {
animation-timing-function: cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

/*
* Keyframes for animations.
* Included for reference only. Generated for `transform: translate(x, y)` orientations on the fly in JavaScript.
*/

@keyframes slideplus-linear {
0% { translate: 0%; }
100% { translate: 100%; }
}

/* https://easings.net/#easeInOutElastic */
@keyframes slideplus-elastic {
0% { translate: 0%; }
4%, 8% { translate: 0.1%; }
18%, 20% { translate: -0.5%; }
28%, 30% { translate: -2.4%; }
38%, 40% { translate: -10%; }
60%, 62% { translate: 110%; }
70%, 72% { translate: 97.6%; }
80%, 82% { translate: 100.5%; }
90%, 92% { translate: 99.9%; }
100% { translate: 100%; }
}

/* https://easings.net/#easeOutBounce */
@keyframes slideplus-bounce {
0% { translate: 0%; }
12% { translate: 10.89%; }
24% { translate: 43.56%; }
36% { translate: 98%; }
54% { translate: 75%; }
74% { translate: 98.4%; }
82% { translate: 93.75%; }
92% { translate: 99.3%; }
96% { translate: 98.5%; }
100% { translate: 100; }
}

/*
* Hide inactive controls and display elements
*/

.slideplus-hidden {
display: none;
}

/*
* JavaScript disabled mode
*/

noscript.slideplus > ul {
padding: 0;
list-style-type: none;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
}

noscript.slideplus > ul > li {
display: inline-block;
position: relative;
overflow-x: hidden;
overflow-y: auto;
overflow-wrap: break-word;
white-space: normal;
}