:root{--zFlexbarFade:4em;--zNavColor:#333}.z-flex-bar{position:relative;display:flex;max-width:100%;vertical-align:top;border-radius:var(--z-border-radius);overflow:hidden}.z-flex-bar.z-round{border-radius:99em}.z-flex-bar-scroller{position:relative;height:auto;flex:0 1 100%;z-index:1;--z-scrollbar-size:2px;--z-scrollbar-padding:2px}.z-flex-bar-scroller .z-scrollcontent.z-flex-bar-content{display:inline-flex;border-radius:inherit}.z-flex-bar-scroller.z-scrollable-left>.z-scrollarea{mask-image:linear-gradient(to right,transparent,#000 var(--zFlexbarFade));-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--zFlexbarFade))}.z-flex-bar-scroller.z-scrollable-right>.z-scrollarea{mask-image:linear-gradient(to left,transparent,#000 var(--zFlexbarFade));-webkit-mask-image:linear-gradient(to left,transparent,#000 var(--zFlexbarFade))}.z-flex-bar-scroller.z-scrollable-left.z-scrollable-right>.z-scrollarea{mask-image:linear-gradient(to left,transparent,#000 var(--zFlexbarFade),#000 calc(100% - var(--zFlexbarFade)),transparent);-webkit-mask-image:linear-gradient(to left,transparent,#000 var(--zFlexbarFade),#000 calc(100% - var(--zFlexbarFade)),transparent)}.z-flex-bar-scroller>.z-scrollbar .z-thumb{opacity:.3}.z-flex-bar-scroller>.z-nav{position:absolute;width:var(--z-plain-size);height:var(--z-plain-size);top:50%;translate:0 -50%;transition:opacity .2s,transform .2s;z-index:2;color:var(--zNavColor)}.z-flex-bar-scroller>.z-nav.z-prev{left:0}.z-flex-bar-scroller>.z-nav.z-next{right:0}.z-flex-bar-scroller>.z-nav[disabled]{opacity:0;transform:scale(.8);pointer-events:none}.z-flex-bar-scroller>.z-nav .z-icon{font-size:1.7em}.z-flex-bar-scroller.z-overflow .z-flex-bar-content>*{flex:1 0 auto}.z-flex-bar-content{display:flex;align-items:center}.z-flex-bar-content>*{flex:1 0 0;border-radius:0}.z-flex-bar-content>:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.z-flex-bar-content>:last-child{border-top-right-radius:inherit;border-bottom-right-radius:inherit}