pds-dev-kit-web-test 0.2.13 → 0.2.15

package/dist/src/sub/DynamicLayout/components/Section/ErrorBoundary/ErrorBoundary.d.ts

@@ -0,0 +1,15 @@
+import React, { Component, ErrorInfo, ReactNode } from 'react';
+declare type Props = {
+    children: ReactNode;
+};
+declare type State = {
+    hasError: boolean;
+};
+declare class ErrorBoundary extends Component<Props, State> {
+    constructor(props: Props);
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    static getDerivedStateFromError(): State;
+    reset(): void;
+    render(): React.ReactNode;
+}
+export default ErrorBoundary;

package/dist/src/sub/DynamicLayout/components/Section/ErrorBoundary/ErrorBoundary.js

@@ -0,0 +1,62 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable react/destructuring-assignment */
+/* eslint-disable no-console */
+var react_1 = require("react");
+var styled_components_1 = __importDefault(require("styled-components"));
+var ErrorBoundary = /** @class */ (function (_super) {
+    __extends(ErrorBoundary, _super);
+    function ErrorBoundary(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
+            hasError: false
+        };
+        return _this;
+    }
+    ErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
+        console.error('Uncaught error:', error, errorInfo);
+    };
+    ErrorBoundary.getDerivedStateFromError = function () {
+        return { hasError: true };
+    };
+    ErrorBoundary.prototype.reset = function () {
+        this.setState({
+            hasError: false
+        });
+    };
+    ErrorBoundary.prototype.render = function () {
+        var hasError = this.state.hasError;
+        if (hasError) {
+            return (0, jsx_runtime_1.jsx)(ErrorWrapper, { children: "Error" }, void 0);
+        }
+        var children = this.props.children;
+        return children;
+    };
+    return ErrorBoundary;
+}(react_1.Component));
+var ErrorWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-direction: row;\n  height: 100%;\n  justify-content: center;\n  width: 100%;\n"], ["\n  align-items: center;\n  display: flex;\n  flex-direction: row;\n  height: 100%;\n  justify-content: center;\n  width: 100%;\n"])));
+exports.default = ErrorBoundary;
+var templateObject_1;

package/dist/src/sub/DynamicLayout/components/Section/ErrorBoundary/index.d.ts

@@ -0,0 +1 @@
+export { default as ErrorBoundary } from './ErrorBoundary';

package/dist/src/sub/DynamicLayout/components/Section/ErrorBoundary/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorBoundary = void 0;
+var ErrorBoundary_1 = require("./ErrorBoundary");
+Object.defineProperty(exports, "ErrorBoundary", { enumerable: true, get: function () { return __importDefault(ErrorBoundary_1).default; } });

package/dist/src/sub/DynamicLayout/mock_samplePage.js

@@ -1850,12 +1850,7 @@ var realMock = [
                                 tl: 0,
                                 tr: 0
                             },
-                            'CB_STYLE_PROP_BORDER_SPEC_RADIUS:HOVER': {
-                                bl: 0,
-                                br: 0,
-                                tl: 0,
-                                tr: 0
-                            },
+                            'CB_STYLE_PROP_BORDER_SPEC_RADIUS:HOVER': null,
                             'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE': null,
                             'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE:HOVER': null,
                             CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX: true,

package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js

@@ -21,6 +21,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var publ_echo_1 = require("publ-echo");
 var react_1 = require("react");
+var ErrorBoundary_1 = require("../../../DynamicLayout/components/Section/ErrorBoundary");
 var dynamicLayoutContext_1 = require("../../../DynamicLayout/dynamicLayoutContext");
 var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../components");
@@ -121,17 +122,17 @@ function CustomSection(props) {
                 }
             });
     };
-    return ((0, jsx_runtime_1.jsx)(S_gleStyles, __assign({ customHeight: customMinHeight }, { children: (0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ ref: gleRef, "x-dlayout-section-type": "NO_NAME", onClick: onClickSection }, { children: (0, jsx_runtime_1.jsx)(components_1.CustomSection, __assign({}, props, { overrideStyles: customSectionStyles, isMobile: isMobile }, { children: (0, jsx_runtime_1.jsx)(Responsive, __assign({ allowOverlap: true, layouts: { lg: layouts.lg, sm: layouts.sm }, resizeHandles: ['nw', 'e', 'n', 'ne', 's', 'se', 'sw', 'w'], breakpoints: { lg: 800, sm: 480 }, breakpoint: breakpoint, cols: { lg: 24, sm: 8 }, rowHeight: 50, margin: [10, 10], style: {
-                        width: customSectionStyles.width,
-                        minHeight: customMinHeight
-                    }, onLayoutChange: onLayoutChange, onDragStop: onDragStop, onResizeStop: onResizeStop }, { children: componentBlocks ? (componentBlocks.map(function (each) { return ((0, jsx_runtime_1.jsx)("div", __assign({ className: selectedCB === each.id ? 'react-grid-item-selected' : '' }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ style: {
-                                width: '100%',
-                                height: '100%',
-                                overflow: 'hidden'
-                            }, onClick: function (e) {
-                                e.stopPropagation();
-                                onClickCB(each.id);
-                            } }, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, __assign({}, each), void 0) }), void 0) }), each.id)); })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0)) }), void 0) }), void 0) }), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(S_gleStyles, __assign({ customHeight: customMinHeight }, { children: (0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ ref: gleRef, "x-dlayout-section-type": "NO_NAME", onClick: onClickSection }, { children: (0, jsx_runtime_1.jsx)(components_1.CustomSection, __assign({}, props, { overrideStyles: customSectionStyles, isMobile: isMobile }, { children: (0, jsx_runtime_1.jsx)(Responsive, __assign({ allowOverlap: true, layouts: { lg: layouts.lg, sm: layouts.sm }, resizeHandles: ['nw', 'e', 'n', 'ne', 's', 'se', 'sw', 'w'], breakpoints: { lg: 800, sm: 480 }, breakpoint: breakpoint, cols: { lg: 24, sm: 8 }, rowHeight: 50, margin: [10, 10], style: {
+                            width: customSectionStyles.width,
+                            minHeight: customMinHeight
+                        }, onLayoutChange: onLayoutChange, onDragStop: onDragStop, onResizeStop: onResizeStop }, { children: componentBlocks ? (componentBlocks.map(function (each) { return ((0, jsx_runtime_1.jsx)("div", __assign({ className: selectedCB === each.id ? 'react-grid-item-selected' : '' }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ style: {
+                                    width: '100%',
+                                    height: '100%',
+                                    overflow: 'hidden'
+                                }, onClick: function (e) {
+                                    e.stopPropagation();
+                                    onClickCB(each.id);
+                                } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, __assign({}, each), void 0) }, void 0) }), void 0) }), each.id)); })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0)) }), void 0) }), void 0) }), void 0) }), void 0) }, void 0));
 }
 var S_gleStyles = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  * {\n    box-sizing: border-box;\n  }\n\n  .react-grid-layout {\n    position: relative;\n  }\n\n  .react-grid-item {\n    left: 0;\n    position: absolute;\n    top: 0;\n    z-index: 1;\n  }\n\n  .react-grid-item.react-draggable.react-resizable:hover,\n  .react-grid-item-selected {\n    box-shadow: 0 0 0 3px #027aff;\n  }\n\n  .react-grid-item img {\n    pointer-events: none;\n    user-select: none;\n  }\n\n  .react-grid-item.isResizing,\n  .react-grid-item.isResizing .cb-layout-box,\n  .react-grid-item.isResizing .cb-layout-box .cb-divider {\n    visibility: hidden;\n  }\n\n  .react-grid-item.react-draggable.isDragging,\n  .react-grid-item.react-draggable.isDragging .cb-layout-box,\n  .react-grid-item.react-draggable.isDragging .cb-layout-box .cb-divider {\n    visibility: hidden;\n  }\n\n  /* .react-grid-item.react-draggable.isDragging .cb-layout-box .twitter-embed-container {\n    visibility: hidden;\n  } */\n\n  .react-grid-item.isResizing > .react-resizable-handle,\n  .react-grid-item.react-draggable.isDragging > .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .react-grid-item.dropping {\n    visibility: hidden;\n  }\n\n  .react-grid-item.static::after {\n    color: red;\n    content: \"this is static, can't drag\";\n    left: 50%;\n    position: absolute;\n    top: 50%;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-grid-item.placeholder {\n    -moz-user-select: none;\n    -ms-user-select: none;\n    -o-user-select: none;\n    -webkit-user-select: none;\n    user-select: none;\n    z-index: 9999;\n  }\n\n  .react-grid-item > .react-resizable-handle::after {\n    background: rgb(255, 255, 255);\n    border: 3px solid rgb(2, 122, 255);\n    content: '';\n    height: 5px;\n    position: absolute;\n    width: 5px;\n  }\n\n  .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .react-grid-item-selected > .react-resizable-handle {\n    visibility: visible;\n  }\n\n  /* NOTE: Resizable related */\n  .react-resizable {\n    position: relative;\n  }\n\n  .react-resizable-handle {\n    align-items: center;\n    background-origin: content-box;\n    background-repeat: no-repeat;\n    box-sizing: border-box;\n    display: flex;\n    height: 20px;\n    justify-content: center;\n    position: absolute;\n    width: 20px;\n  }\n\n  .react-resizable-handle-sw {\n    bottom: 0;\n    cursor: sw-resize;\n    left: 0;\n    transform: translate(-50%, 50%);\n  }\n\n  .react-resizable-handle-se {\n    bottom: 0;\n    cursor: se-resize;\n    right: 0;\n    transform: translate(50%, 50%);\n  }\n\n  .react-resizable-handle-nw {\n    cursor: nw-resize;\n    left: 0;\n    top: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-ne {\n    cursor: ne-resize;\n    right: 0;\n    top: 0;\n    transform: translate(50%, -50%);\n  }\n\n  .react-resizable-handle-w,\n  .react-resizable-handle-e {\n    cursor: ew-resize;\n    top: 50%;\n  }\n\n  .react-resizable-handle-w {\n    left: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-e {\n    right: 0;\n    transform: translate(50%, -50%);\n  }\n\n  .react-resizable-handle-n,\n  .react-resizable-handle-s {\n    cursor: ns-resize;\n    left: 50%;\n  }\n\n  .react-resizable-handle-n {\n    top: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-s {\n    bottom: 0;\n    transform: translate(-50%, 50%);\n  }\n\n  .grid-placeholder {\n    position: absolute;\n    z-index: 0;\n  }\n\n  .grid-pattern-rect {\n    fill: #c0bebe14;\n    stroke: #ffffff5f;\n  }\n\n  .react-grid-item.placeholder .cb-layout-box,\n  .react-grid-item.placeholder .cb-layout-box .cb-divider {\n    animation: none;\n  }\n\n  .react-grid-item.placeholder {\n    box-shadow: 0 0 0 3px #027aff;\n  }\n\n  .react-grid-item.placeholder > .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .grid-guide-line-center {\n    border-color: #ff463aff;\n    border-style: dashed;\n    border-width: 1px;\n    height: 100%;\n    left: 50%;\n    position: absolute;\n    transform: translateX(-50%);\n  }\n\n  /* NOTE: custom \uCD94\uAC00 */\n  .grid-placeholder > svg {\n    min-height: ", ";\n  }\n\n  /* NOTE: Effects */\n\n  @-webkit-keyframes fade-in {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n\n  @keyframes fade-in {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-fwd {\n    0% {\n      -webkit-transform: translateZ(-80px);\n      transform: translateZ(-80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @keyframes fade-in-fwd {\n    0% {\n      -webkit-transform: translateZ(-80px);\n      transform: translateZ(-80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-bck {\n    0% {\n      -webkit-transform: translateZ(80px);\n      transform: translateZ(80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-bck {\n    0% {\n      -webkit-transform: translateZ(80px);\n      transform: translateZ(80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-top {\n    0% {\n      -webkit-transform: translateY(-50px);\n      transform: translateY(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-top {\n    0% {\n      -webkit-transform: translateY(-50px);\n      transform: translateY(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-right {\n    0% {\n      -webkit-transform: translateX(50px);\n      transform: translateX(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-right {\n    0% {\n      -webkit-transform: translateX(50px);\n      transform: translateX(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:29:36\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation fade-in-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes fade-in-bottom {\n    0% {\n      -webkit-transform: translateY(50px);\n      transform: translateY(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-bottom {\n    0% {\n      -webkit-transform: translateY(50px);\n      transform: translateY(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:29:52\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation fade-in-left\n * ----------------------------------------\n */\n  @-webkit-keyframes fade-in-left {\n    0% {\n      -webkit-transform: translateX(-50px);\n      transform: translateX(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-left {\n    0% {\n      -webkit-transform: translateX(-50px);\n      transform: translateX(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:53:50\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-top\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-top {\n    0% {\n      -webkit-transform: translateY(-1000px);\n      transform: translateY(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-top {\n    0% {\n      -webkit-transform: translateY(-1000px);\n      transform: translateY(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:47\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-right\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-right {\n    0% {\n      -webkit-transform: translateX(1000px);\n      transform: translateX(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-right {\n    0% {\n      -webkit-transform: translateX(1000px);\n      transform: translateX(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:1\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-bottom {\n    0% {\n      -webkit-transform: translateY(1000px);\n      transform: translateY(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-bottom {\n    0% {\n      -webkit-transform: translateY(1000px);\n      transform: translateY(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:28\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-left\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-left {\n    0% {\n      -webkit-transform: translateX(-1000px);\n      transform: translateX(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-left {\n    0% {\n      -webkit-transform: translateX(-1000px);\n      transform: translateX(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:52:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation tracking-in-contract\n * ----------------------------------------\n */\n  @-webkit-keyframes tracking-in-contract {\n    0% {\n      letter-spacing: 1em;\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      letter-spacing: normal;\n      opacity: 1;\n    }\n  }\n  @keyframes tracking-in-contract {\n    0% {\n      letter-spacing: 1em;\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      letter-spacing: normal;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:47:57\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation rotate-in-2-cw\n * ----------------------------------------\n */\n  @-webkit-keyframes rotate-in-2-cw {\n    0% {\n      -webkit-transform: rotate(-45deg);\n      transform: rotate(-45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n  @keyframes rotate-in-2-cw {\n    0% {\n      -webkit-transform: rotate(-45deg);\n      transform: rotate(-45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:52:54\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation rotate-in-2-ccw\n * ----------------------------------------\n */\n  @-webkit-keyframes rotate-in-2-ccw {\n    0% {\n      -webkit-transform: rotate(45deg);\n      transform: rotate(45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n  @keyframes rotate-in-2-ccw {\n    0% {\n      -webkit-transform: rotate(45deg);\n      transform: rotate(45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:34:56\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-top-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-top-fwd {\n    0% {\n      -webkit-transform: rotateX(-100deg);\n      transform: rotateX(-100deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-top-fwd {\n    0% {\n      -webkit-transform: rotateX(-100deg);\n      transform: rotateX(-100deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:35:56\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-top-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-top-bck {\n    0% {\n      -webkit-transform: rotateX(70deg);\n      transform: rotateX(70deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-top-bck {\n    0% {\n      -webkit-transform: rotateX(70deg);\n      transform: rotateX(70deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:36:18\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-right-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-right-fwd {\n    0% {\n      -webkit-transform: rotateY(-100deg);\n      transform: rotateY(-100deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-right-fwd {\n    0% {\n      -webkit-transform: rotateY(-100deg);\n      transform: rotateY(-100deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:36:46\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-right-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-right-bck {\n    0% {\n      -webkit-transform: rotateY(70deg);\n      transform: rotateY(70deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-right-bck {\n    0% {\n      -webkit-transform: rotateY(70deg);\n      transform: rotateY(70deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:37:11\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-bottom-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-bottom-fwd {\n    0% {\n      -webkit-transform: rotateX(100deg);\n      transform: rotateX(100deg);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0);\n      transform: rotateX(0);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 1;\n    }\n  }\n\n  @keyframes swing-in-bottom-fwd {\n    0% {\n      -webkit-transform: rotateX(100deg);\n      transform: rotateX(100deg);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0);\n      transform: rotateX(0);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:38:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-left-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-left-fwd {\n    0% {\n      -webkit-transform: rotateY(100deg);\n      transform: rotateY(100deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-left-fwd {\n    0% {\n      -webkit-transform: rotateY(100deg);\n      transform: rotateY(100deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:40:3\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-left-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-left-bck {\n    0% {\n      -webkit-transform: rotateY(-70deg);\n      transform: rotateY(-70deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-left-bck {\n    0% {\n      -webkit-transform: rotateY(-70deg);\n      transform: rotateY(-70deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:44:48\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation scale-in-center\n * ----------------------------------------\n */\n  @-webkit-keyframes scale-in-center {\n    0% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n      opacity: 1;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      opacity: 1;\n    }\n  }\n  @keyframes scale-in-center {\n    0% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n      opacity: 1;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:46:1\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-bck-center\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-bck-center {\n    0% {\n      -webkit-transform: translateZ(600px);\n      transform: translateZ(600px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-bck-center {\n    0% {\n      -webkit-transform: translateZ(600px);\n      transform: translateZ(600px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:13:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation tracking-in-contract-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes tracking-in-contract-bck {\n    0% {\n      letter-spacing: 1em;\n      -webkit-transform: translateZ(400px);\n      transform: translateZ(400px);\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes tracking-in-contract-bck {\n    0% {\n      letter-spacing: 1em;\n      -webkit-transform: translateZ(400px);\n      transform: translateZ(400px);\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:11:16\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation text-focus-in\n * ----------------------------------------\n */\n  @-webkit-keyframes text-focus-in {\n    0% {\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes text-focus-in {\n    0% {\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:33:10\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation puff-in-center\n * ----------------------------------------\n */\n  @-webkit-keyframes puff-in-center {\n    0% {\n      -webkit-transform: scale(2);\n      transform: scale(2);\n      -webkit-filter: blur(4px);\n      filter: blur(4px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes puff-in-center {\n    0% {\n      -webkit-transform: scale(2);\n      transform: scale(2);\n      -webkit-filter: blur(4px);\n      filter: blur(4px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:11:29\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation focus-in-contract\n * ----------------------------------------\n */\n  @-webkit-keyframes focus-in-contract {\n    0% {\n      letter-spacing: 1em;\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes focus-in-contract {\n    0% {\n      letter-spacing: 1em;\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:22:44\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-horizontal\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-horizontal {\n    0%,\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateX(-10px);\n      transform: translateX(-10px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateX(10px);\n      transform: translateX(10px);\n    }\n    80% {\n      -webkit-transform: translateX(8px);\n      transform: translateX(8px);\n    }\n    90% {\n      -webkit-transform: translateX(-8px);\n      transform: translateX(-8px);\n    }\n  }\n  @keyframes shake-horizontal {\n    0%,\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateX(-10px);\n      transform: translateX(-10px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateX(10px);\n      transform: translateX(10px);\n    }\n    80% {\n      -webkit-transform: translateX(8px);\n      transform: translateX(8px);\n    }\n    90% {\n      -webkit-transform: translateX(-8px);\n      transform: translateX(-8px);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:23:8\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-vertical\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-vertical {\n    0%,\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateY(-8px);\n      transform: translateY(-8px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateY(8px);\n      transform: translateY(8px);\n    }\n    80% {\n      -webkit-transform: translateY(6.4px);\n      transform: translateY(6.4px);\n    }\n    90% {\n      -webkit-transform: translateY(-6.4px);\n      transform: translateY(-6.4px);\n    }\n  }\n  @keyframes shake-vertical {\n    0%,\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateY(-8px);\n      transform: translateY(-8px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateY(8px);\n      transform: translateY(8px);\n    }\n    80% {\n      -webkit-transform: translateY(6.4px);\n      transform: translateY(6.4px);\n    }\n    90% {\n      -webkit-transform: translateY(-6.4px);\n      transform: translateY(-6.4px);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:24:19\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-top\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-top {\n    0%,\n    100% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n      -webkit-transform-origin: 50% 0;\n      transform-origin: 50% 0;\n    }\n    10% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: rotate(-4deg);\n      transform: rotate(-4deg);\n    }\n    30%,\n    50%,\n    70% {\n      -webkit-transform: rotate(4deg);\n      transform: rotate(4deg);\n    }\n    80% {\n      -webkit-transform: rotate(-2deg);\n      transform: rotate(-2deg);\n    }\n    90% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n  }\n  @keyframes shake-top {\n    0%,\n    100% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n      -webkit-transform-origin: 50% 0;\n      transform-origin: 50% 0;\n    }\n    10% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: rotate(-4deg);\n      transform: rotate(-4deg);\n    }\n    30%,\n    50%,\n    70% {\n      -webkit-transform: rotate(4deg);\n      transform: rotate(4deg);\n    }\n    80% {\n      -webkit-transform: rotate(-2deg);\n      transform: rotate(-2deg);\n    }\n    90% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:21:6\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation vibrate-1\n * ----------------------------------------\n */\n  @-webkit-keyframes vibrate-1 {\n    0% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n    20% {\n      -webkit-transform: translate(-2px, 2px);\n      transform: translate(-2px, 2px);\n    }\n    40% {\n      -webkit-transform: translate(-2px, -2px);\n      transform: translate(-2px, -2px);\n    }\n    60% {\n      -webkit-transform: translate(2px, 2px);\n      transform: translate(2px, 2px);\n    }\n    80% {\n      -webkit-transform: translate(2px, -2px);\n      transform: translate(2px, -2px);\n    }\n    100% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n  }\n  @keyframes vibrate-1 {\n    0% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n    20% {\n      -webkit-transform: translate(-2px, 2px);\n      transform: translate(-2px, 2px);\n    }\n    40% {\n      -webkit-transform: translate(-2px, -2px);\n      transform: translate(-2px, -2px);\n    }\n    60% {\n      -webkit-transform: translate(2px, 2px);\n      transform: translate(2px, 2px);\n    }\n    80% {\n      -webkit-transform: translate(2px, -2px);\n      transform: translate(2px, -2px);\n    }\n    100% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:27:38\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation blink-1\n * ----------------------------------------\n */\n  @-webkit-keyframes blink-1 {\n    0%,\n    50%,\n    100% {\n      opacity: 1;\n    }\n    25%,\n    75% {\n      opacity: 0;\n    }\n  }\n  @keyframes blink-1 {\n    0%,\n    50%,\n    100% {\n      opacity: 1;\n    }\n    25%,\n    75% {\n      opacity: 0;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:41:14\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * @animation flicker-in-2\n * ----------------------------------------\n */\n  @-webkit-keyframes flicker-in-2 {\n    0% {\n      opacity: 0;\n    }\n    10% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.1% {\n      opacity: 1;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.2% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n    }\n    20.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.5% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    50% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    100% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n  }\n  @keyframes flicker-in-2 {\n    0% {\n      opacity: 0;\n    }\n    10% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.1% {\n      opacity: 1;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.2% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n    }\n    20.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.5% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    50% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    100% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-24 16:9:5\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bounce-top\n * ----------------------------------------\n */\n  @-webkit-keyframes bounce-top {\n    0% {\n      -webkit-transform: translateY(-45px);\n      transform: translateY(-45px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n      opacity: 1;\n    }\n    24% {\n      opacity: 1;\n    }\n    40% {\n      -webkit-transform: translateY(-24px);\n      transform: translateY(-24px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    65% {\n      -webkit-transform: translateY(-12px);\n      transform: translateY(-12px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    82% {\n      -webkit-transform: translateY(-6px);\n      transform: translateY(-6px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    93% {\n      -webkit-transform: translateY(-4px);\n      transform: translateY(-4px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    25%,\n    55%,\n    75%,\n    87% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    100% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n      opacity: 1;\n    }\n  }\n  @keyframes bounce-top {\n    0% {\n      -webkit-transform: translateY(-45px);\n      transform: translateY(-45px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n      opacity: 1;\n    }\n    24% {\n      opacity: 1;\n    }\n    40% {\n      -webkit-transform: translateY(-24px);\n      transform: translateY(-24px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    65% {\n      -webkit-transform: translateY(-12px);\n      transform: translateY(-12px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    82% {\n      -webkit-transform: translateY(-6px);\n      transform: translateY(-6px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    93% {\n      -webkit-transform: translateY(-4px);\n      transform: translateY(-4px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    25%,\n    55%,\n    75%,\n    87% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    100% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:29:16\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation heartbeat\n * ----------------------------------------\n */\n  @-webkit-keyframes heartbeat {\n    from {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-transform-origin: center center;\n      transform-origin: center center;\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    10% {\n      -webkit-transform: scale(0.91);\n      transform: scale(0.91);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    17% {\n      -webkit-transform: scale(0.98);\n      transform: scale(0.98);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    33% {\n      -webkit-transform: scale(0.87);\n      transform: scale(0.87);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    45% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n  }\n  @keyframes heartbeat {\n    from {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-transform-origin: center center;\n      transform-origin: center center;\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    10% {\n      -webkit-transform: scale(0.91);\n      transform: scale(0.91);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    17% {\n      -webkit-transform: scale(0.98);\n      transform: scale(0.98);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    33% {\n      -webkit-transform: scale(0.87);\n      transform: scale(0.87);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    45% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:30:57\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation kenburns-top\n * ----------------------------------------\n */\n  @-webkit-keyframes kenburns-top {\n    0% {\n      -webkit-transform: scale(1) translateY(0);\n      transform: scale(1) translateY(0);\n      -webkit-transform-origin: 50% 16%;\n      transform-origin: 50% 16%;\n    }\n    100% {\n      -webkit-transform: scale(1.25) translateY(-15px);\n      transform: scale(1.25) translateY(-15px);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n    }\n  }\n  @keyframes kenburns-top {\n    0% {\n      -webkit-transform: scale(1) translateY(0);\n      transform: scale(1) translateY(0);\n      -webkit-transform-origin: 50% 16%;\n      transform-origin: 50% 16%;\n    }\n    100% {\n      -webkit-transform: scale(1.25) translateY(-15px);\n      transform: scale(1.25) translateY(-15px);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:33:12\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-top\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-top {\n    0% {\n      background-position: 50% 100%;\n    }\n    100% {\n      background-position: 50% 0%;\n    }\n  }\n  @keyframes bg-pan-top {\n    0% {\n      background-position: 50% 100%;\n    }\n    100% {\n      background-position: 50% 0%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:34:5\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-right\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-right {\n    0% {\n      background-position: 0% 50%;\n    }\n    100% {\n      background-position: 100% 50%;\n    }\n  }\n  @keyframes bg-pan-right {\n    0% {\n      background-position: 0% 50%;\n    }\n    100% {\n      background-position: 100% 50%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:33:27\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-bottom {\n    0% {\n      background-position: 50% 0%;\n    }\n    100% {\n      background-position: 50% 100%;\n    }\n  }\n  @keyframes bg-pan-bottom {\n    0% {\n      background-position: 50% 0%;\n    }\n    100% {\n      background-position: 50% 100%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:34:26\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-left\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-left {\n    0% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n  @keyframes bg-pan-left {\n    0% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n"], ["\n  * {\n    box-sizing: border-box;\n  }\n\n  .react-grid-layout {\n    position: relative;\n  }\n\n  .react-grid-item {\n    left: 0;\n    position: absolute;\n    top: 0;\n    z-index: 1;\n  }\n\n  .react-grid-item.react-draggable.react-resizable:hover,\n  .react-grid-item-selected {\n    box-shadow: 0 0 0 3px #027aff;\n  }\n\n  .react-grid-item img {\n    pointer-events: none;\n    user-select: none;\n  }\n\n  .react-grid-item.isResizing,\n  .react-grid-item.isResizing .cb-layout-box,\n  .react-grid-item.isResizing .cb-layout-box .cb-divider {\n    visibility: hidden;\n  }\n\n  .react-grid-item.react-draggable.isDragging,\n  .react-grid-item.react-draggable.isDragging .cb-layout-box,\n  .react-grid-item.react-draggable.isDragging .cb-layout-box .cb-divider {\n    visibility: hidden;\n  }\n\n  /* .react-grid-item.react-draggable.isDragging .cb-layout-box .twitter-embed-container {\n    visibility: hidden;\n  } */\n\n  .react-grid-item.isResizing > .react-resizable-handle,\n  .react-grid-item.react-draggable.isDragging > .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .react-grid-item.dropping {\n    visibility: hidden;\n  }\n\n  .react-grid-item.static::after {\n    color: red;\n    content: \"this is static, can't drag\";\n    left: 50%;\n    position: absolute;\n    top: 50%;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-grid-item.placeholder {\n    -moz-user-select: none;\n    -ms-user-select: none;\n    -o-user-select: none;\n    -webkit-user-select: none;\n    user-select: none;\n    z-index: 9999;\n  }\n\n  .react-grid-item > .react-resizable-handle::after {\n    background: rgb(255, 255, 255);\n    border: 3px solid rgb(2, 122, 255);\n    content: '';\n    height: 5px;\n    position: absolute;\n    width: 5px;\n  }\n\n  .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .react-grid-item-selected > .react-resizable-handle {\n    visibility: visible;\n  }\n\n  /* NOTE: Resizable related */\n  .react-resizable {\n    position: relative;\n  }\n\n  .react-resizable-handle {\n    align-items: center;\n    background-origin: content-box;\n    background-repeat: no-repeat;\n    box-sizing: border-box;\n    display: flex;\n    height: 20px;\n    justify-content: center;\n    position: absolute;\n    width: 20px;\n  }\n\n  .react-resizable-handle-sw {\n    bottom: 0;\n    cursor: sw-resize;\n    left: 0;\n    transform: translate(-50%, 50%);\n  }\n\n  .react-resizable-handle-se {\n    bottom: 0;\n    cursor: se-resize;\n    right: 0;\n    transform: translate(50%, 50%);\n  }\n\n  .react-resizable-handle-nw {\n    cursor: nw-resize;\n    left: 0;\n    top: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-ne {\n    cursor: ne-resize;\n    right: 0;\n    top: 0;\n    transform: translate(50%, -50%);\n  }\n\n  .react-resizable-handle-w,\n  .react-resizable-handle-e {\n    cursor: ew-resize;\n    top: 50%;\n  }\n\n  .react-resizable-handle-w {\n    left: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-e {\n    right: 0;\n    transform: translate(50%, -50%);\n  }\n\n  .react-resizable-handle-n,\n  .react-resizable-handle-s {\n    cursor: ns-resize;\n    left: 50%;\n  }\n\n  .react-resizable-handle-n {\n    top: 0;\n    transform: translate(-50%, -50%);\n  }\n\n  .react-resizable-handle-s {\n    bottom: 0;\n    transform: translate(-50%, 50%);\n  }\n\n  .grid-placeholder {\n    position: absolute;\n    z-index: 0;\n  }\n\n  .grid-pattern-rect {\n    fill: #c0bebe14;\n    stroke: #ffffff5f;\n  }\n\n  .react-grid-item.placeholder .cb-layout-box,\n  .react-grid-item.placeholder .cb-layout-box .cb-divider {\n    animation: none;\n  }\n\n  .react-grid-item.placeholder {\n    box-shadow: 0 0 0 3px #027aff;\n  }\n\n  .react-grid-item.placeholder > .react-resizable-handle {\n    visibility: hidden;\n  }\n\n  .grid-guide-line-center {\n    border-color: #ff463aff;\n    border-style: dashed;\n    border-width: 1px;\n    height: 100%;\n    left: 50%;\n    position: absolute;\n    transform: translateX(-50%);\n  }\n\n  /* NOTE: custom \uCD94\uAC00 */\n  .grid-placeholder > svg {\n    min-height: ", ";\n  }\n\n  /* NOTE: Effects */\n\n  @-webkit-keyframes fade-in {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n\n  @keyframes fade-in {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-fwd {\n    0% {\n      -webkit-transform: translateZ(-80px);\n      transform: translateZ(-80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @keyframes fade-in-fwd {\n    0% {\n      -webkit-transform: translateZ(-80px);\n      transform: translateZ(-80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-bck {\n    0% {\n      -webkit-transform: translateZ(80px);\n      transform: translateZ(80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-bck {\n    0% {\n      -webkit-transform: translateZ(80px);\n      transform: translateZ(80px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-top {\n    0% {\n      -webkit-transform: translateY(-50px);\n      transform: translateY(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-top {\n    0% {\n      -webkit-transform: translateY(-50px);\n      transform: translateY(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  @-webkit-keyframes fade-in-right {\n    0% {\n      -webkit-transform: translateX(50px);\n      transform: translateX(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-right {\n    0% {\n      -webkit-transform: translateX(50px);\n      transform: translateX(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:29:36\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation fade-in-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes fade-in-bottom {\n    0% {\n      -webkit-transform: translateY(50px);\n      transform: translateY(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-bottom {\n    0% {\n      -webkit-transform: translateY(50px);\n      transform: translateY(50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:29:52\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation fade-in-left\n * ----------------------------------------\n */\n  @-webkit-keyframes fade-in-left {\n    0% {\n      -webkit-transform: translateX(-50px);\n      transform: translateX(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes fade-in-left {\n    0% {\n      -webkit-transform: translateX(-50px);\n      transform: translateX(-50px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:53:50\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-top\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-top {\n    0% {\n      -webkit-transform: translateY(-1000px);\n      transform: translateY(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-top {\n    0% {\n      -webkit-transform: translateY(-1000px);\n      transform: translateY(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:47\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-right\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-right {\n    0% {\n      -webkit-transform: translateX(1000px);\n      transform: translateX(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-right {\n    0% {\n      -webkit-transform: translateX(1000px);\n      transform: translateX(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:1\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-bottom {\n    0% {\n      -webkit-transform: translateY(1000px);\n      transform: translateY(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-bottom {\n    0% {\n      -webkit-transform: translateY(1000px);\n      transform: translateY(1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:54:28\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-left\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-left {\n    0% {\n      -webkit-transform: translateX(-1000px);\n      transform: translateX(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-left {\n    0% {\n      -webkit-transform: translateX(-1000px);\n      transform: translateX(-1000px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:52:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation tracking-in-contract\n * ----------------------------------------\n */\n  @-webkit-keyframes tracking-in-contract {\n    0% {\n      letter-spacing: 1em;\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      letter-spacing: normal;\n      opacity: 1;\n    }\n  }\n  @keyframes tracking-in-contract {\n    0% {\n      letter-spacing: 1em;\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      letter-spacing: normal;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:47:57\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation rotate-in-2-cw\n * ----------------------------------------\n */\n  @-webkit-keyframes rotate-in-2-cw {\n    0% {\n      -webkit-transform: rotate(-45deg);\n      transform: rotate(-45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n  @keyframes rotate-in-2-cw {\n    0% {\n      -webkit-transform: rotate(-45deg);\n      transform: rotate(-45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:52:54\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation rotate-in-2-ccw\n * ----------------------------------------\n */\n  @-webkit-keyframes rotate-in-2-ccw {\n    0% {\n      -webkit-transform: rotate(45deg);\n      transform: rotate(45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n  @keyframes rotate-in-2-ccw {\n    0% {\n      -webkit-transform: rotate(45deg);\n      transform: rotate(45deg);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotate(0);\n      transform: rotate(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:34:56\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-top-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-top-fwd {\n    0% {\n      -webkit-transform: rotateX(-100deg);\n      transform: rotateX(-100deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-top-fwd {\n    0% {\n      -webkit-transform: rotateX(-100deg);\n      transform: rotateX(-100deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:35:56\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-top-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-top-bck {\n    0% {\n      -webkit-transform: rotateX(70deg);\n      transform: rotateX(70deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-top-bck {\n    0% {\n      -webkit-transform: rotateX(70deg);\n      transform: rotateX(70deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0deg);\n      transform: rotateX(0deg);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:36:18\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-right-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-right-fwd {\n    0% {\n      -webkit-transform: rotateY(-100deg);\n      transform: rotateY(-100deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-right-fwd {\n    0% {\n      -webkit-transform: rotateY(-100deg);\n      transform: rotateY(-100deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:36:46\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-right-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-right-bck {\n    0% {\n      -webkit-transform: rotateY(70deg);\n      transform: rotateY(70deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-right-bck {\n    0% {\n      -webkit-transform: rotateY(70deg);\n      transform: rotateY(70deg);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: right;\n      transform-origin: right;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:37:11\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-bottom-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-bottom-fwd {\n    0% {\n      -webkit-transform: rotateX(100deg);\n      transform: rotateX(100deg);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0);\n      transform: rotateX(0);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 1;\n    }\n  }\n\n  @keyframes swing-in-bottom-fwd {\n    0% {\n      -webkit-transform: rotateX(100deg);\n      transform: rotateX(100deg);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateX(0);\n      transform: rotateX(0);\n      -webkit-transform-origin: bottom;\n      transform-origin: bottom;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:38:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-left-fwd\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-left-fwd {\n    0% {\n      -webkit-transform: rotateY(100deg);\n      transform: rotateY(100deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-left-fwd {\n    0% {\n      -webkit-transform: rotateY(100deg);\n      transform: rotateY(100deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:40:3\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation swing-in-left-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes swing-in-left-bck {\n    0% {\n      -webkit-transform: rotateY(-70deg);\n      transform: rotateY(-70deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n  @keyframes swing-in-left-bck {\n    0% {\n      -webkit-transform: rotateY(-70deg);\n      transform: rotateY(-70deg);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: rotateY(0);\n      transform: rotateY(0);\n      -webkit-transform-origin: left;\n      transform-origin: left;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:44:48\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation scale-in-center\n * ----------------------------------------\n */\n  @-webkit-keyframes scale-in-center {\n    0% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n      opacity: 1;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      opacity: 1;\n    }\n  }\n  @keyframes scale-in-center {\n    0% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n      opacity: 1;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:46:1\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation slide-in-bck-center\n * ----------------------------------------\n */\n  @-webkit-keyframes slide-in-bck-center {\n    0% {\n      -webkit-transform: translateZ(600px);\n      transform: translateZ(600px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes slide-in-bck-center {\n    0% {\n      -webkit-transform: translateZ(600px);\n      transform: translateZ(600px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:13:59\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation tracking-in-contract-bck\n * ----------------------------------------\n */\n  @-webkit-keyframes tracking-in-contract-bck {\n    0% {\n      letter-spacing: 1em;\n      -webkit-transform: translateZ(400px);\n      transform: translateZ(400px);\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n  @keyframes tracking-in-contract-bck {\n    0% {\n      letter-spacing: 1em;\n      -webkit-transform: translateZ(400px);\n      transform: translateZ(400px);\n      opacity: 0;\n    }\n    40% {\n      opacity: 0.6;\n    }\n    100% {\n      -webkit-transform: translateZ(0);\n      transform: translateZ(0);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:11:16\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation text-focus-in\n * ----------------------------------------\n */\n  @-webkit-keyframes text-focus-in {\n    0% {\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes text-focus-in {\n    0% {\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:33:10\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation puff-in-center\n * ----------------------------------------\n */\n  @-webkit-keyframes puff-in-center {\n    0% {\n      -webkit-transform: scale(2);\n      transform: scale(2);\n      -webkit-filter: blur(4px);\n      filter: blur(4px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes puff-in-center {\n    0% {\n      -webkit-transform: scale(2);\n      transform: scale(2);\n      -webkit-filter: blur(4px);\n      filter: blur(4px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:11:29\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation focus-in-contract\n * ----------------------------------------\n */\n  @-webkit-keyframes focus-in-contract {\n    0% {\n      letter-spacing: 1em;\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n  @keyframes focus-in-contract {\n    0% {\n      letter-spacing: 1em;\n      -webkit-filter: blur(12px);\n      filter: blur(12px);\n      opacity: 0;\n    }\n    100% {\n      -webkit-filter: blur(0px);\n      filter: blur(0px);\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:22:44\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-horizontal\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-horizontal {\n    0%,\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateX(-10px);\n      transform: translateX(-10px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateX(10px);\n      transform: translateX(10px);\n    }\n    80% {\n      -webkit-transform: translateX(8px);\n      transform: translateX(8px);\n    }\n    90% {\n      -webkit-transform: translateX(-8px);\n      transform: translateX(-8px);\n    }\n  }\n  @keyframes shake-horizontal {\n    0%,\n    100% {\n      -webkit-transform: translateX(0);\n      transform: translateX(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateX(-10px);\n      transform: translateX(-10px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateX(10px);\n      transform: translateX(10px);\n    }\n    80% {\n      -webkit-transform: translateX(8px);\n      transform: translateX(8px);\n    }\n    90% {\n      -webkit-transform: translateX(-8px);\n      transform: translateX(-8px);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:23:8\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-vertical\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-vertical {\n    0%,\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateY(-8px);\n      transform: translateY(-8px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateY(8px);\n      transform: translateY(8px);\n    }\n    80% {\n      -webkit-transform: translateY(6.4px);\n      transform: translateY(6.4px);\n    }\n    90% {\n      -webkit-transform: translateY(-6.4px);\n      transform: translateY(-6.4px);\n    }\n  }\n  @keyframes shake-vertical {\n    0%,\n    100% {\n      -webkit-transform: translateY(0);\n      transform: translateY(0);\n    }\n    10%,\n    30%,\n    50%,\n    70% {\n      -webkit-transform: translateY(-8px);\n      transform: translateY(-8px);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: translateY(8px);\n      transform: translateY(8px);\n    }\n    80% {\n      -webkit-transform: translateY(6.4px);\n      transform: translateY(6.4px);\n    }\n    90% {\n      -webkit-transform: translateY(-6.4px);\n      transform: translateY(-6.4px);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:24:19\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation shake-top\n * ----------------------------------------\n */\n  @-webkit-keyframes shake-top {\n    0%,\n    100% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n      -webkit-transform-origin: 50% 0;\n      transform-origin: 50% 0;\n    }\n    10% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: rotate(-4deg);\n      transform: rotate(-4deg);\n    }\n    30%,\n    50%,\n    70% {\n      -webkit-transform: rotate(4deg);\n      transform: rotate(4deg);\n    }\n    80% {\n      -webkit-transform: rotate(-2deg);\n      transform: rotate(-2deg);\n    }\n    90% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n  }\n  @keyframes shake-top {\n    0%,\n    100% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n      -webkit-transform-origin: 50% 0;\n      transform-origin: 50% 0;\n    }\n    10% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n    20%,\n    40%,\n    60% {\n      -webkit-transform: rotate(-4deg);\n      transform: rotate(-4deg);\n    }\n    30%,\n    50%,\n    70% {\n      -webkit-transform: rotate(4deg);\n      transform: rotate(4deg);\n    }\n    80% {\n      -webkit-transform: rotate(-2deg);\n      transform: rotate(-2deg);\n    }\n    90% {\n      -webkit-transform: rotate(2deg);\n      transform: rotate(2deg);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:21:6\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation vibrate-1\n * ----------------------------------------\n */\n  @-webkit-keyframes vibrate-1 {\n    0% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n    20% {\n      -webkit-transform: translate(-2px, 2px);\n      transform: translate(-2px, 2px);\n    }\n    40% {\n      -webkit-transform: translate(-2px, -2px);\n      transform: translate(-2px, -2px);\n    }\n    60% {\n      -webkit-transform: translate(2px, 2px);\n      transform: translate(2px, 2px);\n    }\n    80% {\n      -webkit-transform: translate(2px, -2px);\n      transform: translate(2px, -2px);\n    }\n    100% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n  }\n  @keyframes vibrate-1 {\n    0% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n    20% {\n      -webkit-transform: translate(-2px, 2px);\n      transform: translate(-2px, 2px);\n    }\n    40% {\n      -webkit-transform: translate(-2px, -2px);\n      transform: translate(-2px, -2px);\n    }\n    60% {\n      -webkit-transform: translate(2px, 2px);\n      transform: translate(2px, 2px);\n    }\n    80% {\n      -webkit-transform: translate(2px, -2px);\n      transform: translate(2px, -2px);\n    }\n    100% {\n      -webkit-transform: translate(0);\n      transform: translate(0);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:27:38\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation blink-1\n * ----------------------------------------\n */\n  @-webkit-keyframes blink-1 {\n    0%,\n    50%,\n    100% {\n      opacity: 1;\n    }\n    25%,\n    75% {\n      opacity: 0;\n    }\n  }\n  @keyframes blink-1 {\n    0%,\n    50%,\n    100% {\n      opacity: 1;\n    }\n    25%,\n    75% {\n      opacity: 0;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 0:41:14\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * @animation flicker-in-2\n * ----------------------------------------\n */\n  @-webkit-keyframes flicker-in-2 {\n    0% {\n      opacity: 0;\n    }\n    10% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.1% {\n      opacity: 1;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.2% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n    }\n    20.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.5% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    50% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    100% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n  }\n  @keyframes flicker-in-2 {\n    0% {\n      opacity: 0;\n    }\n    10% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.1% {\n      opacity: 1;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    10.2% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    20.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);\n    }\n    20.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    30.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.5% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    30.6% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    45.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    50% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);\n    }\n    55.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    57.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3);\n    }\n    60.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    65.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.3),\n        0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    75.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    77.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.4),\n        0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    85.1% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86% {\n      opacity: 0;\n      -webkit-box-shadow: none;\n      box-shadow: none;\n    }\n    86.1% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n    100% {\n      opacity: 1;\n      -webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n      box-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45),\n        0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-24 16:9:5\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bounce-top\n * ----------------------------------------\n */\n  @-webkit-keyframes bounce-top {\n    0% {\n      -webkit-transform: translateY(-45px);\n      transform: translateY(-45px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n      opacity: 1;\n    }\n    24% {\n      opacity: 1;\n    }\n    40% {\n      -webkit-transform: translateY(-24px);\n      transform: translateY(-24px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    65% {\n      -webkit-transform: translateY(-12px);\n      transform: translateY(-12px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    82% {\n      -webkit-transform: translateY(-6px);\n      transform: translateY(-6px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    93% {\n      -webkit-transform: translateY(-4px);\n      transform: translateY(-4px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    25%,\n    55%,\n    75%,\n    87% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    100% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n      opacity: 1;\n    }\n  }\n  @keyframes bounce-top {\n    0% {\n      -webkit-transform: translateY(-45px);\n      transform: translateY(-45px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n      opacity: 1;\n    }\n    24% {\n      opacity: 1;\n    }\n    40% {\n      -webkit-transform: translateY(-24px);\n      transform: translateY(-24px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    65% {\n      -webkit-transform: translateY(-12px);\n      transform: translateY(-12px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    82% {\n      -webkit-transform: translateY(-6px);\n      transform: translateY(-6px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    93% {\n      -webkit-transform: translateY(-4px);\n      transform: translateY(-4px);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    25%,\n    55%,\n    75%,\n    87% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    100% {\n      -webkit-transform: translateY(0px);\n      transform: translateY(0px);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n      opacity: 1;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:29:16\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation heartbeat\n * ----------------------------------------\n */\n  @-webkit-keyframes heartbeat {\n    from {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-transform-origin: center center;\n      transform-origin: center center;\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    10% {\n      -webkit-transform: scale(0.91);\n      transform: scale(0.91);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    17% {\n      -webkit-transform: scale(0.98);\n      transform: scale(0.98);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    33% {\n      -webkit-transform: scale(0.87);\n      transform: scale(0.87);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    45% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n  }\n  @keyframes heartbeat {\n    from {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-transform-origin: center center;\n      transform-origin: center center;\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    10% {\n      -webkit-transform: scale(0.91);\n      transform: scale(0.91);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    17% {\n      -webkit-transform: scale(0.98);\n      transform: scale(0.98);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n    33% {\n      -webkit-transform: scale(0.87);\n      transform: scale(0.87);\n      -webkit-animation-timing-function: ease-in;\n      animation-timing-function: ease-in;\n    }\n    45% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n      -webkit-animation-timing-function: ease-out;\n      animation-timing-function: ease-out;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:30:57\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation kenburns-top\n * ----------------------------------------\n */\n  @-webkit-keyframes kenburns-top {\n    0% {\n      -webkit-transform: scale(1) translateY(0);\n      transform: scale(1) translateY(0);\n      -webkit-transform-origin: 50% 16%;\n      transform-origin: 50% 16%;\n    }\n    100% {\n      -webkit-transform: scale(1.25) translateY(-15px);\n      transform: scale(1.25) translateY(-15px);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n    }\n  }\n  @keyframes kenburns-top {\n    0% {\n      -webkit-transform: scale(1) translateY(0);\n      transform: scale(1) translateY(0);\n      -webkit-transform-origin: 50% 16%;\n      transform-origin: 50% 16%;\n    }\n    100% {\n      -webkit-transform: scale(1.25) translateY(-15px);\n      transform: scale(1.25) translateY(-15px);\n      -webkit-transform-origin: top;\n      transform-origin: top;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:33:12\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-top\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-top {\n    0% {\n      background-position: 50% 100%;\n    }\n    100% {\n      background-position: 50% 0%;\n    }\n  }\n  @keyframes bg-pan-top {\n    0% {\n      background-position: 50% 100%;\n    }\n    100% {\n      background-position: 50% 0%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:34:5\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-right\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-right {\n    0% {\n      background-position: 0% 50%;\n    }\n    100% {\n      background-position: 100% 50%;\n    }\n  }\n  @keyframes bg-pan-right {\n    0% {\n      background-position: 0% 50%;\n    }\n    100% {\n      background-position: 100% 50%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:33:27\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-bottom\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-bottom {\n    0% {\n      background-position: 50% 0%;\n    }\n    100% {\n      background-position: 50% 100%;\n    }\n  }\n  @keyframes bg-pan-bottom {\n    0% {\n      background-position: 50% 0%;\n    }\n    100% {\n      background-position: 50% 100%;\n    }\n  }\n\n  /* ----------------------------------------------\n * Generated by Animista on 2023-7-4 1:34:26\n * Licensed under FreeBSD License.\n * See http://animista.net/license for more info. \n * w: http://animista.net, t: @cssanimista\n * ---------------------------------------------- */\n\n  /**\n * ----------------------------------------\n * animation bg-pan-left\n * ----------------------------------------\n */\n  @-webkit-keyframes bg-pan-left {\n    0% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n  @keyframes bg-pan-left {\n    0% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n"])), function (_a) {
     var customHeight = _a.customHeight;

package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/textUtil.js

@@ -15,7 +15,7 @@ exports.getTextCSSPropKey = exports.parseStyleTextToCSSProp = void 0;
 function parseStyleTextToCSSProp(_a) {
     var availableSpecCodes = _a.availableSpecCodes, props = _a.props, propKey = _a.propKey, device = _a.device;
     return availableSpecCodes.reduce(function (acc, currentKey) {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         var stringifiedKey = currentKey.toString();
         var keyWithDevice = device === 'DESKTOP' ? currentKey : stringifiedKey + ":MOBILE" || currentKey;
         var keyWithHover = keyWithDevice.toString() + ":HOVER";
@@ -36,9 +36,23 @@ function parseStyleTextToCSSProp(_a) {
                 hoverStyle: __assign(__assign({}, acc.hoverStyle), (_d = {}, _d[cssPropertyKey] = getFontName(String(hoverValue)), _d))
             };
         }
+        if (cssPropertyKey === 'letterSpacing') {
+            var numValue = (Math.abs(+value) - 100) * (+value > 0 ? 0.01 : -0.01) + "em";
+            var numHoverValue = (Math.abs(+hoverValue) - 100) * (+hoverValue > 0 ? 0.01 : -0.01) + "em";
+            return {
+                style: __assign(__assign({}, acc.style), (_e = {}, _e[cssPropertyKey] = numValue, _e)),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_f = {}, _f[cssPropertyKey] = numHoverValue, _f))
+            };
+        }
+        if (cssPropertyKey === 'fontSize') {
+            return {
+                style: __assign(__assign({}, acc.style), (_g = {}, _g[cssPropertyKey] = value + "px", _g)),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_h = {}, _h[cssPropertyKey] = hoverValue + "px", _h))
+            };
+        }
         return {
-            style: __assign(__assign({}, acc.style), (_e = {}, _e[cssPropertyKey] = value, _e)),
-            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_f = {}, _f[cssPropertyKey] = hoverValue, _f))
+            style: __assign(__assign({}, acc.style), (_j = {}, _j[cssPropertyKey] = value, _j)),
+            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_k = {}, _k[cssPropertyKey] = hoverValue, _k))
         };
     }, {
         style: {},

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBorder.d.ts

@@ -21,19 +21,19 @@ export declare type CB_STYLE_PROP_BORDER_SPECS_BASE = {
 };
 export declare type CB_STYLE_PROP_BORDER_SPECS = CB_STYLE_PROP_BORDER_SPECS_BASE & {
     'CB_STYLE_PROP_BORDER_SPEC_STYLE:HOVER': CB_STYLE_PROP_BORDER_SPEC_STYLE;
-    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE': CB_STYLE_PROP_BORDER_SPEC_STYLE | undefined;
-    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE:HOVER': CB_STYLE_PROP_BORDER_SPEC_STYLE | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE': CB_STYLE_PROP_BORDER_SPEC_STYLE | null | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE:HOVER': CB_STYLE_PROP_BORDER_SPEC_STYLE | null | undefined;
     'CB_STYLE_PROP_BORDER_SPEC_WIDTH:HOVER': NUMBER_INTEGER;
-    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE': NUMBER_INTEGER | undefined;
-    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE:HOVER': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
     'CB_STYLE_PROP_BORDER_SPEC_COLOR:HOVER': STRING_8DIGIT_HEX;
-    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE': STRING_8DIGIT_HEX | undefined;
-    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE': STRING_8DIGIT_HEX | null | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | null | undefined;
     'CB_STYLE_PROP_BORDER_SPEC_RADIUS:HOVER': CB_STYLE_PROP_BORDER_SPEC_RADIUS_OBJ;
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE': CB_STYLE_PROP_BORDER_SPEC_RADIUS_OBJ | undefined;
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE:HOVER': CB_STYLE_PROP_BORDER_SPEC_RADIUS_OBJ | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE': CB_STYLE_PROP_BORDER_SPEC_RADIUS_OBJ | null | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE:HOVER': CB_STYLE_PROP_BORDER_SPEC_RADIUS_OBJ | null | undefined;
     'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:HOVER': boolean;
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE': boolean | undefined;
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE:HOVER': boolean | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE': boolean | null | undefined;
+    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE:HOVER': boolean | null | undefined;
 };
 export {};

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBorder.js

@@ -29,10 +29,10 @@ function parseStylePropBorder(namedProps, device) {
         var isRadius = cssPropertyKey === 'borderRadius';
         if (isRadius) {
             var _c = value, tl = _c.tl, tr = _c.tr, bl = _c.bl, br = _c.br;
-            var _d = hoverValue, hoverTl = _d.tl, hoverTr = _d.tr, hoverBl = _d.bl, hoverBr = _d.br;
+            var hoverValueTypeExpanded = hoverValue;
             return {
                 style: __assign(__assign({}, acc.style), { borderTopLeftRadius: tl, borderTopRightRadius: tr, borderBottomLeftRadius: bl, borderBottomRightRadius: br }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { borderTopLeftRadius: hoverTl, borderTopRightRadius: hoverTr, borderBottomLeftRadius: hoverBl, borderBottomRightRadius: hoverBr })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { borderTopLeftRadius: hoverValueTypeExpanded ? hoverValueTypeExpanded.tl : 0, borderTopRightRadius: hoverValueTypeExpanded ? hoverValueTypeExpanded.tr : 0, borderBottomLeftRadius: hoverValueTypeExpanded ? hoverValueTypeExpanded.bl : 0, borderBottomRightRadius: hoverValueTypeExpanded ? hoverValueTypeExpanded.br : 0 })
             };
         }
         return {

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropOpacity.js

@@ -20,8 +20,8 @@ function parseStylePropOpacity(namedProps, device) {
         var value = specs[baseKey];
         var hoverValue = specs[baseKey + ":HOVER"];
         return {
-            style: __assign(__assign({}, acc.style), (_a = {}, _a[cssPropertyKey] = value, _a)),
-            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_b = {}, _b[cssPropertyKey] = hoverValue, _b))
+            style: __assign(__assign({}, acc.style), (_a = {}, _a[cssPropertyKey] = (value || 0) / 100, _a)),
+            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_b = {}, _b[cssPropertyKey] = (hoverValue || 0) / 100, _b))
         };
     }, {
         style: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "0.2.13",
+  "version": "0.2.15",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md

@@ -1,6 +1,8 @@
 # pds-dev-kit-web-test Release Notes
-## [v0.2.13]
-## 기준 pds-dev-kit-web 버전 @2.0.14
+## [v0.2.15]
+## 기준 pds-dev-kit-web 버전 @2.0.15
 ### sub
 * DynamicLayout - custom section
-    * jsonProperties 관련 내용 수정
+    * 스타일 스펙 보더의 호버값이 null 일 때의 이슈 해결
+    * 커스텀 섹션/ 컴포넌트에 Error boundary 추가
+

package/webhook/node_modules/esrecurse/.babelrc

@@ -1,3 +0,0 @@
-{
-    "presets": ["es2015"]
-}