pds-dev-kit-web 2.2.24 → 2.2.26

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 (15) hide show
  1. package/dist/src/common/styles/colorSet/UIColor.json +2 -1
  2. package/dist/src/common/styles/colorSet/index.d.ts +3 -2
  3. package/dist/src/common/styles/colorSet/index.js +2 -2
  4. package/dist/src/common/styles/colorSet/ui-type.d.ts +1 -0
  5. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.d.ts +5 -2
  6. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.js +3 -2
  7. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTX.d.ts +21 -0
  8. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTX.js +125 -0
  9. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/index.d.ts +1 -0
  10. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/index.js +3 -1
  11. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.d.ts +5 -2
  12. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.js +10 -6
  13. package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js +1 -1
  14. package/package.json +1 -1
  15. package/release-note.md +3 -9
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -838,5 +838,6 @@
838
838
  "ui_cpnt_textlabel_sys_white_02": "sys_text_white_02",
839
839
  "ui_cpnt_headerbar_base_area_transparent": "sys_container_background_04",
840
840
  "ui_108": "sys_widget_error_01",
841
- "ui_110": "sys_component_base_black_opacity50"
841
+ "ui_110": "sys_component_base_black_opacity50",
842
+ "ui_contentscontainer03_background": "sys_container_background_01"
842
843
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -119,7 +119,7 @@ declare const colorSet: {
119
119
  grey300: string;
120
120
  darkgrey300: string;
121
121
  };
122
- readonly PaletteColor_light: {
122
+ readonly PaletteColor_Dark: {
123
123
  sys_container_background_01: string;
124
124
  sys_container_background_02: string;
125
125
  sys_container_background_03: string;
@@ -466,7 +466,7 @@ declare const colorSet: {
466
466
  sys_text_white_02: string;
467
467
  sys_component_base_45: string;
468
468
  };
469
- readonly PaletteColor_Dark: {
469
+ readonly PaletteColor_light: {
470
470
  sys_container_background_01: string;
471
471
  sys_container_background_02: string;
472
472
  sys_container_background_03: string;
@@ -1654,6 +1654,7 @@ declare const colorSet: {
1654
1654
  ui_cpnt_headerbar_base_area_transparent: string;
1655
1655
  ui_108: string;
1656
1656
  ui_110: string;
1657
+ ui_contentscontainer03_background: string;
1657
1658
  };
1658
1659
  };
1659
1660
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
7
  var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
- var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
8
  var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
+ var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
10
10
  var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
12
  SemanticColor: SemanticColor_json_1.default,
13
- PaletteColor_light: PaletteColor_light_json_1.default,
14
13
  PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
+ PaletteColor_light: PaletteColor_light_json_1.default,
15
15
  UIColor: UIColor_json_1.default
16
16
  };
17
17
  exports.default = colorSet;
package/dist/src/common/styles/colorSet/ui-type.d.ts CHANGED
@@ -839,4 +839,5 @@ export interface UITheme {
839
839
  ui_cpnt_headerbar_base_area_transparent: string;
840
840
  ui_108: string;
841
841
  ui_110: string;
842
+ ui_contentscontainer03_background: string;
842
843
  }
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.d.ts CHANGED
@@ -3,14 +3,17 @@ import type { MutableRefObject } from 'react';
3
3
  export type ContentsContainerProps = {
4
4
  content1?: JSX.Element;
5
5
  content2?: JSX.Element;
6
- layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTK_4' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTM_3' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTP_2' | 'WTQ_1' | 'WTS_1' | 'WTS_2' | 'WTT_1' | 'WTT_2' | 'WTU_1' | 'WTV_1' | 'WTW_1';
6
+ content3?: JSX.Element;
7
+ layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTK_4' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTM_3' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTP_2' | 'WTQ_1' | 'WTS_1' | 'WTS_2' | 'WTT_1' | 'WTT_2' | 'WTU_1' | 'WTV_1' | 'WTW_1' | 'WTX_1';
7
8
  containerColor?: string;
8
9
  areaColor?: string;
9
10
  isLoadingContainer1?: boolean;
10
11
  isLoadingContainer2?: boolean;
12
+ isLoadingContainer3?: boolean;
11
13
  overrideContainer1ColorKey?: UiColors;
12
14
  overrideContainer2ColorKey?: UiColors;
15
+ overrideContainer3ColorKey?: UiColors;
13
16
  container1Ref?: MutableRefObject<HTMLDivElement | null>;
14
17
  };
15
- declare const ContentsContainer: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey, container1Ref }: ContentsContainerProps) => JSX.Element;
18
+ declare const ContentsContainer: ({ content1, content2, content3, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, isLoadingContainer3, overrideContainer1ColorKey, overrideContainer2ColorKey, overrideContainer3ColorKey, container1Ref }: ContentsContainerProps) => JSX.Element;
16
19
  export default ContentsContainer;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  var jsx_runtime_1 = require("react/jsx-runtime");
4
4
  var variation_1 = require("./variation");
5
5
  var ContentsContainer = function (_a) {
6
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey, container1Ref = _a.container1Ref;
6
+ var content1 = _a.content1, content2 = _a.content2, content3 = _a.content3, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, isLoadingContainer3 = _a.isLoadingContainer3, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey, overrideContainer3ColorKey = _a.overrideContainer3ColorKey, container1Ref = _a.container1Ref;
7
7
  return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: {
8
8
  WTA_1: ((0, jsx_runtime_1.jsx)(variation_1.WTA, { layoutType: "WTA_1", content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, overrideContainer1ColorKey: overrideContainer1ColorKey })),
9
9
  WTA_2: ((0, jsx_runtime_1.jsx)(variation_1.WTA, { layoutType: "WTA_2", content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, overrideContainer1ColorKey: overrideContainer1ColorKey })),
@@ -51,7 +51,8 @@ var ContentsContainer = function (_a) {
51
51
  WTT_2: ((0, jsx_runtime_1.jsx)(variation_1.WTT, { layoutType: "WTT_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, container1Ref: container1Ref, isLoadingContainer1: isLoadingContainer1, overrideContainer1ColorKey: overrideContainer1ColorKey })),
52
52
  WTU_1: ((0, jsx_runtime_1.jsx)(variation_1.WTU, { layoutType: "WTU_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
53
53
  WTV_1: ((0, jsx_runtime_1.jsx)(variation_1.WTV, { layoutType: "WTV_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
54
- WTW_1: ((0, jsx_runtime_1.jsx)(variation_1.WTW, { layoutType: "WTW_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey }))
54
+ WTW_1: ((0, jsx_runtime_1.jsx)(variation_1.WTW, { layoutType: "WTW_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
55
+ WTX_1: ((0, jsx_runtime_1.jsx)(variation_1.WTX, { layoutType: "WTX_1", content1: content1, content2: content2, content3: content3, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, isLoadingContainer3: isLoadingContainer3, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey, overrideContainer3ColorKey: overrideContainer3ColorKey }))
55
56
  }[layoutType] }));
56
57
  };
57
58
  exports.default = ContentsContainer;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTX.d.ts ADDED
@@ -0,0 +1,21 @@
1
+ /// <reference types="react" />
2
+ import type { UiColors } from '../../../../../../common';
3
+ export type WTXProps = {
4
+ content1?: JSX.Element;
5
+ content2?: JSX.Element;
6
+ content3?: JSX.Element;
7
+ layoutType?: 'WTX_1';
8
+ containerColor?: string;
9
+ areaColor?: string;
10
+ isLoadingContainer1?: boolean;
11
+ isLoadingContainer2?: boolean;
12
+ isLoadingContainer3?: boolean;
13
+ overrideContainer1ColorKey?: UiColors;
14
+ overrideContainer2ColorKey?: UiColors;
15
+ overrideContainer3ColorKey?: UiColors;
16
+ };
17
+ export type StyleProps = {
18
+ $contentsArea3Width?: number;
19
+ };
20
+ declare const WTX: ({ content1, content2, content3, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, isLoadingContainer3, overrideContainer1ColorKey, overrideContainer2ColorKey, overrideContainer3ColorKey }: WTXProps) => JSX.Element;
21
+ export default WTX;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTX.js ADDED
@@ -0,0 +1,125 @@
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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
+ if (k2 === undefined) k2 = k;
19
+ var desc = Object.getOwnPropertyDescriptor(m, k);
20
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
+ desc = { enumerable: true, get: function() { return m[k]; } };
22
+ }
23
+ Object.defineProperty(o, k2, desc);
24
+ }) : (function(o, m, k, k2) {
25
+ if (k2 === undefined) k2 = k;
26
+ o[k2] = m[k];
27
+ }));
28
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
30
+ }) : function(o, v) {
31
+ o["default"] = v;
32
+ });
33
+ var __importStar = (this && this.__importStar) || function (mod) {
34
+ if (mod && mod.__esModule) return mod;
35
+ var result = {};
36
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
+ __setModuleDefault(result, mod);
38
+ return result;
39
+ };
40
+ Object.defineProperty(exports, "__esModule", { value: true });
41
+ var jsx_runtime_1 = require("react/jsx-runtime");
42
+ var react_1 = require("react");
43
+ var styled_components_1 = __importStar(require("styled-components"));
44
+ var components_1 = require("../../../../../../common/components");
45
+ var WTX = function (_a) {
46
+ var _b, _c;
47
+ var content1 = _a.content1, content2 = _a.content2, content3 = _a.content3, _d = _a.layoutType, layoutType = _d === void 0 ? 'WTX_1' : _d, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, isLoadingContainer3 = _a.isLoadingContainer3, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey, overrideContainer3ColorKey = _a.overrideContainer3ColorKey;
48
+ var contentsArea3Ref = (0, react_1.useRef)(null);
49
+ var _e = (0, react_1.useState)((_c = (_b = contentsArea3Ref.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) !== null && _c !== void 0 ? _c : 480), contentsArea3Width = _e[0], setContentsArea3Width = _e[1];
50
+ var handleResize = function () {
51
+ if (contentsArea3Ref === null || contentsArea3Ref.current === null) {
52
+ return;
53
+ }
54
+ setContentsArea3Width(contentsArea3Ref.current.offsetWidth);
55
+ };
56
+ /**
57
+ @when : 브라우저 화면 사이즈가 변경될 때
58
+ @expected : contentsArea3의 너비를 contentsArea3Width에 저장합니다.
59
+ @clear : 이벤트 등록을 해제합니다.
60
+ */
61
+ (0, react_1.useEffect)(function () {
62
+ window.addEventListener('resize', handleResize);
63
+ return function () {
64
+ window.removeEventListener('resize', handleResize);
65
+ };
66
+ }, []);
67
+ return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey, "$contentsArea3Width": contentsArea3Width }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {}) }))) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey, "$contentsArea3Width": contentsArea3Width }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {}) }))) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType }, { children: content2 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer3, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, containerColor: containerColor, overrideContainer3ColorKey: overrideContainer3ColorKey, "$contentsArea3Width": contentsArea3Width }, { children: isLoadingContainer3 ? ((0, jsx_runtime_1.jsx)(S_ContentsArea3, __assign({ layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {}) }))) : ((0, jsx_runtime_1.jsx)(S_ContentsArea3, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType, areaColor: areaColor, ref: contentsArea3Ref }, { children: (0, jsx_runtime_1.jsx)(S_content3, __assign({ "x-pds-name": "content3", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTX", layoutType: layoutType }, { children: content3 })) }))) }))] }));
68
+ };
69
+ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
70
+ var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
71
+ return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
72
+ });
73
+ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
74
+ var theme = _a.theme, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
75
+ return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
76
+ });
77
+ var overrideStyleContainer3 = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
78
+ var theme = _a.theme, overrideContainer3ColorKey = _a.overrideContainer3ColorKey;
79
+ return overrideContainer3ColorKey && theme[overrideContainer3ColorKey];
80
+ });
81
+ var S_Box = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n height: 100%;\n"], ["\n display: flex;\n height: 100%;\n"])));
82
+ var S_ContentsContainer1 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: flex-end;\n min-width: 240px;\n width: ", ";\n\n ", ";\n\n ", "\n"], ["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: flex-end;\n min-width: 240px;\n width: ", ";\n\n ", ";\n\n ", "\n"])), function (_a) {
83
+ var theme = _a.theme;
84
+ return theme.ui_contentscontainer01_background;
85
+ }, function (_a) {
86
+ var $contentsArea3Width = _a.$contentsArea3Width;
87
+ return "calc(50% - 240px - (".concat($contentsArea3Width, "px - 240px) / 2)");
88
+ }, function (_a) {
89
+ var containerColor = _a.containerColor;
90
+ return "background-color: ".concat(containerColor);
91
+ }, overrideStyleContainer1);
92
+ var S_ContentsContainer2 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: flex-end;\n width: 480px;\n ", ";\n\n ", "\n"], ["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: flex-end;\n width: 480px;\n ", ";\n\n ", "\n"])), function (_a) {
93
+ var theme = _a.theme;
94
+ return theme.ui_contentscontainer01_background;
95
+ }, function (_a) {
96
+ var containerColor = _a.containerColor;
97
+ return "background-color: ".concat(containerColor);
98
+ }, overrideStyleContainer2);
99
+ var S_ContentsContainer3 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n background-color: ", ";\n height: 100%;\n width: ", ";\n ", ";\n\n ", "\n"], ["\n background-color: ", ";\n height: 100%;\n width: ", ";\n ", ";\n\n ", "\n"])), function (_a) {
100
+ var theme = _a.theme;
101
+ return theme.ui_contentscontainer03_background;
102
+ }, function (_a) {
103
+ var $contentsArea3Width = _a.$contentsArea3Width;
104
+ return "calc(50% - 240px + (".concat($contentsArea3Width, "px - 240px) / 2)");
105
+ }, function (_a) {
106
+ var containerColor = _a.containerColor;
107
+ return "background-color: ".concat(containerColor);
108
+ }, overrideStyleContainer3);
109
+ var S_ContentsArea1 = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n height: 100%;\n max-width: 240px;\n width: 240px;\n\n ", ";\n"], ["\n height: 100%;\n max-width: 240px;\n width: 240px;\n\n ", ";\n"])), function (_a) {
110
+ var areaColor = _a.areaColor;
111
+ return "background-color: ".concat(areaColor);
112
+ });
113
+ var S_ContentsArea2 = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n height: 100%;\n max-width: 480px;\n width: 480px;\n ", ";\n"], ["\n height: 100%;\n max-width: 480px;\n width: 480px;\n ", ";\n"])), function (_a) {
114
+ var areaColor = _a.areaColor;
115
+ return "background-color: ".concat(areaColor);
116
+ });
117
+ var S_ContentsArea3 = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n height: 100%;\n max-width: 880px;\n min-width: 480px;\n width: 60%;\n ", ";\n"], ["\n height: 100%;\n max-width: 880px;\n min-width: 480px;\n width: 60%;\n ", ";\n"])), function (_a) {
118
+ var areaColor = _a.areaColor;
119
+ return "background-color: ".concat(areaColor);
120
+ });
121
+ var S_Content1 = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n height: 100%;\n overflow: hidden;\n"], ["\n height: 100%;\n overflow: hidden;\n"])));
122
+ var S_Content2 = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n height: 100%;\n overflow: hidden;\n"], ["\n height: 100%;\n overflow: hidden;\n"])));
123
+ var S_content3 = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n height: 100%;\n overflow: hidden;\n"], ["\n height: 100%;\n overflow: hidden;\n"])));
124
+ exports.default = WTX;
125
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/index.d.ts CHANGED
@@ -20,3 +20,4 @@ export { default as WTT } from './WTT';
20
20
  export { default as WTU } from './WTU';
21
21
  export { default as WTV } from './WTV';
22
22
  export { default as WTW } from './WTW';
23
+ export { default as WTX } from './WTX';
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/index.js CHANGED
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.WTW = exports.WTV = exports.WTU = exports.WTT = exports.WTS = exports.WTQ = exports.WTP = exports.WTO = exports.WTN = exports.WTM = exports.WTL = exports.WTK = exports.WTJ = exports.WTI = exports.WTH = exports.WTG = exports.WTF = exports.WTE = exports.WTD = exports.WTC = exports.WTB = exports.WTA = void 0;
6
+ exports.WTX = exports.WTW = exports.WTV = exports.WTU = exports.WTT = exports.WTS = exports.WTQ = exports.WTP = exports.WTO = exports.WTN = exports.WTM = exports.WTL = exports.WTK = exports.WTJ = exports.WTI = exports.WTH = exports.WTG = exports.WTF = exports.WTE = exports.WTD = exports.WTC = exports.WTB = exports.WTA = void 0;
7
7
  var WTA_1 = require("./WTA");
8
8
  Object.defineProperty(exports, "WTA", { enumerable: true, get: function () { return __importDefault(WTA_1).default; } });
9
9
  var WTB_1 = require("./WTB");
@@ -48,3 +48,5 @@ var WTV_1 = require("./WTV");
48
48
  Object.defineProperty(exports, "WTV", { enumerable: true, get: function () { return __importDefault(WTV_1).default; } });
49
49
  var WTW_1 = require("./WTW");
50
50
  Object.defineProperty(exports, "WTW", { enumerable: true, get: function () { return __importDefault(WTW_1).default; } });
51
+ var WTX_1 = require("./WTX");
52
+ Object.defineProperty(exports, "WTX", { enumerable: true, get: function () { return __importDefault(WTX_1).default; } });
package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.d.ts CHANGED
@@ -1,20 +1,23 @@
1
1
  import type { UiColors } from '../../../../common';
2
2
  import type { MutableRefObject } from 'react';
3
3
  export type ContainersBoxProps = {
4
- layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTK_4' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTM_3' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTP_2' | 'WTQ_1' | 'WTS_1' | 'WTS_2' | 'WTT_1' | 'WTT_2' | 'WTU_1' | 'WTV_1' | 'WTW_1';
4
+ layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTK_4' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTM_3' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTP_2' | 'WTQ_1' | 'WTS_1' | 'WTS_2' | 'WTT_1' | 'WTT_2' | 'WTU_1' | 'WTV_1' | 'WTW_1' | 'WTX_1';
5
5
  pageMenuContent?: JSX.Element;
6
6
  tabMenuContent?: JSX.Element;
7
7
  subMenuContent?: JSX.Element;
8
8
  content1?: JSX.Element;
9
9
  content2?: JSX.Element;
10
+ content3?: JSX.Element;
10
11
  children?: React.ReactNode;
11
12
  containerColor?: string;
12
13
  areaColor?: string;
13
14
  isLoadingContainer1?: boolean;
14
15
  isLoadingContainer2?: boolean;
16
+ isLoadingContainer3?: boolean;
15
17
  overrideContainer1ColorKey?: UiColors;
16
18
  overrideContainer2ColorKey?: UiColors;
19
+ overrideContainer3ColorKey?: UiColors;
17
20
  container1Ref?: MutableRefObject<HTMLDivElement | null>;
18
21
  };
19
- declare const ContainersBox: ({ layoutType, pageMenuContent, tabMenuContent, subMenuContent, content1, content2, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey, container1Ref }: ContainersBoxProps) => JSX.Element;
22
+ declare const ContainersBox: ({ layoutType, pageMenuContent, tabMenuContent, subMenuContent, content1, content2, content3, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, isLoadingContainer3, overrideContainer1ColorKey, overrideContainer2ColorKey, overrideContainer3ColorKey, container1Ref }: ContainersBoxProps) => JSX.Element;
20
23
  export default ContainersBox;
package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.js CHANGED
@@ -42,7 +42,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
42
42
  var styled_components_1 = __importStar(require("styled-components"));
43
43
  var Containers_1 = require("../Containers");
44
44
  var ContainersBox = function (_a) {
45
- var layoutType = _a.layoutType, pageMenuContent = _a.pageMenuContent, tabMenuContent = _a.tabMenuContent, subMenuContent = _a.subMenuContent, content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey, container1Ref = _a.container1Ref;
45
+ var layoutType = _a.layoutType, pageMenuContent = _a.pageMenuContent, tabMenuContent = _a.tabMenuContent, subMenuContent = _a.subMenuContent, content1 = _a.content1, content2 = _a.content2, content3 = _a.content3, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, isLoadingContainer3 = _a.isLoadingContainer3, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey, overrideContainer3ColorKey = _a.overrideContainer3ColorKey, container1Ref = _a.container1Ref;
46
46
  return ((0, jsx_runtime_1.jsxs)(S_ContainersBox, { children: [{
47
47
  WTA_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
48
48
  WTA_2: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
@@ -90,7 +90,8 @@ var ContainersBox = function (_a) {
90
90
  WTT_2: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
91
91
  WTU_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
92
92
  WTV_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
93
- WTW_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})
93
+ WTW_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
94
+ WTX_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})
94
95
  }[layoutType], (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [{
95
96
  WTA_1: ((0, jsx_runtime_1.jsx)(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu_mobile_480", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor })),
96
97
  WTA_2: ((0, jsx_runtime_1.jsx)(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu_mobile_600", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor })),
@@ -138,7 +139,8 @@ var ContainersBox = function (_a) {
138
139
  WTT_2: ((0, jsx_runtime_1.jsx)(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor })),
139
140
  WTU_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
140
141
  WTV_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
141
- WTW_1: ((0, jsx_runtime_1.jsx)(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor }))
142
+ WTW_1: ((0, jsx_runtime_1.jsx)(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor })),
143
+ WTX_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})
142
144
  }[layoutType], {
143
145
  WTA_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
144
146
  WTA_2: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
@@ -186,7 +188,8 @@ var ContainersBox = function (_a) {
186
188
  WTT_2: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
187
189
  WTU_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
188
190
  WTV_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
189
- WTW_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})
191
+ WTW_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}),
192
+ WTX_1: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})
190
193
  }[layoutType], (0, jsx_runtime_1.jsxs)(S_BottomWrapper, __assign({ layoutType: layoutType }, { children: [{
191
194
  WTA_1: '',
192
195
  WTA_2: '',
@@ -234,8 +237,9 @@ var ContainersBox = function (_a) {
234
237
  WTT_2: '',
235
238
  WTU_1: '',
236
239
  WTV_1: '',
237
- WTW_1: ''
238
- }[layoutType], (0, jsx_runtime_1.jsx)(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey, container1Ref: container1Ref })] }))] })] }));
240
+ WTW_1: '',
241
+ WTX_1: ''
242
+ }[layoutType], (0, jsx_runtime_1.jsx)(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, content3: content3, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, isLoadingContainer3: isLoadingContainer3, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey, overrideContainer3ColorKey: overrideContainer3ColorKey, container1Ref: container1Ref })] }))] })] }));
239
243
  };
240
244
  var S_ContainersBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: flex-start;\n display: flex;\n height: 100%;\n"], ["\n align-items: flex-start;\n display: flex;\n height: 100%;\n"])));
241
245
  var S_RightBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex: 1;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex: 1;\n flex-direction: column;\n height: 100%;\n"])));
package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js CHANGED
@@ -219,7 +219,7 @@ function CustomSection(props) {
219
219
  onContextMenuCB(each.id, e);
220
220
  } }, { 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
221
  }
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"])));
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-selected {\n z-index: 9998 !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: 9998 !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
223
  var S_SectionWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
224
224
  exports.default = react_1.default.memo(CustomSection);
225
225
  var templateObject_1, templateObject_2;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "2.2.24",
3
+ "version": "2.2.26",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,13 +1,7 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v2.2.24]
3
- ## daily|https://design.storybook.publ.biz/
2
+ ## [v2.2.26]
3
+ ## urgent|https://design.storybook.publ.biz/
4
4
 
5
- ### Component
6
- * Icon
7
- * ic_upload_list line 추가
8
- * ic_hourglass line 추가
9
5
  ### sub
10
6
  * DynamicLayout
11
- * custom section
12
- * width값으로 들어가던 것을 max-width로 들어가도록 수정
13
- * width는 100%로 고정
7
+ * 선택된 CB가 가장 위쪽으로 올라올때 z-index값 수정