[
  {
    "path": ".gitignore",
    "content": "# Exclusion\n/node_modules\n.DS_Store\n.vscode\ntodo.txt\nnext.md\npackage-lock.json"
  },
  {
    "path": "LICENSE",
    "content": "The MIT License (MIT)\n\nCopyright (c) 2022 Christian Pucci\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE."
  },
  {
    "path": "README.md",
    "content": ":tophat: magic\n---------------\n\nCSS3 Animations with special effects. **(→ 3.1 kB gzip)**\n\n## Demo\n\nCheckout the demo for the animations [here](https://www.minimamente.com/project/magic/)\n\n## **Table of Contents**\n\n- [Installation](#installation)\n- [Getting Started](#getting-started)\n- [Usage with JavaScript](#usage-with-javascript)\n- [Usage with jQuery](#usage-with-jquery)\n- [HTML & CSS tips](#html--css-tips)\n- [:tada: Gulp and SCSS (SASS) compiling](#tada-gulp-and-scss-sass-compiling)\n- [:white_check_mark: Browser Support](#white_check_mark-browser-support)\n\n\n## Installation\n\n**GitHub Package Registry** - [Package url](https://github.com/miniMAC/magic/packages/24129)\n```bash\nnpm install @minimac/magic.css\n```\n\n**NPM** - [Package url](https://www.npmjs.com/package/magic.css)\n```bash\nnpm i magic.css\n```\n\n**YARN** - [Package url](https://yarnpkg.com/en/package/magic.css)\n```bash\nyarn add magic.css\n```\n\n## Getting Started\n\nInclude the file **magic.css** or include the minified version **magic.min.css**\n\n```html\n<link rel=\"stylesheet\" href=\"yourpath/magic.css\">\n```\n\nor\n\n```html\n<link rel=\"stylesheet\" href=\"yourpath/magic.min.css\">\n```\n\n## Usage with JavaScript\n\nThis is a sample code for on hover effect with **JavaScript**.\nFirst, Include the class `magictime` and then a desired animation class.\n```js\nconst selector = document.querySelector('.yourdiv')\nselector.classList.add('magictime', 'puffIn')\n```\n\nIf you want to load the animation after certain time, you can use this example:\n```js\n//set timer to 5 seconds, after that, load the magic animation\nfunction myFunction() {\n    const selector = document.querySelector('.yourdiv')\n    selector.classList.add('magictime', 'puffIn')\n}\nsetTimeout(myFunction, 5000);\n```\n\nIf you want to load the animation after certain time but with an infinite loop, you can use this example:\n```js\n//set timer to 3 seconds, after that, load the magic animation and repeat forever\nfunction myFunction() {\n    const selector = document.querySelector('.yourdiv')\n    selector.classList.add('magictime', 'puffIn')\n}\nsetInterval(myFunction, 3000);\n```\n\n## Usage with jQuery\n\nThis is a sample code for on hover effect with jQuery.\nFirst, Include the class `magictime` and then the desired animation class.\n```js\n$('.yourdiv').hover(function () {\n    $(this).addClass('magictime puffIn');\n});\n```\n\nIf you want to load the animation after certain time, you can use this example:\n```js\n//set timer to 5 seconds, after that, load the magic animation\nsetTimeout(function(){\n    $('.yourdiv').addClass('magictime puffIn');\n}, 5000);\n```\n\nIf you want to load the animation after certain time but with infinite loop, you can use this example:\n```js\n//set timer to 3 seconds, after that, load the magic animation and repeat forever\nsetInterval(function(){\n    $('.yourdiv').toggleClass('magictime puffIn');\n}, 3000 );\n```\n## HTML & CSS tips\n\nYou can **change the time** of the animation by setting the class `magictime` for example:\n```css\n.magictime {\n    -webkit-animation-duration: 3s;\n    animation-duration: 3s;\n}\n```\n\n**Default** CSS timing is:\n```css\n.magictime {\n    -webkit-animation-duration: 1s;\n    animation-duration: 1s;\n}\n```\n\nIf you want to assign the **timing to a specific animation**, you can use the following code *(use 2 class)*:\n```css\n.magictime.magic {\n    -webkit-animation-duration: 10s;\n    animation-duration: 10s;\n}\n```\n\n## Animation Classes\n\n| MAGIC EFFECTS | BLING     | STATIC EFFECTS      | STATIC EFFECTS OUT | PERSPECTIVE            | ROTATE      |\n|---------------|-----------|---------------------|--------------------|------------------------|-------------|\n| magic         | puffIn    | openDownLeft        | openDownLeftOut    | perspectiveDown        | rotateDown  |\n| twisterInDown | puffOut   | openDownRight       | openDownRightOut   | perspectiveUp          | rotateUp    |\n| twisterInUp   | vanishIn  | openUpLeft          | openUpLeftOut      | perspectiveLeft        | rotateLeft  |\n| swap          | vanishOut | openUpRight         | openUpRightOut     | perspectiveRight       | rotateRight |\n|               |           | openDownLeftReturn  |                    | perspectiveDownReturn  |             |\n|               |           | openDownRightReturn |                    | perspectiveUpReturn    |             |\n|               |           | openUpLeftReturn    |                    | perspectiveLeftReturn  |             |\n|               |           | openUpRightReturn   |                    | perspectiveRightReturn |             |\n\n\n| SLIDE            | MATH      | TIN         | BOMB         | BOING        | ON THE SPACE  |\n|------------------|-----------|-------------|--------------|--------------|---------------|\n| slideDown        | swashOut  | tinRightOut | bombRightOut | boingInUp    | spaceOutUp    |\n| slideUp          | swashIn   | tinLeftOut  | bombLeftOut  | boingOutDown | spaceOutRight |\n| slideLeft        | foolishIn | tinUpOut    |              |              | spaceOutDown  |\n| slideRight       | holeOut   | tinDownOut  |              |              | spaceOutLeft  |\n| slideDownReturn  |           | tinRightIn  |              |              | spaceInUp     |\n| slideUpReturn    |           | tinLeftIn   |              |              | spaceInRight  |\n| slideLeftReturn  |           | tinUpIn     |              |              | spaceInDown   |\n| slideRightReturn |           | tinDownIn   |              |              | spaceInLeft   |\n\n:tada: Gulp and SCSS (SASS) compiling\n---------------\n\nIf you want to customize the CSS files, now you will have the chance. For example, if you want to include only certain animations, you will have to go to this file:\n\n```html\nassets/scss/magic.scss\n```\n\nComment or uncomment your desired file and run from terminal the following commands:\n\n```bash\nnpm install\n```\n\nand last command:\n\n```bash\ngulp\n```\n\n**Automatically** this generate the new files!\n\n\n:white_check_mark: Browser Support\n---------------\n\n**Browser** | Chrome | Firefox | Safari | iOS Safari | Opera | Android | Android Chrome | IE | Opera Mini\n--- | :---: | :---: | :---: | :---: | :---: | :---: | :---: | :---: | :---:\n**Version** | 31+ | 31+ | 7+ | 7.1+ | 27+ | 4.1+ | 42+ | 10+ | :x:\n"
  },
  {
    "path": "assets/scss/_magictime.scss",
    "content": ".magictime {\n    animation-duration: 1s;\n    animation-fill-mode: both;\n}"
  },
  {
    "path": "assets/scss/_media.scss",
    "content": "@media (print), (prefers-reduced-motion) {\n  .magictime {\n    animation: unset !important;\n    transition: none !important;\n  }\n}\n"
  },
  {
    "path": "assets/scss/bling/_puffIn.scss",
    "content": ".puffIn {\n  animation-name: puffIn;\n}\n\n@-webkit-keyframes puffIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n\n@keyframes puffIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/bling/_puffOut.scss",
    "content": ".puffOut {\n  animation-name: puffOut;\n}\n\n@-webkit-keyframes puffOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n}\n\n@keyframes puffOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/bling/_vanishIn.scss",
    "content": ".vanishIn {\n  animation-name: vanishIn;\n}\n\n@-webkit-keyframes vanishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(90px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n\n@keyframes vanishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(90px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/bling/_vanishOut.scss",
    "content": ".vanishOut {\n  animation-name: vanishOut;\n}\n\n@-webkit-keyframes vanishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(20px);\n  }\n}\n\n@keyframes vanishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(20px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/boing/_boingInUp.scss",
    "content": ".boingInUp {\n  -webkit-animation-name: boingInUp;\n  animation-name: boingInUp;\n}\n\n@-webkit-keyframes boingInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(-90deg);\n    transform: perspective(800px) rotateX(-90deg);\n  }\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(50deg);\n    transform: perspective(800px) rotateX(50deg);\n  }\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n\n@keyframes boingInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(-90deg);\n    transform: perspective(800px) rotateX(-90deg);\n  }\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(50deg);\n    transform: perspective(800px) rotateX(50deg);\n  }\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/boing/_boingOutDown.scss",
    "content": ".boingOutDown {\n  -webkit-animation-name: boingOutDown;\n  animation-name: boingOutDown;\n}\n@-webkit-keyframes boingOutDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n  }\n\n  30% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n    transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n  }\n}\n@keyframes boingOutDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n  }\n\n  30% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n    transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n    transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/bomb/_bombLeftOut.scss",
    "content": ".bombLeftOut {\n  -webkit-animation-name: bombLeftOut;\n  animation-name: bombLeftOut;\n}\n@-webkit-keyframes bombLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: -100% 50%;\n    transform-origin: -100% 50%;\n    -webkit-transform: rotate(-160deg);\n    transform: rotate(-160deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: -100% 50%;\n    transform-origin: -100% 50%;\n    -webkit-transform: rotate(-160deg);\n    transform: rotate(-160deg);\n    -webkit-filter: blur(20px);\n    filter: blur(20px);\n  }\n}\n@keyframes bombLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: -100% 50%;\n    transform-origin: -100% 50%;\n    -webkit-transform: rotate(-160deg);\n    transform: rotate(-160deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: -100% 50%;\n    transform-origin: -100% 50%;\n    -webkit-transform: rotate(-160deg);\n    transform: rotate(-160deg);\n    -webkit-filter: blur(20px);\n    filter: blur(20px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/bomb/_bombRightOut.scss",
    "content": ".bombRightOut {\n  -webkit-animation-name: bombRightOut;\n  animation-name: bombRightOut;\n}\n@-webkit-keyframes bombRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: 200% 50%;\n    transform-origin: 200% 50%;\n    -webkit-transform: rotate(160deg);\n    transform: rotate(160deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 200% 50%;\n    transform-origin: 200% 50%;\n    -webkit-transform: rotate(160deg);\n    transform: rotate(160deg);\n    -webkit-filter: blur(20px);\n    filter: blur(20px);\n  }\n}\n@keyframes bombRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  50% {\n    opacity: 1;\n    -webkit-transform-origin: 200% 50%;\n    transform-origin: 200% 50%;\n    -webkit-transform: rotate(160deg);\n    transform: rotate(160deg);\n    -webkit-filter: blur(0px);\n    filter: blur(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 200% 50%;\n    transform-origin: 200% 50%;\n    -webkit-transform: rotate(160deg);\n    transform: rotate(160deg);\n    -webkit-filter: blur(20px);\n    filter: blur(20px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/magic.scss",
    "content": "@charset \"UTF-8\";\n\n/*!\n * Magic - https://www.minimamente.com\n * Licensed under the MIT license - https://opensource.org/licenses/MIT\n * Copyright (c) 2022 Christian Pucci\n */\n\n// bling\n@import \"bling/puffIn\";\n@import \"bling/puffOut\";\n@import \"bling/vanishIn\";\n@import \"bling/vanishOut\";\n\n// boing\n@import \"boing/boingInUp\";\n@import \"boing/boingOutDown\";\n\n// bomb\n@import \"bomb/bombLeftOut\";\n@import \"bomb/bombRightOut\";\n\n// magic_effects\n@import \"magic_effects/magic\";\n@import \"magic_effects/swap\";\n@import \"magic_effects/twisterInDown\";\n@import \"magic_effects/twisterInUp\";\n\n// math\n@import \"math/foolishIn\";\n@import \"math/foolishOut\";\n@import \"math/holeOut\";\n@import \"math/swashIn\";\n@import \"math/swashOut\";\n\n// on_the_space\n@import \"on_the_space/spaceInDown\";\n@import \"on_the_space/spaceInLeft\";\n@import \"on_the_space/spaceInRight\";\n@import \"on_the_space/spaceInUp\";\n@import \"on_the_space/spaceOutDown\";\n@import \"on_the_space/spaceOutLeft\";\n@import \"on_the_space/spaceOutRight\";\n@import \"on_the_space/spaceOutUp\";\n\n// perspective\n@import \"perspective/perspectiveDown\";\n@import \"perspective/perspectiveDownReturn\";\n@import \"perspective/perspectiveLeft\";\n@import \"perspective/perspectiveLeftReturn\";\n@import \"perspective/perspectiveRight\";\n@import \"perspective/perspectiveRightReturn\";\n@import \"perspective/perspectiveUp\";\n@import \"perspective/perspectiveUpReturn\";\n\n// rotate\n@import \"rotate/rotateDown\";\n@import \"rotate/rotateLeft\";\n@import \"rotate/rotateRight\";\n@import \"rotate/rotateUp\";\n\n// slide\n@import \"slide/slideDown\";\n@import \"slide/slideDownReturn\";\n@import \"slide/slideLeft\";\n@import \"slide/slideLeftReturn\";\n@import \"slide/slideRight\";\n@import \"slide/slideRightReturn\";\n@import \"slide/slideUp\";\n@import \"slide/slideUpReturn\";\n\n// static_effects\n@import \"static_effects/openDownLeft\";\n@import \"static_effects/openDownLeftReturn\";\n@import \"static_effects/openDownRight\";\n@import \"static_effects/openDownRightReturn\";\n@import \"static_effects/openUpLeft\";\n@import \"static_effects/openUpLeftReturn\";\n@import \"static_effects/openUpRight\";\n@import \"static_effects/openUpRightReturn\";\n\n// static_effects_out\n@import \"static_effects_out/openDownLeftOut\";\n@import \"static_effects_out/openDownRightOut\";\n@import \"static_effects_out/openUpLeftOut\";\n@import \"static_effects_out/openUpRightOut\";\n\n// tin\n@import \"tin/tinDownIn\";\n@import \"tin/tinDownOut\";\n@import \"tin/tinLeftIn\";\n@import \"tin/tinLeftOut\";\n@import \"tin/tinRightIn\";\n@import \"tin/tinRightOut\";\n@import \"tin/tinUpIn\";\n@import \"tin/tinUpOut\";\n\n// magictime\n@import \"magictime\";\n\n// media\n@import \"media\";\n"
  },
  {
    "path": "assets/scss/magic_effects/_magic.scss",
    "content": ".magic {\n  -webkit-animation-name: magic;\n  animation-name: magic;\n}\n@-webkit-keyframes magic {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 200%;\n    transform-origin: 100% 200%;\n    -webkit-transform: scale(1, 1) rotate(0deg);\n    transform: scale(1, 1) rotate(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 200% 500%;\n    transform-origin: 200% 500%;\n    -webkit-transform: scale(0, 0) rotate(270deg);\n    transform: scale(0, 0) rotate(270deg);\n  }\n}\n@keyframes magic {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 200%;\n    transform-origin: 100% 200%;\n    -webkit-transform: scale(1, 1) rotate(0deg);\n    transform: scale(1, 1) rotate(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 200% 500%;\n    transform-origin: 200% 500%;\n    -webkit-transform: scale(0, 0) rotate(270deg);\n    transform: scale(0, 0) rotate(270deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/magic_effects/_swap.scss",
    "content": ".swap {\n  -webkit-animation-name: swap;\n  animation-name: swap;\n}\n@-webkit-keyframes swap {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) translate(-700px, 0px);\n    transform: scale(0, 0) translate(-700px, 0px);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(1, 1) translate(0px, 0px);\n    transform: scale(1, 1) translate(0px, 0px);\n  }\n}\n@keyframes swap {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) translate(-700px, 0px);\n    transform: scale(0, 0) translate(-700px, 0px);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(1, 1) translate(0px, 0px);\n    transform: scale(1, 1) translate(0px, 0px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/magic_effects/_twisterInDown.scss",
    "content": ".twisterInDown {\n  -webkit-animation-name: twisterInDown;\n  animation-name: twisterInDown;\n}\n@-webkit-keyframes twisterInDown {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n\n  30% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);\n    transform: scale(1, 1) rotate(0deg) translateY(0%);\n  }\n}\n@keyframes twisterInDown {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n\n  30% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);\n    transform: scale(1, 1) rotate(0deg) translateY(0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/magic_effects/_twisterInUp.scss",
    "content": ".twisterInUp {\n  -webkit-animation-name: twisterInUp;\n  animation-name: twisterInUp;\n}\n@-webkit-keyframes twisterInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n\n  30% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);\n    transform: scale(1, 1) rotate(0deg) translateY(0);\n  }\n}\n@keyframes twisterInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n\n  30% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);\n    transform: scale(1, 1) rotate(0deg) translateY(0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/math/_foolishIn.scss",
    "content": ".foolishIn {\n  -webkit-animation-name: foolishIn;\n  animation-name: foolishIn;\n}\n@-webkit-keyframes foolishIn {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotate(360deg);\n    transform: scale(0, 0) rotate(360deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  60% {\n    opacity: 1;\n    -webkit-transform-origin: 0%;\n    transform-origin: 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 0%;\n    transform-origin: 0% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotate(0deg);\n    transform: scale(1, 1) rotate(0deg);\n  }\n}\n@keyframes foolishIn {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotate(360deg);\n    transform: scale(0, 0) rotate(360deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 100%;\n    transform-origin: 100% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  60% {\n    opacity: 1;\n    -webkit-transform-origin: 0%;\n    transform-origin: 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 0%;\n    transform-origin: 0% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotate(0deg);\n    transform: scale(1, 1) rotate(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/math/_foolishOut.scss",
    "content": ".foolishOut {\n  -webkit-animation-name: foolishOut;\n  animation-name: foolishOut;\n}\n@-webkit-keyframes foolishOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotate(360deg);\n    transform: scale(1, 1) rotate(360deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 0%;\n    transform-origin: 0% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 0%;\n    transform-origin: 100% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  60% {\n    opacity: 1;\n    -webkit-transform-origin: 0%;\n    transform-origin: 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotate(0deg);\n    transform: scale(0, 0) rotate(0deg);\n  }\n}\n@keyframes foolishOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotate(360deg);\n    transform: scale(1, 1) rotate(360deg);\n  }\n\n  20% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 0%;\n    transform-origin: 0% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  40% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 0%;\n    transform-origin: 100% 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  60% {\n    opacity: 1;\n    -webkit-transform-origin: 0%;\n    transform-origin: 0%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 100%;\n    transform-origin: 0% 100%;\n    -webkit-transform: scale(0.5, 0.5) rotate(0deg);\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotate(0deg);\n    transform: scale(0, 0) rotate(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/math/_holeOut.scss",
    "content": ".holeOut {\n  -webkit-animation-name: holeOut;\n  animation-name: holeOut;\n}\n@-webkit-keyframes holeOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotateY(0deg);\n    transform: scale(1, 1) rotateY(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotateY(180deg);\n    transform: scale(0, 0) rotateY(180deg);\n  }\n}\n@keyframes holeOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1) rotateY(0deg);\n    transform: scale(1, 1) rotateY(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0) rotateY(180deg);\n    transform: scale(0, 0) rotateY(180deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/math/_swashIn.scss",
    "content": ".swashIn {\n  -webkit-animation-name: swashIn;\n  animation-name: swashIn;\n}\n@-webkit-keyframes swashIn {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0);\n    transform: scale(0, 0);\n  }\n\n  90% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0.9, 0.9);\n    transform: scale(0.9, 0.9);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1);\n    transform: scale(1, 1);\n  }\n}\n@keyframes swashIn {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0);\n    transform: scale(0, 0);\n  }\n\n  90% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0.9, 0.9);\n    transform: scale(0.9, 0.9);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1);\n    transform: scale(1, 1);\n  }\n}\n"
  },
  {
    "path": "assets/scss/math/_swashOut.scss",
    "content": ".swashOut {\n  -webkit-animation-name: swashOut;\n  animation-name: swashOut;\n}\n@-webkit-keyframes swashOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1);\n    transform: scale(1, 1);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0.9, 0.9);\n    transform: scale(0.9, 0.9);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0);\n    transform: scale(0, 0);\n  }\n}\n@keyframes swashOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(1, 1);\n    transform: scale(1, 1);\n  }\n\n  80% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0.9, 0.9);\n    transform: scale(0.9, 0.9);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 50%;\n    transform-origin: 50% 50%;\n    -webkit-transform: scale(0, 0);\n    transform: scale(0, 0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceInDown.scss",
    "content": ".spaceInDown {\n  -webkit-animation-name: spaceInDown;\n  animation-name: spaceInDown;\n}\n@-webkit-keyframes spaceInDown {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(0.2) translate(0%, 200%);\n    transform: scale(0.2) translate(0%, 200%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInDown {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(0.2) translate(0%, 200%);\n    transform: scale(0.2) translate(0%, 200%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceInLeft.scss",
    "content": ".spaceInLeft {\n  -webkit-animation-name: spaceInLeft;\n  animation-name: spaceInLeft;\n}\n@-webkit-keyframes spaceInLeft {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(0.2) translate(-200%, 0%);\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInLeft {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(0.2) translate(-200%, 0%);\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceInRight.scss",
    "content": ".spaceInRight {\n  -webkit-animation-name: spaceInRight;\n  animation-name: spaceInRight;\n}\n@-webkit-keyframes spaceInRight {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(0.2) translate(200%, 0%);\n    transform: scale(0.2) translate(200%, 0%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInRight {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(0.2) translate(200%, 0%);\n    transform: scale(0.2) translate(200%, 0%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceInUp.scss",
    "content": ".spaceInUp {\n  -webkit-animation-name: spaceInUp;\n  animation-name: spaceInUp;\n}\n@-webkit-keyframes spaceInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(0.2) translate(0%, -200%);\n    transform: scale(0.2) translate(0%, -200%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInUp {\n  0% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(0.2) translate(0%, -200%);\n    transform: scale(0.2) translate(0%, -200%);\n  }\n\n  100% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceOutDown.scss",
    "content": ".spaceOutDown {\n  -webkit-animation-name: spaceOutDown;\n  animation-name: spaceOutDown;\n}\n@-webkit-keyframes spaceOutDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(0.2) translate(0%, 200%);\n    transform: scale(0.2) translate(0%, 200%);\n  }\n}\n@keyframes spaceOutDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: scale(0.2) translate(0%, 200%);\n    transform: scale(0.2) translate(0%, 200%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceOutLeft.scss",
    "content": ".spaceOutLeft {\n  -webkit-animation-name: spaceOutLeft;\n  animation-name: spaceOutLeft;\n}\n@-webkit-keyframes spaceOutLeft {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(0.2) translate(-200%, 0%);\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n}\n@keyframes spaceOutLeft {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 0% 50%;\n    transform-origin: 0% 50%;\n    -webkit-transform: scale(0.2) translate(-200%, 0%);\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceOutRight.scss",
    "content": ".spaceOutRight {\n  -webkit-animation-name: spaceOutRight;\n  animation-name: spaceOutRight;\n}\n@-webkit-keyframes spaceOutRight {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(0.2) translate(200%, 0%);\n    transform: scale(0.2) translate(200%, 0%);\n  }\n}\n@keyframes spaceOutRight {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 100% 50%;\n    transform-origin: 100% 50%;\n    -webkit-transform: scale(0.2) translate(200%, 0%);\n    transform: scale(0.2) translate(200%, 0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/on_the_space/_spaceOutUp.scss",
    "content": ".spaceOutUp {\n  -webkit-animation-name: spaceOutUp;\n  animation-name: spaceOutUp;\n}\n@-webkit-keyframes spaceOutUp {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(0.2) translate(0%, -200%);\n    transform: scale(0.2) translate(0%, -200%);\n  }\n}\n@keyframes spaceOutUp {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(1) translate(0%, 0%);\n    transform: scale(1) translate(0%, 0%);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0%;\n    transform-origin: 50% 0%;\n    -webkit-transform: scale(0.2) translate(0%, -200%);\n    transform: scale(0.2) translate(0%, -200%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveDown.scss",
    "content": ".perspectiveDown {\n  -webkit-animation-name: perspectiveDown;\n  animation-name: perspectiveDown;\n}\n@-webkit-keyframes perspectiveDown {\n  0% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg);\n    transform: perspective(800px) rotateX(-180deg);\n  }\n}\n@keyframes perspectiveDown {\n  0% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg);\n    transform: perspective(800px) rotateX(-180deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveDownReturn.scss",
    "content": ".perspectiveDownReturn {\n  -webkit-animation-name: perspectiveDownReturn;\n  animation-name: perspectiveDownReturn;\n}\n@-webkit-keyframes perspectiveDownReturn {\n  0% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg);\n    transform: perspective(800px) rotateX(-180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n@keyframes perspectiveDownReturn {\n  0% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg);\n    transform: perspective(800px) rotateX(-180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 100%;\n    transform-origin: 0 100%;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveLeft.scss",
    "content": ".perspectiveLeft {\n  -webkit-animation-name: perspectiveLeft;\n  animation-name: perspectiveLeft;\n}\n@-webkit-keyframes perspectiveLeft {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg);\n    transform: perspective(800px) rotateY(-180deg);\n  }\n}\n@keyframes perspectiveLeft {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg);\n    transform: perspective(800px) rotateY(-180deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveLeftReturn.scss",
    "content": ".perspectiveLeftReturn {\n  -webkit-animation-name: perspectiveLeftReturn;\n  animation-name: perspectiveLeftReturn;\n}\n@-webkit-keyframes perspectiveLeftReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg);\n    transform: perspective(800px) rotateY(-180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n@keyframes perspectiveLeftReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg);\n    transform: perspective(800px) rotateY(-180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveRight.scss",
    "content": ".perspectiveRight {\n  -webkit-animation-name: perspectiveRight;\n  animation-name: perspectiveRight;\n}\n@-webkit-keyframes perspectiveRight {\n  0% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg);\n    transform: perspective(800px) rotateY(180deg);\n  }\n}\n@keyframes perspectiveRight {\n  0% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg);\n    transform: perspective(800px) rotateY(180deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveRightReturn.scss",
    "content": ".perspectiveRightReturn {\n  -webkit-animation-name: perspectiveRightReturn;\n  animation-name: perspectiveRightReturn;\n}\n@-webkit-keyframes perspectiveRightReturn {\n  0% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg);\n    transform: perspective(800px) rotateY(180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n@keyframes perspectiveRightReturn {\n  0% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg);\n    transform: perspective(800px) rotateY(180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 100% 0;\n    transform-origin: 100% 0;\n    -webkit-transform: perspective(800px) rotateY(0deg);\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveUp.scss",
    "content": ".perspectiveUp {\n  -webkit-animation-name: perspectiveUp;\n  animation-name: perspectiveUp;\n}\n@-webkit-keyframes perspectiveUp {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(180deg);\n    transform: perspective(800px) rotateX(180deg);\n  }\n}\n@keyframes perspectiveUp {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(180deg);\n    transform: perspective(800px) rotateX(180deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/perspective/_perspectiveUpReturn.scss",
    "content": ".perspectiveUpReturn {\n  -webkit-animation-name: perspectiveUpReturn;\n  animation-name: perspectiveUpReturn;\n}\n@-webkit-keyframes perspectiveUpReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(180deg);\n    transform: perspective(800px) rotateX(180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n@keyframes perspectiveUpReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(180deg);\n    transform: perspective(800px) rotateX(180deg);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg);\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n"
  },
  {
    "path": "assets/scss/rotate/_rotateDown.scss",
    "content": ".rotateDown {\n  -webkit-animation-name: rotateDown;\n  animation-name: rotateDown;\n}\n@-webkit-keyframes rotateDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n    transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n  }\n}\n@keyframes rotateDown {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 100%;\n    transform-origin: 50% 100%;\n    -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n    transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/rotate/_rotateLeft.scss",
    "content": ".rotateLeft {\n  -webkit-animation-name: rotateLeft;\n  animation-name: rotateLeft;\n}\n@-webkit-keyframes rotateLeft {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);\n    transform: perspective(800px) rotateY(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n    transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n  }\n}\n@keyframes rotateLeft {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);\n    transform: perspective(800px) rotateY(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n    transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/rotate/_rotateRight.scss",
    "content": ".rotateRight {\n  -webkit-animation-name: rotateRight;\n  animation-name: rotateRight;\n}\n@-webkit-keyframes rotateRight {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);\n    transform: perspective(800px) rotateY(0deg) translate3d(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg) translateZ(150px);\n    transform: perspective(800px) rotateY(180deg) translateZ(150px);\n  }\n}\n@keyframes rotateRight {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);\n    transform: perspective(800px) rotateY(0deg) translate3d(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateY(180deg) translateZ(150px);\n    transform: perspective(800px) rotateY(180deg) translateZ(150px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/rotate/_rotateUp.scss",
    "content": ".rotateUp {\n  -webkit-animation-name: rotateUp;\n  animation-name: rotateUp;\n}\n@-webkit-keyframes rotateUp {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);\n    transform: perspective(800px) rotateX(180deg) translateZ(100px);\n  }\n}\n@keyframes rotateUp {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: 50% 0;\n    transform-origin: 50% 0;\n    -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);\n    transform: perspective(800px) rotateX(180deg) translateZ(100px);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideDown.scss",
    "content": ".slideDown {\n  -webkit-animation-name: slideDown;\n  animation-name: slideDown;\n}\n@-webkit-keyframes slideDown {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(100%);\n    transform: translateY(100%);\n  }\n}\n@keyframes slideDown {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(100%);\n    transform: translateY(100%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideDownReturn.scss",
    "content": ".slideDownReturn {\n  -webkit-animation-name: slideDownReturn;\n  animation-name: slideDownReturn;\n}\n@-webkit-keyframes slideDownReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(100%);\n    transform: translateY(100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n}\n@keyframes slideDownReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(100%);\n    transform: translateY(100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideLeft.scss",
    "content": ".slideLeft {\n  -webkit-animation-name: slideLeft;\n  animation-name: slideLeft;\n}\n@-webkit-keyframes slideLeft {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(-100%);\n    transform: translateX(-100%);\n  }\n}\n@keyframes slideLeft {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(-100%);\n    transform: translateX(-100%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideLeftReturn.scss",
    "content": ".slideLeftReturn {\n  -webkit-animation-name: slideLeftReturn;\n  animation-name: slideLeftReturn;\n}\n@-webkit-keyframes slideLeftReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(-100%);\n    transform: translateX(-100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n}\n@keyframes slideLeftReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(-100%);\n    transform: translateX(-100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideRight.scss",
    "content": ".slideRight {\n  -webkit-animation-name: slideRight;\n  animation-name: slideRight;\n}\n@-webkit-keyframes slideRight {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(100%);\n    transform: translateX(100%);\n  }\n}\n@keyframes slideRight {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(100%);\n    transform: translateX(100%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideRightReturn.scss",
    "content": ".slideRightReturn {\n  -webkit-animation-name: slideRightReturn;\n  animation-name: slideRightReturn;\n}\n@-webkit-keyframes slideRightReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(100%);\n    transform: translateX(100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n}\n@keyframes slideRightReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(100%);\n    transform: translateX(100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateX(0%);\n    transform: translateX(0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideUp.scss",
    "content": ".slideUp {\n  -webkit-animation-name: slideUp;\n  animation-name: slideUp;\n}\n@-webkit-keyframes slideUp {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(-100%);\n    transform: translateY(-100%);\n  }\n}\n@keyframes slideUp {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(-100%);\n    transform: translateY(-100%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/slide/_slideUpReturn.scss",
    "content": ".slideUpReturn {\n  -webkit-animation-name: slideUpReturn;\n  animation-name: slideUpReturn;\n}\n@-webkit-keyframes slideUpReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(-100%);\n    transform: translateY(-100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n}\n@keyframes slideUpReturn {\n  0% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(-100%);\n    transform: translateY(-100%);\n  }\n\n  100% {\n    -webkit-transform-origin: 0 0;\n    transform-origin: 0 0;\n    -webkit-transform: translateY(0%);\n    transform: translateY(0%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openDownLeft.scss",
    "content": ".openDownLeft {\n  -webkit-animation-name: openDownLeft;\n  animation-name: openDownLeft;\n}\n@-webkit-keyframes openDownLeft {\n  0% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownLeft {\n  0% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openDownLeftReturn.scss",
    "content": ".openDownLeftReturn {\n  -webkit-animation-name: openDownLeftReturn;\n  animation-name: openDownLeftReturn;\n}\n@-webkit-keyframes openDownLeftReturn {\n  0% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openDownLeftReturn {\n  0% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openDownRight.scss",
    "content": ".openDownRight {\n  -webkit-animation-name: openDownRight;\n  animation-name: openDownRight;\n}\n@-webkit-keyframes openDownRight {\n  0% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownRight {\n  0% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openDownRightReturn.scss",
    "content": ".openDownRightReturn {\n  -webkit-animation-name: openDownRightReturn;\n  animation-name: openDownRightReturn;\n}\n@-webkit-keyframes openDownRightReturn {\n  0% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openDownRightReturn {\n  0% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openUpLeft.scss",
    "content": ".openUpLeft {\n  -webkit-animation-name: openUpLeft;\n  animation-name: openUpLeft;\n}\n@-webkit-keyframes openUpLeft {\n  0% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpLeft {\n  0% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openUpLeftReturn.scss",
    "content": ".openUpLeftReturn {\n  -webkit-animation-name: openUpLeftReturn;\n  animation-name: openUpLeftReturn;\n}\n@-webkit-keyframes openUpLeftReturn {\n  0% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openUpLeftReturn {\n  0% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openUpRight.scss",
    "content": ".openUpRight {\n  -webkit-animation-name: openUpRight;\n  animation-name: openUpRight;\n}\n@-webkit-keyframes openUpRight {\n  0% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpRight {\n  0% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects/_openUpRightReturn.scss",
    "content": ".openUpRightReturn {\n  -webkit-animation-name: openUpRightReturn;\n  animation-name: openUpRightReturn;\n}\n@-webkit-keyframes openUpRightReturn {\n  0% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openUpRightReturn {\n  0% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n\n  100% {\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects_out/_openDownLeftOut.scss",
    "content": ".openDownLeftOut {\n  -webkit-animation-name: openDownLeftOut;\n  animation-name: openDownLeftOut;\n}\n@-webkit-keyframes openDownLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: bottom left;\n    transform-origin: bottom left;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects_out/_openDownRightOut.scss",
    "content": ".openDownRightOut {\n  -webkit-animation-name: openDownRightOut;\n  animation-name: openDownRightOut;\n}\n@-webkit-keyframes openDownRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: bottom right;\n    transform-origin: bottom right;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects_out/_openUpLeftOut.scss",
    "content": ".openUpLeftOut {\n  -webkit-animation-name: openUpLeftOut;\n  animation-name: openUpLeftOut;\n}\n@-webkit-keyframes openUpLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpLeftOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: top left;\n    transform-origin: top left;\n    -webkit-transform: rotate(110deg);\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/static_effects_out/_openUpRightOut.scss",
    "content": ".openUpRightOut {\n  -webkit-animation-name: openUpRightOut;\n  animation-name: openUpRightOut;\n}\n@-webkit-keyframes openUpRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpRightOut {\n  0% {\n    opacity: 1;\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform-origin: top right;\n    transform-origin: top right;\n    -webkit-transform: rotate(-110deg);\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinDownIn.scss",
    "content": ".tinDownIn {\n  -webkit-animation-name: tinDownIn;\n  animation-name: tinDownIn;\n}\n@-webkit-keyframes tinDownIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(900%);\n    transform: scale(1, 1) translateY(900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n}\n@keyframes tinDownIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(900%);\n    transform: scale(1, 1) translateY(900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinDownOut.scss",
    "content": ".tinDownOut {\n  -webkit-animation-name: tinDownOut;\n  animation-name: tinDownOut;\n}\n@-webkit-keyframes tinDownOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(900%);\n    transform: scale(1, 1) translateY(900%);\n  }\n}\n@keyframes tinDownOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(900%);\n    transform: scale(1, 1) translateY(900%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinLeftIn.scss",
    "content": ".tinLeftIn {\n  -webkit-animation-name: tinLeftIn;\n  animation-name: tinLeftIn;\n}\n@-webkit-keyframes tinLeftIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(-900%);\n    transform: scale(1, 1) translateX(-900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n}\n@keyframes tinLeftIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(-900%);\n    transform: scale(1, 1) translateX(-900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinLeftOut.scss",
    "content": ".tinLeftOut {\n  -webkit-animation-name: tinLeftOut;\n  animation-name: tinLeftOut;\n}\n@-webkit-keyframes tinLeftOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(-900%);\n    transform: scale(1, 1) translateX(-900%);\n  }\n}\n@keyframes tinLeftOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(-900%);\n    transform: scale(1, 1) translateX(-900%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinRightIn.scss",
    "content": ".tinRightIn {\n  -webkit-animation-name: tinRightIn;\n  animation-name: tinRightIn;\n}\n@-webkit-keyframes tinRightIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(900%);\n    transform: scale(1, 1) translateX(900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n}\n@keyframes tinRightIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(900%);\n    transform: scale(1, 1) translateX(900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinRightOut.scss",
    "content": ".tinRightOut {\n  -webkit-animation-name: tinRightOut;\n  animation-name: tinRightOut;\n}\n@-webkit-keyframes tinRightOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(900%);\n    transform: scale(1, 1) translateX(900%);\n  }\n}\n@keyframes tinRightOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateX(0);\n    transform: scale(1, 1) translateX(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateX(0);\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateX(900%);\n    transform: scale(1, 1) translateX(900%);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinUpIn.scss",
    "content": ".tinUpIn {\n  -webkit-animation-name: tinUpIn;\n  animation-name: tinUpIn;\n}\n@-webkit-keyframes tinUpIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(-900%);\n    transform: scale(1, 1) translateY(-900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n}\n@keyframes tinUpIn {\n  0% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(-900%);\n    transform: scale(1, 1) translateY(-900%);\n  }\n\n  50%,\n  70%,\n  90% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  60%,\n  80%,\n  100% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n}\n"
  },
  {
    "path": "assets/scss/tin/_tinUpOut.scss",
    "content": ".tinUpOut {\n  -webkit-animation-name: tinUpOut;\n  animation-name: tinUpOut;\n}\n@-webkit-keyframes tinUpOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(-900%);\n    transform: scale(1, 1) translateY(-900%);\n  }\n}\n@keyframes tinUpOut {\n  0%,\n  20%,\n  40%,\n  50% {\n    opacity: 1;\n    -webkit-transform: scale(1, 1) translateY(0);\n    transform: scale(1, 1) translateY(0);\n  }\n\n  10%,\n  30% {\n    opacity: 1;\n    -webkit-transform: scale(1.1, 1.1) translateY(0);\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n\n  100% {\n    opacity: 0;\n    -webkit-transform: scale(1, 1) translateY(-900%);\n    transform: scale(1, 1) translateY(-900%);\n  }\n}\n"
  },
  {
    "path": "dist/magic.css",
    "content": "/*!\n * Magic - https://www.minimamente.com\n * Licensed under the MIT license - https://opensource.org/licenses/MIT\n * Copyright (c) 2022 Christian Pucci\n */\n.puffIn {\n  -webkit-animation-name: puffIn;\n          animation-name: puffIn;\n}\n\n@-webkit-keyframes puffIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n@keyframes puffIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n.puffOut {\n  -webkit-animation-name: puffOut;\n          animation-name: puffOut;\n}\n\n@-webkit-keyframes puffOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n}\n@keyframes puffOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(2px);\n  }\n}\n.vanishIn {\n  -webkit-animation-name: vanishIn;\n          animation-name: vanishIn;\n}\n\n@-webkit-keyframes vanishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(90px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n@keyframes vanishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(90px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n}\n.vanishOut {\n  -webkit-animation-name: vanishOut;\n          animation-name: vanishOut;\n}\n\n@-webkit-keyframes vanishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(20px);\n  }\n}\n@keyframes vanishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(2, 2);\n    filter: blur(20px);\n  }\n}\n.boingInUp {\n  -webkit-animation-name: boingInUp;\n  animation-name: boingInUp;\n}\n\n@-webkit-keyframes boingInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(-90deg);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(50deg);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n@keyframes boingInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(-90deg);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(50deg);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n.boingOutDown {\n  -webkit-animation-name: boingOutDown;\n  animation-name: boingOutDown;\n}\n\n@-webkit-keyframes boingOutDown {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n  }\n  30% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n  }\n}\n@keyframes boingOutDown {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n  }\n  30% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 100% 100%;\n    transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n  }\n}\n.bombLeftOut {\n  -webkit-animation-name: bombLeftOut;\n  animation-name: bombLeftOut;\n}\n\n@-webkit-keyframes bombLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: rotate(0deg);\n    filter: blur(0px);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: -100% 50%;\n    transform: rotate(-160deg);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: -100% 50%;\n    transform: rotate(-160deg);\n    filter: blur(20px);\n  }\n}\n@keyframes bombLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: rotate(0deg);\n    filter: blur(0px);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: -100% 50%;\n    transform: rotate(-160deg);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: -100% 50%;\n    transform: rotate(-160deg);\n    filter: blur(20px);\n  }\n}\n.bombRightOut {\n  -webkit-animation-name: bombRightOut;\n  animation-name: bombRightOut;\n}\n\n@-webkit-keyframes bombRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: rotate(0deg);\n    filter: blur(0px);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: 200% 50%;\n    transform: rotate(160deg);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 200% 50%;\n    transform: rotate(160deg);\n    filter: blur(20px);\n  }\n}\n@keyframes bombRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: rotate(0deg);\n    filter: blur(0px);\n  }\n  50% {\n    opacity: 1;\n    transform-origin: 200% 50%;\n    transform: rotate(160deg);\n    filter: blur(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 200% 50%;\n    transform: rotate(160deg);\n    filter: blur(20px);\n  }\n}\n.magic {\n  -webkit-animation-name: magic;\n  animation-name: magic;\n}\n\n@-webkit-keyframes magic {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 200%;\n    transform: scale(1, 1) rotate(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 200% 500%;\n    transform: scale(0, 0) rotate(270deg);\n  }\n}\n@keyframes magic {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 200%;\n    transform: scale(1, 1) rotate(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 200% 500%;\n    transform: scale(0, 0) rotate(270deg);\n  }\n}\n.swap {\n  -webkit-animation-name: swap;\n  animation-name: swap;\n}\n\n@-webkit-keyframes swap {\n  0% {\n    opacity: 0;\n    transform-origin: 0 100%;\n    transform: scale(0, 0) translate(-700px, 0px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(1, 1) translate(0px, 0px);\n  }\n}\n@keyframes swap {\n  0% {\n    opacity: 0;\n    transform-origin: 0 100%;\n    transform: scale(0, 0) translate(-700px, 0px);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(1, 1) translate(0px, 0px);\n  }\n}\n.twisterInDown {\n  -webkit-animation-name: twisterInDown;\n  animation-name: twisterInDown;\n}\n\n@-webkit-keyframes twisterInDown {\n  0% {\n    opacity: 0;\n    transform-origin: 0 100%;\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n  30% {\n    transform-origin: 0 100%;\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(1, 1) rotate(0deg) translateY(0%);\n  }\n}\n@keyframes twisterInDown {\n  0% {\n    opacity: 0;\n    transform-origin: 0 100%;\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n  30% {\n    transform-origin: 0 100%;\n    transform: scale(0, 0) rotate(360deg) translateY(-100%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(1, 1) rotate(0deg) translateY(0%);\n  }\n}\n.twisterInUp {\n  -webkit-animation-name: twisterInUp;\n  animation-name: twisterInUp;\n}\n\n@-webkit-keyframes twisterInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 100% 0;\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n  30% {\n    transform-origin: 100% 0;\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: scale(1, 1) rotate(0deg) translateY(0);\n  }\n}\n@keyframes twisterInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 100% 0;\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n  30% {\n    transform-origin: 100% 0;\n    transform: scale(0, 0) rotate(360deg) translateY(100%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: scale(1, 1) rotate(0deg) translateY(0);\n  }\n}\n.foolishIn {\n  -webkit-animation-name: foolishIn;\n  animation-name: foolishIn;\n}\n\n@-webkit-keyframes foolishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotate(360deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  60% {\n    opacity: 1;\n    transform-origin: 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotate(0deg);\n  }\n}\n@keyframes foolishIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotate(360deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 100% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  60% {\n    opacity: 1;\n    transform-origin: 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotate(0deg);\n  }\n}\n.foolishOut {\n  -webkit-animation-name: foolishOut;\n  animation-name: foolishOut;\n}\n\n@-webkit-keyframes foolishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotate(360deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 100% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  60% {\n    opacity: 1;\n    transform-origin: 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotate(0deg);\n  }\n}\n@keyframes foolishOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotate(360deg);\n  }\n  20% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  40% {\n    opacity: 1;\n    transform-origin: 100% 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  60% {\n    opacity: 1;\n    transform-origin: 0%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scale(0.5, 0.5) rotate(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotate(0deg);\n  }\n}\n.holeOut {\n  -webkit-animation-name: holeOut;\n  animation-name: holeOut;\n}\n\n@-webkit-keyframes holeOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotateY(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotateY(180deg);\n  }\n}\n@keyframes holeOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1) rotateY(0deg);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0) rotateY(180deg);\n  }\n}\n.swashIn {\n  -webkit-animation-name: swashIn;\n  animation-name: swashIn;\n}\n\n@-webkit-keyframes swashIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0);\n  }\n  90% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(0.9, 0.9);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n  }\n}\n@keyframes swashIn {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0);\n  }\n  90% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(0.9, 0.9);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n  }\n}\n.swashOut {\n  -webkit-animation-name: swashOut;\n  animation-name: swashOut;\n}\n\n@-webkit-keyframes swashOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(0.9, 0.9);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0);\n  }\n}\n@keyframes swashOut {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(1, 1);\n  }\n  80% {\n    opacity: 1;\n    transform-origin: 50% 50%;\n    transform: scale(0.9, 0.9);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 50%;\n    transform: scale(0, 0);\n  }\n}\n.spaceInDown {\n  -webkit-animation-name: spaceInDown;\n  animation-name: spaceInDown;\n}\n\n@-webkit-keyframes spaceInDown {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: scale(0.2) translate(0%, 200%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 100%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInDown {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: scale(0.2) translate(0%, 200%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 100%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n.spaceInLeft {\n  -webkit-animation-name: spaceInLeft;\n  animation-name: spaceInLeft;\n}\n\n@-webkit-keyframes spaceInLeft {\n  0% {\n    opacity: 0;\n    transform-origin: 0% 50%;\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInLeft {\n  0% {\n    opacity: 0;\n    transform-origin: 0% 50%;\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n.spaceInRight {\n  -webkit-animation-name: spaceInRight;\n  animation-name: spaceInRight;\n}\n\n@-webkit-keyframes spaceInRight {\n  0% {\n    opacity: 0;\n    transform-origin: 100% 50%;\n    transform: scale(0.2) translate(200%, 0%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInRight {\n  0% {\n    opacity: 0;\n    transform-origin: 100% 50%;\n    transform: scale(0.2) translate(200%, 0%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 100% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n.spaceInUp {\n  -webkit-animation-name: spaceInUp;\n  animation-name: spaceInUp;\n}\n\n@-webkit-keyframes spaceInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: scale(0.2) translate(0%, -200%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n@keyframes spaceInUp {\n  0% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: scale(0.2) translate(0%, -200%);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: scale(1) translate(0%, 0%);\n  }\n}\n.spaceOutDown {\n  -webkit-animation-name: spaceOutDown;\n  animation-name: spaceOutDown;\n}\n\n@-webkit-keyframes spaceOutDown {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 100%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: scale(0.2) translate(0%, 200%);\n  }\n}\n@keyframes spaceOutDown {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 100%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: scale(0.2) translate(0%, 200%);\n  }\n}\n.spaceOutLeft {\n  -webkit-animation-name: spaceOutLeft;\n  animation-name: spaceOutLeft;\n}\n\n@-webkit-keyframes spaceOutLeft {\n  0% {\n    opacity: 1;\n    transform-origin: 0% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 0% 50%;\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n}\n@keyframes spaceOutLeft {\n  0% {\n    opacity: 1;\n    transform-origin: 0% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 0% 50%;\n    transform: scale(0.2) translate(-200%, 0%);\n  }\n}\n.spaceOutRight {\n  -webkit-animation-name: spaceOutRight;\n  animation-name: spaceOutRight;\n}\n\n@-webkit-keyframes spaceOutRight {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 100% 50%;\n    transform: scale(0.2) translate(200%, 0%);\n  }\n}\n@keyframes spaceOutRight {\n  0% {\n    opacity: 1;\n    transform-origin: 100% 50%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 100% 50%;\n    transform: scale(0.2) translate(200%, 0%);\n  }\n}\n.spaceOutUp {\n  -webkit-animation-name: spaceOutUp;\n  animation-name: spaceOutUp;\n}\n\n@-webkit-keyframes spaceOutUp {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: scale(0.2) translate(0%, -200%);\n  }\n}\n@keyframes spaceOutUp {\n  0% {\n    opacity: 1;\n    transform-origin: 50% 0%;\n    transform: scale(1) translate(0%, 0%);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0%;\n    transform: scale(0.2) translate(0%, -200%);\n  }\n}\n.perspectiveDown {\n  -webkit-animation-name: perspectiveDown;\n  animation-name: perspectiveDown;\n}\n\n@-webkit-keyframes perspectiveDown {\n  0% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n  100% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(-180deg);\n  }\n}\n@keyframes perspectiveDown {\n  0% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n  100% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(-180deg);\n  }\n}\n.perspectiveDownReturn {\n  -webkit-animation-name: perspectiveDownReturn;\n  animation-name: perspectiveDownReturn;\n}\n\n@-webkit-keyframes perspectiveDownReturn {\n  0% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(-180deg);\n  }\n  100% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n@keyframes perspectiveDownReturn {\n  0% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(-180deg);\n  }\n  100% {\n    transform-origin: 0 100%;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n.perspectiveLeft {\n  -webkit-animation-name: perspectiveLeft;\n  animation-name: perspectiveLeft;\n}\n\n@-webkit-keyframes perspectiveLeft {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(-180deg);\n  }\n}\n@keyframes perspectiveLeft {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(-180deg);\n  }\n}\n.perspectiveLeftReturn {\n  -webkit-animation-name: perspectiveLeftReturn;\n  animation-name: perspectiveLeftReturn;\n}\n\n@-webkit-keyframes perspectiveLeftReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(-180deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n@keyframes perspectiveLeftReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(-180deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n.perspectiveRight {\n  -webkit-animation-name: perspectiveRight;\n  animation-name: perspectiveRight;\n}\n\n@-webkit-keyframes perspectiveRight {\n  0% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n  100% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(180deg);\n  }\n}\n@keyframes perspectiveRight {\n  0% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n  100% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(180deg);\n  }\n}\n.perspectiveRightReturn {\n  -webkit-animation-name: perspectiveRightReturn;\n  animation-name: perspectiveRightReturn;\n}\n\n@-webkit-keyframes perspectiveRightReturn {\n  0% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(180deg);\n  }\n  100% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n@keyframes perspectiveRightReturn {\n  0% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(180deg);\n  }\n  100% {\n    transform-origin: 100% 0;\n    transform: perspective(800px) rotateY(0deg);\n  }\n}\n.perspectiveUp {\n  -webkit-animation-name: perspectiveUp;\n  animation-name: perspectiveUp;\n}\n\n@-webkit-keyframes perspectiveUp {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(180deg);\n  }\n}\n@keyframes perspectiveUp {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(180deg);\n  }\n}\n.perspectiveUpReturn {\n  -webkit-animation-name: perspectiveUpReturn;\n  animation-name: perspectiveUpReturn;\n}\n\n@-webkit-keyframes perspectiveUpReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(180deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n@keyframes perspectiveUpReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(180deg);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg);\n  }\n}\n.rotateDown {\n  -webkit-animation-name: rotateDown;\n  animation-name: rotateDown;\n}\n\n@-webkit-keyframes rotateDown {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n  }\n}\n@keyframes rotateDown {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 100%;\n    transform: perspective(800px) rotateX(-180deg) translateZ(300px);\n  }\n}\n.rotateLeft {\n  -webkit-animation-name: rotateLeft;\n  animation-name: rotateLeft;\n}\n\n@-webkit-keyframes rotateLeft {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n  }\n}\n@keyframes rotateLeft {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateY(-180deg) translateZ(300px);\n  }\n}\n.rotateRight {\n  -webkit-animation-name: rotateRight;\n  animation-name: rotateRight;\n}\n\n@-webkit-keyframes rotateRight {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg) translate3d(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateY(180deg) translateZ(150px);\n  }\n}\n@keyframes rotateRight {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateY(0deg) translate3d(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateY(180deg) translateZ(150px);\n  }\n}\n.rotateUp {\n  -webkit-animation-name: rotateUp;\n  animation-name: rotateUp;\n}\n\n@-webkit-keyframes rotateUp {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateX(180deg) translateZ(100px);\n  }\n}\n@keyframes rotateUp {\n  0% {\n    opacity: 1;\n    transform-origin: 0 0;\n    transform: perspective(800px) rotateX(0deg) translateZ(0px);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 50% 0;\n    transform: perspective(800px) rotateX(180deg) translateZ(100px);\n  }\n}\n.slideDown {\n  -webkit-animation-name: slideDown;\n  animation-name: slideDown;\n}\n\n@-webkit-keyframes slideDown {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(100%);\n  }\n}\n@keyframes slideDown {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(100%);\n  }\n}\n.slideDownReturn {\n  -webkit-animation-name: slideDownReturn;\n  animation-name: slideDownReturn;\n}\n\n@-webkit-keyframes slideDownReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n}\n@keyframes slideDownReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n}\n.slideLeft {\n  -webkit-animation-name: slideLeft;\n  animation-name: slideLeft;\n}\n\n@-webkit-keyframes slideLeft {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(-100%);\n  }\n}\n@keyframes slideLeft {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(-100%);\n  }\n}\n.slideLeftReturn {\n  -webkit-animation-name: slideLeftReturn;\n  animation-name: slideLeftReturn;\n}\n\n@-webkit-keyframes slideLeftReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(-100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n}\n@keyframes slideLeftReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(-100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n}\n.slideRight {\n  -webkit-animation-name: slideRight;\n  animation-name: slideRight;\n}\n\n@-webkit-keyframes slideRight {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(100%);\n  }\n}\n@keyframes slideRight {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(100%);\n  }\n}\n.slideRightReturn {\n  -webkit-animation-name: slideRightReturn;\n  animation-name: slideRightReturn;\n}\n\n@-webkit-keyframes slideRightReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n}\n@keyframes slideRightReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateX(100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateX(0%);\n  }\n}\n.slideUp {\n  -webkit-animation-name: slideUp;\n  animation-name: slideUp;\n}\n\n@-webkit-keyframes slideUp {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(-100%);\n  }\n}\n@keyframes slideUp {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(-100%);\n  }\n}\n.slideUpReturn {\n  -webkit-animation-name: slideUpReturn;\n  animation-name: slideUpReturn;\n}\n\n@-webkit-keyframes slideUpReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(-100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n}\n@keyframes slideUpReturn {\n  0% {\n    transform-origin: 0 0;\n    transform: translateY(-100%);\n  }\n  100% {\n    transform-origin: 0 0;\n    transform: translateY(0%);\n  }\n}\n.openDownLeft {\n  -webkit-animation-name: openDownLeft;\n  animation-name: openDownLeft;\n}\n\n@-webkit-keyframes openDownLeft {\n  0% {\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownLeft {\n  0% {\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openDownLeftReturn {\n  -webkit-animation-name: openDownLeftReturn;\n  animation-name: openDownLeftReturn;\n}\n\n@-webkit-keyframes openDownLeftReturn {\n  0% {\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openDownLeftReturn {\n  0% {\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n.openDownRight {\n  -webkit-animation-name: openDownRight;\n  animation-name: openDownRight;\n}\n\n@-webkit-keyframes openDownRight {\n  0% {\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownRight {\n  0% {\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openDownRightReturn {\n  -webkit-animation-name: openDownRightReturn;\n  animation-name: openDownRightReturn;\n}\n\n@-webkit-keyframes openDownRightReturn {\n  0% {\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openDownRightReturn {\n  0% {\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n.openUpLeft {\n  -webkit-animation-name: openUpLeft;\n  animation-name: openUpLeft;\n}\n\n@-webkit-keyframes openUpLeft {\n  0% {\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpLeft {\n  0% {\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openUpLeftReturn {\n  -webkit-animation-name: openUpLeftReturn;\n  animation-name: openUpLeftReturn;\n}\n\n@-webkit-keyframes openUpLeftReturn {\n  0% {\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openUpLeftReturn {\n  0% {\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n.openUpRight {\n  -webkit-animation-name: openUpRight;\n  animation-name: openUpRight;\n}\n\n@-webkit-keyframes openUpRight {\n  0% {\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpRight {\n  0% {\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openUpRightReturn {\n  -webkit-animation-name: openUpRightReturn;\n  animation-name: openUpRightReturn;\n}\n\n@-webkit-keyframes openUpRightReturn {\n  0% {\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n@keyframes openUpRightReturn {\n  0% {\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n  100% {\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n}\n.openDownLeftOut {\n  -webkit-animation-name: openDownLeftOut;\n  animation-name: openDownLeftOut;\n}\n\n@-webkit-keyframes openDownLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: bottom left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: bottom left;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openDownRightOut {\n  -webkit-animation-name: openDownRightOut;\n  animation-name: openDownRightOut;\n}\n\n@-webkit-keyframes openDownRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openDownRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: bottom right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: bottom right;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openUpLeftOut {\n  -webkit-animation-name: openUpLeftOut;\n  animation-name: openUpLeftOut;\n}\n\n@-webkit-keyframes openUpLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpLeftOut {\n  0% {\n    opacity: 1;\n    transform-origin: top left;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: top left;\n    transform: rotate(110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.openUpRightOut {\n  -webkit-animation-name: openUpRightOut;\n  animation-name: openUpRightOut;\n}\n\n@-webkit-keyframes openUpRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n@keyframes openUpRightOut {\n  0% {\n    opacity: 1;\n    transform-origin: top right;\n    transform: rotate(0deg);\n    -webkit-animation-timing-function: ease-out;\n    animation-timing-function: ease-out;\n  }\n  100% {\n    opacity: 0;\n    transform-origin: top right;\n    transform: rotate(-110deg);\n    -webkit-animation-timing-function: ease-in-out;\n    animation-timing-function: ease-in-out;\n  }\n}\n.tinDownIn {\n  -webkit-animation-name: tinDownIn;\n  animation-name: tinDownIn;\n}\n\n@-webkit-keyframes tinDownIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n}\n@keyframes tinDownIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n}\n.tinDownOut {\n  -webkit-animation-name: tinDownOut;\n  animation-name: tinDownOut;\n}\n\n@-webkit-keyframes tinDownOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(900%);\n  }\n}\n@keyframes tinDownOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(900%);\n  }\n}\n.tinLeftIn {\n  -webkit-animation-name: tinLeftIn;\n  animation-name: tinLeftIn;\n}\n\n@-webkit-keyframes tinLeftIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(-900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n}\n@keyframes tinLeftIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(-900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n}\n.tinLeftOut {\n  -webkit-animation-name: tinLeftOut;\n  animation-name: tinLeftOut;\n}\n\n@-webkit-keyframes tinLeftOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(-900%);\n  }\n}\n@keyframes tinLeftOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(-900%);\n  }\n}\n.tinRightIn {\n  -webkit-animation-name: tinRightIn;\n  animation-name: tinRightIn;\n}\n\n@-webkit-keyframes tinRightIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n}\n@keyframes tinRightIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n}\n.tinRightOut {\n  -webkit-animation-name: tinRightOut;\n  animation-name: tinRightOut;\n}\n\n@-webkit-keyframes tinRightOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(900%);\n  }\n}\n@keyframes tinRightOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateX(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateX(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateX(900%);\n  }\n}\n.tinUpIn {\n  -webkit-animation-name: tinUpIn;\n  animation-name: tinUpIn;\n}\n\n@-webkit-keyframes tinUpIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(-900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n}\n@keyframes tinUpIn {\n  0% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(-900%);\n  }\n  50%, 70%, 90% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  60%, 80%, 100% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n}\n.tinUpOut {\n  -webkit-animation-name: tinUpOut;\n  animation-name: tinUpOut;\n}\n\n@-webkit-keyframes tinUpOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(-900%);\n  }\n}\n@keyframes tinUpOut {\n  0%, 20%, 40%, 50% {\n    opacity: 1;\n    transform: scale(1, 1) translateY(0);\n  }\n  10%, 30% {\n    opacity: 1;\n    transform: scale(1.1, 1.1) translateY(0);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1, 1) translateY(-900%);\n  }\n}\n.magictime {\n  -webkit-animation-duration: 1s;\n          animation-duration: 1s;\n  -webkit-animation-fill-mode: both;\n          animation-fill-mode: both;\n}\n\n@media (print), (prefers-reduced-motion) {\n  .magictime {\n    -webkit-animation: unset !important;\n            animation: unset !important;\n    transition: none !important;\n  }\n}\n/*# sourceMappingURL=magic.css.map */"
  },
  {
    "path": "gulpfile.js",
    "content": "/**\n * Gulp\n *\n * npm i --save-dev gulp sass gulp-sass postcss gulp-postcss autoprefixer gulp-rename cssnano gulp-cssnano\n *\n * @see https://gulpjs.com/\n */\n\nconst { src, dest, watch, parallel } = require('gulp');\nconst sass = require('gulp-sass')(require('sass'));\nconst postcss = require('gulp-postcss');\nconst autoprefixer = require('autoprefixer');\nconst cssnano = require('cssnano');\nconst rename = require('gulp-rename');\n\n// Define project paths\nlet paths = {\n    styles: {\n        // grab all .scss files from that path\n        src: 'assets/scss/*.scss',\n        // destination path\n        dest: 'dist'\n    }\n};\n\n// SCSS\nfunction style() {\n    return src(paths.styles.src, { sourcemaps: true })\n        .pipe(sass().on(\"error\", sass.logError))\n        .pipe(postcss([ autoprefixer() ]))\n        .pipe(dest(paths.styles.dest, { sourcemaps: '.' }))\n}\n\nfunction styleMin() {\n    return src(paths.styles.src, { sourcemaps: true })\n        .pipe(sass().on(\"error\", sass.logError))\n        .pipe(postcss([ autoprefixer(), cssnano() ]))\n        .pipe(rename({ extname: '.min.css' }))\n        .pipe(dest(paths.styles.dest, { sourcemaps: '.' }));\n}\n\n\n// Watchers\nwatch('assets/scss/*.scss', style);\n\n// Yo baby!! ✌️\nexports.default = parallel( style, styleMin );"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"magic.css\",\n  \"version\": \"1.4.8\",\n  \"description\": \"Magic CSS3 animations\",\n  \"main\": \"index.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/miniMAC/magic.git\"\n  },\n  \"author\": \"Christian Pucci <minimac@minimamente.com> (https://www.minimamente.com/)\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/miniMAC/magic/issues\"\n  },\n  \"homepage\": \"https://github.com/miniMAC/magic#readme\",\n  \"devDependencies\": {\n    \"autoprefixer\": \"^10.3.7\",\n    \"cssnano\": \"^5.0.8\",\n    \"gulp\": \"^4.0.2\",\n    \"gulp-cssnano\": \"^1.1.0\",\n    \"gulp-postcss\": \"^9.0.1\",\n    \"gulp-rename\": \"^2.0.0\",\n    \"gulp-sass\": \"^5.1.0\",\n    \"np\": \"^7.6.2\",\n    \"postcss\": \"^8.3.9\",\n    \"sass\": \"^1.49.8\"\n  },\n  \"keywords\": [\n    \"css\",\n    \"css3\",\n    \"animation\",\n    \"animations\",\n    \"magic\"\n  ]\n}\n"
  }
]