.logo-to-header-animation{--background-color:red;--background-final-width:120px;--background-final-height:60px;--logo-start-width:200px;--logo-start-height:100px;--logo-end-width:var(--background-final-width);--logo-end-height:var(--background-final-height);--final-left-position:20px;--final-top-position:0;--final-borders-radius:0 0 20px 20px;--final-opacity:0;--animation-duration:1.5s;--animation-delay:1s;--animation-easing:cubic-bezier(0.05, 0.7, 0.1, 1);--animation-background-duration:var(--animation-duration);--animation-background-delay:var(--animation-delay);--animation-background-easing:var(--animation-easing);--animation-logo-duration:var(--animation-duration);--animation-logo-delay:var(--animation-delay);--animation-logo-easing:var(--animation-easing);position:absolute!important;width:100vw!important;height:100vh!important;overflow:hidden!important;pointer-events:none!important}.logo-to-header-animation .background{position:absolute;width:100%;height:100%;background:var(--background-color);z-index:998;transform-origin:top left;animation:logo-to-header-bg-resize var(--animation-background-duration) var(--animation-background-easing) forwards var(--animation-background-delay);display:flex;align-items:center;justify-content:center}.logo-to-header-animation .logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--logo-start-width);height:var(--logo-start-height);z-index:999;transform-origin:center center;animation:logo-to-header-logo-resize var(--animation-logo-duration) var(--animation-logo-easing) forwards var(--animation-logo-delay);display:flex;align-items:center;justify-content:center}@keyframes logo-to-header-bg-resize{0%{top:0;left:0;border-radius:0;opacity:1}50%{border-radius:var(--final-borders-radius)}100%{top:var(--final-top-position);left:var(--final-left-position);width:var(--background-final-width);height:var(--background-final-height);border-radius:var(--final-borders-radius);opacity:var(--final-opacity)}}@keyframes logo-to-header-logo-resize{0%{top:50%;left:50%;transform:translate(-50%,-50%);max-width:var(--logo-start-width);max-height:var(--logo-start-height);opacity:1}100%{top:var(--final-top-position);left:var(--final-left-position);transform:translate(0);width:var(--logo-end-width);height:var(--logo-end-height);opacity:var(--final-opacity)}}.logo-center-to-header-animation{--background-color:red;--background-final-width:120px;--background-final-height:60px;--logo-start-width:200px;--logo-start-height:100px;--logo-end-width:var(--background-final-width);--logo-end-height:var(--background-final-height);--final-left-position:20px;--final-top-position:10px;--final-borders-radius:20px;--animation-duration:2s;--animation-delay:1s;--animation-easing:cubic-bezier(0.05, 0.7, 0.1, 1);--animation-background-duration:var(--animation-duration);--animation-background-delay:var(--animation-delay);--animation-background-easing:var(--animation-easing);--animation-logo-duration:var(--animation-duration);--animation-logo-delay:var(--animation-delay);--animation-logo-easing:var(--animation-easing);position:absolute;width:100vw;height:100vh;overflow:hidden}.logo-center-to-header-animation .background{position:absolute;width:100%;height:100%;background:var(--background-color);z-index:998;transform-origin:center center;animation:logo-center-to-header-bg-resize var(--animation-background-duration) var(--animation-background-easing) forwards var(--animation-background-delay);display:flex;align-items:center;justify-content:center}.logo-center-to-header-animation .logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--logo-start-width);height:var(--logo-start-height);z-index:999;transform-origin:center;animation:logo-center-to-header-logo-resize var(--animation-logo-duration) var(--animation-logo-easing) forwards var(--animation-logo-delay);display:flex;align-items:center;justify-content:center}@keyframes logo-center-to-header-bg-resize{0%{border-radius:0;transform:scale(1);opacity:1}50%{border-radius:var(--final-borders-radius);transform:scale(0);opacity:.3}100%{border-radius:var(--final-borders-radius);transform:scale(0);opacity:.3}}@keyframes logo-center-to-header-logo-resize{0%{top:50%;left:50%;transform:translate(-50%,-50%);width:var(--logo-start-width);height:var(--logo-start-height)}50%{top:50%;left:50%;transform:translate(-50%,-50%);width:var(--logo-start-width);height:var(--logo-start-height)}100%{top:var(--final-top-position);left:var(--final-left-position);transform:translate(0);width:var(--logo-end-width);height:var(--logo-end-height)}}.split-view-animation{--split-views-bg-color:#fff;--logo-positionX:50%;--logo-positionY:50%;--loader-positionX:50%;--loader-positionY:55%;--loader-width:30%;--loader-height:20px;--loader-bg-color:#e0e0e0;--loader-bar-color:#3b82f6;--loader-border-radius:10px;--animation-loading-duration:0.5s;--animation-loading-delay:0s;--animation-split-duration:1s;--animation-split-delay:0.3s;--animation-elements-fadeOut-duration:0.3s;--animation-easing:ease-in-out;--animation-split-view-duration:var(--animation-split-duration);--animation-split-view-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay) + var(--animation-split-delay));--animation-split-view-easing:var(--animation-easing);--animation-logo-duration:var(--animation-elements-fadeOut-duration);--animation-logo-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay));--animation-logo-easing:var(--animation-easing);;--animation-loader-duration:var(--animation-elements-fadeOut-duration);--animation-loader-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay));--animation-loader-easing:var(--animation-easing);;--animation-loader-bar-duration:var(--animation-loading-duration);--animation-loader-bar-delay:var(--animation-loading-delay);--animation-loader-bar-easing:var(--animation-easing);;--z-index-foreground:999;--z-index-background:998;position:absolute;width:100vw;height:100vh;overflow:hidden}.split-view-animation .split-view-part{position:absolute;background:var(--split-views-bg-color);;z-index:var(--z-index-background);display:flex;justify-content:center;align-items:center}.split-view-animation .split-view-top{top:0;left:0;width:100%;height:50%;transform-origin:center top;animation:split-view-slide-up var(--animation-split-view-duration) var(--animation-split-view-easing) forwards var(--animation-split-view-delay)}.split-view-animation .split-view-bottom{top:50%;left:0;width:100%;height:50%;transform-origin:center bottom;animation:split-view-slide-down var(--animation-split-view-duration) var(--animation-split-view-easing) forwards var(--animation-split-view-delay)}.split-view-animation .split-view-left{top:0;left:0;width:50%;height:100%;transform-origin:left center;animation:split-view-slide-left var(--animation-split-view-duration) var(--animation-split-view-easing) forwards var(--animation-split-view-delay)}.split-view-animation .split-view-right{top:0;left:50%;width:50%;height:100%;transform-origin:right center;animation:split-view-slide-right var(--animation-split-view-duration) var(--animation-split-view-easing) forwards var(--animation-split-view-delay)}.split-view-animation .split-view-logo{position:absolute;top:var(--logo-positionY);left:var(--logo-positionX);transform:translate(-50%,-50%);z-index:var(--z-index-foreground);animation:split-view-logo-fadeOut var(--animation-logo-duration) var(--animation-logo-easing) forwards var(--animation-logo-delay)}.split-view-animation .split-view-loader{position:absolute;top:var(--loader-positionY);left:var(--loader-positionX);transform:translate(-50%,-50%);width:var(--loader-width);height:var(--loader-height);background-color:var(--loader-bg-color);z-index:var(--z-index-foreground);overflow:hidden;border-radius:var(--loader-border-radius);animation:split-view-loader-fadeOut var(--animation-loader-duration) var(--animation-loader-easing) forwards var(--animation-loader-delay)}.split-view-animation .split-view-loader::before{content:'';position:absolute;width:100%;height:100%;top:0;left:0;transform:scaleX(0%);transform-origin:left;animation:split-view-loading-bar var(--animation-loader-bar-duration) var(--animation-loader-bar-easing) forwards var(--animation-loader-bar-delay),split-view-loader-fadeOut var(--animation-loader-bar-duration) var(--animation-loader-bar-easing) forwards var(--animation-loader-delay);background-color:var(--loader-bar-color)}@keyframes split-view-slide-up{0%{transform:translateY(0%);visibility:visible}99%{visibility:visible}100%{transform:translateY(-100%);visibility:hidden}}@keyframes split-view-slide-down{0%{transform:translateY(0%);visibility:visible}99%{visibility:visible}100%{transform:translateY(100%);visibility:hidden}}@keyframes split-view-slide-left{0%{transform:translateX(0%);visibility:visible}99%{visibility:visible}100%{transform:translateX(-100%);visibility:hidden}}@keyframes split-view-slide-right{0%{transform:translateX(0%);visibility:visible}99%{visibility:visible}100%{transform:translateX(100%);visibility:hidden}}@keyframes split-view-logo-fadeOut{0%{opacity:1;visibility:visible}99%{visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes split-view-loader-fadeOut{0%{opacity:1;visibility:visible}99%{visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes split-view-loading-bar{0%{transform:scaleX(.6)}100%{transform:scaleX(1)}}.slide-view-animation{--background-color:#fff;--logo-positionX:50%;--logo-positionY:50%;--loader-positionX:50%;--loader-positionY:55%;--loader-width:30%;--loader-height:20px;--loader-bg-color:#e0e0e0;--loader-bar-color:#3b82f6;--loader-border-radius:10px;--animation-loading-duration:0.5s;--animation-loading-delay:0s;--animation-slide-duration:1s;--animation-slide-delay:0.3s;--animation-elements-fadeOut-duration:0.3s;--animation-easing:ease-in-out;--animation-slide-view-duration:var(--animation-slide-duration);--animation-slide-view-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay) + var(--animation-slide-delay));--animation-slide-view-easing:var(--animation-easing);--animation-logo-duration:var(--animation-elements-fadeOut-duration);--animation-logo-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay));--animation-logo-easing:var(--animation-easing);;--animation-loader-duration:var(--animation-elements-fadeOut-duration);--animation-loader-delay:calc(var(--animation-loading-duration) + var(--animation-loading-delay));--animation-loader-easing:var(--animation-easing);;--animation-loader-bar-duration:var(--animation-loading-duration);--animation-loader-bar-delay:var(--animation-loading-delay);--animation-loader-bar-easing:var(--animation-easing);;--z-index-foreground:999;--z-index-background:998;position:absolute;width:100vw;height:100vh;overflow:hidden}.slide-view-animation .slide-view-part{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--background-color);z-index:var(--z-index-background);display:flex;justify-content:center;align-items:center}.slide-view-animation .slide-view-top{transform-origin:center top;animation:split-view-slide-up var(--animation-slide-view-duration) var(--animation-slide-view-easing) forwards var(--animation-slide-view-delay)}.slide-view-animation .slide-view-bottom{transform-origin:center bottom;animation:slide-view-slide-down var(--animation-slide-view-duration) var(--animation-slide-view-easing) forwards var(--animation-slide-view-delay)}.slide-view-animation .slide-view-left{transform-origin:left center;animation:split-view-slide-left var(--animation-slide-view-duration) var(--animation-slide-view-easing) forwards var(--animation-slide-view-delay)}.slide-view-animation .slide-view-right{transform-origin:right center;animation:slide-view-slide-right var(--animation-slide-view-duration) var(--animation-slide-view-easing) forwards var(--animation-slide-view-delay)}.slide-view-animation .slide-view-logo{position:absolute;top:var(--logo-positionY);left:var(--logo-positionX);transform:translate(-50%,-50%);z-index:var(--z-index-foreground);animation:slide-view-logo-fadeOut var(--animation-logo-duration) var(--animation-logo-easing) forwards var(--animation-logo-delay)}.slide-view-animation .slide-view-loader{position:absolute;top:var(--loader-positionY);left:var(--loader-positionX);transform:translate(-50%,-50%);width:var(--loader-width);height:var(--loader-height);background-color:var(--loader-bg-color);z-index:var(--z-index-foreground);overflow:hidden;border-radius:var(--loader-border-radius);animation:split-view-loader-fadeOut var(--animation-loader-duration) var(--animation-loader-easing) forwards var(--animation-loader-delay)}.slide-view-animation .slide-view-loader::before{content:'';position:absolute;width:100%;height:100%;top:0;left:0;transform:scaleX(0);transform-origin:left;animation:slide-view-loading-bar var(--animation-loader-bar-duration) var(--animation-loader-bar-easing) forwards var(--animation-loader-bar-delay),slide-view-loader-fadeOut var(--animation-loader-bar-duration) var(--animation-loader-bar-easing) forwards var(--animation-loader-delay);background-color:var(--loader-bar-color)}@keyframes slide-view-slide-up{0%{transform:translateY(0%);visibility:visible}99%{visibility:visible}100%{transform:translateY(-100%);visibility:hidden}}@keyframes slide-view-slide-down{0%{transform:translateY(0%);visibility:visible}99%{visibility:visible}100%{transform:translateY(100%);visibility:hidden}}@keyframes slide-view-slide-left{0%{transform:translateX(0%);visibility:visible}99%{visibility:visible}100%{transform:translateX(-100%);visibility:hidden}}@keyframes slide-view-slide-right{0%{transform:translateX(0%);visibility:visible}99%{visibility:visible}100%{transform:translateX(100%);visibility:hidden}}@keyframes slide-view-logo-fadeOut{0%{opacity:1;visibility:visible}99%{visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes slide-view-loader-fadeOut{0%{opacity:1;visibility:visible}99%{visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes slide-view-loading-bar{0%{transform:scaleX(.6)}100%{transform:scaleX(1)}}