pds-dev-kit-web-test 0.3.1 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/src/common/assets/icons/line/Chapter.d.ts +4 -0
  2. package/dist/src/common/assets/icons/line/Chapter.js +30 -0
  3. package/dist/src/common/assets/icons/line/index.d.ts +1 -0
  4. package/dist/src/common/assets/icons/line/index.js +2 -0
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js +1 -3
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js +2 -4
  7. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js +2 -7
  8. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js +2 -4
  9. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js +2 -4
  10. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js +2 -4
  11. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js +2 -7
  12. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js +2 -4
  13. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.d.ts +6 -0
  14. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.js +27 -0
  15. package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useIntersectionObserver.js +1 -4
  16. package/package.json +1 -1
  17. package/release-note.md +4 -3
  18. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/ComponentBlockCommonWrapper.d.ts +0 -3
  19. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/ComponentBlockCommonWrapper.js +0 -8
  20. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/AnimationObserverBox.d.ts +0 -8
  21. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/AnimationObserverBox.js +0 -34
package/dist/src/common/assets/icons/line/Chapter.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import type IconType from '../IconType';
3
+ declare const Chapter: ({ color, size, ...rest }: IconType) => JSX.Element;
4
+ export default Chapter;
package/dist/src/common/assets/icons/line/Chapter.js ADDED
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __rest = (this && this.__rest) || function (s, e) {
14
+ var t = {};
15
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
+ t[p] = s[p];
17
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
+ t[p[i]] = s[p[i]];
21
+ }
22
+ return t;
23
+ };
24
+ Object.defineProperty(exports, "__esModule", { value: true });
25
+ var jsx_runtime_1 = require("react/jsx-runtime");
26
+ var Chapter = function (_a) {
27
+ var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
28
+ return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsxs)("g", __assign({ fill: "none", fillRule: "evenodd" }, { children: [(0, jsx_runtime_1.jsx)("path", { fill: color, d: "M5.6613,11.4557 L5.6613,9.2747 C5.6613,8.6267 6.3613,8.2227 6.9223,8.5467 L8.8113,9.6367 L10.7003,10.7277 C11.2613,11.0517 11.2613,11.8597 10.7003,12.1837 L8.8113,13.2747 L6.9223,14.3647 C6.3613,14.6887 5.6613,14.2847 5.6613,13.6367 L5.6613,11.4557 Z" }), (0, jsx_runtime_1.jsx)("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M11.6363,5.9619 C9.6583,4.1809 5.8493,3.5079 3.4303,4.4109 C2.8643,4.6219 2.3983,5.2749 2.3983,5.8789 L2.3993,18.1849 C2.3993,18.7149 2.9373,19.0399 3.4293,18.8419 C5.9343,17.8349 9.7133,18.3309 11.6713,19.8739 C11.8653,20.0269 12.1213,20.0269 12.3163,19.8729 C14.3223,18.2839 18.0623,17.8379 20.5753,18.8439 C21.0653,19.0399 21.6013,18.7129 21.6013,18.1849 L21.6013,5.8789 C21.6013,5.2749 21.1363,4.6219 20.5703,4.4109 C18.1513,3.5079 14.3423,4.1809 12.3643,5.9619 C12.1523,6.1529 11.8483,6.1529 11.6363,5.9619 Z M14.1962,8.9646 L18.2602,8.9646 M14.1962,11.765 L18.2602,11.765 M14.1962,14.5653 L18.2602,14.5653" })] })) })));
29
+ };
30
+ exports.default = Chapter;
package/dist/src/common/assets/icons/line/index.d.ts CHANGED
@@ -43,6 +43,7 @@ declare const lineIcons: {
43
43
  readonly ic_cart: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
44
44
  readonly ic_channel: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
45
45
  readonly ic_channel_setting: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
46
+ readonly ic_chapter: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
46
47
  readonly ic_chat: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
47
48
  readonly ic_chat_counseling: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
48
49
  readonly ic_chat_crm: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
package/dist/src/common/assets/icons/line/index.js CHANGED
@@ -46,6 +46,7 @@ var Carousel_1 = __importDefault(require("./Carousel"));
46
46
  var Cart_1 = __importDefault(require("./Cart"));
47
47
  var Channel_1 = __importDefault(require("./Channel"));
48
48
  var ChannelSetting_1 = __importDefault(require("./ChannelSetting"));
49
+ var Chapter_1 = __importDefault(require("./Chapter"));
49
50
  var Chat_1 = __importDefault(require("./Chat"));
50
51
  var ChatCounseling_1 = __importDefault(require("./ChatCounseling"));
51
52
  var ChatCrm_1 = __importDefault(require("./ChatCrm"));
@@ -310,6 +311,7 @@ var lineIcons = {
310
311
  ic_cart: Cart_1.default,
311
312
  ic_channel: Channel_1.default,
312
313
  ic_channel_setting: ChannelSetting_1.default,
314
+ ic_chapter: Chapter_1.default,
313
315
  ic_chat: Chat_1.default,
314
316
  ic_chat_counseling: ChatCounseling_1.default,
315
317
  ic_chat_crm: ChatCrm_1.default,
package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js CHANGED
@@ -42,7 +42,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
42
42
  };
43
43
  Object.defineProperty(exports, "__esModule", { value: true });
44
44
  var jsx_runtime_1 = require("react/jsx-runtime");
45
- /* eslint-disable no-console */
46
45
  /* eslint-disable react/destructuring-assignment */
47
46
  var publ_echo_1 = require("publ-echo");
48
47
  var react_1 = __importStar(require("react"));
@@ -76,7 +75,6 @@ function CustomSection(props) {
76
75
  sm: sm
77
76
  };
78
77
  }), layouts = _f[0], setLayouts = _f[1];
79
- console.log(layouts);
80
78
  (0, react_1.useEffect)(function () {
81
79
  var _a = (0, util_1.parsePlacement)(componentBlocks !== null && componentBlocks !== void 0 ? componentBlocks : []), lg = _a.lg, sm = _a.sm;
82
80
  setLayouts({ lg: lg, sm: sm });
@@ -219,7 +217,7 @@ function CustomSection(props) {
219
217
  onContextMenuCB(each.id, e);
220
218
  } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { cbProps: each, device: device }) }) })) }), each.id)); })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})) })) })) })) }) }));
221
219
  }
222
- 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 z-index: 1;\n }\n\n .react-grid-layout .grid-placeholder {\n box-sizing: border-box;\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: #0000001a;\n stroke: #ffffff33;\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 z-index: 99999;\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 z-index: 1;\n }\n\n .react-grid-layout .grid-placeholder {\n box-sizing: border-box;\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: #0000001a;\n stroke: #ffffff33;\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 z-index: 99999;\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"])));
220
+ 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 z-index: 1;\n }\n\n .react-grid-layout .grid-placeholder {\n box-sizing: border-box;\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-selected {\n z-index: 9999 !important;\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: #0000001a;\n stroke: #ffffff33;\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 z-index: 99999;\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 z-index: 1;\n }\n\n .react-grid-layout .grid-placeholder {\n box-sizing: border-box;\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-selected {\n z-index: 9999 !important;\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: #0000001a;\n stroke: #ffffff33;\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 z-index: 99999;\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"])));
223
221
  var S_SectionWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
224
222
  exports.default = react_1.default.memo(CustomSection);
225
223
  var templateObject_1, templateObject_2;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js CHANGED
@@ -26,7 +26,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
26
26
  };
27
27
  Object.defineProperty(exports, "__esModule", { value: true });
28
28
  var jsx_runtime_1 = require("react/jsx-runtime");
29
- /* eslint-disable no-console */
30
29
  /* eslint-disable react/destructuring-assignment */
31
30
  var react_1 = require("react");
32
31
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
@@ -35,7 +34,7 @@ var useGoogleFonts_1 = require("../../../../../../../DynamicLayout/sections/Cust
35
34
  var newUtils_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils");
36
35
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
37
36
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
38
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
37
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
39
38
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
40
39
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
41
40
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
@@ -66,8 +65,7 @@ function Button(props) {
66
65
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
67
66
  var hasEffect = !isNoneEffectType;
68
67
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
69
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
70
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle, style: {
68
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle, style: {
71
69
  paddingLeft: paddingLeft,
72
70
  paddingRight: paddingRight,
73
71
  paddingBottom: paddingBottom,
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js CHANGED
@@ -37,18 +37,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
37
37
  __setModuleDefault(result, mod);
38
38
  return result;
39
39
  };
40
- var __importDefault = (this && this.__importDefault) || function (mod) {
41
- return (mod && mod.__esModule) ? mod : { "default": mod };
42
- };
43
40
  Object.defineProperty(exports, "__esModule", { value: true });
44
41
  var jsx_runtime_1 = require("react/jsx-runtime");
45
- /* eslint-disable no-console */
46
42
  var react_1 = require("react");
47
43
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
48
44
  var styled_components_1 = __importStar(require("styled-components"));
49
45
  var hooks_1 = require("../../../../hooks");
50
46
  var util_1 = require("../../../../util");
51
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
47
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
52
48
  var S_CB_Box_1 = require("../components/S_CB_Box");
53
49
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
54
50
  function Divider(props) {
@@ -68,8 +64,7 @@ function Divider(props) {
68
64
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
69
65
  var hasEffect = !isNoneEffectType;
70
66
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
71
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
72
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {} }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign({}, propsHoverStyle) }) })) }))] }));
67
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {} }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign({}, propsHoverStyle) }) })) }))] }));
73
68
  }
74
69
  var S_DIVIDER = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
75
70
  var normalStyle = _a.normalStyle;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js CHANGED
@@ -42,13 +42,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
42
42
  };
43
43
  Object.defineProperty(exports, "__esModule", { value: true });
44
44
  var jsx_runtime_1 = require("react/jsx-runtime");
45
- /* eslint-disable no-console */
46
45
  var react_1 = require("react");
47
46
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
48
47
  var styled_components_1 = __importStar(require("styled-components"));
49
48
  var hooks_1 = require("../../../../hooks");
50
49
  var util_1 = require("../../../../util");
51
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
50
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
52
51
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
53
52
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
54
53
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
@@ -73,8 +72,7 @@ function Image(props) {
73
72
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
74
73
  var hasEffect = !isNoneEffectType;
75
74
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
76
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
77
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_ImageWrapper, __assign({ style: __assign({}, effectCssProperties) }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, layout), { overflow: 'hidden' }), boxStyle.normal), { cursor: CLINKCursor }), hoverStyle: __assign({}, boxStyle.hover), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: __assign({}, imgStyle.normal), hoverStyle: __assign({}, imgStyle.hover) }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }) })) })) })) }))] }));
75
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_ImageWrapper, __assign({ style: __assign({}, effectCssProperties) }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, layout), { overflow: 'hidden' }), boxStyle.normal), { cursor: CLINKCursor }), hoverStyle: __assign({}, boxStyle.hover), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: __assign({}, imgStyle.normal), hoverStyle: __assign({}, imgStyle.hover) }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }) })) })) })) }))] }));
78
76
  }
79
77
  function parseImageCBStyle(style, hoverStyle, mode) {
80
78
  var boxStyle = {
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js CHANGED
@@ -19,7 +19,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
19
19
  };
20
20
  Object.defineProperty(exports, "__esModule", { value: true });
21
21
  var jsx_runtime_1 = require("react/jsx-runtime");
22
- /* eslint-disable no-console */
23
22
  /* eslint-disable react/destructuring-assignment */
24
23
  var react_1 = require("react");
25
24
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
@@ -28,7 +27,7 @@ var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection
28
27
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
29
28
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
30
29
  var styled_components_1 = __importDefault(require("styled-components"));
31
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
30
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
32
31
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
33
32
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
34
33
  function RichText(props) {
@@ -49,8 +48,7 @@ function RichText(props) {
49
48
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
50
49
  var hasEffect = !isNoneEffectType;
51
50
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
52
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
53
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }) }) })) }))] }));
51
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }) }) })) }))] }));
54
52
  }
55
53
  function getBGColorStyles(props, device) {
56
54
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js CHANGED
@@ -15,7 +15,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  var jsx_runtime_1 = require("react/jsx-runtime");
18
- /* eslint-disable no-console */
19
18
  /* eslint-disable react/destructuring-assignment */
20
19
  var react_1 = require("react");
21
20
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
@@ -24,7 +23,7 @@ var getGoogleFonts_1 = require("../../../../hooks/useGoogleFonts/getGoogleFonts"
24
23
  var useGoogleFonts_1 = __importDefault(require("../../../../hooks/useGoogleFonts/useGoogleFonts"));
25
24
  var textUtil_1 = require("../../../../newUtils/textUtil");
26
25
  var util_1 = require("../../../../util");
27
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
26
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
28
27
  var S_CB_Box_1 = require("../components/S_CB_Box");
29
28
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
30
29
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
@@ -54,8 +53,7 @@ function Text(props) {
54
53
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
55
54
  var hasEffect = !isNoneEffectType;
56
55
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
57
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
58
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
56
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
59
57
  }
60
58
  function getTextStyles(props, device) {
61
59
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js CHANGED
@@ -10,18 +10,14 @@ var __assign = (this && this.__assign) || function () {
10
10
  };
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
- var __importDefault = (this && this.__importDefault) || function (mod) {
14
- return (mod && mod.__esModule) ? mod : { "default": mod };
15
- };
16
13
  Object.defineProperty(exports, "__esModule", { value: true });
17
14
  var jsx_runtime_1 = require("react/jsx-runtime");
18
- /* eslint-disable no-console */
19
15
  var react_1 = require("react");
20
16
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
21
17
  var ComponentBlocks_1 = require("../../../../../../../DynamicLayout/components/ComponentBlocks");
22
18
  var hooks_1 = require("../../../../hooks");
23
19
  var util_1 = require("../../../../util");
24
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
20
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
25
21
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
26
22
  function Twitter(props) {
27
23
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -51,7 +47,6 @@ function Twitter(props) {
51
47
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
52
48
  var hasEffect = !isNoneEffectType;
53
49
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
54
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
55
- return ((0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, twitterTimelineKey) })) })));
50
+ return ((0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, twitterTimelineKey) })) })));
56
51
  }
57
52
  exports.default = Twitter;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js CHANGED
@@ -19,14 +19,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
19
19
  };
20
20
  Object.defineProperty(exports, "__esModule", { value: true });
21
21
  var jsx_runtime_1 = require("react/jsx-runtime");
22
- /* eslint-disable no-console */
23
22
  var react_1 = require("react");
24
23
  var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
25
24
  var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/hooks");
26
25
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
27
26
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
28
27
  var styled_components_1 = __importDefault(require("styled-components"));
29
- var AnimationObserverBox_1 = __importDefault(require("../components/AnimationObserverBox"));
28
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
30
29
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
31
30
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
32
31
  var parseYoutubeContentProp_1 = __importDefault(require("./parseYoutubeContentProp"));
@@ -50,8 +49,7 @@ function Youtube(props) {
50
49
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
51
50
  var hasEffect = !isNoneEffectType;
52
51
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
53
- console.log('hasEffect: ', hasEffect, cbRef, isVisible);
54
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(AnimationObserverBox_1.default, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: isEditMode ? ((0, jsx_runtime_1.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc })] })) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" })) })) }))] }));
52
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: isEditMode ? ((0, jsx_runtime_1.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc })] })) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" })) })) }))] }));
55
53
  }
56
54
  function getBGColorStyles(props, device) {
57
55
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ type Props = {
3
+ effectVisibleStyle: React.CSSProperties;
4
+ };
5
+ export declare const S_CB_AnimationObserverBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Props, never>;
6
+ export {};
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.js ADDED
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __assign = (this && this.__assign) || function () {
7
+ __assign = Object.assign || function(t) {
8
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
9
+ s = arguments[i];
10
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
+ t[p] = s[p];
12
+ }
13
+ return t;
14
+ };
15
+ return __assign.apply(this, arguments);
16
+ };
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
20
+ Object.defineProperty(exports, "__esModule", { value: true });
21
+ exports.S_CB_AnimationObserverBox = void 0;
22
+ var styled_components_1 = __importDefault(require("styled-components"));
23
+ exports.S_CB_AnimationObserverBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n\n ", ";\n"], ["\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_a) {
24
+ var effectVisibleStyle = _a.effectVisibleStyle;
25
+ return effectVisibleStyle && __assign({}, effectVisibleStyle);
26
+ });
27
+ var templateObject_1;
package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useIntersectionObserver.js CHANGED
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useIntersectionObserver = void 0;
4
- /* eslint-disable no-console */
5
4
  var react_1 = require("react");
6
5
  function useIntersectionObserver(elementRef, _a) {
7
6
  var _b = _a.threshold, threshold = _b === void 0 ? 0 : _b, _c = _a.root, root = _c === void 0 ? null : _c, _d = _a.rootMargin, rootMargin = _d === void 0 ? '0%' : _d, _e = _a.freezeOnceVisible, freezeOnceVisible = _e === void 0 ? false : _e;
@@ -14,10 +13,8 @@ function useIntersectionObserver(elementRef, _a) {
14
13
  (0, react_1.useEffect)(function () {
15
14
  var node = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current; // DOM Ref
16
15
  var hasIOSupport = !!window.IntersectionObserver;
17
- if (!hasIOSupport || frozen || !node) {
18
- console.log('no node or support', elementRef === null || elementRef === void 0 ? void 0 : elementRef.current);
16
+ if (!hasIOSupport || frozen || !node)
19
17
  return;
20
- }
21
18
  var observerParams = { threshold: threshold, root: root, rootMargin: rootMargin };
22
19
  var observer = new IntersectionObserver(updateEntry, observerParams);
23
20
  observer.observe(node);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "0.3.1",
3
+ "version": "0.3.2",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,6 +1,7 @@
1
1
  # pds-dev-kit-web-test Release Notes
2
- ## [v0.3.1]
3
- ## 기준 pds-dev-kit-web 버전 @2.2.22
2
+ ## [v0.3.2]
3
+ ## 기준 pds-dev-kit-web 버전 @2.2.23
4
4
  ### sub
5
5
  * DynamicLayout
6
- * 애니메이션이 적용된 CB가 항상 잘 보이도록 수정
6
+ * 선택된 CB가 가장 위쪽으로 올라오도록 수정
7
+
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/ComponentBlockCommonWrapper.d.ts DELETED
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- declare function ComponentBlockCommonWrapper(): JSX.Element;
3
- export default ComponentBlockCommonWrapper;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/ComponentBlockCommonWrapper.js DELETED
@@ -1,8 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var jsx_runtime_1 = require("react/jsx-runtime");
4
- require("react");
5
- function ComponentBlockCommonWrapper() {
6
- return (0, jsx_runtime_1.jsx)("div", { children: "ComponentBlockCommonWrapper" });
7
- }
8
- exports.default = ComponentBlockCommonWrapper;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/AnimationObserverBox.d.ts DELETED
@@ -1,8 +0,0 @@
1
- import type React from 'react';
2
- type Props = {
3
- children: any;
4
- effectVisibleStyle: React.CSSProperties;
5
- style?: React.CSSProperties;
6
- };
7
- declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
8
- export default _default;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/AnimationObserverBox.js DELETED
@@ -1,34 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
- var __importDefault = (this && this.__importDefault) || function (mod) {
18
- return (mod && mod.__esModule) ? mod : { "default": mod };
19
- };
20
- Object.defineProperty(exports, "__esModule", { value: true });
21
- var jsx_runtime_1 = require("react/jsx-runtime");
22
- var react_1 = require("react");
23
- var styled_components_1 = __importDefault(require("styled-components"));
24
- function AnimationObserverBox(_a, ref) {
25
- var children = _a.children, effectVisibleStyle = _a.effectVisibleStyle, style = _a.style;
26
- return ((0, jsx_runtime_1.jsx)(S_Wrapper, __assign({ ref: ref, className: "animation-obserber-box" }, { children: (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox, __assign({ style: style, effectVisibleStyle: effectVisibleStyle }, { children: children })) })));
27
- }
28
- var S_Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n"], ["\n height: 100%;\n width: 100%;\n"])));
29
- exports.default = (0, react_1.forwardRef)(AnimationObserverBox);
30
- var S_CB_AnimationObserverBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n\n ", ";\n"], ["\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_a) {
31
- var effectVisibleStyle = _a.effectVisibleStyle;
32
- return effectVisibleStyle && __assign({}, effectVisibleStyle);
33
- });
34
- var templateObject_1, templateObject_2;