.ScrollWithFade.horizontal{width:100%}.ScrollWithFade.vertical{height:100%}.ScrollWithFade .fade{--tw-gradient-from:#fff var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);opacity:1;pointer-events:none}.ScrollWithFade .fade,.ScrollWithFade .fade .arrow{position:absolute;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ScrollWithFade .fade .arrow{pointer-events:auto;display:inline-flex;aspect-ratio:1/1;--tw-scale-x:1;--tw-scale-y:1;border-radius:9999px;--tw-bg-opacity:1;background-color:rgb(53 184 245/var(--tw-bg-opacity,1));padding:.4em;font-size:1.4em;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.ScrollWithFade .fade .arrow,.ScrollWithFade .fade .arrow .arrow-icon{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade .arrow .arrow-icon{--tw-translate-x:.1rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ScrollWithFade .fade.bottom,.ScrollWithFade .fade.top{left:0;height:3rem;width:100%}.ScrollWithFade .fade.bottom .arrow,.ScrollWithFade .fade.top .arrow{left:50%;--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade.left,.ScrollWithFade .fade.right{top:0;height:100%;width:3rem}.ScrollWithFade .fade.left .arrow,.ScrollWithFade .fade.right .arrow{top:50%;--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade.top{top:0;background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.ScrollWithFade .fade.top .arrow{top:0;--tw-rotate:-90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade.bottom{bottom:0;background-image:linear-gradient(to top,var(--tw-gradient-stops))}.ScrollWithFade .fade.bottom .arrow{bottom:0;--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade.left{left:0;background-image:linear-gradient(to right,var(--tw-gradient-stops))}.ScrollWithFade .fade.left .arrow{left:0;--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ScrollWithFade .fade.right{right:0;background-image:linear-gradient(to left,var(--tw-gradient-stops))}.ScrollWithFade .fade.right .arrow{right:0}.ScrollWithFade .no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.ScrollWithFade .no-scrollbar::-webkit-scrollbar{display:none}
