:root {
   --album-is-wrapping: true;
   --album-auto-height: true;
   --album-auto-width: true;
   --album-clip-padding-side: 0px;
   --album-clip-padding-vert: 0px;
   --album-edge-fade-width: 0px;
   --album-slot-gap: 50px;
   --album-slot-width: 100%; /* Can be set to 'auto'*/
   --album-slot-width-min: ;
   --album-slot-width-max: ;
   --album-transition-deceleration: 10;  /* In units of pages/sec^2 */
}

.album {
   --album-clip-padding-side-full: calc(var(--album-clip-padding-side) + var(--album-edge-fade-width));
   clip-path: inset(calc(0px - var(--album-clip-padding-vert)) calc(0px - var(--album-clip-padding-side-full)));
   position: relative;
   user-select: none;
   -webkit-user-select: none;
}
.album:after {
   content: '';
   position: absolute;
   inset: calc(0px - var(--album-clip-padding-vert)) calc(0px - var(--album-clip-padding-side-full));
   pointer-events: none;
   background: linear-gradient(90deg, var(--main-content-color), transparent var(--album-edge-fade-width), transparent calc(100% - var(--album-edge-fade-width)), var(--main-content-color));
}
.album-item {
   position: absolute;
   inset: 0;
   width: fit-content;
   height: fit-content;
   margin: auto;
   pointer-events: none;
   /* overflow: hidden; */
}
.album .album-item.album-scrollable,
.album .album-item .album-scrollable {
   overflow-y: scroll;
   overflow-y: overlay;
}
.album-button-left,
.album-button-right {
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto;
   border: none;
   outline: none;
   opacity: 50%;
   transition: opacity 0.5s;
   width: 65px;
   height: fit-content;
   max-width: 12%;
   background: none;
   filter: drop-shadow(1px 3px 4px hsla(0, 0%, 0%, 50%));
   padding: 0px;
}
.album-button-left:hover,
.album-button-right:hover {
   opacity: 100%;
   cursor: pointer;
   background: transparent;
}
.album-button-left:disabled,
.album-button-right:disabled {
   cursor: default;
   opacity: 0%;
}
.album-button-left {
   left: 0;
   transform: scale(-1,1);
}
.album-button-right {
   right: 0;
}
.album-measure-rod {
   position: absolute;
   height: 1px;
   opacity: 0%;
}
.album-page-number {
   position: absolute;
   bottom: 10px;
   left: 0;
   right: 0;
   text-align: center;
   font-size: 30px;
   font-weight: 600;
   color: white;
   line-height: 100%;
   filter: drop-shadow(0px 0px 4px black);
   pointer-events: none;
   opacity: 50%;
   transition: opacity 0.5s;
}
.album:hover .album-page-number {
   opacity: 100%;
}

.album-pan-panel {
   position: absolute;
   inset: 0;
   cursor: grab;
}

.album-item-wistia>div {
   pointer-events: initial;
}