├── .DS_Store ├── .gitattributes ├── src ├── index.tsx ├── Loading │ ├── index.tsx │ └── index.css ├── Icons │ ├── Send.tsx │ ├── UserAvater.tsx │ └── AiAvater.tsx ├── Evoil │ ├── index.tsx │ └── index.css └── Search │ ├── index.css │ └── index.tsx ├── README.md ├── public └── index.html ├── webpack.config.js ├── package.json ├── LICENSE ├── .gitignore └── tsconfig.json /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KiritoCheng/openai-public/HEAD/.DS_Store -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import Search from "./Search"; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById("root") 10 | ); 11 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # openai-public 2 | 项目示例：https://kiritosa.com/ai/ 3 | 搭配openai3.5接口写出的聊天AI页，后端项目请前往[openai-server](https://github.com/KiritoCheng/openai-server)仓库查看。 4 | 5 | ![image](https://user-images.githubusercontent.com/19926113/231107329-c43a1592-aef5-412d-a42b-2c49342b8921.png) 6 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | OpenAI Chart 7 | 8 | 9 |
10 | 11 | 12 | -------------------------------------------------------------------------------- /src/Loading/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import "./index.css"; 3 | 4 | export const Loading = () => { 5 | return ( 6 |
7 | Please wait  8 | 9 | . 10 | . 11 | . 12 | 13 |
14 | ); 15 | }; 16 | -------------------------------------------------------------------------------- /src/Loading/index.css: -------------------------------------------------------------------------------- 1 | .waiting-dots { 2 | display: inline-block; 3 | font-size: 24px; 4 | } 5 | 6 | .waiting-dots span { 7 | animation: blink 1.5s infinite; 8 | opacity: 0; 9 | animation-delay: 0s; 10 | display: inline-block; 11 | } 12 | 13 | .waiting-dots span:nth-child(2) { 14 | animation-delay: 0.5s; 15 | } 16 | 17 | .waiting-dots span:nth-child(3) { 18 | animation-delay: 1s; 19 | } 20 | 21 | @keyframes blink { 22 | from { 23 | opacity: 0; 24 | } 25 | to { 26 | opacity: 1; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/Icons/Send.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | export const SendIcon = () => { 4 | return ( 5 | 16 | 17 | 18 | 19 | ); 20 | }; 21 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 3 | 4 | module.exports = { 5 | entry: './src/index.tsx', 6 | output: { 7 | path: path.join(__dirname, '/dist'), 8 | filename: 'bundle.min.js', 9 | }, 10 | module: { 11 | rules: [ 12 | { 13 | test: /\.tsx?$/, 14 | loader: 'ts-loader', 15 | }, 16 | { 17 | test: /\.css$/, 18 | use: ['style-loader', 'css-loader'] 19 | } 20 | ], 21 | }, 22 | plugins: [ 23 | new HtmlWebpackPlugin({ 24 | template: './public/index.html', 25 | }), 26 | ], 27 | resolve: { 28 | extensions: ['.ts', '.tsx', '.js'], 29 | }, 30 | }; 31 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "openai-public", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "webpack serve --mode development", 9 | "build": "webpack --mode production", 10 | "build-dev": "webpack --mode development" 11 | }, 12 | "keywords": [], 13 | "author": "", 14 | "license": "ISC", 15 | "devDependencies": { 16 | "@types/prismjs": "^1.26.0", 17 | "@types/react": "^18.0.30", 18 | "@types/react-dom": "^18.0.11", 19 | "css-loader": "^6.7.3", 20 | "html-webpack-plugin": "^5.5.0", 21 | "prism-themes": "^1.9.0", 22 | "react": "^18.2.0", 23 | "react-dom": "^18.2.0", 24 | "style-loader": "^3.3.2", 25 | "ts-loader": "^9.4.2", 26 | "typescript": "^5.0.2", 27 | "webpack": "^5.76.3", 28 | "webpack-cli": "^5.0.1", 29 | "webpack-dev-server": "^4.13.1" 30 | }, 31 | "dependencies": { 32 | "prismjs": "^1.29.0" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 Kirito 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /src/Icons/UserAvater.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | export const UserAvater = () => { 4 | return ( 5 | 16 | ); 17 | }; 18 | -------------------------------------------------------------------------------- /src/Evoil/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import "./index.css"; 3 | 4 | export const Evoil = () => { 5 | return ( 6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 | ); 71 | }; 72 | -------------------------------------------------------------------------------- /src/Search/index.css: -------------------------------------------------------------------------------- 1 | code { 2 | color: #cb3837; 3 | margin: 0 6px; 4 | } 5 | 6 | .container { 7 | width: 100%; 8 | } 9 | 10 | @media screen and (max-width: 768px) { 11 | .search-container { 12 | width: 90%; 13 | top: 60px; 14 | left: 50%; 15 | transform: translate(-50%, 0); 16 | } 17 | .result-container { 18 | width: 100%; 19 | margin: 0 auto; 20 | } 21 | .back-container { 22 | padding: 24px; 23 | padding-top: 120px; 24 | } 25 | } 26 | @media screen and (min-width: 768px) { 27 | .search-container { 28 | width: 584px; 29 | bottom: 60px; 30 | left: 50%; 31 | transform: translate(-50%, 0); 32 | } 33 | .result-container { 34 | margin: 0 auto; 35 | margin-bottom: 20px; 36 | width: 768px; 37 | } 38 | .back-container { 39 | padding-bottom: 200px; 40 | } 41 | } 42 | 43 | .search-container { 44 | background-color: #fff; 45 | box-shadow: 0 1px 6px rgba(32, 33, 36, 0.28); 46 | border-color: rgba(223, 225, 229, 0); 47 | display: flex; 48 | height: 44px; 49 | border: 1px solid #dfe1e5; 50 | border-radius: 24px; 51 | position: fixed; 52 | z-index: 999; 53 | } 54 | 55 | .input-left { 56 | display: flex; 57 | align-items: center; 58 | padding-right: 13px; 59 | margin-top: -5px; 60 | } 61 | .input-right { 62 | display: flex; 63 | flex: 0 0 auto; 64 | align-items: stretch; 65 | flex-direction: row; 66 | padding-left: 4px; 67 | } 68 | .input-right .btn { 69 | flex: 1 0 auto; 70 | display: flex; 71 | cursor: pointer; 72 | align-items: center; 73 | border: 0; 74 | background: transparent; 75 | outline: none; 76 | padding: 0 8px; 77 | width: 24px; 78 | line-height: 44px; 79 | color: #9aa0a6; 80 | } 81 | 82 | .input-box { 83 | display: flex; 84 | flex: 1; 85 | flex-wrap: wrap; 86 | } 87 | 88 | .input-box input { 89 | background-color: transparent; 90 | border: none; 91 | margin: 0; 92 | padding: 0; 93 | color: rgba(0, 0, 0, 0.87); 94 | word-wrap: break-word; 95 | outline: none; 96 | display: flex; 97 | -webkit-tap-highlight-color: transparent; 98 | font-size: 16px; 99 | flex: 100%; 100 | font-family: arial, sans-serif; 101 | } 102 | 103 | .ai-container, 104 | .question-container { 105 | border-radius: 8px; 106 | padding: 12px; 107 | word-break: break-all; 108 | display: flex; 109 | } 110 | .ai-container { 111 | background-color: rgba(247, 247, 248, 1); 112 | } 113 | .avater { 114 | flex-basis: 42px; 115 | } 116 | .result { 117 | flex: 1; 118 | } 119 | .result > div > p:first-child { 120 | margin: 0; 121 | } 122 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | .pnpm-debug.log* 9 | 10 | # Diagnostic reports (https://nodejs.org/api/report.html) 11 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 12 | 13 | # Runtime data 14 | pids 15 | *.pid 16 | *.seed 17 | *.pid.lock 18 | 19 | # Directory for instrumented libs generated by jscoverage/JSCover 20 | lib-cov 21 | 22 | # Coverage directory used by tools like istanbul 23 | coverage 24 | *.lcov 25 | 26 | # nyc test coverage 27 | .nyc_output 28 | 29 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 30 | .grunt 31 | 32 | # Bower dependency directory (https://bower.io/) 33 | bower_components 34 | 35 | # node-waf configuration 36 | .lock-wscript 37 | 38 | # Compiled binary addons (https://nodejs.org/api/addons.html) 39 | build/Release 40 | 41 | # Dependency directories 42 | node_modules/ 43 | jspm_packages/ 44 | 45 | # Snowpack dependency directory (https://snowpack.dev/) 46 | web_modules/ 47 | 48 | # TypeScript cache 49 | *.tsbuildinfo 50 | 51 | # Optional npm cache directory 52 | .npm 53 | 54 | # Optional eslint cache 55 | .eslintcache 56 | 57 | # Optional stylelint cache 58 | .stylelintcache 59 | 60 | # Microbundle cache 61 | .rpt2_cache/ 62 | .rts2_cache_cjs/ 63 | .rts2_cache_es/ 64 | .rts2_cache_umd/ 65 | 66 | # Optional REPL history 67 | .node_repl_history 68 | 69 | # Output of 'npm pack' 70 | *.tgz 71 | 72 | # Yarn Integrity file 73 | .yarn-integrity 74 | 75 | # dotenv environment variable files 76 | .env 77 | .env.development.local 78 | .env.test.local 79 | .env.production.local 80 | .env.local 81 | 82 | # parcel-bundler cache (https://parceljs.org/) 83 | .cache 84 | .parcel-cache 85 | 86 | # Next.js build output 87 | .next 88 | out 89 | 90 | # Nuxt.js build / generate output 91 | .nuxt 92 | dist 93 | 94 | # Gatsby files 95 | .cache/ 96 | # Comment in the public line in if your project uses Gatsby and not Next.js 97 | # https://nextjs.org/blog/next-9-1#public-directory-support 98 | # public 99 | 100 | # vuepress build output 101 | .vuepress/dist 102 | 103 | # vuepress v2.x temp and cache directory 104 | .temp 105 | .cache 106 | 107 | # Serverless directories 108 | .serverless/ 109 | 110 | # FuseBox cache 111 | .fusebox/ 112 | 113 | # DynamoDB Local files 114 | .dynamodb/ 115 | 116 | # TernJS port file 117 | .tern-port 118 | 119 | # Stores VSCode versions used for testing VSCode extensions 120 | .vscode-test 121 | 122 | # yarn v2 123 | .yarn/cache 124 | .yarn/unplugged 125 | .yarn/build-state.yml 126 | .yarn/install-state.gz 127 | .pnp.* 128 | -------------------------------------------------------------------------------- /src/Search/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { AiAvater } from "../Icons/AiAvater"; 3 | import { UserAvater } from "../Icons/UserAvater"; 4 | import "./index.css"; 5 | import Prism from "prismjs"; 6 | import "prism-themes/themes/prism-one-light.css"; 7 | import { SendIcon } from "../Icons/Send"; 8 | import { Loading } from "../Loading"; 9 | import { Evoil } from "../Evoil"; 10 | 11 | const Search = () => { 12 | const [apiData, setApiData] = useState(""); 13 | const [resultList, setResult] = useState([] as any); 14 | const [qaList, setQa] = useState([] as any); 15 | const [loading, setLoading] = useState(false); 16 | 17 | useEffect(() => { 18 | Prism.highlightAll(); 19 | }, [resultList]); 20 | 21 | const requestData = () => { 22 | if (loading === true) return; 23 | if (!(apiData && apiData !== "")) return; 24 | 25 | setApiData(""); 26 | setLoading(true); 27 | setQa([...qaList, apiData]); 28 | 29 | const apiUrl = "https://kiritosa.com:1200/api/chart"; 30 | fetch(apiUrl + `?content=${apiData}`) 31 | .then((res) => res.json()) 32 | .then(function (response) { 33 | const htmlString = response.data || ""; 34 | const dom: any = React.createElement("div", { 35 | dangerouslySetInnerHTML: { __html: htmlString }, 36 | }); 37 | setResult([...resultList, dom]); 38 | }) 39 | .catch(function (error) { 40 | console.log(error); 41 | setResult([...resultList, "请求出错！"]); 42 | }) 43 | .finally(() => { 44 | setLoading(false); 45 | }); 46 | }; 47 | 48 | return ( 49 |
50 |
51 |
52 |
53 | { 58 | setApiData(e.target.value); 59 | }} 60 | onKeyDown={(e: any) => { 61 | if (e.key === "Enter") { 62 | // 处理用户按下回车键的操作 63 | requestData(); 64 | } 65 | }} 66 | /> 67 |
68 | 69 |
70 |
71 | 72 |
73 |
74 |
75 | 76 |
77 | {qaList.length > 0 && 78 | qaList.map((item: any, index: any) => { 79 | const res = resultList[index]; 80 | return ( 81 |
82 |
83 |
84 | 85 |
86 |
{item}
87 |
88 | 89 |
90 |
91 | 92 |
93 | {res ? ( 94 |
{res}
95 | ) : ( 96 | 97 | )} 98 |
99 |
100 | ); 101 | })} 102 | 103 |
104 |
105 | ); 106 | }; 107 | 108 | export default Search; 109 | -------------------------------------------------------------------------------- /src/Icons/AiAvater.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | export const AiAvater = () => { 4 | return ( 5 | 13 | 17 | 18 | ); 19 | }; 20 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "jsx": "react", 4 | /* Visit https://aka.ms/tsconfig to read more about this file */ 5 | 6 | /* Projects */ 7 | // "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */ 8 | // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ 9 | // "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */ 10 | // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */ 11 | // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ 12 | // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ 13 | 14 | /* Language and Environment */ 15 | "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ 16 | // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ 17 | // "jsx": "preserve", /* Specify what JSX code is generated. */ 18 | // "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */ 19 | // "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ 20 | // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */ 21 | // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ 22 | // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */ 23 | // "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */ 24 | // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ 25 | // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ 26 | // "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */ 27 | 28 | /* Modules */ 29 | "module": "commonjs", /* Specify what module code is generated. */ 30 | // "rootDir": "./", /* Specify the root folder within your source files. */ 31 | // "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */ 32 | // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ 33 | // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ 34 | // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ 35 | // "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */ 36 | // "types": [], /* Specify type package names to be included without being referenced in a source file. */ 37 | // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ 38 | // "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */ 39 | // "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */ 40 | // "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */ 41 | // "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */ 42 | // "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */ 43 | // "resolveJsonModule": true, /* Enable importing .json files. */ 44 | // "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */ 45 | // "noResolve": true, /* Disallow 'import's, 'require's or ''s from expanding the number of files TypeScript should add to a project. */ 46 | 47 | /* JavaScript Support */ 48 | // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */ 49 | // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ 50 | // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */ 51 | 52 | /* Emit */ 53 | // "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ 54 | // "declarationMap": true, /* Create sourcemaps for d.ts files. */ 55 | // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ 56 | // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ 57 | // "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ 58 | // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ 59 | // "outDir": "./", /* Specify an output folder for all emitted files. */ 60 | // "removeComments": true, /* Disable emitting comments. */ 61 | // "noEmit": true, /* Disable emitting files from a compilation. */ 62 | // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ 63 | // "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */ 64 | // "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ 65 | // "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ 66 | // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ 67 | // "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ 68 | // "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ 69 | // "newLine": "crlf", /* Set the newline character for emitting files. */ 70 | // "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */ 71 | // "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */ 72 | // "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ 73 | // "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */ 74 | // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ 75 | // "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ 76 | 77 | /* Interop Constraints */ 78 | // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ 79 | // "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */ 80 | // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ 81 | "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ 82 | // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ 83 | "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ 84 | 85 | /* Type Checking */ 86 | "strict": true, /* Enable all strict type-checking options. */ 87 | // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */ 88 | // "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */ 89 | // "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ 90 | // "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */ 91 | // "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ 92 | // "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */ 93 | // "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */ 94 | // "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ 95 | // "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */ 96 | // "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */ 97 | // "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ 98 | // "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ 99 | // "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ 100 | // "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */ 101 | // "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ 102 | // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */ 103 | // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ 104 | // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ 105 | 106 | /* Completeness */ 107 | // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ 108 | "skipLibCheck": true /* Skip type checking all .d.ts files. */ 109 | } 110 | } 111 | -------------------------------------------------------------------------------- /src/Evoil/index.css: -------------------------------------------------------------------------------- 1 | #header #sky .container, 2 | .headband .eye > .eyelid, 3 | .page-archive .group-picture-container, 4 | .post .group-picture-row, 5 | .site-overview-wrap, 6 | svg:not(:root) { 7 | overflow: hidden; 8 | } 9 | 10 | @media screen and (max-width: 768px) { 11 | .headband { 12 | bottom: -80px; 13 | } 14 | } 15 | @media screen and (min-width: 768px) { 16 | .headband { 17 | bottom: -50px; 18 | } 19 | } 20 | .headband { 21 | position: fixed; 22 | 23 | left: -20px; 24 | -webkit-transform: scale(0.6); 25 | -moz-transform: scale(0.6); 26 | -ms-transform: scale(0.6); 27 | -o-transform: scale(0.6); 28 | transform: scale(0.6); 29 | } 30 | 31 | .headband .eevee * { 32 | position: absolute; 33 | } 34 | 35 | .headband .body { 36 | -webkit-animation: body 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 37 | infinite; 38 | animation: body 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 39 | height: 100px; 40 | position: absolute; 41 | width: 125px; 42 | top: 164px; 43 | left: 140px; 44 | background: #c49152; 45 | border-top-right-radius: 30%; 46 | border-bottom-right-radius: 50%; 47 | border-bottom-left-radius: 70%; 48 | box-shadow: inset -15px 0 0 #9d7442; 49 | } 50 | 51 | .headband .chest { 52 | -webkit-animation: chest 10s 50ms cubic-bezier(0.645, 0.045, 0.355, 1) both 53 | infinite; 54 | animation: chest 10s 50ms cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 55 | height: 110%; 56 | width: 130px; 57 | left: -30px; 58 | z-index: 1; 59 | } 60 | 61 | .headband .fur { 62 | height: 80px; 63 | width: 80px; 64 | top: 0; 65 | border-radius: 50%; 66 | background: -webkit-linear-gradient( 67 | bottom, 68 | #efe1af, 69 | #fff 40%, 70 | #fff 50%, 71 | #efe1af 75% 72 | ); 73 | background: linear-gradient(to top, #efe1af, #fff 40%, #fff 50%, #efe1af 75%); 74 | } 75 | 76 | .headband .fur:first-child { 77 | -webkit-animation: fur-center 10s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1) 78 | both infinite; 79 | animation: fur-center 10s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1) both 80 | infinite; 81 | height: 110px; 82 | width: 110px; 83 | left: calc(50% - 55px); 84 | z-index: 1; 85 | box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.2), 3px 0 15px rgba(0, 0, 0, 0.2); 86 | } 87 | 88 | .headband .fur:first-child > .patch { 89 | height: 50%; 90 | width: 50%; 91 | left: 25%; 92 | -webkit-transform-style: none; 93 | transform-style: none; 94 | bottom: 8%; 95 | } 96 | 97 | .headband .fur:first-child > .patch:before { 98 | -webkit-animation: fur-center-patch-left 10s 0s 99 | cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 100 | animation: fur-center-patch-left 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) 101 | both infinite; 102 | left: 25%; 103 | top: 0; 104 | -webkit-transform: rotate(65deg) skewX(15deg); 105 | -moz-transform: rotate(65deg) skewX(15deg); 106 | -ms-transform: rotate(65deg) skewX(15deg); 107 | -o-transform: rotate(65deg) skewX(15deg); 108 | transform: rotate(65deg) skewX(15deg); 109 | box-shadow: 2px 0 #bfb48c; 110 | background: -webkit-linear-gradient( 111 | 135deg, 112 | #bfb48c, 113 | #efe1af 9%, 114 | transparent 20% 115 | ); 116 | background: linear-gradient(-45deg, #bfb48c, #efe1af 9%, transparent 20%); 117 | border-top-right-radius: 60%; 118 | border-bottom-right-radius: 8%; 119 | } 120 | 121 | .headband .fur:first-child > .patch:after { 122 | -webkit-animation: fur-center-patch-right 10s 70ms 123 | cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 124 | animation: fur-center-patch-right 10s 70ms 125 | cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 126 | left: initial; 127 | right: 25%; 128 | top: 0; 129 | -webkit-transform: rotate(35deg) skewX(15deg); 130 | -moz-transform: rotate(35deg) skewX(15deg); 131 | -ms-transform: rotate(35deg) skewX(15deg); 132 | -o-transform: rotate(35deg) skewX(15deg); 133 | transform: rotate(35deg) skewX(15deg); 134 | box-shadow: 0 3px #bfb48c; 135 | background: -webkit-linear-gradient( 136 | 127deg, 137 | #bfb48c, 138 | #efe1af 9%, 139 | transparent 20% 140 | ); 141 | background: linear-gradient(-37deg, #bfb48c, #efe1af 9%, transparent 20%); 142 | border-top-right-radius: 0; 143 | border-bottom-left-radius: 60%; 144 | border-bottom-right-radius: 8%; 145 | } 146 | 147 | .headband .fur:nth-child(2) { 148 | left: -3px; 149 | } 150 | 151 | .headband .fur:nth-child(3) { 152 | -webkit-animation: fur-right 10s 0.15s cubic-bezier(0.645, 0.045, 0.355, 1) 153 | both infinite; 154 | animation: fur-right 10s 0.15s cubic-bezier(0.645, 0.045, 0.355, 1) both 155 | infinite; 156 | right: -20px; 157 | } 158 | 159 | .headband .fur > .patch:after, 160 | .headband .fur > .patch:before { 161 | content: ""; 162 | display: block; 163 | position: absolute; 164 | width: 100%; 165 | height: 100%; 166 | border-bottom-left-radius: 100%; 167 | background: -webkit-linear-gradient( 168 | 120deg, 169 | #bfb48c, 170 | #efe1af 6%, 171 | #fff 55%, 172 | transparent 173 | ); 174 | background: linear-gradient( 175 | -30deg, 176 | #bfb48c, 177 | #efe1af 6%, 178 | #fff 55%, 179 | transparent 180 | ); 181 | } 182 | 183 | .headband .fur:not(:first-child) > .patch { 184 | height: 35%; 185 | width: 35%; 186 | bottom: 10%; 187 | left: 30%; 188 | } 189 | 190 | .headband .fur:not(:first-child) > .patch:after, 191 | .headband .fur:not(:first-child) > .patch:before { 192 | -webkit-animation: fur-right-patch 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) 193 | both infinite; 194 | animation: fur-right-patch 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 195 | infinite; 196 | -webkit-transform-origin: top left; 197 | transform-origin: top left; 198 | box-shadow: 2px 0 #bfb48c; 199 | border-top-right-radius: 75%; 200 | border-bottom-right-radius: 10%; 201 | } 202 | 203 | .headband .fur:not(:first-child) > .patch:before { 204 | left: 150%; 205 | top: -25%; 206 | } 207 | 208 | .headband .fur:not(:first-child) > .patch:after { 209 | -webkit-animation-delay: 0.1s; 210 | animation-delay: 0.1s; 211 | left: 100%; 212 | top: 0; 213 | } 214 | 215 | .headband .head { 216 | height: 149px; 217 | width: 144px; 218 | top: -110px; 219 | left: -35px; 220 | z-index: 10; 221 | -webkit-animation: head 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 222 | infinite; 223 | animation: head 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 224 | -webkit-transform-style: preserve-3d; 225 | transform-style: preserve-3d; 226 | -webkit-perspective: 1000px; 227 | perspective: 1000px; 228 | } 229 | 230 | .headband .head:before { 231 | content: ""; 232 | position: absolute; 233 | display: block; 234 | height: 100%; 235 | width: 100%; 236 | top: 0; 237 | left: 0; 238 | } 239 | 240 | .headband .head:after { 241 | content: ""; 242 | position: absolute; 243 | display: block; 244 | height: 20%; 245 | width: 20%; 246 | -webkit-transform: skewX(30deg) rotate(40deg); 247 | -moz-transform: skewX(30deg) rotate(40deg); 248 | -ms-transform: skewX(30deg) rotate(40deg); 249 | -o-transform: skewX(30deg) rotate(40deg); 250 | transform: skewX(30deg) rotate(40deg); 251 | left: 50%; 252 | top: -2%; 253 | background: #c49152; 254 | box-shadow: -15px 8px #ca9d65, -25px 22px #cca069, -35px 50px #cda36f; 255 | z-index: -1; 256 | } 257 | 258 | .headband .face { 259 | position: absolute; 260 | top: 0; 261 | left: 0; 262 | height: 100%; 263 | width: 100%; 264 | background: -webkit-linear-gradient( 265 | bottom right, 266 | #9d7442, 267 | #c49152 60%, 268 | #c49152 70%, 269 | #d7b58b 100% 270 | ); 271 | background: linear-gradient( 272 | to top left, 273 | #9d7442, 274 | #c49152 60%, 275 | #c49152 70%, 276 | #d7b58b 100% 277 | ); 278 | } 279 | 280 | .headband .face, 281 | .headband .face:before { 282 | border-radius: 40% 40% 50% 50%/50% 50% 30% 30%; 283 | } 284 | 285 | .headband .face:before { 286 | -webkit-animation: head-shadow 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) 287 | both infinite; 288 | animation: head-shadow 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 289 | infinite; 290 | content: ""; 291 | display: block; 292 | position: absolute; 293 | height: 100%; 294 | width: 100%; 295 | background: -webkit-radial-gradient( 296 | farthest-side, 297 | rgba(0, 0, 0, 0.6), 298 | rgba(0, 0, 0, 0) 299 | ); 300 | background: radial-gradient( 301 | farthest-side, 302 | rgba(0, 0, 0, 0.6), 303 | rgba(0, 0, 0, 0) 304 | ); 305 | z-index: -1; 306 | top: 20%; 307 | left: 0; 308 | } 309 | 310 | .headband .ears { 311 | width: 100%; 312 | height: 54px; 313 | z-index: -2; 314 | } 315 | 316 | .headband .ear { 317 | width: 160px; 318 | height: 70px; 319 | left: 50%; 320 | bottom: 10%; 321 | -webkit-transform-origin: bottom left; 322 | transform-origin: bottom left; 323 | -webkit-transform: translateX(40px); 324 | -moz-transform: translateX(40px); 325 | -ms-transform: translateX(40px); 326 | -o-transform: translateX(40px); 327 | transform: translateX(40px); 328 | } 329 | 330 | .headband .ear:after, 331 | .headband .ear:before { 332 | -webkit-animation: ear 10s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1) both 333 | infinite; 334 | animation: ear 10s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 335 | -webkit-animation-delay: 50ms; 336 | animation-delay: 50ms; 337 | content: ""; 338 | position: absolute; 339 | top: 0; 340 | left: 0; 341 | width: 100%; 342 | height: 100%; 343 | -webkit-transform: skewX(-25deg) skewY(5deg); 344 | -moz-transform: skewX(-25deg) skewY(5deg); 345 | -ms-transform: skewX(-25deg) skewY(5deg); 346 | -o-transform: skewX(-25deg) skewY(5deg); 347 | transform: skewX(-25deg) skewY(5deg); 348 | background: -webkit-radial-gradient(farthest-side, #6a3c1c, #5a3318); 349 | background: radial-gradient(farthest-side, #6a3c1c, #5a3318); 350 | -webkit-transform-origin: bottom left; 351 | transform-origin: bottom left; 352 | border: 12px solid #260f02; 353 | border-top-left-radius: 100%; 354 | border-bottom-right-radius: 100%; 355 | } 356 | 357 | .headband .ear:after { 358 | border: 8px solid #9d7442; 359 | background: 0 0; 360 | } 361 | 362 | .headband .ear + .ear { 363 | -webkit-transform: translateX(-40px) rotateY(180deg); 364 | -moz-transform: translateX(-40px) rotateY(180deg); 365 | -ms-transform: translateX(-40px) rotateY(180deg); 366 | -o-transform: translateX(-40px) rotateY(180deg); 367 | transform: translateX(-40px) rotateY(180deg); 368 | } 369 | 370 | .headband .ear > .lobe { 371 | height: 20%; 372 | width: 20%; 373 | background: #9d7442; 374 | bottom: 25%; 375 | left: -5%; 376 | -webkit-transform: skewX(-50deg); 377 | -moz-transform: skewX(-50deg); 378 | -ms-transform: skewX(-50deg); 379 | -o-transform: skewX(-50deg); 380 | transform: skewX(-50deg); 381 | border-top-right-radius: 15%; 382 | box-shadow: 9px 6px 0 #9d7442; 383 | } 384 | 385 | .headband .eyes { 386 | width: 77%; 387 | height: 33%; 388 | left: 5%; 389 | top: 35%; 390 | -webkit-animation: eyes 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 391 | infinite; 392 | animation: eyes 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 393 | } 394 | 395 | .headband .eye { 396 | height: 100%; 397 | width: 28%; 398 | background-color: #260f02; 399 | box-shadow: inset 0 0 0 3px #260f02; 400 | background-image: -webkit-radial-gradient( 401 | ellipse 5px 10px at 50% 65%, 402 | #260f02 0, 403 | #260f02 99%, 404 | rgba(0, 0, 0, 0) 100% 405 | ), 406 | -webkit-radial-gradient(ellipse 10px 20px at 50% 90%, #955d27 0, #955d27 99%, rgba( 407 | 0, 408 | 0, 409 | 0, 410 | 0 411 | ) 412 | 100%), 413 | -webkit-radial-gradient(ellipse 4px 6px at 55% 20%, #fff 0, #fff 99%, rgba( 414 | 0, 415 | 0, 416 | 0, 417 | 0 418 | ) 419 | 100%); 420 | background-image: radial-gradient( 421 | ellipse 5px 10px at 50% 65%, 422 | #260f02 0, 423 | #260f02 99%, 424 | rgba(0, 0, 0, 0) 100% 425 | ), 426 | radial-gradient( 427 | ellipse 10px 20px at 50% 90%, 428 | #955d27 0, 429 | #955d27 99%, 430 | rgba(0, 0, 0, 0) 100% 431 | ), 432 | radial-gradient( 433 | ellipse 4px 6px at 55% 20%, 434 | #fff 0, 435 | #fff 99%, 436 | rgba(0, 0, 0, 0) 100% 437 | ); 438 | border-radius: 50%/65% 65% 35% 35%; 439 | } 440 | 441 | .headband .eye:last-child { 442 | right: 10%; 443 | -webkit-transform: rotateY(180deg); 444 | -moz-transform: rotateY(180deg); 445 | -ms-transform: rotateY(180deg); 446 | -o-transform: rotateY(180deg); 447 | transform: rotateY(180deg); 448 | } 449 | 450 | .headband .eye:before { 451 | content: ""; 452 | display: block; 453 | position: absolute; 454 | height: 30%; 455 | width: 30%; 456 | background: 0 0; 457 | border-radius: 50%; 458 | border-right: 3px solid #260f02; 459 | border-left: 1px solid transparent; 460 | border-top: 1px solid transparent; 461 | border-bottom: 1px solid transparent; 462 | -webkit-transform: rotate(-38deg); 463 | -moz-transform: rotate(-38deg); 464 | -ms-transform: rotate(-38deg); 465 | -o-transform: rotate(-38deg); 466 | transform: rotate(-38deg); 467 | top: -4px; 468 | left: initial; 469 | right: 2px; 470 | opacity: 0.6; 471 | z-index: 1; 472 | } 473 | 474 | .headband .eye > .eyelid { 475 | height: 102%; 476 | width: 102%; 477 | left: -1%; 478 | top: -1%; 479 | } 480 | 481 | .headband .eye > .eyelid:before { 482 | -webkit-animation: eyelid 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 483 | infinite; 484 | animation: eyelid 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 485 | content: ""; 486 | position: absolute; 487 | display: block; 488 | top: 0; 489 | left: 0; 490 | height: 100%; 491 | width: 100%; 492 | background: #c49152; 493 | border-bottom: 3px solid #260f02; 494 | -webkit-transform-origin: center bottom; 495 | transform-origin: center bottom; 496 | -webkit-transform: translateY(-100%); 497 | -moz-transform: translateY(-100%); 498 | -ms-transform: translateY(-100%); 499 | -o-transform: translateY(-100%); 500 | transform: translateY(-100%); 501 | border-radius: 50% 50% 15% 15%; 502 | } 503 | 504 | .headband .mouth { 505 | -webkit-animation: mouth 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 506 | infinite, 507 | mouth-move 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 508 | animation: mouth 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite, 509 | mouth-move 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 510 | -webkit-animation-timing-function: step-end, 511 | cubic-bezier(0.645, 0.045, 0.355, 1); 512 | animation-timing-function: step-end, cubic-bezier(0.645, 0.045, 0.355, 1); 513 | -webkit-animation-fill-mode: none; 514 | animation-fill-mode: none; 515 | width: 12%; 516 | height: 6%; 517 | bottom: 13%; 518 | left: 33%; 519 | border-radius: 50%; 520 | box-shadow: 0 -2px #260f02; 521 | } 522 | 523 | .headband .mouth:after, 524 | .headband .mouth:before { 525 | -webkit-animation: mouth-side 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 526 | infinite; 527 | animation: mouth-side 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 528 | infinite; 529 | -webkit-animation-timing-function: step-end; 530 | animation-timing-function: step-end; 531 | content: ""; 532 | display: block; 533 | position: absolute; 534 | width: 60%; 535 | height: 100%; 536 | border-radius: 50%; 537 | bottom: 53%; 538 | border-bottom: 2px solid #260f02; 539 | } 540 | 541 | .headband .mouth:before { 542 | right: 87%; 543 | } 544 | 545 | .headband .mouth:after { 546 | left: 87%; 547 | } 548 | 549 | .headband .nose { 550 | -webkit-animation: nose 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 551 | infinite; 552 | animation: nose 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 553 | width: 6%; 554 | height: 4%; 555 | background: #260f02; 556 | bottom: 26%; 557 | left: 35%; 558 | border-radius: 50%/35% 35% 65% 65%; 559 | } 560 | 561 | .headband .tail { 562 | height: 120px; 563 | width: 120px; 564 | z-index: -1; 565 | -webkit-animation: tail 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 566 | infinite; 567 | animation: tail 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 568 | } 569 | 570 | .headband .tail:after, 571 | .headband .tail:before { 572 | content: ""; 573 | display: block; 574 | position: absolute; 575 | top: 0; 576 | left: 0; 577 | width: 100%; 578 | height: 100%; 579 | } 580 | 581 | .headband .tail:after { 582 | background: #c49152; 583 | border-radius: 50%; 584 | -webkit-transform: rotate(-135deg); 585 | -moz-transform: rotate(-135deg); 586 | -ms-transform: rotate(-135deg); 587 | -o-transform: rotate(-135deg); 588 | transform: rotate(-135deg); 589 | } 590 | 591 | .headband .body > .tail { 592 | z-index: -2; 593 | right: -40px; 594 | top: -70px; 595 | } 596 | 597 | .headband .body > .tail:after { 598 | background: -webkit-linear-gradient( 599 | top left, 600 | #9d7442, 601 | #9d7442 20%, 602 | #c49152, 603 | #c49152 604 | ); 605 | background: linear-gradient( 606 | to bottom right, 607 | #9d7442, 608 | #9d7442 20%, 609 | #c49152, 610 | #c49152 611 | ); 612 | } 613 | 614 | .headband .tail .tail { 615 | top: -35px; 616 | -webkit-transform-origin: center bottom; 617 | transform-origin: center bottom; 618 | -webkit-transform: scale(0.85); 619 | -moz-transform: scale(0.85); 620 | -ms-transform: scale(0.85); 621 | -o-transform: scale(0.85); 622 | transform: scale(0.85); 623 | } 624 | 625 | .headband .tail > .tail .tail { 626 | z-index: 1; 627 | } 628 | 629 | .headband .tail.-end { 630 | top: -60px; 631 | } 632 | 633 | .headband .tail.-end:after { 634 | background: #efe1af; 635 | background: -webkit-linear-gradient(top left, #efe1af, #fff); 636 | background: linear-gradient(to bottom right, #efe1af, #fff); 637 | border-radius: 50% 50% initial 100%/50% 100% initial 50%; 638 | } 639 | 640 | .headband .tail.-end:before { 641 | content: ""; 642 | display: block; 643 | position: absolute; 644 | background: #c49152; 645 | height: 40%; 646 | width: 40%; 647 | z-index: 1; 648 | border-radius: 50% 50% 0 0; 649 | top: initial; 650 | bottom: -15%; 651 | left: 30%; 652 | box-shadow: -20px -5px #c49152, 20px -5px #c49152; 653 | } 654 | 655 | .headband .tail > .tail > .tail * { 656 | -webkit-animation: tail-end 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 657 | infinite; 658 | animation: tail-end 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 659 | } 660 | 661 | .headband .legs { 662 | -webkit-animation: legs 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 663 | infinite; 664 | animation: legs 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 665 | top: 70%; 666 | width: 100%; 667 | height: 100%; 668 | } 669 | 670 | .headband .leg { 671 | top: 0; 672 | background: -webkit-linear-gradient(right, #9d7442, #c49152, #cca069); 673 | background: linear-gradient(to left, #9d7442, #c49152, #cca069); 674 | -webkit-transform-origin: center top; 675 | transform-origin: center top; 676 | -webkit-animation: leg 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 677 | infinite; 678 | animation: leg 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 679 | } 680 | 681 | .headband .leg, 682 | .headband .leg > .inner-leg { 683 | height: 40px; 684 | width: 30px; 685 | border-radius: 35%; 686 | } 687 | 688 | .headband .leg:after, 689 | .headband .leg:before { 690 | content: ""; 691 | display: block; 692 | position: absolute; 693 | } 694 | 695 | .headband .leg > .inner-leg { 696 | top: 50%; 697 | -webkit-transform-origin: center 10%; 698 | transform-origin: center 10%; 699 | -webkit-animation: leg-inner 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 700 | infinite; 701 | animation: leg-inner 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 702 | } 703 | 704 | .headband .leg > .inner-leg:before { 705 | -webkit-animation: paw-inner 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both 706 | infinite; 707 | animation: paw-inner 10s 0s cubic-bezier(0.645, 0.045, 0.355, 1) both infinite; 708 | } 709 | 710 | .headband .leg:nth-child(1) { 711 | left: 20px; 712 | top: -2px; 713 | } 714 | 715 | .headband .leg:nth-child(2) { 716 | left: 70px; 717 | } 718 | 719 | .headband .leg:nth-child(2) ~ * { 720 | z-index: -1; 721 | } 722 | 723 | .headband .leg:nth-child(2) ~ *, 724 | .headband .leg:nth-child(2) ~ * > .inner-leg, 725 | .headband .leg:nth-child(2) ~ * > .inner-leg:before { 726 | -webkit-animation-delay: 70ms; 727 | animation-delay: 70ms; 728 | } 729 | 730 | .headband .leg:nth-child(3) { 731 | left: 35px; 732 | top: -10px; 733 | } 734 | 735 | .headband .leg:nth-child(4) { 736 | left: 90px; 737 | top: -10px; 738 | } 739 | 740 | .headband .inner-leg { 741 | background: -webkit-linear-gradient(right, #9d7442, #c49152, #cca069); 742 | background: linear-gradient(to left, #9d7442, #c49152, #cca069); 743 | } 744 | 745 | .headband .inner-leg:before { 746 | content: ""; 747 | display: block; 748 | position: absolute; 749 | bottom: -10%; 750 | width: 105%; 751 | height: 50%; 752 | background-image: -webkit-linear-gradient( 753 | top, 754 | #c49152 0, 755 | #c49152 50%, 756 | transparent 100% 757 | ), 758 | -webkit-linear-gradient(left, transparent 0, transparent 25%, rgba( 759 | 0, 760 | 0, 761 | 0, 762 | 0.5 763 | ) 764 | 26%, rgba(0, 0, 0, 0.5) 35%, transparent 36%, transparent 65%, rgba( 765 | 0, 766 | 0, 767 | 0, 768 | 0.5 769 | ) 770 | 66%, rgba(0, 0, 0, 0.5) 75%, transparent 76%), 771 | -webkit-linear-gradient(bottom, #9d7442, #c49152, #cca069); 772 | background-image: linear-gradient( 773 | to bottom, 774 | #c49152 0, 775 | #c49152 50%, 776 | transparent 100% 777 | ), 778 | linear-gradient( 779 | to right, 780 | transparent 0, 781 | transparent 25%, 782 | rgba(0, 0, 0, 0.5) 26%, 783 | rgba(0, 0, 0, 0.5) 35%, 784 | transparent 36%, 785 | transparent 65%, 786 | rgba(0, 0, 0, 0.5) 66%, 787 | rgba(0, 0, 0, 0.5) 75%, 788 | transparent 76% 789 | ), 790 | linear-gradient(to top, #9d7442, #c49152, #cca069); 791 | border-radius: 40% 40% 20% 20%; 792 | } 793 | 794 | @media (max-width: 600px) { 795 | .headband html body { 796 | -webkit-box-orient: vertical; 797 | -webkit-box-direction: normal; 798 | -webkit-flex-direction: column; 799 | -ms-flex-direction: column; 800 | flex-direction: column; 801 | } 802 | 803 | .headband html body .dex { 804 | max-width: 100%; 805 | } 806 | } 807 | 808 | .headband .dex { 809 | font-family: Lato, sans-serif; 810 | max-width: 40%; 811 | color: #fff; 812 | font-weight: 300; 813 | padding: 1rem 2rem; 814 | } 815 | 816 | .headband .heading { 817 | font-size: 24px; 818 | margin-bottom: 14px; 819 | letter-spacing: 0.25ch; 820 | } 821 | 822 | .headband .heading > span { 823 | font-weight: 100; 824 | margin-right: 0.5ch; 825 | } 826 | 827 | .headband .heading > strong { 828 | font-size: 28px; 829 | font-weight: 300; 830 | } 831 | 832 | .headband .pokeball { 833 | display: inline-block; 834 | width: 1rem; 835 | height: 1rem; 836 | background: -webkit-radial-gradient( 837 | 0.4rem, 838 | #fff, 839 | #fff 50%, 840 | rgba(0, 0, 0, 0) 50% 841 | ); 842 | background: radial-gradient(0.4rem, #fff, #fff 50%, rgba(0, 0, 0, 0) 50%); 843 | margin-right: 1rem; 844 | } 845 | 846 | .headband .pokeball:after, 847 | .headband .pokeball:before { 848 | content: ""; 849 | display: block; 850 | position: absolute; 851 | bottom: -0.063rem; 852 | left: 0; 853 | height: 50%; 854 | width: 100%; 855 | border-radius: 0 0 1rem 1rem; 856 | box-shadow: inset 0 -0.09rem 0 0.09rem #fff, 857 | inset 0.09rem -0.09rem 0 0.09rem #fff, 858 | inset -0.09rem -0.09rem 0 0.09rem #fff; 859 | } 860 | 861 | .headband { 862 | display: inline-block; 863 | } 864 | 865 | .headband .pokeball:after { 866 | -webkit-transform-origin: top center; 867 | transform-origin: top center; 868 | -webkit-transform: rotateX(180deg); 869 | -moz-transform: rotateX(180deg); 870 | -ms-transform: rotateX(180deg); 871 | -o-transform: rotateX(180deg); 872 | transform: rotateX(180deg); 873 | bottom: 0.063rem; 874 | } 875 | 876 | .headband .info { 877 | margin-right: 1rem; 878 | margin-bottom: 14px; 879 | } 880 | 881 | .headband .subheading { 882 | font-size: 18px; 883 | line-height: 28px; 884 | } 885 | 886 | .headband p { 887 | line-height: 18px; 888 | margin: 0 0 1rem; 889 | } 890 | 891 | .headband a { 892 | -webkit-transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 893 | transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 894 | } 895 | 896 | .headband a, 897 | .headband a:active, 898 | .headband a:visited { 899 | color: #fff; 900 | } 901 | 902 | .headband a:hover { 903 | opacity: 0.8; 904 | } 905 | 906 | .eevee { 907 | height: 325px; 908 | width: 410px; 909 | } 910 | 911 | @media (max-width: 600px) { 912 | .eevee { 913 | -webkit-transform: scale(0.8); 914 | -moz-transform: scale(0.8); 915 | -ms-transform: scale(0.8); 916 | -o-transform: scale(0.8); 917 | transform: scale(0.8); 918 | } 919 | } 920 | 921 | @media (max-width: 300px) { 922 | .eevee { 923 | -webkit-transform: scale(0.5); 924 | -moz-transform: scale(0.5); 925 | -ms-transform: scale(0.5); 926 | -o-transform: scale(0.5); 927 | transform: scale(0.5); 928 | } 929 | } 930 | 931 | @-moz-keyframes head { 932 | 0%, 933 | 100%, 934 | 15.38462%, 935 | 23.07692%, 936 | 30.76923%, 937 | 46.15385%, 938 | 53.84615%, 939 | 61.53846%, 940 | 69.23077%, 941 | 7.69231% { 942 | -webkit-transform: translateY(2%); 943 | -moz-transform: translateY(2%); 944 | -ms-transform: translateY(2%); 945 | -o-transform: translateY(2%); 946 | transform: translateY(2%); 947 | } 948 | 949 | 11.53846%, 950 | 19.23077%, 951 | 26.92308%, 952 | 3.84615%, 953 | 50%, 954 | 57.69231%, 955 | 65.38462%, 956 | 73.07692% { 957 | -webkit-transform: translateY(0); 958 | -moz-transform: translateY(0); 959 | -ms-transform: translateY(0); 960 | -o-transform: translateY(0); 961 | transform: translateY(0); 962 | } 963 | 964 | 34.61538% { 965 | -webkit-transform: translateY(2%) rotate(-3deg); 966 | -moz-transform: translateY(2%) rotate(-3deg); 967 | -ms-transform: translateY(2%) rotate(-3deg); 968 | -o-transform: translateY(2%) rotate(-3deg); 969 | transform: translateY(2%) rotate(-3deg); 970 | } 971 | 972 | 38.46154% { 973 | -webkit-transform: translateY(-5%) rotate(7deg); 974 | -moz-transform: translateY(-5%) rotate(7deg); 975 | -ms-transform: translateY(-5%) rotate(7deg); 976 | -o-transform: translateY(-5%) rotate(7deg); 977 | transform: translateY(-5%) rotate(7deg); 978 | } 979 | 980 | 76.92308% { 981 | -webkit-transform: translateY(7%) rotate(-3deg); 982 | -moz-transform: translateY(7%) rotate(-3deg); 983 | -ms-transform: translateY(7%) rotate(-3deg); 984 | -o-transform: translateY(7%) rotate(-3deg); 985 | transform: translateY(7%) rotate(-3deg); 986 | } 987 | 988 | 84.61538% { 989 | -webkit-transform: translateY(-7%) rotate(3deg); 990 | -moz-transform: translateY(-7%) rotate(3deg); 991 | -ms-transform: translateY(-7%) rotate(3deg); 992 | -o-transform: translateY(-7%) rotate(3deg); 993 | transform: translateY(-7%) rotate(3deg); 994 | } 995 | } 996 | 997 | @-webkit-keyframes head { 998 | 0%, 999 | 100%, 1000 | 15.38462%, 1001 | 23.07692%, 1002 | 30.76923%, 1003 | 46.15385%, 1004 | 53.84615%, 1005 | 61.53846%, 1006 | 69.23077%, 1007 | 7.69231% { 1008 | -webkit-transform: translateY(2%); 1009 | -moz-transform: translateY(2%); 1010 | -ms-transform: translateY(2%); 1011 | -o-transform: translateY(2%); 1012 | transform: translateY(2%); 1013 | } 1014 | 1015 | 11.53846%, 1016 | 19.23077%, 1017 | 26.92308%, 1018 | 3.84615%, 1019 | 50%, 1020 | 57.69231%, 1021 | 65.38462%, 1022 | 73.07692% { 1023 | -webkit-transform: translateY(0); 1024 | -moz-transform: translateY(0); 1025 | -ms-transform: translateY(0); 1026 | -o-transform: translateY(0); 1027 | transform: translateY(0); 1028 | } 1029 | 1030 | 34.61538% { 1031 | -webkit-transform: translateY(2%) rotate(-3deg); 1032 | -moz-transform: translateY(2%) rotate(-3deg); 1033 | -ms-transform: translateY(2%) rotate(-3deg); 1034 | -o-transform: translateY(2%) rotate(-3deg); 1035 | transform: translateY(2%) rotate(-3deg); 1036 | } 1037 | 1038 | 38.46154% { 1039 | -webkit-transform: translateY(-5%) rotate(7deg); 1040 | -moz-transform: translateY(-5%) rotate(7deg); 1041 | -ms-transform: translateY(-5%) rotate(7deg); 1042 | -o-transform: translateY(-5%) rotate(7deg); 1043 | transform: translateY(-5%) rotate(7deg); 1044 | } 1045 | 1046 | 76.92308% { 1047 | -webkit-transform: translateY(7%) rotate(-3deg); 1048 | -moz-transform: translateY(7%) rotate(-3deg); 1049 | -ms-transform: translateY(7%) rotate(-3deg); 1050 | -o-transform: translateY(7%) rotate(-3deg); 1051 | transform: translateY(7%) rotate(-3deg); 1052 | } 1053 | 1054 | 84.61538% { 1055 | -webkit-transform: translateY(-7%) rotate(3deg); 1056 | -moz-transform: translateY(-7%) rotate(3deg); 1057 | -ms-transform: translateY(-7%) rotate(3deg); 1058 | -o-transform: translateY(-7%) rotate(3deg); 1059 | transform: translateY(-7%) rotate(3deg); 1060 | } 1061 | } 1062 | 1063 | @-o-keyframes head { 1064 | 0%, 1065 | 100%, 1066 | 15.38462%, 1067 | 23.07692%, 1068 | 30.76923%, 1069 | 46.15385%, 1070 | 53.84615%, 1071 | 61.53846%, 1072 | 69.23077%, 1073 | 7.69231% { 1074 | -webkit-transform: translateY(2%); 1075 | -moz-transform: translateY(2%); 1076 | -ms-transform: translateY(2%); 1077 | -o-transform: translateY(2%); 1078 | transform: translateY(2%); 1079 | } 1080 | 1081 | 11.53846%, 1082 | 19.23077%, 1083 | 26.92308%, 1084 | 3.84615%, 1085 | 50%, 1086 | 57.69231%, 1087 | 65.38462%, 1088 | 73.07692% { 1089 | -webkit-transform: translateY(0); 1090 | -moz-transform: translateY(0); 1091 | -ms-transform: translateY(0); 1092 | -o-transform: translateY(0); 1093 | transform: translateY(0); 1094 | } 1095 | 1096 | 34.61538% { 1097 | -webkit-transform: translateY(2%) rotate(-3deg); 1098 | -moz-transform: translateY(2%) rotate(-3deg); 1099 | -ms-transform: translateY(2%) rotate(-3deg); 1100 | -o-transform: translateY(2%) rotate(-3deg); 1101 | transform: translateY(2%) rotate(-3deg); 1102 | } 1103 | 1104 | 38.46154% { 1105 | -webkit-transform: translateY(-5%) rotate(7deg); 1106 | -moz-transform: translateY(-5%) rotate(7deg); 1107 | -ms-transform: translateY(-5%) rotate(7deg); 1108 | -o-transform: translateY(-5%) rotate(7deg); 1109 | transform: translateY(-5%) rotate(7deg); 1110 | } 1111 | 1112 | 76.92308% { 1113 | -webkit-transform: translateY(7%) rotate(-3deg); 1114 | -moz-transform: translateY(7%) rotate(-3deg); 1115 | -ms-transform: translateY(7%) rotate(-3deg); 1116 | -o-transform: translateY(7%) rotate(-3deg); 1117 | transform: translateY(7%) rotate(-3deg); 1118 | } 1119 | 1120 | 84.61538% { 1121 | -webkit-transform: translateY(-7%) rotate(3deg); 1122 | -moz-transform: translateY(-7%) rotate(3deg); 1123 | -ms-transform: translateY(-7%) rotate(3deg); 1124 | -o-transform: translateY(-7%) rotate(3deg); 1125 | transform: translateY(-7%) rotate(3deg); 1126 | } 1127 | } 1128 | 1129 | @keyframes head { 1130 | 0%, 1131 | 100%, 1132 | 15.38462%, 1133 | 23.07692%, 1134 | 30.76923%, 1135 | 46.15385%, 1136 | 53.84615%, 1137 | 61.53846%, 1138 | 69.23077%, 1139 | 7.69231% { 1140 | -webkit-transform: translateY(2%); 1141 | -moz-transform: translateY(2%); 1142 | -ms-transform: translateY(2%); 1143 | -o-transform: translateY(2%); 1144 | transform: translateY(2%); 1145 | } 1146 | 1147 | 11.53846%, 1148 | 19.23077%, 1149 | 26.92308%, 1150 | 3.84615%, 1151 | 50%, 1152 | 57.69231%, 1153 | 65.38462%, 1154 | 73.07692% { 1155 | -webkit-transform: translateY(0); 1156 | -moz-transform: translateY(0); 1157 | -ms-transform: translateY(0); 1158 | -o-transform: translateY(0); 1159 | transform: translateY(0); 1160 | } 1161 | 1162 | 34.61538% { 1163 | -webkit-transform: translateY(2%) rotate(-3deg); 1164 | -moz-transform: translateY(2%) rotate(-3deg); 1165 | -ms-transform: translateY(2%) rotate(-3deg); 1166 | -o-transform: translateY(2%) rotate(-3deg); 1167 | transform: translateY(2%) rotate(-3deg); 1168 | } 1169 | 1170 | 38.46154% { 1171 | -webkit-transform: translateY(-5%) rotate(7deg); 1172 | -moz-transform: translateY(-5%) rotate(7deg); 1173 | -ms-transform: translateY(-5%) rotate(7deg); 1174 | -o-transform: translateY(-5%) rotate(7deg); 1175 | transform: translateY(-5%) rotate(7deg); 1176 | } 1177 | 1178 | 76.92308% { 1179 | -webkit-transform: translateY(7%) rotate(-3deg); 1180 | -moz-transform: translateY(7%) rotate(-3deg); 1181 | -ms-transform: translateY(7%) rotate(-3deg); 1182 | -o-transform: translateY(7%) rotate(-3deg); 1183 | transform: translateY(7%) rotate(-3deg); 1184 | } 1185 | 1186 | 84.61538% { 1187 | -webkit-transform: translateY(-7%) rotate(3deg); 1188 | -moz-transform: translateY(-7%) rotate(3deg); 1189 | -ms-transform: translateY(-7%) rotate(3deg); 1190 | -o-transform: translateY(-7%) rotate(3deg); 1191 | transform: translateY(-7%) rotate(3deg); 1192 | } 1193 | } 1194 | 1195 | @-moz-keyframes head-shadow { 1196 | 0%, 1197 | 100%, 1198 | 15.38462%, 1199 | 23.07692%, 1200 | 30.76923%, 1201 | 46.15385%, 1202 | 53.84615%, 1203 | 61.53846%, 1204 | 69.23077%, 1205 | 7.69231% { 1206 | -webkit-transform: translateY(-2%); 1207 | -moz-transform: translateY(-2%); 1208 | -ms-transform: translateY(-2%); 1209 | -o-transform: translateY(-2%); 1210 | transform: translateY(-2%); 1211 | } 1212 | 1213 | 11.53846%, 1214 | 19.23077%, 1215 | 26.92308%, 1216 | 3.84615%, 1217 | 50%, 1218 | 57.69231%, 1219 | 65.38462%, 1220 | 73.07692% { 1221 | -webkit-transform: translateY(1%); 1222 | -moz-transform: translateY(1%); 1223 | -ms-transform: translateY(1%); 1224 | -o-transform: translateY(1%); 1225 | transform: translateY(1%); 1226 | } 1227 | 1228 | 34.61538% { 1229 | -webkit-transform: translateY(-5%); 1230 | -moz-transform: translateY(-5%); 1231 | -ms-transform: translateY(-5%); 1232 | -o-transform: translateY(-5%); 1233 | transform: translateY(-5%); 1234 | } 1235 | 1236 | 38.46154% { 1237 | -webkit-transform: translateY(5%); 1238 | -moz-transform: translateY(5%); 1239 | -ms-transform: translateY(5%); 1240 | -o-transform: translateY(5%); 1241 | transform: translateY(5%); 1242 | } 1243 | 1244 | 76.92308% { 1245 | -webkit-transform: translateY(-4%); 1246 | -moz-transform: translateY(-4%); 1247 | -ms-transform: translateY(-4%); 1248 | -o-transform: translateY(-4%); 1249 | transform: translateY(-4%); 1250 | } 1251 | 1252 | 84.61538% { 1253 | -webkit-transform: translateY(10%) scale(0.9); 1254 | -moz-transform: translateY(10%) scale(0.9); 1255 | -ms-transform: translateY(10%) scale(0.9); 1256 | -o-transform: translateY(10%) scale(0.9); 1257 | transform: translateY(10%) scale(0.9); 1258 | } 1259 | } 1260 | 1261 | @-webkit-keyframes head-shadow { 1262 | 0%, 1263 | 100%, 1264 | 15.38462%, 1265 | 23.07692%, 1266 | 30.76923%, 1267 | 46.15385%, 1268 | 53.84615%, 1269 | 61.53846%, 1270 | 69.23077%, 1271 | 7.69231% { 1272 | -webkit-transform: translateY(-2%); 1273 | -moz-transform: translateY(-2%); 1274 | -ms-transform: translateY(-2%); 1275 | -o-transform: translateY(-2%); 1276 | transform: translateY(-2%); 1277 | } 1278 | 1279 | 11.53846%, 1280 | 19.23077%, 1281 | 26.92308%, 1282 | 3.84615%, 1283 | 50%, 1284 | 57.69231%, 1285 | 65.38462%, 1286 | 73.07692% { 1287 | -webkit-transform: translateY(1%); 1288 | -moz-transform: translateY(1%); 1289 | -ms-transform: translateY(1%); 1290 | -o-transform: translateY(1%); 1291 | transform: translateY(1%); 1292 | } 1293 | 1294 | 34.61538% { 1295 | -webkit-transform: translateY(-5%); 1296 | -moz-transform: translateY(-5%); 1297 | -ms-transform: translateY(-5%); 1298 | -o-transform: translateY(-5%); 1299 | transform: translateY(-5%); 1300 | } 1301 | 1302 | 38.46154% { 1303 | -webkit-transform: translateY(5%); 1304 | -moz-transform: translateY(5%); 1305 | -ms-transform: translateY(5%); 1306 | -o-transform: translateY(5%); 1307 | transform: translateY(5%); 1308 | } 1309 | 1310 | 76.92308% { 1311 | -webkit-transform: translateY(-4%); 1312 | -moz-transform: translateY(-4%); 1313 | -ms-transform: translateY(-4%); 1314 | -o-transform: translateY(-4%); 1315 | transform: translateY(-4%); 1316 | } 1317 | 1318 | 84.61538% { 1319 | -webkit-transform: translateY(10%) scale(0.9); 1320 | -moz-transform: translateY(10%) scale(0.9); 1321 | -ms-transform: translateY(10%) scale(0.9); 1322 | -o-transform: translateY(10%) scale(0.9); 1323 | transform: translateY(10%) scale(0.9); 1324 | } 1325 | } 1326 | 1327 | @-o-keyframes head-shadow { 1328 | 0%, 1329 | 100%, 1330 | 15.38462%, 1331 | 23.07692%, 1332 | 30.76923%, 1333 | 46.15385%, 1334 | 53.84615%, 1335 | 61.53846%, 1336 | 69.23077%, 1337 | 7.69231% { 1338 | -webkit-transform: translateY(-2%); 1339 | -moz-transform: translateY(-2%); 1340 | -ms-transform: translateY(-2%); 1341 | -o-transform: translateY(-2%); 1342 | transform: translateY(-2%); 1343 | } 1344 | 1345 | 11.53846%, 1346 | 19.23077%, 1347 | 26.92308%, 1348 | 3.84615%, 1349 | 50%, 1350 | 57.69231%, 1351 | 65.38462%, 1352 | 73.07692% { 1353 | -webkit-transform: translateY(1%); 1354 | -moz-transform: translateY(1%); 1355 | -ms-transform: translateY(1%); 1356 | -o-transform: translateY(1%); 1357 | transform: translateY(1%); 1358 | } 1359 | 1360 | 34.61538% { 1361 | -webkit-transform: translateY(-5%); 1362 | -moz-transform: translateY(-5%); 1363 | -ms-transform: translateY(-5%); 1364 | -o-transform: translateY(-5%); 1365 | transform: translateY(-5%); 1366 | } 1367 | 1368 | 38.46154% { 1369 | -webkit-transform: translateY(5%); 1370 | -moz-transform: translateY(5%); 1371 | -ms-transform: translateY(5%); 1372 | -o-transform: translateY(5%); 1373 | transform: translateY(5%); 1374 | } 1375 | 1376 | 76.92308% { 1377 | -webkit-transform: translateY(-4%); 1378 | -moz-transform: translateY(-4%); 1379 | -ms-transform: translateY(-4%); 1380 | -o-transform: translateY(-4%); 1381 | transform: translateY(-4%); 1382 | } 1383 | 1384 | 84.61538% { 1385 | -webkit-transform: translateY(10%) scale(0.9); 1386 | -moz-transform: translateY(10%) scale(0.9); 1387 | -ms-transform: translateY(10%) scale(0.9); 1388 | -o-transform: translateY(10%) scale(0.9); 1389 | transform: translateY(10%) scale(0.9); 1390 | } 1391 | } 1392 | 1393 | @keyframes head-shadow { 1394 | 0%, 1395 | 100%, 1396 | 15.38462%, 1397 | 23.07692%, 1398 | 30.76923%, 1399 | 46.15385%, 1400 | 53.84615%, 1401 | 61.53846%, 1402 | 69.23077%, 1403 | 7.69231% { 1404 | -webkit-transform: translateY(-2%); 1405 | -moz-transform: translateY(-2%); 1406 | -ms-transform: translateY(-2%); 1407 | -o-transform: translateY(-2%); 1408 | transform: translateY(-2%); 1409 | } 1410 | 1411 | 11.53846%, 1412 | 19.23077%, 1413 | 26.92308%, 1414 | 3.84615%, 1415 | 50%, 1416 | 57.69231%, 1417 | 65.38462%, 1418 | 73.07692% { 1419 | -webkit-transform: translateY(1%); 1420 | -moz-transform: translateY(1%); 1421 | -ms-transform: translateY(1%); 1422 | -o-transform: translateY(1%); 1423 | transform: translateY(1%); 1424 | } 1425 | 1426 | 34.61538% { 1427 | -webkit-transform: translateY(-5%); 1428 | -moz-transform: translateY(-5%); 1429 | -ms-transform: translateY(-5%); 1430 | -o-transform: translateY(-5%); 1431 | transform: translateY(-5%); 1432 | } 1433 | 1434 | 38.46154% { 1435 | -webkit-transform: translateY(5%); 1436 | -moz-transform: translateY(5%); 1437 | -ms-transform: translateY(5%); 1438 | -o-transform: translateY(5%); 1439 | transform: translateY(5%); 1440 | } 1441 | 1442 | 76.92308% { 1443 | -webkit-transform: translateY(-4%); 1444 | -moz-transform: translateY(-4%); 1445 | -ms-transform: translateY(-4%); 1446 | -o-transform: translateY(-4%); 1447 | transform: translateY(-4%); 1448 | } 1449 | 1450 | 84.61538% { 1451 | -webkit-transform: translateY(10%) scale(0.9); 1452 | -moz-transform: translateY(10%) scale(0.9); 1453 | -ms-transform: translateY(10%) scale(0.9); 1454 | -o-transform: translateY(10%) scale(0.9); 1455 | transform: translateY(10%) scale(0.9); 1456 | } 1457 | } 1458 | 1459 | @-moz-keyframes eyes { 1460 | 0%, 1461 | 100%, 1462 | 15.38462%, 1463 | 23.07692%, 1464 | 30.76923%, 1465 | 46.15385%, 1466 | 53.84615%, 1467 | 61.53846%, 1468 | 69.23077%, 1469 | 7.69231% { 1470 | -webkit-transform: rotateX(-7deg) translateZ(10px); 1471 | -moz-transform: rotateX(-7deg) translateZ(10px); 1472 | -ms-transform: rotateX(-7deg) translateZ(10px); 1473 | -o-transform: rotateX(-7deg) translateZ(10px); 1474 | transform: rotateX(-7deg) translateZ(10px); 1475 | } 1476 | 1477 | 11.53846%, 1478 | 19.23077%, 1479 | 26.92308%, 1480 | 3.84615%, 1481 | 50%, 1482 | 57.69231%, 1483 | 65.38462%, 1484 | 73.07692% { 1485 | -webkit-transform: rotateX(7deg) translateZ(10px); 1486 | -moz-transform: rotateX(7deg) translateZ(10px); 1487 | -ms-transform: rotateX(7deg) translateZ(10px); 1488 | -o-transform: rotateX(7deg) translateZ(10px); 1489 | transform: rotateX(7deg) translateZ(10px); 1490 | } 1491 | 1492 | 76.92308% { 1493 | -webkit-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1494 | -moz-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1495 | -ms-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1496 | -o-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1497 | transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1498 | } 1499 | 1500 | 84.61538% { 1501 | -webkit-transform: rotateX(20deg) translateZ(10px); 1502 | -moz-transform: rotateX(20deg) translateZ(10px); 1503 | -ms-transform: rotateX(20deg) translateZ(10px); 1504 | -o-transform: rotateX(20deg) translateZ(10px); 1505 | transform: rotateX(20deg) translateZ(10px); 1506 | } 1507 | } 1508 | 1509 | @-webkit-keyframes eyes { 1510 | 0%, 1511 | 100%, 1512 | 15.38462%, 1513 | 23.07692%, 1514 | 30.76923%, 1515 | 46.15385%, 1516 | 53.84615%, 1517 | 61.53846%, 1518 | 69.23077%, 1519 | 7.69231% { 1520 | -webkit-transform: rotateX(-7deg) translateZ(10px); 1521 | -moz-transform: rotateX(-7deg) translateZ(10px); 1522 | -ms-transform: rotateX(-7deg) translateZ(10px); 1523 | -o-transform: rotateX(-7deg) translateZ(10px); 1524 | transform: rotateX(-7deg) translateZ(10px); 1525 | } 1526 | 1527 | 11.53846%, 1528 | 19.23077%, 1529 | 26.92308%, 1530 | 3.84615%, 1531 | 50%, 1532 | 57.69231%, 1533 | 65.38462%, 1534 | 73.07692% { 1535 | -webkit-transform: rotateX(7deg) translateZ(10px); 1536 | -moz-transform: rotateX(7deg) translateZ(10px); 1537 | -ms-transform: rotateX(7deg) translateZ(10px); 1538 | -o-transform: rotateX(7deg) translateZ(10px); 1539 | transform: rotateX(7deg) translateZ(10px); 1540 | } 1541 | 1542 | 76.92308% { 1543 | -webkit-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1544 | -moz-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1545 | -ms-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1546 | -o-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1547 | transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1548 | } 1549 | 1550 | 84.61538% { 1551 | -webkit-transform: rotateX(20deg) translateZ(10px); 1552 | -moz-transform: rotateX(20deg) translateZ(10px); 1553 | -ms-transform: rotateX(20deg) translateZ(10px); 1554 | -o-transform: rotateX(20deg) translateZ(10px); 1555 | transform: rotateX(20deg) translateZ(10px); 1556 | } 1557 | } 1558 | 1559 | @-o-keyframes eyes { 1560 | 0%, 1561 | 100%, 1562 | 15.38462%, 1563 | 23.07692%, 1564 | 30.76923%, 1565 | 46.15385%, 1566 | 53.84615%, 1567 | 61.53846%, 1568 | 69.23077%, 1569 | 7.69231% { 1570 | -webkit-transform: rotateX(-7deg) translateZ(10px); 1571 | -moz-transform: rotateX(-7deg) translateZ(10px); 1572 | -ms-transform: rotateX(-7deg) translateZ(10px); 1573 | -o-transform: rotateX(-7deg) translateZ(10px); 1574 | transform: rotateX(-7deg) translateZ(10px); 1575 | } 1576 | 1577 | 11.53846%, 1578 | 19.23077%, 1579 | 26.92308%, 1580 | 3.84615%, 1581 | 50%, 1582 | 57.69231%, 1583 | 65.38462%, 1584 | 73.07692% { 1585 | -webkit-transform: rotateX(7deg) translateZ(10px); 1586 | -moz-transform: rotateX(7deg) translateZ(10px); 1587 | -ms-transform: rotateX(7deg) translateZ(10px); 1588 | -o-transform: rotateX(7deg) translateZ(10px); 1589 | transform: rotateX(7deg) translateZ(10px); 1590 | } 1591 | 1592 | 76.92308% { 1593 | -webkit-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1594 | -moz-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1595 | -ms-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1596 | -o-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1597 | transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1598 | } 1599 | 1600 | 84.61538% { 1601 | -webkit-transform: rotateX(20deg) translateZ(10px); 1602 | -moz-transform: rotateX(20deg) translateZ(10px); 1603 | -ms-transform: rotateX(20deg) translateZ(10px); 1604 | -o-transform: rotateX(20deg) translateZ(10px); 1605 | transform: rotateX(20deg) translateZ(10px); 1606 | } 1607 | } 1608 | 1609 | @keyframes eyes { 1610 | 0%, 1611 | 100%, 1612 | 15.38462%, 1613 | 23.07692%, 1614 | 30.76923%, 1615 | 46.15385%, 1616 | 53.84615%, 1617 | 61.53846%, 1618 | 69.23077%, 1619 | 7.69231% { 1620 | -webkit-transform: rotateX(-7deg) translateZ(10px); 1621 | -moz-transform: rotateX(-7deg) translateZ(10px); 1622 | -ms-transform: rotateX(-7deg) translateZ(10px); 1623 | -o-transform: rotateX(-7deg) translateZ(10px); 1624 | transform: rotateX(-7deg) translateZ(10px); 1625 | } 1626 | 1627 | 11.53846%, 1628 | 19.23077%, 1629 | 26.92308%, 1630 | 3.84615%, 1631 | 50%, 1632 | 57.69231%, 1633 | 65.38462%, 1634 | 73.07692% { 1635 | -webkit-transform: rotateX(7deg) translateZ(10px); 1636 | -moz-transform: rotateX(7deg) translateZ(10px); 1637 | -ms-transform: rotateX(7deg) translateZ(10px); 1638 | -o-transform: rotateX(7deg) translateZ(10px); 1639 | transform: rotateX(7deg) translateZ(10px); 1640 | } 1641 | 1642 | 76.92308% { 1643 | -webkit-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1644 | -moz-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1645 | -ms-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1646 | -o-transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1647 | transform: translateY(5%) rotateX(-20deg) translateZ(10px); 1648 | } 1649 | 1650 | 84.61538% { 1651 | -webkit-transform: rotateX(20deg) translateZ(10px); 1652 | -moz-transform: rotateX(20deg) translateZ(10px); 1653 | -ms-transform: rotateX(20deg) translateZ(10px); 1654 | -o-transform: rotateX(20deg) translateZ(10px); 1655 | transform: rotateX(20deg) translateZ(10px); 1656 | } 1657 | } 1658 | 1659 | @-moz-keyframes eyelid { 1660 | 0%, 1661 | 23.07692%, 1662 | 24.61538%, 1663 | 76.92308%, 1664 | 95.38462% { 1665 | -webkit-transform: translateY(-120%) rotate(-30deg); 1666 | -moz-transform: translateY(-120%) rotate(-30deg); 1667 | -ms-transform: translateY(-120%) rotate(-30deg); 1668 | -o-transform: translateY(-120%) rotate(-30deg); 1669 | transform: translateY(-120%) rotate(-30deg); 1670 | } 1671 | 1672 | 23.46154%, 1673 | 24.46154%, 1674 | 77.30769%, 1675 | 93.84615% { 1676 | -webkit-transform: translateY(0) rotate(0); 1677 | -moz-transform: translateY(0) rotate(0); 1678 | -ms-transform: translateY(0) rotate(0); 1679 | -o-transform: translateY(0) rotate(0); 1680 | transform: translateY(0) rotate(0); 1681 | } 1682 | 1683 | 79.23077%, 1684 | 92.30769% { 1685 | -webkit-transform: translateY(-85%) rotate(30deg); 1686 | -moz-transform: translateY(-85%) rotate(30deg); 1687 | -ms-transform: translateY(-85%) rotate(30deg); 1688 | -o-transform: translateY(-85%) rotate(30deg); 1689 | transform: translateY(-85%) rotate(30deg); 1690 | } 1691 | } 1692 | 1693 | @-webkit-keyframes eyelid { 1694 | 0%, 1695 | 23.07692%, 1696 | 24.61538%, 1697 | 76.92308%, 1698 | 95.38462% { 1699 | -webkit-transform: translateY(-120%) rotate(-30deg); 1700 | -moz-transform: translateY(-120%) rotate(-30deg); 1701 | -ms-transform: translateY(-120%) rotate(-30deg); 1702 | -o-transform: translateY(-120%) rotate(-30deg); 1703 | transform: translateY(-120%) rotate(-30deg); 1704 | } 1705 | 1706 | 23.46154%, 1707 | 24.46154%, 1708 | 77.30769%, 1709 | 93.84615% { 1710 | -webkit-transform: translateY(0) rotate(0); 1711 | -moz-transform: translateY(0) rotate(0); 1712 | -ms-transform: translateY(0) rotate(0); 1713 | -o-transform: translateY(0) rotate(0); 1714 | transform: translateY(0) rotate(0); 1715 | } 1716 | 1717 | 79.23077%, 1718 | 92.30769% { 1719 | -webkit-transform: translateY(-85%) rotate(30deg); 1720 | -moz-transform: translateY(-85%) rotate(30deg); 1721 | -ms-transform: translateY(-85%) rotate(30deg); 1722 | -o-transform: translateY(-85%) rotate(30deg); 1723 | transform: translateY(-85%) rotate(30deg); 1724 | } 1725 | } 1726 | 1727 | @-o-keyframes eyelid { 1728 | 0%, 1729 | 23.07692%, 1730 | 24.61538%, 1731 | 76.92308%, 1732 | 95.38462% { 1733 | -webkit-transform: translateY(-120%) rotate(-30deg); 1734 | -moz-transform: translateY(-120%) rotate(-30deg); 1735 | -ms-transform: translateY(-120%) rotate(-30deg); 1736 | -o-transform: translateY(-120%) rotate(-30deg); 1737 | transform: translateY(-120%) rotate(-30deg); 1738 | } 1739 | 1740 | 23.46154%, 1741 | 24.46154%, 1742 | 77.30769%, 1743 | 93.84615% { 1744 | -webkit-transform: translateY(0) rotate(0); 1745 | -moz-transform: translateY(0) rotate(0); 1746 | -ms-transform: translateY(0) rotate(0); 1747 | -o-transform: translateY(0) rotate(0); 1748 | transform: translateY(0) rotate(0); 1749 | } 1750 | 1751 | 79.23077%, 1752 | 92.30769% { 1753 | -webkit-transform: translateY(-85%) rotate(30deg); 1754 | -moz-transform: translateY(-85%) rotate(30deg); 1755 | -ms-transform: translateY(-85%) rotate(30deg); 1756 | -o-transform: translateY(-85%) rotate(30deg); 1757 | transform: translateY(-85%) rotate(30deg); 1758 | } 1759 | } 1760 | 1761 | @keyframes eyelid { 1762 | 0%, 1763 | 23.07692%, 1764 | 24.61538%, 1765 | 76.92308%, 1766 | 95.38462% { 1767 | -webkit-transform: translateY(-120%) rotate(-30deg); 1768 | -moz-transform: translateY(-120%) rotate(-30deg); 1769 | -ms-transform: translateY(-120%) rotate(-30deg); 1770 | -o-transform: translateY(-120%) rotate(-30deg); 1771 | transform: translateY(-120%) rotate(-30deg); 1772 | } 1773 | 1774 | 23.46154%, 1775 | 24.46154%, 1776 | 77.30769%, 1777 | 93.84615% { 1778 | -webkit-transform: translateY(0) rotate(0); 1779 | -moz-transform: translateY(0) rotate(0); 1780 | -ms-transform: translateY(0) rotate(0); 1781 | -o-transform: translateY(0) rotate(0); 1782 | transform: translateY(0) rotate(0); 1783 | } 1784 | 1785 | 79.23077%, 1786 | 92.30769% { 1787 | -webkit-transform: translateY(-85%) rotate(30deg); 1788 | -moz-transform: translateY(-85%) rotate(30deg); 1789 | -ms-transform: translateY(-85%) rotate(30deg); 1790 | -o-transform: translateY(-85%) rotate(30deg); 1791 | transform: translateY(-85%) rotate(30deg); 1792 | } 1793 | } 1794 | 1795 | @-moz-keyframes nose { 1796 | 0%, 1797 | 100%, 1798 | 15.38462%, 1799 | 23.07692%, 1800 | 30.76923%, 1801 | 46.15385%, 1802 | 53.84615%, 1803 | 61.53846%, 1804 | 69.23077%, 1805 | 7.69231% { 1806 | -webkit-transform: translateY(30%); 1807 | -moz-transform: translateY(30%); 1808 | -ms-transform: translateY(30%); 1809 | -o-transform: translateY(30%); 1810 | transform: translateY(30%); 1811 | } 1812 | 1813 | 11.53846%, 1814 | 19.23077%, 1815 | 26.92308%, 1816 | 3.84615%, 1817 | 50%, 1818 | 57.69231%, 1819 | 65.38462%, 1820 | 73.07692% { 1821 | -webkit-transform: translateY(-20%); 1822 | -moz-transform: translateY(-20%); 1823 | -ms-transform: translateY(-20%); 1824 | -o-transform: translateY(-20%); 1825 | transform: translateY(-20%); 1826 | } 1827 | 1828 | 76.92308% { 1829 | -webkit-transform: translateY(70%); 1830 | -moz-transform: translateY(70%); 1831 | -ms-transform: translateY(70%); 1832 | -o-transform: translateY(70%); 1833 | transform: translateY(70%); 1834 | } 1835 | 1836 | 84.61538% { 1837 | -webkit-transform: translateY(-60%); 1838 | -moz-transform: translateY(-60%); 1839 | -ms-transform: translateY(-60%); 1840 | -o-transform: translateY(-60%); 1841 | transform: translateY(-60%); 1842 | } 1843 | } 1844 | 1845 | @-webkit-keyframes nose { 1846 | 0%, 1847 | 100%, 1848 | 15.38462%, 1849 | 23.07692%, 1850 | 30.76923%, 1851 | 46.15385%, 1852 | 53.84615%, 1853 | 61.53846%, 1854 | 69.23077%, 1855 | 7.69231% { 1856 | -webkit-transform: translateY(30%); 1857 | -moz-transform: translateY(30%); 1858 | -ms-transform: translateY(30%); 1859 | -o-transform: translateY(30%); 1860 | transform: translateY(30%); 1861 | } 1862 | 1863 | 11.53846%, 1864 | 19.23077%, 1865 | 26.92308%, 1866 | 3.84615%, 1867 | 50%, 1868 | 57.69231%, 1869 | 65.38462%, 1870 | 73.07692% { 1871 | -webkit-transform: translateY(-20%); 1872 | -moz-transform: translateY(-20%); 1873 | -ms-transform: translateY(-20%); 1874 | -o-transform: translateY(-20%); 1875 | transform: translateY(-20%); 1876 | } 1877 | 1878 | 76.92308% { 1879 | -webkit-transform: translateY(70%); 1880 | -moz-transform: translateY(70%); 1881 | -ms-transform: translateY(70%); 1882 | -o-transform: translateY(70%); 1883 | transform: translateY(70%); 1884 | } 1885 | 1886 | 84.61538% { 1887 | -webkit-transform: translateY(-60%); 1888 | -moz-transform: translateY(-60%); 1889 | -ms-transform: translateY(-60%); 1890 | -o-transform: translateY(-60%); 1891 | transform: translateY(-60%); 1892 | } 1893 | } 1894 | 1895 | @-o-keyframes nose { 1896 | 0%, 1897 | 100%, 1898 | 15.38462%, 1899 | 23.07692%, 1900 | 30.76923%, 1901 | 46.15385%, 1902 | 53.84615%, 1903 | 61.53846%, 1904 | 69.23077%, 1905 | 7.69231% { 1906 | -webkit-transform: translateY(30%); 1907 | -moz-transform: translateY(30%); 1908 | -ms-transform: translateY(30%); 1909 | -o-transform: translateY(30%); 1910 | transform: translateY(30%); 1911 | } 1912 | 1913 | 11.53846%, 1914 | 19.23077%, 1915 | 26.92308%, 1916 | 3.84615%, 1917 | 50%, 1918 | 57.69231%, 1919 | 65.38462%, 1920 | 73.07692% { 1921 | -webkit-transform: translateY(-20%); 1922 | -moz-transform: translateY(-20%); 1923 | -ms-transform: translateY(-20%); 1924 | -o-transform: translateY(-20%); 1925 | transform: translateY(-20%); 1926 | } 1927 | 1928 | 76.92308% { 1929 | -webkit-transform: translateY(70%); 1930 | -moz-transform: translateY(70%); 1931 | -ms-transform: translateY(70%); 1932 | -o-transform: translateY(70%); 1933 | transform: translateY(70%); 1934 | } 1935 | 1936 | 84.61538% { 1937 | -webkit-transform: translateY(-60%); 1938 | -moz-transform: translateY(-60%); 1939 | -ms-transform: translateY(-60%); 1940 | -o-transform: translateY(-60%); 1941 | transform: translateY(-60%); 1942 | } 1943 | } 1944 | 1945 | @keyframes nose { 1946 | 0%, 1947 | 100%, 1948 | 15.38462%, 1949 | 23.07692%, 1950 | 30.76923%, 1951 | 46.15385%, 1952 | 53.84615%, 1953 | 61.53846%, 1954 | 69.23077%, 1955 | 7.69231% { 1956 | -webkit-transform: translateY(30%); 1957 | -moz-transform: translateY(30%); 1958 | -ms-transform: translateY(30%); 1959 | -o-transform: translateY(30%); 1960 | transform: translateY(30%); 1961 | } 1962 | 1963 | 11.53846%, 1964 | 19.23077%, 1965 | 26.92308%, 1966 | 3.84615%, 1967 | 50%, 1968 | 57.69231%, 1969 | 65.38462%, 1970 | 73.07692% { 1971 | -webkit-transform: translateY(-20%); 1972 | -moz-transform: translateY(-20%); 1973 | -ms-transform: translateY(-20%); 1974 | -o-transform: translateY(-20%); 1975 | transform: translateY(-20%); 1976 | } 1977 | 1978 | 76.92308% { 1979 | -webkit-transform: translateY(70%); 1980 | -moz-transform: translateY(70%); 1981 | -ms-transform: translateY(70%); 1982 | -o-transform: translateY(70%); 1983 | transform: translateY(70%); 1984 | } 1985 | 1986 | 84.61538% { 1987 | -webkit-transform: translateY(-60%); 1988 | -moz-transform: translateY(-60%); 1989 | -ms-transform: translateY(-60%); 1990 | -o-transform: translateY(-60%); 1991 | transform: translateY(-60%); 1992 | } 1993 | } 1994 | 1995 | @-moz-keyframes mouth-move { 1996 | 0%, 1997 | 100%, 1998 | 15.38462%, 1999 | 23.07692%, 2000 | 30.76923%, 2001 | 46.15385%, 2002 | 53.84615%, 2003 | 61.53846%, 2004 | 69.23077%, 2005 | 7.69231% { 2006 | -webkit-transform: translateY(15%); 2007 | -moz-transform: translateY(15%); 2008 | -ms-transform: translateY(15%); 2009 | -o-transform: translateY(15%); 2010 | transform: translateY(15%); 2011 | } 2012 | 2013 | 11.53846%, 2014 | 19.23077%, 2015 | 26.92308%, 2016 | 3.84615%, 2017 | 50%, 2018 | 57.69231%, 2019 | 65.38462%, 2020 | 73.07692% { 2021 | -webkit-transform: translateY(-5%); 2022 | -moz-transform: translateY(-5%); 2023 | -ms-transform: translateY(-5%); 2024 | -o-transform: translateY(-5%); 2025 | transform: translateY(-5%); 2026 | } 2027 | 2028 | 76.92308% { 2029 | -webkit-transform: translateY(30%); 2030 | -moz-transform: translateY(30%); 2031 | -ms-transform: translateY(30%); 2032 | -o-transform: translateY(30%); 2033 | transform: translateY(30%); 2034 | } 2035 | 2036 | 84.61538% { 2037 | -webkit-transform: translateY(-10%); 2038 | -moz-transform: translateY(-10%); 2039 | -ms-transform: translateY(-10%); 2040 | -o-transform: translateY(-10%); 2041 | transform: translateY(-10%); 2042 | } 2043 | } 2044 | 2045 | @-webkit-keyframes mouth-move { 2046 | 0%, 2047 | 100%, 2048 | 15.38462%, 2049 | 23.07692%, 2050 | 30.76923%, 2051 | 46.15385%, 2052 | 53.84615%, 2053 | 61.53846%, 2054 | 69.23077%, 2055 | 7.69231% { 2056 | -webkit-transform: translateY(15%); 2057 | -moz-transform: translateY(15%); 2058 | -ms-transform: translateY(15%); 2059 | -o-transform: translateY(15%); 2060 | transform: translateY(15%); 2061 | } 2062 | 2063 | 11.53846%, 2064 | 19.23077%, 2065 | 26.92308%, 2066 | 3.84615%, 2067 | 50%, 2068 | 57.69231%, 2069 | 65.38462%, 2070 | 73.07692% { 2071 | -webkit-transform: translateY(-5%); 2072 | -moz-transform: translateY(-5%); 2073 | -ms-transform: translateY(-5%); 2074 | -o-transform: translateY(-5%); 2075 | transform: translateY(-5%); 2076 | } 2077 | 2078 | 76.92308% { 2079 | -webkit-transform: translateY(30%); 2080 | -moz-transform: translateY(30%); 2081 | -ms-transform: translateY(30%); 2082 | -o-transform: translateY(30%); 2083 | transform: translateY(30%); 2084 | } 2085 | 2086 | 84.61538% { 2087 | -webkit-transform: translateY(-10%); 2088 | -moz-transform: translateY(-10%); 2089 | -ms-transform: translateY(-10%); 2090 | -o-transform: translateY(-10%); 2091 | transform: translateY(-10%); 2092 | } 2093 | } 2094 | 2095 | @-o-keyframes mouth-move { 2096 | 0%, 2097 | 100%, 2098 | 15.38462%, 2099 | 23.07692%, 2100 | 30.76923%, 2101 | 46.15385%, 2102 | 53.84615%, 2103 | 61.53846%, 2104 | 69.23077%, 2105 | 7.69231% { 2106 | -webkit-transform: translateY(15%); 2107 | -moz-transform: translateY(15%); 2108 | -ms-transform: translateY(15%); 2109 | -o-transform: translateY(15%); 2110 | transform: translateY(15%); 2111 | } 2112 | 2113 | 11.53846%, 2114 | 19.23077%, 2115 | 26.92308%, 2116 | 3.84615%, 2117 | 50%, 2118 | 57.69231%, 2119 | 65.38462%, 2120 | 73.07692% { 2121 | -webkit-transform: translateY(-5%); 2122 | -moz-transform: translateY(-5%); 2123 | -ms-transform: translateY(-5%); 2124 | -o-transform: translateY(-5%); 2125 | transform: translateY(-5%); 2126 | } 2127 | 2128 | 76.92308% { 2129 | -webkit-transform: translateY(30%); 2130 | -moz-transform: translateY(30%); 2131 | -ms-transform: translateY(30%); 2132 | -o-transform: translateY(30%); 2133 | transform: translateY(30%); 2134 | } 2135 | 2136 | 84.61538% { 2137 | -webkit-transform: translateY(-10%); 2138 | -moz-transform: translateY(-10%); 2139 | -ms-transform: translateY(-10%); 2140 | -o-transform: translateY(-10%); 2141 | transform: translateY(-10%); 2142 | } 2143 | } 2144 | 2145 | @keyframes mouth-move { 2146 | 0%, 2147 | 100%, 2148 | 15.38462%, 2149 | 23.07692%, 2150 | 30.76923%, 2151 | 46.15385%, 2152 | 53.84615%, 2153 | 61.53846%, 2154 | 69.23077%, 2155 | 7.69231% { 2156 | -webkit-transform: translateY(15%); 2157 | -moz-transform: translateY(15%); 2158 | -ms-transform: translateY(15%); 2159 | -o-transform: translateY(15%); 2160 | transform: translateY(15%); 2161 | } 2162 | 2163 | 11.53846%, 2164 | 19.23077%, 2165 | 26.92308%, 2166 | 3.84615%, 2167 | 50%, 2168 | 57.69231%, 2169 | 65.38462%, 2170 | 73.07692% { 2171 | -webkit-transform: translateY(-5%); 2172 | -moz-transform: translateY(-5%); 2173 | -ms-transform: translateY(-5%); 2174 | -o-transform: translateY(-5%); 2175 | transform: translateY(-5%); 2176 | } 2177 | 2178 | 76.92308% { 2179 | -webkit-transform: translateY(30%); 2180 | -moz-transform: translateY(30%); 2181 | -ms-transform: translateY(30%); 2182 | -o-transform: translateY(30%); 2183 | transform: translateY(30%); 2184 | } 2185 | 2186 | 84.61538% { 2187 | -webkit-transform: translateY(-10%); 2188 | -moz-transform: translateY(-10%); 2189 | -ms-transform: translateY(-10%); 2190 | -o-transform: translateY(-10%); 2191 | transform: translateY(-10%); 2192 | } 2193 | } 2194 | 2195 | @-moz-keyframes mouth { 2196 | 0%, 2197 | 93.07692% { 2198 | width: 12%; 2199 | height: 6%; 2200 | bottom: 13%; 2201 | left: 33%; 2202 | border-radius: 50%; 2203 | box-shadow: 0 -2px #260f02; 2204 | border: none; 2205 | background: 0 0; 2206 | } 2207 | 2208 | 79.23077%, 2209 | 92.30769% { 2210 | height: 10%; 2211 | background: #b37b7e; 2212 | box-shadow: inset 0 5px #260f02; 2213 | border: 2px solid #260f02; 2214 | border-radius: 50%/60% 60% 40% 40%; 2215 | } 2216 | } 2217 | 2218 | @-webkit-keyframes mouth { 2219 | 0%, 2220 | 93.07692% { 2221 | width: 12%; 2222 | height: 6%; 2223 | bottom: 13%; 2224 | left: 33%; 2225 | border-radius: 50%; 2226 | box-shadow: 0 -2px #260f02; 2227 | border: none; 2228 | background: 0 0; 2229 | } 2230 | 2231 | 79.23077%, 2232 | 92.30769% { 2233 | height: 10%; 2234 | background: #b37b7e; 2235 | box-shadow: inset 0 5px #260f02; 2236 | border: 2px solid #260f02; 2237 | border-radius: 50%/60% 60% 40% 40%; 2238 | } 2239 | } 2240 | 2241 | @-o-keyframes mouth { 2242 | 0%, 2243 | 93.07692% { 2244 | width: 12%; 2245 | height: 6%; 2246 | bottom: 13%; 2247 | left: 33%; 2248 | border-radius: 50%; 2249 | box-shadow: 0 -2px #260f02; 2250 | border: none; 2251 | background: 0 0; 2252 | } 2253 | 2254 | 79.23077%, 2255 | 92.30769% { 2256 | height: 10%; 2257 | background: #b37b7e; 2258 | box-shadow: inset 0 5px #260f02; 2259 | border: 2px solid #260f02; 2260 | border-radius: 50%/60% 60% 40% 40%; 2261 | } 2262 | } 2263 | 2264 | @keyframes mouth { 2265 | 0%, 2266 | 93.07692% { 2267 | width: 12%; 2268 | height: 6%; 2269 | bottom: 13%; 2270 | left: 33%; 2271 | border-radius: 50%; 2272 | box-shadow: 0 -2px #260f02; 2273 | border: none; 2274 | background: 0 0; 2275 | } 2276 | 2277 | 79.23077%, 2278 | 92.30769% { 2279 | height: 10%; 2280 | background: #b37b7e; 2281 | box-shadow: inset 0 5px #260f02; 2282 | border: 2px solid #260f02; 2283 | border-radius: 50%/60% 60% 40% 40%; 2284 | } 2285 | } 2286 | 2287 | @-moz-keyframes mouth-side { 2288 | 0%, 2289 | 93.07692% { 2290 | opacity: 1; 2291 | } 2292 | 2293 | 79.23077% { 2294 | opacity: 0; 2295 | } 2296 | } 2297 | 2298 | @-webkit-keyframes mouth-side { 2299 | 0%, 2300 | 93.07692% { 2301 | opacity: 1; 2302 | } 2303 | 2304 | 79.23077% { 2305 | opacity: 0; 2306 | } 2307 | } 2308 | 2309 | @-o-keyframes mouth-side { 2310 | 0%, 2311 | 93.07692% { 2312 | opacity: 1; 2313 | } 2314 | 2315 | 79.23077% { 2316 | opacity: 0; 2317 | } 2318 | } 2319 | 2320 | @keyframes mouth-side { 2321 | 0%, 2322 | 93.07692% { 2323 | opacity: 1; 2324 | } 2325 | 2326 | 79.23077% { 2327 | opacity: 0; 2328 | } 2329 | } 2330 | 2331 | @-moz-keyframes ear { 2332 | 11.53846%, 2333 | 19.23077%, 2334 | 26.92308%, 2335 | 3.84615%, 2336 | 50%, 2337 | 57.69231%, 2338 | 65.38462%, 2339 | 73.07692% { 2340 | -webkit-transform: rotateX(-20deg) rotate(-15deg); 2341 | -moz-transform: rotateX(-20deg) rotate(-15deg); 2342 | -ms-transform: rotateX(-20deg) rotate(-15deg); 2343 | -o-transform: rotateX(-20deg) rotate(-15deg); 2344 | transform: rotateX(-20deg) rotate(-15deg); 2345 | } 2346 | 2347 | 0%, 2348 | 100%, 2349 | 15.38462%, 2350 | 23.07692%, 2351 | 30.76923%, 2352 | 46.15385%, 2353 | 53.84615%, 2354 | 61.53846%, 2355 | 69.23077%, 2356 | 7.69231% { 2357 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2358 | -moz-transform: rotateX(20deg) rotate(-5deg); 2359 | -ms-transform: rotateX(20deg) rotate(-5deg); 2360 | -o-transform: rotateX(20deg) rotate(-5deg); 2361 | transform: rotateX(20deg) rotate(-5deg); 2362 | } 2363 | 2364 | 36.15385%, 2365 | 37.69231%, 2366 | 39.23077%, 2367 | 40.76923% { 2368 | -webkit-transform: rotate(-20deg); 2369 | -moz-transform: rotate(-20deg); 2370 | -ms-transform: rotate(-20deg); 2371 | -o-transform: rotate(-20deg); 2372 | transform: rotate(-20deg); 2373 | } 2374 | 2375 | 36.92308%, 2376 | 38.46154%, 2377 | 40%, 2378 | 43.07692% { 2379 | -webkit-transform: rotate(-10deg); 2380 | -moz-transform: rotate(-10deg); 2381 | -ms-transform: rotate(-10deg); 2382 | -o-transform: rotate(-10deg); 2383 | transform: rotate(-10deg); 2384 | } 2385 | 2386 | 76.92308% { 2387 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2388 | -moz-transform: rotateX(20deg) rotate(-5deg); 2389 | -ms-transform: rotateX(20deg) rotate(-5deg); 2390 | -o-transform: rotateX(20deg) rotate(-5deg); 2391 | transform: rotateX(20deg) rotate(-5deg); 2392 | } 2393 | 2394 | 80%, 2395 | 83.07692%, 2396 | 86.15385%, 2397 | 89.23077%, 2398 | 92.30769% { 2399 | -webkit-transform: rotateX(-30deg) rotate(-30deg); 2400 | -moz-transform: rotateX(-30deg) rotate(-30deg); 2401 | -ms-transform: rotateX(-30deg) rotate(-30deg); 2402 | -o-transform: rotateX(-30deg) rotate(-30deg); 2403 | transform: rotateX(-30deg) rotate(-30deg); 2404 | } 2405 | 2406 | 81.53846%, 2407 | 84.61538%, 2408 | 87.69231%, 2409 | 90.76923%, 2410 | 93.84615% { 2411 | -webkit-transform: rotateX(-20deg) rotate(-20deg); 2412 | -moz-transform: rotateX(-20deg) rotate(-20deg); 2413 | -ms-transform: rotateX(-20deg) rotate(-20deg); 2414 | -o-transform: rotateX(-20deg) rotate(-20deg); 2415 | transform: rotateX(-20deg) rotate(-20deg); 2416 | } 2417 | } 2418 | 2419 | @-webkit-keyframes ear { 2420 | 11.53846%, 2421 | 19.23077%, 2422 | 26.92308%, 2423 | 3.84615%, 2424 | 50%, 2425 | 57.69231%, 2426 | 65.38462%, 2427 | 73.07692% { 2428 | -webkit-transform: rotateX(-20deg) rotate(-15deg); 2429 | -moz-transform: rotateX(-20deg) rotate(-15deg); 2430 | -ms-transform: rotateX(-20deg) rotate(-15deg); 2431 | -o-transform: rotateX(-20deg) rotate(-15deg); 2432 | transform: rotateX(-20deg) rotate(-15deg); 2433 | } 2434 | 2435 | 0%, 2436 | 100%, 2437 | 15.38462%, 2438 | 23.07692%, 2439 | 30.76923%, 2440 | 46.15385%, 2441 | 53.84615%, 2442 | 61.53846%, 2443 | 69.23077%, 2444 | 7.69231% { 2445 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2446 | -moz-transform: rotateX(20deg) rotate(-5deg); 2447 | -ms-transform: rotateX(20deg) rotate(-5deg); 2448 | -o-transform: rotateX(20deg) rotate(-5deg); 2449 | transform: rotateX(20deg) rotate(-5deg); 2450 | } 2451 | 2452 | 36.15385%, 2453 | 37.69231%, 2454 | 39.23077%, 2455 | 40.76923% { 2456 | -webkit-transform: rotate(-20deg); 2457 | -moz-transform: rotate(-20deg); 2458 | -ms-transform: rotate(-20deg); 2459 | -o-transform: rotate(-20deg); 2460 | transform: rotate(-20deg); 2461 | } 2462 | 2463 | 36.92308%, 2464 | 38.46154%, 2465 | 40%, 2466 | 43.07692% { 2467 | -webkit-transform: rotate(-10deg); 2468 | -moz-transform: rotate(-10deg); 2469 | -ms-transform: rotate(-10deg); 2470 | -o-transform: rotate(-10deg); 2471 | transform: rotate(-10deg); 2472 | } 2473 | 2474 | 76.92308% { 2475 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2476 | -moz-transform: rotateX(20deg) rotate(-5deg); 2477 | -ms-transform: rotateX(20deg) rotate(-5deg); 2478 | -o-transform: rotateX(20deg) rotate(-5deg); 2479 | transform: rotateX(20deg) rotate(-5deg); 2480 | } 2481 | 2482 | 80%, 2483 | 83.07692%, 2484 | 86.15385%, 2485 | 89.23077%, 2486 | 92.30769% { 2487 | -webkit-transform: rotateX(-30deg) rotate(-30deg); 2488 | -moz-transform: rotateX(-30deg) rotate(-30deg); 2489 | -ms-transform: rotateX(-30deg) rotate(-30deg); 2490 | -o-transform: rotateX(-30deg) rotate(-30deg); 2491 | transform: rotateX(-30deg) rotate(-30deg); 2492 | } 2493 | 2494 | 81.53846%, 2495 | 84.61538%, 2496 | 87.69231%, 2497 | 90.76923%, 2498 | 93.84615% { 2499 | -webkit-transform: rotateX(-20deg) rotate(-20deg); 2500 | -moz-transform: rotateX(-20deg) rotate(-20deg); 2501 | -ms-transform: rotateX(-20deg) rotate(-20deg); 2502 | -o-transform: rotateX(-20deg) rotate(-20deg); 2503 | transform: rotateX(-20deg) rotate(-20deg); 2504 | } 2505 | } 2506 | 2507 | @-o-keyframes ear { 2508 | 11.53846%, 2509 | 19.23077%, 2510 | 26.92308%, 2511 | 3.84615%, 2512 | 50%, 2513 | 57.69231%, 2514 | 65.38462%, 2515 | 73.07692% { 2516 | -webkit-transform: rotateX(-20deg) rotate(-15deg); 2517 | -moz-transform: rotateX(-20deg) rotate(-15deg); 2518 | -ms-transform: rotateX(-20deg) rotate(-15deg); 2519 | -o-transform: rotateX(-20deg) rotate(-15deg); 2520 | transform: rotateX(-20deg) rotate(-15deg); 2521 | } 2522 | 2523 | 0%, 2524 | 100%, 2525 | 15.38462%, 2526 | 23.07692%, 2527 | 30.76923%, 2528 | 46.15385%, 2529 | 53.84615%, 2530 | 61.53846%, 2531 | 69.23077%, 2532 | 7.69231% { 2533 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2534 | -moz-transform: rotateX(20deg) rotate(-5deg); 2535 | -ms-transform: rotateX(20deg) rotate(-5deg); 2536 | -o-transform: rotateX(20deg) rotate(-5deg); 2537 | transform: rotateX(20deg) rotate(-5deg); 2538 | } 2539 | 2540 | 36.15385%, 2541 | 37.69231%, 2542 | 39.23077%, 2543 | 40.76923% { 2544 | -webkit-transform: rotate(-20deg); 2545 | -moz-transform: rotate(-20deg); 2546 | -ms-transform: rotate(-20deg); 2547 | -o-transform: rotate(-20deg); 2548 | transform: rotate(-20deg); 2549 | } 2550 | 2551 | 36.92308%, 2552 | 38.46154%, 2553 | 40%, 2554 | 43.07692% { 2555 | -webkit-transform: rotate(-10deg); 2556 | -moz-transform: rotate(-10deg); 2557 | -ms-transform: rotate(-10deg); 2558 | -o-transform: rotate(-10deg); 2559 | transform: rotate(-10deg); 2560 | } 2561 | 2562 | 76.92308% { 2563 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2564 | -moz-transform: rotateX(20deg) rotate(-5deg); 2565 | -ms-transform: rotateX(20deg) rotate(-5deg); 2566 | -o-transform: rotateX(20deg) rotate(-5deg); 2567 | transform: rotateX(20deg) rotate(-5deg); 2568 | } 2569 | 2570 | 80%, 2571 | 83.07692%, 2572 | 86.15385%, 2573 | 89.23077%, 2574 | 92.30769% { 2575 | -webkit-transform: rotateX(-30deg) rotate(-30deg); 2576 | -moz-transform: rotateX(-30deg) rotate(-30deg); 2577 | -ms-transform: rotateX(-30deg) rotate(-30deg); 2578 | -o-transform: rotateX(-30deg) rotate(-30deg); 2579 | transform: rotateX(-30deg) rotate(-30deg); 2580 | } 2581 | 2582 | 81.53846%, 2583 | 84.61538%, 2584 | 87.69231%, 2585 | 90.76923%, 2586 | 93.84615% { 2587 | -webkit-transform: rotateX(-20deg) rotate(-20deg); 2588 | -moz-transform: rotateX(-20deg) rotate(-20deg); 2589 | -ms-transform: rotateX(-20deg) rotate(-20deg); 2590 | -o-transform: rotateX(-20deg) rotate(-20deg); 2591 | transform: rotateX(-20deg) rotate(-20deg); 2592 | } 2593 | } 2594 | 2595 | @keyframes ear { 2596 | 11.53846%, 2597 | 19.23077%, 2598 | 26.92308%, 2599 | 3.84615%, 2600 | 50%, 2601 | 57.69231%, 2602 | 65.38462%, 2603 | 73.07692% { 2604 | -webkit-transform: rotateX(-20deg) rotate(-15deg); 2605 | -moz-transform: rotateX(-20deg) rotate(-15deg); 2606 | -ms-transform: rotateX(-20deg) rotate(-15deg); 2607 | -o-transform: rotateX(-20deg) rotate(-15deg); 2608 | transform: rotateX(-20deg) rotate(-15deg); 2609 | } 2610 | 2611 | 0%, 2612 | 100%, 2613 | 15.38462%, 2614 | 23.07692%, 2615 | 30.76923%, 2616 | 46.15385%, 2617 | 53.84615%, 2618 | 61.53846%, 2619 | 69.23077%, 2620 | 7.69231% { 2621 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2622 | -moz-transform: rotateX(20deg) rotate(-5deg); 2623 | -ms-transform: rotateX(20deg) rotate(-5deg); 2624 | -o-transform: rotateX(20deg) rotate(-5deg); 2625 | transform: rotateX(20deg) rotate(-5deg); 2626 | } 2627 | 2628 | 36.15385%, 2629 | 37.69231%, 2630 | 39.23077%, 2631 | 40.76923% { 2632 | -webkit-transform: rotate(-20deg); 2633 | -moz-transform: rotate(-20deg); 2634 | -ms-transform: rotate(-20deg); 2635 | -o-transform: rotate(-20deg); 2636 | transform: rotate(-20deg); 2637 | } 2638 | 2639 | 36.92308%, 2640 | 38.46154%, 2641 | 40%, 2642 | 43.07692% { 2643 | -webkit-transform: rotate(-10deg); 2644 | -moz-transform: rotate(-10deg); 2645 | -ms-transform: rotate(-10deg); 2646 | -o-transform: rotate(-10deg); 2647 | transform: rotate(-10deg); 2648 | } 2649 | 2650 | 76.92308% { 2651 | -webkit-transform: rotateX(20deg) rotate(-5deg); 2652 | -moz-transform: rotateX(20deg) rotate(-5deg); 2653 | -ms-transform: rotateX(20deg) rotate(-5deg); 2654 | -o-transform: rotateX(20deg) rotate(-5deg); 2655 | transform: rotateX(20deg) rotate(-5deg); 2656 | } 2657 | 2658 | 80%, 2659 | 83.07692%, 2660 | 86.15385%, 2661 | 89.23077%, 2662 | 92.30769% { 2663 | -webkit-transform: rotateX(-30deg) rotate(-30deg); 2664 | -moz-transform: rotateX(-30deg) rotate(-30deg); 2665 | -ms-transform: rotateX(-30deg) rotate(-30deg); 2666 | -o-transform: rotateX(-30deg) rotate(-30deg); 2667 | transform: rotateX(-30deg) rotate(-30deg); 2668 | } 2669 | 2670 | 81.53846%, 2671 | 84.61538%, 2672 | 87.69231%, 2673 | 90.76923%, 2674 | 93.84615% { 2675 | -webkit-transform: rotateX(-20deg) rotate(-20deg); 2676 | -moz-transform: rotateX(-20deg) rotate(-20deg); 2677 | -ms-transform: rotateX(-20deg) rotate(-20deg); 2678 | -o-transform: rotateX(-20deg) rotate(-20deg); 2679 | transform: rotateX(-20deg) rotate(-20deg); 2680 | } 2681 | } 2682 | 2683 | @-moz-keyframes tail { 2684 | 0%, 2685 | 100%, 2686 | 15.38462%, 2687 | 23.07692%, 2688 | 30.76923%, 2689 | 46.15385%, 2690 | 53.84615%, 2691 | 61.53846%, 2692 | 69.23077%, 2693 | 7.69231% { 2694 | -webkit-transform: scale(0.9) rotate(-5deg); 2695 | -moz-transform: scale(0.9) rotate(-5deg); 2696 | -ms-transform: scale(0.9) rotate(-5deg); 2697 | -o-transform: scale(0.9) rotate(-5deg); 2698 | transform: scale(0.9) rotate(-5deg); 2699 | } 2700 | 2701 | 11.53846%, 2702 | 19.23077%, 2703 | 26.92308%, 2704 | 3.84615%, 2705 | 50%, 2706 | 57.69231%, 2707 | 65.38462%, 2708 | 73.07692% { 2709 | -webkit-transform: scale(0.9) rotate(5deg); 2710 | -moz-transform: scale(0.9) rotate(5deg); 2711 | -ms-transform: scale(0.9) rotate(5deg); 2712 | -o-transform: scale(0.9) rotate(5deg); 2713 | transform: scale(0.9) rotate(5deg); 2714 | } 2715 | 2716 | 33.84615% { 2717 | -webkit-transform: scale(0.9) rotate(10deg); 2718 | -moz-transform: scale(0.9) rotate(10deg); 2719 | -ms-transform: scale(0.9) rotate(10deg); 2720 | -o-transform: scale(0.9) rotate(10deg); 2721 | transform: scale(0.9) rotate(10deg); 2722 | } 2723 | 2724 | 35.38462%, 2725 | 38.46154%, 2726 | 41.53846% { 2727 | -webkit-transform: scale(0.9) rotate(-2deg); 2728 | -moz-transform: scale(0.9) rotate(-2deg); 2729 | -ms-transform: scale(0.9) rotate(-2deg); 2730 | -o-transform: scale(0.9) rotate(-2deg); 2731 | transform: scale(0.9) rotate(-2deg); 2732 | } 2733 | 2734 | 36.92308%, 2735 | 40%, 2736 | 43.07692% { 2737 | -webkit-transform: scale(0.9) rotate(4deg); 2738 | -moz-transform: scale(0.9) rotate(4deg); 2739 | -ms-transform: scale(0.9) rotate(4deg); 2740 | -o-transform: scale(0.9) rotate(4deg); 2741 | transform: scale(0.9) rotate(4deg); 2742 | } 2743 | 2744 | 76.92308% { 2745 | -webkit-transform: scale(0.9) rotate(-7deg); 2746 | -moz-transform: scale(0.9) rotate(-7deg); 2747 | -ms-transform: scale(0.9) rotate(-7deg); 2748 | -o-transform: scale(0.9) rotate(-7deg); 2749 | transform: scale(0.9) rotate(-7deg); 2750 | } 2751 | 2752 | 84.61538% { 2753 | -webkit-transform: scale(0.9) rotate(15deg); 2754 | -moz-transform: scale(0.9) rotate(15deg); 2755 | -ms-transform: scale(0.9) rotate(15deg); 2756 | -o-transform: scale(0.9) rotate(15deg); 2757 | transform: scale(0.9) rotate(15deg); 2758 | } 2759 | } 2760 | 2761 | @-webkit-keyframes tail { 2762 | 0%, 2763 | 100%, 2764 | 15.38462%, 2765 | 23.07692%, 2766 | 30.76923%, 2767 | 46.15385%, 2768 | 53.84615%, 2769 | 61.53846%, 2770 | 69.23077%, 2771 | 7.69231% { 2772 | -webkit-transform: scale(0.9) rotate(-5deg); 2773 | -moz-transform: scale(0.9) rotate(-5deg); 2774 | -ms-transform: scale(0.9) rotate(-5deg); 2775 | -o-transform: scale(0.9) rotate(-5deg); 2776 | transform: scale(0.9) rotate(-5deg); 2777 | } 2778 | 2779 | 11.53846%, 2780 | 19.23077%, 2781 | 26.92308%, 2782 | 3.84615%, 2783 | 50%, 2784 | 57.69231%, 2785 | 65.38462%, 2786 | 73.07692% { 2787 | -webkit-transform: scale(0.9) rotate(5deg); 2788 | -moz-transform: scale(0.9) rotate(5deg); 2789 | -ms-transform: scale(0.9) rotate(5deg); 2790 | -o-transform: scale(0.9) rotate(5deg); 2791 | transform: scale(0.9) rotate(5deg); 2792 | } 2793 | 2794 | 33.84615% { 2795 | -webkit-transform: scale(0.9) rotate(10deg); 2796 | -moz-transform: scale(0.9) rotate(10deg); 2797 | -ms-transform: scale(0.9) rotate(10deg); 2798 | -o-transform: scale(0.9) rotate(10deg); 2799 | transform: scale(0.9) rotate(10deg); 2800 | } 2801 | 2802 | 35.38462%, 2803 | 38.46154%, 2804 | 41.53846% { 2805 | -webkit-transform: scale(0.9) rotate(-2deg); 2806 | -moz-transform: scale(0.9) rotate(-2deg); 2807 | -ms-transform: scale(0.9) rotate(-2deg); 2808 | -o-transform: scale(0.9) rotate(-2deg); 2809 | transform: scale(0.9) rotate(-2deg); 2810 | } 2811 | 2812 | 36.92308%, 2813 | 40%, 2814 | 43.07692% { 2815 | -webkit-transform: scale(0.9) rotate(4deg); 2816 | -moz-transform: scale(0.9) rotate(4deg); 2817 | -ms-transform: scale(0.9) rotate(4deg); 2818 | -o-transform: scale(0.9) rotate(4deg); 2819 | transform: scale(0.9) rotate(4deg); 2820 | } 2821 | 2822 | 76.92308% { 2823 | -webkit-transform: scale(0.9) rotate(-7deg); 2824 | -moz-transform: scale(0.9) rotate(-7deg); 2825 | -ms-transform: scale(0.9) rotate(-7deg); 2826 | -o-transform: scale(0.9) rotate(-7deg); 2827 | transform: scale(0.9) rotate(-7deg); 2828 | } 2829 | 2830 | 84.61538% { 2831 | -webkit-transform: scale(0.9) rotate(15deg); 2832 | -moz-transform: scale(0.9) rotate(15deg); 2833 | -ms-transform: scale(0.9) rotate(15deg); 2834 | -o-transform: scale(0.9) rotate(15deg); 2835 | transform: scale(0.9) rotate(15deg); 2836 | } 2837 | } 2838 | 2839 | @-o-keyframes tail { 2840 | 0%, 2841 | 100%, 2842 | 15.38462%, 2843 | 23.07692%, 2844 | 30.76923%, 2845 | 46.15385%, 2846 | 53.84615%, 2847 | 61.53846%, 2848 | 69.23077%, 2849 | 7.69231% { 2850 | -webkit-transform: scale(0.9) rotate(-5deg); 2851 | -moz-transform: scale(0.9) rotate(-5deg); 2852 | -ms-transform: scale(0.9) rotate(-5deg); 2853 | -o-transform: scale(0.9) rotate(-5deg); 2854 | transform: scale(0.9) rotate(-5deg); 2855 | } 2856 | 2857 | 11.53846%, 2858 | 19.23077%, 2859 | 26.92308%, 2860 | 3.84615%, 2861 | 50%, 2862 | 57.69231%, 2863 | 65.38462%, 2864 | 73.07692% { 2865 | -webkit-transform: scale(0.9) rotate(5deg); 2866 | -moz-transform: scale(0.9) rotate(5deg); 2867 | -ms-transform: scale(0.9) rotate(5deg); 2868 | -o-transform: scale(0.9) rotate(5deg); 2869 | transform: scale(0.9) rotate(5deg); 2870 | } 2871 | 2872 | 33.84615% { 2873 | -webkit-transform: scale(0.9) rotate(10deg); 2874 | -moz-transform: scale(0.9) rotate(10deg); 2875 | -ms-transform: scale(0.9) rotate(10deg); 2876 | -o-transform: scale(0.9) rotate(10deg); 2877 | transform: scale(0.9) rotate(10deg); 2878 | } 2879 | 2880 | 35.38462%, 2881 | 38.46154%, 2882 | 41.53846% { 2883 | -webkit-transform: scale(0.9) rotate(-2deg); 2884 | -moz-transform: scale(0.9) rotate(-2deg); 2885 | -ms-transform: scale(0.9) rotate(-2deg); 2886 | -o-transform: scale(0.9) rotate(-2deg); 2887 | transform: scale(0.9) rotate(-2deg); 2888 | } 2889 | 2890 | 36.92308%, 2891 | 40%, 2892 | 43.07692% { 2893 | -webkit-transform: scale(0.9) rotate(4deg); 2894 | -moz-transform: scale(0.9) rotate(4deg); 2895 | -ms-transform: scale(0.9) rotate(4deg); 2896 | -o-transform: scale(0.9) rotate(4deg); 2897 | transform: scale(0.9) rotate(4deg); 2898 | } 2899 | 2900 | 76.92308% { 2901 | -webkit-transform: scale(0.9) rotate(-7deg); 2902 | -moz-transform: scale(0.9) rotate(-7deg); 2903 | -ms-transform: scale(0.9) rotate(-7deg); 2904 | -o-transform: scale(0.9) rotate(-7deg); 2905 | transform: scale(0.9) rotate(-7deg); 2906 | } 2907 | 2908 | 84.61538% { 2909 | -webkit-transform: scale(0.9) rotate(15deg); 2910 | -moz-transform: scale(0.9) rotate(15deg); 2911 | -ms-transform: scale(0.9) rotate(15deg); 2912 | -o-transform: scale(0.9) rotate(15deg); 2913 | transform: scale(0.9) rotate(15deg); 2914 | } 2915 | } 2916 | 2917 | @keyframes tail { 2918 | 0%, 2919 | 100%, 2920 | 15.38462%, 2921 | 23.07692%, 2922 | 30.76923%, 2923 | 46.15385%, 2924 | 53.84615%, 2925 | 61.53846%, 2926 | 69.23077%, 2927 | 7.69231% { 2928 | -webkit-transform: scale(0.9) rotate(-5deg); 2929 | -moz-transform: scale(0.9) rotate(-5deg); 2930 | -ms-transform: scale(0.9) rotate(-5deg); 2931 | -o-transform: scale(0.9) rotate(-5deg); 2932 | transform: scale(0.9) rotate(-5deg); 2933 | } 2934 | 2935 | 11.53846%, 2936 | 19.23077%, 2937 | 26.92308%, 2938 | 3.84615%, 2939 | 50%, 2940 | 57.69231%, 2941 | 65.38462%, 2942 | 73.07692% { 2943 | -webkit-transform: scale(0.9) rotate(5deg); 2944 | -moz-transform: scale(0.9) rotate(5deg); 2945 | -ms-transform: scale(0.9) rotate(5deg); 2946 | -o-transform: scale(0.9) rotate(5deg); 2947 | transform: scale(0.9) rotate(5deg); 2948 | } 2949 | 2950 | 33.84615% { 2951 | -webkit-transform: scale(0.9) rotate(10deg); 2952 | -moz-transform: scale(0.9) rotate(10deg); 2953 | -ms-transform: scale(0.9) rotate(10deg); 2954 | -o-transform: scale(0.9) rotate(10deg); 2955 | transform: scale(0.9) rotate(10deg); 2956 | } 2957 | 2958 | 35.38462%, 2959 | 38.46154%, 2960 | 41.53846% { 2961 | -webkit-transform: scale(0.9) rotate(-2deg); 2962 | -moz-transform: scale(0.9) rotate(-2deg); 2963 | -ms-transform: scale(0.9) rotate(-2deg); 2964 | -o-transform: scale(0.9) rotate(-2deg); 2965 | transform: scale(0.9) rotate(-2deg); 2966 | } 2967 | 2968 | 36.92308%, 2969 | 40%, 2970 | 43.07692% { 2971 | -webkit-transform: scale(0.9) rotate(4deg); 2972 | -moz-transform: scale(0.9) rotate(4deg); 2973 | -ms-transform: scale(0.9) rotate(4deg); 2974 | -o-transform: scale(0.9) rotate(4deg); 2975 | transform: scale(0.9) rotate(4deg); 2976 | } 2977 | 2978 | 76.92308% { 2979 | -webkit-transform: scale(0.9) rotate(-7deg); 2980 | -moz-transform: scale(0.9) rotate(-7deg); 2981 | -ms-transform: scale(0.9) rotate(-7deg); 2982 | -o-transform: scale(0.9) rotate(-7deg); 2983 | transform: scale(0.9) rotate(-7deg); 2984 | } 2985 | 2986 | 84.61538% { 2987 | -webkit-transform: scale(0.9) rotate(15deg); 2988 | -moz-transform: scale(0.9) rotate(15deg); 2989 | -ms-transform: scale(0.9) rotate(15deg); 2990 | -o-transform: scale(0.9) rotate(15deg); 2991 | transform: scale(0.9) rotate(15deg); 2992 | } 2993 | } 2994 | 2995 | @-moz-keyframes tail-end { 2996 | 0%, 2997 | 100%, 2998 | 15.38462%, 2999 | 23.07692%, 3000 | 30.76923%, 3001 | 46.15385%, 3002 | 53.84615%, 3003 | 61.53846%, 3004 | 69.23077%, 3005 | 7.69231% { 3006 | -webkit-transform: scale(0.9) rotate(-12deg); 3007 | -moz-transform: scale(0.9) rotate(-12deg); 3008 | -ms-transform: scale(0.9) rotate(-12deg); 3009 | -o-transform: scale(0.9) rotate(-12deg); 3010 | transform: scale(0.9) rotate(-12deg); 3011 | } 3012 | 3013 | 11.53846%, 3014 | 19.23077%, 3015 | 26.92308%, 3016 | 3.84615%, 3017 | 50%, 3018 | 57.69231%, 3019 | 65.38462%, 3020 | 73.07692% { 3021 | -webkit-transform: scale(0.9) rotate(9deg); 3022 | -moz-transform: scale(0.9) rotate(9deg); 3023 | -ms-transform: scale(0.9) rotate(9deg); 3024 | -o-transform: scale(0.9) rotate(9deg); 3025 | transform: scale(0.9) rotate(9deg); 3026 | } 3027 | 3028 | 33.84615% { 3029 | -webkit-transform: scale(0.9) rotate(10deg); 3030 | -moz-transform: scale(0.9) rotate(10deg); 3031 | -ms-transform: scale(0.9) rotate(10deg); 3032 | -o-transform: scale(0.9) rotate(10deg); 3033 | transform: scale(0.9) rotate(10deg); 3034 | } 3035 | 3036 | 35.38462%, 3037 | 38.46154%, 3038 | 41.53846% { 3039 | -webkit-transform: scale(0.9) rotate(-4deg); 3040 | -moz-transform: scale(0.9) rotate(-4deg); 3041 | -ms-transform: scale(0.9) rotate(-4deg); 3042 | -o-transform: scale(0.9) rotate(-4deg); 3043 | transform: scale(0.9) rotate(-4deg); 3044 | } 3045 | 3046 | 36.92308%, 3047 | 40%, 3048 | 43.07692% { 3049 | -webkit-transform: scale(0.9) rotate(12deg); 3050 | -moz-transform: scale(0.9) rotate(12deg); 3051 | -ms-transform: scale(0.9) rotate(12deg); 3052 | -o-transform: scale(0.9) rotate(12deg); 3053 | transform: scale(0.9) rotate(12deg); 3054 | } 3055 | 3056 | 76.92308% { 3057 | -webkit-transform: scale(0.9) rotate(7deg); 3058 | -moz-transform: scale(0.9) rotate(7deg); 3059 | -ms-transform: scale(0.9) rotate(7deg); 3060 | -o-transform: scale(0.9) rotate(7deg); 3061 | transform: scale(0.9) rotate(7deg); 3062 | } 3063 | 3064 | 81.53846%, 3065 | 84.61538%, 3066 | 87.69231%, 3067 | 90.76923% { 3068 | -webkit-transform: scale(0.9) rotate(-10deg); 3069 | -moz-transform: scale(0.9) rotate(-10deg); 3070 | -ms-transform: scale(0.9) rotate(-10deg); 3071 | -o-transform: scale(0.9) rotate(-10deg); 3072 | transform: scale(0.9) rotate(-10deg); 3073 | } 3074 | 3075 | 83.07692%, 3076 | 86.15385%, 3077 | 89.23077%, 3078 | 92.30769% { 3079 | -webkit-transform: scale(0.9) rotate(2deg); 3080 | -moz-transform: scale(0.9) rotate(2deg); 3081 | -ms-transform: scale(0.9) rotate(2deg); 3082 | -o-transform: scale(0.9) rotate(2deg); 3083 | transform: scale(0.9) rotate(2deg); 3084 | } 3085 | } 3086 | 3087 | @-webkit-keyframes tail-end { 3088 | 0%, 3089 | 100%, 3090 | 15.38462%, 3091 | 23.07692%, 3092 | 30.76923%, 3093 | 46.15385%, 3094 | 53.84615%, 3095 | 61.53846%, 3096 | 69.23077%, 3097 | 7.69231% { 3098 | -webkit-transform: scale(0.9) rotate(-12deg); 3099 | -moz-transform: scale(0.9) rotate(-12deg); 3100 | -ms-transform: scale(0.9) rotate(-12deg); 3101 | -o-transform: scale(0.9) rotate(-12deg); 3102 | transform: scale(0.9) rotate(-12deg); 3103 | } 3104 | 3105 | 11.53846%, 3106 | 19.23077%, 3107 | 26.92308%, 3108 | 3.84615%, 3109 | 50%, 3110 | 57.69231%, 3111 | 65.38462%, 3112 | 73.07692% { 3113 | -webkit-transform: scale(0.9) rotate(9deg); 3114 | -moz-transform: scale(0.9) rotate(9deg); 3115 | -ms-transform: scale(0.9) rotate(9deg); 3116 | -o-transform: scale(0.9) rotate(9deg); 3117 | transform: scale(0.9) rotate(9deg); 3118 | } 3119 | 3120 | 33.84615% { 3121 | -webkit-transform: scale(0.9) rotate(10deg); 3122 | -moz-transform: scale(0.9) rotate(10deg); 3123 | -ms-transform: scale(0.9) rotate(10deg); 3124 | -o-transform: scale(0.9) rotate(10deg); 3125 | transform: scale(0.9) rotate(10deg); 3126 | } 3127 | 3128 | 35.38462%, 3129 | 38.46154%, 3130 | 41.53846% { 3131 | -webkit-transform: scale(0.9) rotate(-4deg); 3132 | -moz-transform: scale(0.9) rotate(-4deg); 3133 | -ms-transform: scale(0.9) rotate(-4deg); 3134 | -o-transform: scale(0.9) rotate(-4deg); 3135 | transform: scale(0.9) rotate(-4deg); 3136 | } 3137 | 3138 | 36.92308%, 3139 | 40%, 3140 | 43.07692% { 3141 | -webkit-transform: scale(0.9) rotate(12deg); 3142 | -moz-transform: scale(0.9) rotate(12deg); 3143 | -ms-transform: scale(0.9) rotate(12deg); 3144 | -o-transform: scale(0.9) rotate(12deg); 3145 | transform: scale(0.9) rotate(12deg); 3146 | } 3147 | 3148 | 76.92308% { 3149 | -webkit-transform: scale(0.9) rotate(7deg); 3150 | -moz-transform: scale(0.9) rotate(7deg); 3151 | -ms-transform: scale(0.9) rotate(7deg); 3152 | -o-transform: scale(0.9) rotate(7deg); 3153 | transform: scale(0.9) rotate(7deg); 3154 | } 3155 | 3156 | 81.53846%, 3157 | 84.61538%, 3158 | 87.69231%, 3159 | 90.76923% { 3160 | -webkit-transform: scale(0.9) rotate(-10deg); 3161 | -moz-transform: scale(0.9) rotate(-10deg); 3162 | -ms-transform: scale(0.9) rotate(-10deg); 3163 | -o-transform: scale(0.9) rotate(-10deg); 3164 | transform: scale(0.9) rotate(-10deg); 3165 | } 3166 | 3167 | 83.07692%, 3168 | 86.15385%, 3169 | 89.23077%, 3170 | 92.30769% { 3171 | -webkit-transform: scale(0.9) rotate(2deg); 3172 | -moz-transform: scale(0.9) rotate(2deg); 3173 | -ms-transform: scale(0.9) rotate(2deg); 3174 | -o-transform: scale(0.9) rotate(2deg); 3175 | transform: scale(0.9) rotate(2deg); 3176 | } 3177 | } 3178 | 3179 | @-o-keyframes tail-end { 3180 | 0%, 3181 | 100%, 3182 | 15.38462%, 3183 | 23.07692%, 3184 | 30.76923%, 3185 | 46.15385%, 3186 | 53.84615%, 3187 | 61.53846%, 3188 | 69.23077%, 3189 | 7.69231% { 3190 | -webkit-transform: scale(0.9) rotate(-12deg); 3191 | -moz-transform: scale(0.9) rotate(-12deg); 3192 | -ms-transform: scale(0.9) rotate(-12deg); 3193 | -o-transform: scale(0.9) rotate(-12deg); 3194 | transform: scale(0.9) rotate(-12deg); 3195 | } 3196 | 3197 | 11.53846%, 3198 | 19.23077%, 3199 | 26.92308%, 3200 | 3.84615%, 3201 | 50%, 3202 | 57.69231%, 3203 | 65.38462%, 3204 | 73.07692% { 3205 | -webkit-transform: scale(0.9) rotate(9deg); 3206 | -moz-transform: scale(0.9) rotate(9deg); 3207 | -ms-transform: scale(0.9) rotate(9deg); 3208 | -o-transform: scale(0.9) rotate(9deg); 3209 | transform: scale(0.9) rotate(9deg); 3210 | } 3211 | 3212 | 33.84615% { 3213 | -webkit-transform: scale(0.9) rotate(10deg); 3214 | -moz-transform: scale(0.9) rotate(10deg); 3215 | -ms-transform: scale(0.9) rotate(10deg); 3216 | -o-transform: scale(0.9) rotate(10deg); 3217 | transform: scale(0.9) rotate(10deg); 3218 | } 3219 | 3220 | 35.38462%, 3221 | 38.46154%, 3222 | 41.53846% { 3223 | -webkit-transform: scale(0.9) rotate(-4deg); 3224 | -moz-transform: scale(0.9) rotate(-4deg); 3225 | -ms-transform: scale(0.9) rotate(-4deg); 3226 | -o-transform: scale(0.9) rotate(-4deg); 3227 | transform: scale(0.9) rotate(-4deg); 3228 | } 3229 | 3230 | 36.92308%, 3231 | 40%, 3232 | 43.07692% { 3233 | -webkit-transform: scale(0.9) rotate(12deg); 3234 | -moz-transform: scale(0.9) rotate(12deg); 3235 | -ms-transform: scale(0.9) rotate(12deg); 3236 | -o-transform: scale(0.9) rotate(12deg); 3237 | transform: scale(0.9) rotate(12deg); 3238 | } 3239 | 3240 | 76.92308% { 3241 | -webkit-transform: scale(0.9) rotate(7deg); 3242 | -moz-transform: scale(0.9) rotate(7deg); 3243 | -ms-transform: scale(0.9) rotate(7deg); 3244 | -o-transform: scale(0.9) rotate(7deg); 3245 | transform: scale(0.9) rotate(7deg); 3246 | } 3247 | 3248 | 81.53846%, 3249 | 84.61538%, 3250 | 87.69231%, 3251 | 90.76923% { 3252 | -webkit-transform: scale(0.9) rotate(-10deg); 3253 | -moz-transform: scale(0.9) rotate(-10deg); 3254 | -ms-transform: scale(0.9) rotate(-10deg); 3255 | -o-transform: scale(0.9) rotate(-10deg); 3256 | transform: scale(0.9) rotate(-10deg); 3257 | } 3258 | 3259 | 83.07692%, 3260 | 86.15385%, 3261 | 89.23077%, 3262 | 92.30769% { 3263 | -webkit-transform: scale(0.9) rotate(2deg); 3264 | -moz-transform: scale(0.9) rotate(2deg); 3265 | -ms-transform: scale(0.9) rotate(2deg); 3266 | -o-transform: scale(0.9) rotate(2deg); 3267 | transform: scale(0.9) rotate(2deg); 3268 | } 3269 | } 3270 | 3271 | @keyframes tail-end { 3272 | 0%, 3273 | 100%, 3274 | 15.38462%, 3275 | 23.07692%, 3276 | 30.76923%, 3277 | 46.15385%, 3278 | 53.84615%, 3279 | 61.53846%, 3280 | 69.23077%, 3281 | 7.69231% { 3282 | -webkit-transform: scale(0.9) rotate(-12deg); 3283 | -moz-transform: scale(0.9) rotate(-12deg); 3284 | -ms-transform: scale(0.9) rotate(-12deg); 3285 | -o-transform: scale(0.9) rotate(-12deg); 3286 | transform: scale(0.9) rotate(-12deg); 3287 | } 3288 | 3289 | 11.53846%, 3290 | 19.23077%, 3291 | 26.92308%, 3292 | 3.84615%, 3293 | 50%, 3294 | 57.69231%, 3295 | 65.38462%, 3296 | 73.07692% { 3297 | -webkit-transform: scale(0.9) rotate(9deg); 3298 | -moz-transform: scale(0.9) rotate(9deg); 3299 | -ms-transform: scale(0.9) rotate(9deg); 3300 | -o-transform: scale(0.9) rotate(9deg); 3301 | transform: scale(0.9) rotate(9deg); 3302 | } 3303 | 3304 | 33.84615% { 3305 | -webkit-transform: scale(0.9) rotate(10deg); 3306 | -moz-transform: scale(0.9) rotate(10deg); 3307 | -ms-transform: scale(0.9) rotate(10deg); 3308 | -o-transform: scale(0.9) rotate(10deg); 3309 | transform: scale(0.9) rotate(10deg); 3310 | } 3311 | 3312 | 35.38462%, 3313 | 38.46154%, 3314 | 41.53846% { 3315 | -webkit-transform: scale(0.9) rotate(-4deg); 3316 | -moz-transform: scale(0.9) rotate(-4deg); 3317 | -ms-transform: scale(0.9) rotate(-4deg); 3318 | -o-transform: scale(0.9) rotate(-4deg); 3319 | transform: scale(0.9) rotate(-4deg); 3320 | } 3321 | 3322 | 36.92308%, 3323 | 40%, 3324 | 43.07692% { 3325 | -webkit-transform: scale(0.9) rotate(12deg); 3326 | -moz-transform: scale(0.9) rotate(12deg); 3327 | -ms-transform: scale(0.9) rotate(12deg); 3328 | -o-transform: scale(0.9) rotate(12deg); 3329 | transform: scale(0.9) rotate(12deg); 3330 | } 3331 | 3332 | 76.92308% { 3333 | -webkit-transform: scale(0.9) rotate(7deg); 3334 | -moz-transform: scale(0.9) rotate(7deg); 3335 | -ms-transform: scale(0.9) rotate(7deg); 3336 | -o-transform: scale(0.9) rotate(7deg); 3337 | transform: scale(0.9) rotate(7deg); 3338 | } 3339 | 3340 | 81.53846%, 3341 | 84.61538%, 3342 | 87.69231%, 3343 | 90.76923% { 3344 | -webkit-transform: scale(0.9) rotate(-10deg); 3345 | -moz-transform: scale(0.9) rotate(-10deg); 3346 | -ms-transform: scale(0.9) rotate(-10deg); 3347 | -o-transform: scale(0.9) rotate(-10deg); 3348 | transform: scale(0.9) rotate(-10deg); 3349 | } 3350 | 3351 | 83.07692%, 3352 | 86.15385%, 3353 | 89.23077%, 3354 | 92.30769% { 3355 | -webkit-transform: scale(0.9) rotate(2deg); 3356 | -moz-transform: scale(0.9) rotate(2deg); 3357 | -ms-transform: scale(0.9) rotate(2deg); 3358 | -o-transform: scale(0.9) rotate(2deg); 3359 | transform: scale(0.9) rotate(2deg); 3360 | } 3361 | } 3362 | 3363 | @-moz-keyframes chest { 3364 | 0%, 3365 | 100%, 3366 | 30.76923% { 3367 | -webkit-transform: translateY(0); 3368 | -moz-transform: translateY(0); 3369 | -ms-transform: translateY(0); 3370 | -o-transform: translateY(0); 3371 | transform: translateY(0); 3372 | } 3373 | 3374 | 34.61538% { 3375 | -webkit-transform: rotate(-2deg) translateY(2%); 3376 | -moz-transform: rotate(-2deg) translateY(2%); 3377 | -ms-transform: rotate(-2deg) translateY(2%); 3378 | -o-transform: rotate(-2deg) translateY(2%); 3379 | transform: rotate(-2deg) translateY(2%); 3380 | } 3381 | 3382 | 38.46154% { 3383 | -webkit-transform: rotate(2deg) translateY(-2%); 3384 | -moz-transform: rotate(2deg) translateY(-2%); 3385 | -ms-transform: rotate(2deg) translateY(-2%); 3386 | -o-transform: rotate(2deg) translateY(-2%); 3387 | transform: rotate(2deg) translateY(-2%); 3388 | } 3389 | 3390 | 69.23077% { 3391 | -webkit-transform: translateY(0); 3392 | -moz-transform: translateY(0); 3393 | -ms-transform: translateY(0); 3394 | -o-transform: translateY(0); 3395 | transform: translateY(0); 3396 | } 3397 | 3398 | 76.92308% { 3399 | -webkit-transform: translateY(2%); 3400 | -moz-transform: translateY(2%); 3401 | -ms-transform: translateY(2%); 3402 | -o-transform: translateY(2%); 3403 | transform: translateY(2%); 3404 | } 3405 | 3406 | 84.61538% { 3407 | -webkit-transform: translateY(0); 3408 | -moz-transform: translateY(0); 3409 | -ms-transform: translateY(0); 3410 | -o-transform: translateY(0); 3411 | transform: translateY(0); 3412 | } 3413 | } 3414 | 3415 | @-webkit-keyframes chest { 3416 | 0%, 3417 | 100%, 3418 | 30.76923% { 3419 | -webkit-transform: translateY(0); 3420 | -moz-transform: translateY(0); 3421 | -ms-transform: translateY(0); 3422 | -o-transform: translateY(0); 3423 | transform: translateY(0); 3424 | } 3425 | 3426 | 34.61538% { 3427 | -webkit-transform: rotate(-2deg) translateY(2%); 3428 | -moz-transform: rotate(-2deg) translateY(2%); 3429 | -ms-transform: rotate(-2deg) translateY(2%); 3430 | -o-transform: rotate(-2deg) translateY(2%); 3431 | transform: rotate(-2deg) translateY(2%); 3432 | } 3433 | 3434 | 38.46154% { 3435 | -webkit-transform: rotate(2deg) translateY(-2%); 3436 | -moz-transform: rotate(2deg) translateY(-2%); 3437 | -ms-transform: rotate(2deg) translateY(-2%); 3438 | -o-transform: rotate(2deg) translateY(-2%); 3439 | transform: rotate(2deg) translateY(-2%); 3440 | } 3441 | 3442 | 69.23077% { 3443 | -webkit-transform: translateY(0); 3444 | -moz-transform: translateY(0); 3445 | -ms-transform: translateY(0); 3446 | -o-transform: translateY(0); 3447 | transform: translateY(0); 3448 | } 3449 | 3450 | 76.92308% { 3451 | -webkit-transform: translateY(2%); 3452 | -moz-transform: translateY(2%); 3453 | -ms-transform: translateY(2%); 3454 | -o-transform: translateY(2%); 3455 | transform: translateY(2%); 3456 | } 3457 | 3458 | 84.61538% { 3459 | -webkit-transform: translateY(0); 3460 | -moz-transform: translateY(0); 3461 | -ms-transform: translateY(0); 3462 | -o-transform: translateY(0); 3463 | transform: translateY(0); 3464 | } 3465 | } 3466 | 3467 | @-o-keyframes chest { 3468 | 0%, 3469 | 100%, 3470 | 30.76923% { 3471 | -webkit-transform: translateY(0); 3472 | -moz-transform: translateY(0); 3473 | -ms-transform: translateY(0); 3474 | -o-transform: translateY(0); 3475 | transform: translateY(0); 3476 | } 3477 | 3478 | 34.61538% { 3479 | -webkit-transform: rotate(-2deg) translateY(2%); 3480 | -moz-transform: rotate(-2deg) translateY(2%); 3481 | -ms-transform: rotate(-2deg) translateY(2%); 3482 | -o-transform: rotate(-2deg) translateY(2%); 3483 | transform: rotate(-2deg) translateY(2%); 3484 | } 3485 | 3486 | 38.46154% { 3487 | -webkit-transform: rotate(2deg) translateY(-2%); 3488 | -moz-transform: rotate(2deg) translateY(-2%); 3489 | -ms-transform: rotate(2deg) translateY(-2%); 3490 | -o-transform: rotate(2deg) translateY(-2%); 3491 | transform: rotate(2deg) translateY(-2%); 3492 | } 3493 | 3494 | 69.23077% { 3495 | -webkit-transform: translateY(0); 3496 | -moz-transform: translateY(0); 3497 | -ms-transform: translateY(0); 3498 | -o-transform: translateY(0); 3499 | transform: translateY(0); 3500 | } 3501 | 3502 | 76.92308% { 3503 | -webkit-transform: translateY(2%); 3504 | -moz-transform: translateY(2%); 3505 | -ms-transform: translateY(2%); 3506 | -o-transform: translateY(2%); 3507 | transform: translateY(2%); 3508 | } 3509 | 3510 | 84.61538% { 3511 | -webkit-transform: translateY(0); 3512 | -moz-transform: translateY(0); 3513 | -ms-transform: translateY(0); 3514 | -o-transform: translateY(0); 3515 | transform: translateY(0); 3516 | } 3517 | } 3518 | 3519 | @keyframes chest { 3520 | 0%, 3521 | 100%, 3522 | 30.76923% { 3523 | -webkit-transform: translateY(0); 3524 | -moz-transform: translateY(0); 3525 | -ms-transform: translateY(0); 3526 | -o-transform: translateY(0); 3527 | transform: translateY(0); 3528 | } 3529 | 3530 | 34.61538% { 3531 | -webkit-transform: rotate(-2deg) translateY(2%); 3532 | -moz-transform: rotate(-2deg) translateY(2%); 3533 | -ms-transform: rotate(-2deg) translateY(2%); 3534 | -o-transform: rotate(-2deg) translateY(2%); 3535 | transform: rotate(-2deg) translateY(2%); 3536 | } 3537 | 3538 | 38.46154% { 3539 | -webkit-transform: rotate(2deg) translateY(-2%); 3540 | -moz-transform: rotate(2deg) translateY(-2%); 3541 | -ms-transform: rotate(2deg) translateY(-2%); 3542 | -o-transform: rotate(2deg) translateY(-2%); 3543 | transform: rotate(2deg) translateY(-2%); 3544 | } 3545 | 3546 | 69.23077% { 3547 | -webkit-transform: translateY(0); 3548 | -moz-transform: translateY(0); 3549 | -ms-transform: translateY(0); 3550 | -o-transform: translateY(0); 3551 | transform: translateY(0); 3552 | } 3553 | 3554 | 76.92308% { 3555 | -webkit-transform: translateY(2%); 3556 | -moz-transform: translateY(2%); 3557 | -ms-transform: translateY(2%); 3558 | -o-transform: translateY(2%); 3559 | transform: translateY(2%); 3560 | } 3561 | 3562 | 84.61538% { 3563 | -webkit-transform: translateY(0); 3564 | -moz-transform: translateY(0); 3565 | -ms-transform: translateY(0); 3566 | -o-transform: translateY(0); 3567 | transform: translateY(0); 3568 | } 3569 | } 3570 | 3571 | @-moz-keyframes fur-center { 3572 | 0%, 3573 | 100%, 3574 | 15.38462%, 3575 | 23.07692%, 3576 | 30.76923%, 3577 | 46.15385%, 3578 | 53.84615%, 3579 | 61.53846%, 3580 | 69.23077%, 3581 | 7.69231% { 3582 | -webkit-transform: translateY(0); 3583 | -moz-transform: translateY(0); 3584 | -ms-transform: translateY(0); 3585 | -o-transform: translateY(0); 3586 | transform: translateY(0); 3587 | } 3588 | 3589 | 11.53846%, 3590 | 19.23077%, 3591 | 26.92308%, 3592 | 3.84615%, 3593 | 50%, 3594 | 57.69231%, 3595 | 65.38462%, 3596 | 73.07692% { 3597 | -webkit-transform: translateY(2%); 3598 | -moz-transform: translateY(2%); 3599 | -ms-transform: translateY(2%); 3600 | -o-transform: translateY(2%); 3601 | transform: translateY(2%); 3602 | } 3603 | } 3604 | 3605 | @-webkit-keyframes fur-center { 3606 | 0%, 3607 | 100%, 3608 | 15.38462%, 3609 | 23.07692%, 3610 | 30.76923%, 3611 | 46.15385%, 3612 | 53.84615%, 3613 | 61.53846%, 3614 | 69.23077%, 3615 | 7.69231% { 3616 | -webkit-transform: translateY(0); 3617 | -moz-transform: translateY(0); 3618 | -ms-transform: translateY(0); 3619 | -o-transform: translateY(0); 3620 | transform: translateY(0); 3621 | } 3622 | 3623 | 11.53846%, 3624 | 19.23077%, 3625 | 26.92308%, 3626 | 3.84615%, 3627 | 50%, 3628 | 57.69231%, 3629 | 65.38462%, 3630 | 73.07692% { 3631 | -webkit-transform: translateY(2%); 3632 | -moz-transform: translateY(2%); 3633 | -ms-transform: translateY(2%); 3634 | -o-transform: translateY(2%); 3635 | transform: translateY(2%); 3636 | } 3637 | } 3638 | 3639 | @-o-keyframes fur-center { 3640 | 0%, 3641 | 100%, 3642 | 15.38462%, 3643 | 23.07692%, 3644 | 30.76923%, 3645 | 46.15385%, 3646 | 53.84615%, 3647 | 61.53846%, 3648 | 69.23077%, 3649 | 7.69231% { 3650 | -webkit-transform: translateY(0); 3651 | -moz-transform: translateY(0); 3652 | -ms-transform: translateY(0); 3653 | -o-transform: translateY(0); 3654 | transform: translateY(0); 3655 | } 3656 | 3657 | 11.53846%, 3658 | 19.23077%, 3659 | 26.92308%, 3660 | 3.84615%, 3661 | 50%, 3662 | 57.69231%, 3663 | 65.38462%, 3664 | 73.07692% { 3665 | -webkit-transform: translateY(2%); 3666 | -moz-transform: translateY(2%); 3667 | -ms-transform: translateY(2%); 3668 | -o-transform: translateY(2%); 3669 | transform: translateY(2%); 3670 | } 3671 | } 3672 | 3673 | @keyframes fur-center { 3674 | 0%, 3675 | 100%, 3676 | 15.38462%, 3677 | 23.07692%, 3678 | 30.76923%, 3679 | 46.15385%, 3680 | 53.84615%, 3681 | 61.53846%, 3682 | 69.23077%, 3683 | 7.69231% { 3684 | -webkit-transform: translateY(0); 3685 | -moz-transform: translateY(0); 3686 | -ms-transform: translateY(0); 3687 | -o-transform: translateY(0); 3688 | transform: translateY(0); 3689 | } 3690 | 3691 | 11.53846%, 3692 | 19.23077%, 3693 | 26.92308%, 3694 | 3.84615%, 3695 | 50%, 3696 | 57.69231%, 3697 | 65.38462%, 3698 | 73.07692% { 3699 | -webkit-transform: translateY(2%); 3700 | -moz-transform: translateY(2%); 3701 | -ms-transform: translateY(2%); 3702 | -o-transform: translateY(2%); 3703 | transform: translateY(2%); 3704 | } 3705 | } 3706 | 3707 | @-moz-keyframes fur-center-patch-left { 3708 | 0%, 3709 | 100%, 3710 | 15.38462%, 3711 | 23.07692%, 3712 | 30.76923%, 3713 | 46.15385%, 3714 | 53.84615%, 3715 | 61.53846%, 3716 | 69.23077%, 3717 | 7.69231% { 3718 | -webkit-transform: rotate(65deg) skewX(15deg); 3719 | -moz-transform: rotate(65deg) skewX(15deg); 3720 | -ms-transform: rotate(65deg) skewX(15deg); 3721 | -o-transform: rotate(65deg) skewX(15deg); 3722 | transform: rotate(65deg) skewX(15deg); 3723 | } 3724 | 3725 | 11.53846%, 3726 | 19.23077%, 3727 | 26.92308%, 3728 | 3.84615%, 3729 | 50%, 3730 | 57.69231%, 3731 | 65.38462%, 3732 | 73.07692% { 3733 | -webkit-transform: rotate(60deg) skewX(15deg); 3734 | -moz-transform: rotate(60deg) skewX(15deg); 3735 | -ms-transform: rotate(60deg) skewX(15deg); 3736 | -o-transform: rotate(60deg) skewX(15deg); 3737 | transform: rotate(60deg) skewX(15deg); 3738 | } 3739 | } 3740 | 3741 | @-webkit-keyframes fur-center-patch-left { 3742 | 0%, 3743 | 100%, 3744 | 15.38462%, 3745 | 23.07692%, 3746 | 30.76923%, 3747 | 46.15385%, 3748 | 53.84615%, 3749 | 61.53846%, 3750 | 69.23077%, 3751 | 7.69231% { 3752 | -webkit-transform: rotate(65deg) skewX(15deg); 3753 | -moz-transform: rotate(65deg) skewX(15deg); 3754 | -ms-transform: rotate(65deg) skewX(15deg); 3755 | -o-transform: rotate(65deg) skewX(15deg); 3756 | transform: rotate(65deg) skewX(15deg); 3757 | } 3758 | 3759 | 11.53846%, 3760 | 19.23077%, 3761 | 26.92308%, 3762 | 3.84615%, 3763 | 50%, 3764 | 57.69231%, 3765 | 65.38462%, 3766 | 73.07692% { 3767 | -webkit-transform: rotate(60deg) skewX(15deg); 3768 | -moz-transform: rotate(60deg) skewX(15deg); 3769 | -ms-transform: rotate(60deg) skewX(15deg); 3770 | -o-transform: rotate(60deg) skewX(15deg); 3771 | transform: rotate(60deg) skewX(15deg); 3772 | } 3773 | } 3774 | 3775 | @-o-keyframes fur-center-patch-left { 3776 | 0%, 3777 | 100%, 3778 | 15.38462%, 3779 | 23.07692%, 3780 | 30.76923%, 3781 | 46.15385%, 3782 | 53.84615%, 3783 | 61.53846%, 3784 | 69.23077%, 3785 | 7.69231% { 3786 | -webkit-transform: rotate(65deg) skewX(15deg); 3787 | -moz-transform: rotate(65deg) skewX(15deg); 3788 | -ms-transform: rotate(65deg) skewX(15deg); 3789 | -o-transform: rotate(65deg) skewX(15deg); 3790 | transform: rotate(65deg) skewX(15deg); 3791 | } 3792 | 3793 | 11.53846%, 3794 | 19.23077%, 3795 | 26.92308%, 3796 | 3.84615%, 3797 | 50%, 3798 | 57.69231%, 3799 | 65.38462%, 3800 | 73.07692% { 3801 | -webkit-transform: rotate(60deg) skewX(15deg); 3802 | -moz-transform: rotate(60deg) skewX(15deg); 3803 | -ms-transform: rotate(60deg) skewX(15deg); 3804 | -o-transform: rotate(60deg) skewX(15deg); 3805 | transform: rotate(60deg) skewX(15deg); 3806 | } 3807 | } 3808 | 3809 | @keyframes fur-center-patch-left { 3810 | 0%, 3811 | 100%, 3812 | 15.38462%, 3813 | 23.07692%, 3814 | 30.76923%, 3815 | 46.15385%, 3816 | 53.84615%, 3817 | 61.53846%, 3818 | 69.23077%, 3819 | 7.69231% { 3820 | -webkit-transform: rotate(65deg) skewX(15deg); 3821 | -moz-transform: rotate(65deg) skewX(15deg); 3822 | -ms-transform: rotate(65deg) skewX(15deg); 3823 | -o-transform: rotate(65deg) skewX(15deg); 3824 | transform: rotate(65deg) skewX(15deg); 3825 | } 3826 | 3827 | 11.53846%, 3828 | 19.23077%, 3829 | 26.92308%, 3830 | 3.84615%, 3831 | 50%, 3832 | 57.69231%, 3833 | 65.38462%, 3834 | 73.07692% { 3835 | -webkit-transform: rotate(60deg) skewX(15deg); 3836 | -moz-transform: rotate(60deg) skewX(15deg); 3837 | -ms-transform: rotate(60deg) skewX(15deg); 3838 | -o-transform: rotate(60deg) skewX(15deg); 3839 | transform: rotate(60deg) skewX(15deg); 3840 | } 3841 | } 3842 | 3843 | @-moz-keyframes fur-center-patch-right { 3844 | 0%, 3845 | 100%, 3846 | 15.38462%, 3847 | 23.07692%, 3848 | 30.76923%, 3849 | 46.15385%, 3850 | 53.84615%, 3851 | 61.53846%, 3852 | 69.23077%, 3853 | 7.69231% { 3854 | -webkit-transform: rotate(35deg) skewX(15deg); 3855 | -moz-transform: rotate(35deg) skewX(15deg); 3856 | -ms-transform: rotate(35deg) skewX(15deg); 3857 | -o-transform: rotate(35deg) skewX(15deg); 3858 | transform: rotate(35deg) skewX(15deg); 3859 | } 3860 | 3861 | 11.53846%, 3862 | 19.23077%, 3863 | 26.92308%, 3864 | 3.84615%, 3865 | 50%, 3866 | 57.69231%, 3867 | 65.38462%, 3868 | 73.07692% { 3869 | -webkit-transform: rotate(30deg) skewX(15deg); 3870 | -moz-transform: rotate(30deg) skewX(15deg); 3871 | -ms-transform: rotate(30deg) skewX(15deg); 3872 | -o-transform: rotate(30deg) skewX(15deg); 3873 | transform: rotate(30deg) skewX(15deg); 3874 | } 3875 | } 3876 | 3877 | @-webkit-keyframes fur-center-patch-right { 3878 | 0%, 3879 | 100%, 3880 | 15.38462%, 3881 | 23.07692%, 3882 | 30.76923%, 3883 | 46.15385%, 3884 | 53.84615%, 3885 | 61.53846%, 3886 | 69.23077%, 3887 | 7.69231% { 3888 | -webkit-transform: rotate(35deg) skewX(15deg); 3889 | -moz-transform: rotate(35deg) skewX(15deg); 3890 | -ms-transform: rotate(35deg) skewX(15deg); 3891 | -o-transform: rotate(35deg) skewX(15deg); 3892 | transform: rotate(35deg) skewX(15deg); 3893 | } 3894 | 3895 | 11.53846%, 3896 | 19.23077%, 3897 | 26.92308%, 3898 | 3.84615%, 3899 | 50%, 3900 | 57.69231%, 3901 | 65.38462%, 3902 | 73.07692% { 3903 | -webkit-transform: rotate(30deg) skewX(15deg); 3904 | -moz-transform: rotate(30deg) skewX(15deg); 3905 | -ms-transform: rotate(30deg) skewX(15deg); 3906 | -o-transform: rotate(30deg) skewX(15deg); 3907 | transform: rotate(30deg) skewX(15deg); 3908 | } 3909 | } 3910 | 3911 | @-o-keyframes fur-center-patch-right { 3912 | 0%, 3913 | 100%, 3914 | 15.38462%, 3915 | 23.07692%, 3916 | 30.76923%, 3917 | 46.15385%, 3918 | 53.84615%, 3919 | 61.53846%, 3920 | 69.23077%, 3921 | 7.69231% { 3922 | -webkit-transform: rotate(35deg) skewX(15deg); 3923 | -moz-transform: rotate(35deg) skewX(15deg); 3924 | -ms-transform: rotate(35deg) skewX(15deg); 3925 | -o-transform: rotate(35deg) skewX(15deg); 3926 | transform: rotate(35deg) skewX(15deg); 3927 | } 3928 | 3929 | 11.53846%, 3930 | 19.23077%, 3931 | 26.92308%, 3932 | 3.84615%, 3933 | 50%, 3934 | 57.69231%, 3935 | 65.38462%, 3936 | 73.07692% { 3937 | -webkit-transform: rotate(30deg) skewX(15deg); 3938 | -moz-transform: rotate(30deg) skewX(15deg); 3939 | -ms-transform: rotate(30deg) skewX(15deg); 3940 | -o-transform: rotate(30deg) skewX(15deg); 3941 | transform: rotate(30deg) skewX(15deg); 3942 | } 3943 | } 3944 | 3945 | @keyframes fur-center-patch-right { 3946 | 0%, 3947 | 100%, 3948 | 15.38462%, 3949 | 23.07692%, 3950 | 30.76923%, 3951 | 46.15385%, 3952 | 53.84615%, 3953 | 61.53846%, 3954 | 69.23077%, 3955 | 7.69231% { 3956 | -webkit-transform: rotate(35deg) skewX(15deg); 3957 | -moz-transform: rotate(35deg) skewX(15deg); 3958 | -ms-transform: rotate(35deg) skewX(15deg); 3959 | -o-transform: rotate(35deg) skewX(15deg); 3960 | transform: rotate(35deg) skewX(15deg); 3961 | } 3962 | 3963 | 11.53846%, 3964 | 19.23077%, 3965 | 26.92308%, 3966 | 3.84615%, 3967 | 50%, 3968 | 57.69231%, 3969 | 65.38462%, 3970 | 73.07692% { 3971 | -webkit-transform: rotate(30deg) skewX(15deg); 3972 | -moz-transform: rotate(30deg) skewX(15deg); 3973 | -ms-transform: rotate(30deg) skewX(15deg); 3974 | -o-transform: rotate(30deg) skewX(15deg); 3975 | transform: rotate(30deg) skewX(15deg); 3976 | } 3977 | } 3978 | 3979 | @-moz-keyframes fur-right { 3980 | 0%, 3981 | 100%, 3982 | 15.38462%, 3983 | 23.07692%, 3984 | 30.76923%, 3985 | 46.15385%, 3986 | 53.84615%, 3987 | 61.53846%, 3988 | 69.23077%, 3989 | 7.69231% { 3990 | -webkit-transform: translateY(0); 3991 | -moz-transform: translateY(0); 3992 | -ms-transform: translateY(0); 3993 | -o-transform: translateY(0); 3994 | transform: translateY(0); 3995 | } 3996 | 3997 | 11.53846%, 3998 | 19.23077%, 3999 | 26.92308%, 4000 | 3.84615%, 4001 | 50%, 4002 | 57.69231%, 4003 | 65.38462%, 4004 | 73.07692% { 4005 | -webkit-transform: translateY(2%); 4006 | -moz-transform: translateY(2%); 4007 | -ms-transform: translateY(2%); 4008 | -o-transform: translateY(2%); 4009 | transform: translateY(2%); 4010 | } 4011 | } 4012 | 4013 | @-webkit-keyframes fur-right { 4014 | 0%, 4015 | 100%, 4016 | 15.38462%, 4017 | 23.07692%, 4018 | 30.76923%, 4019 | 46.15385%, 4020 | 53.84615%, 4021 | 61.53846%, 4022 | 69.23077%, 4023 | 7.69231% { 4024 | -webkit-transform: translateY(0); 4025 | -moz-transform: translateY(0); 4026 | -ms-transform: translateY(0); 4027 | -o-transform: translateY(0); 4028 | transform: translateY(0); 4029 | } 4030 | 4031 | 11.53846%, 4032 | 19.23077%, 4033 | 26.92308%, 4034 | 3.84615%, 4035 | 50%, 4036 | 57.69231%, 4037 | 65.38462%, 4038 | 73.07692% { 4039 | -webkit-transform: translateY(2%); 4040 | -moz-transform: translateY(2%); 4041 | -ms-transform: translateY(2%); 4042 | -o-transform: translateY(2%); 4043 | transform: translateY(2%); 4044 | } 4045 | } 4046 | 4047 | @-o-keyframes fur-right { 4048 | 0%, 4049 | 100%, 4050 | 15.38462%, 4051 | 23.07692%, 4052 | 30.76923%, 4053 | 46.15385%, 4054 | 53.84615%, 4055 | 61.53846%, 4056 | 69.23077%, 4057 | 7.69231% { 4058 | -webkit-transform: translateY(0); 4059 | -moz-transform: translateY(0); 4060 | -ms-transform: translateY(0); 4061 | -o-transform: translateY(0); 4062 | transform: translateY(0); 4063 | } 4064 | 4065 | 11.53846%, 4066 | 19.23077%, 4067 | 26.92308%, 4068 | 3.84615%, 4069 | 50%, 4070 | 57.69231%, 4071 | 65.38462%, 4072 | 73.07692% { 4073 | -webkit-transform: translateY(2%); 4074 | -moz-transform: translateY(2%); 4075 | -ms-transform: translateY(2%); 4076 | -o-transform: translateY(2%); 4077 | transform: translateY(2%); 4078 | } 4079 | } 4080 | 4081 | @keyframes fur-right { 4082 | 0%, 4083 | 100%, 4084 | 15.38462%, 4085 | 23.07692%, 4086 | 30.76923%, 4087 | 46.15385%, 4088 | 53.84615%, 4089 | 61.53846%, 4090 | 69.23077%, 4091 | 7.69231% { 4092 | -webkit-transform: translateY(0); 4093 | -moz-transform: translateY(0); 4094 | -ms-transform: translateY(0); 4095 | -o-transform: translateY(0); 4096 | transform: translateY(0); 4097 | } 4098 | 4099 | 11.53846%, 4100 | 19.23077%, 4101 | 26.92308%, 4102 | 3.84615%, 4103 | 50%, 4104 | 57.69231%, 4105 | 65.38462%, 4106 | 73.07692% { 4107 | -webkit-transform: translateY(2%); 4108 | -moz-transform: translateY(2%); 4109 | -ms-transform: translateY(2%); 4110 | -o-transform: translateY(2%); 4111 | transform: translateY(2%); 4112 | } 4113 | } 4114 | 4115 | @-moz-keyframes fur-right-patch { 4116 | 0%, 4117 | 100%, 4118 | 15.38462%, 4119 | 23.07692%, 4120 | 30.76923%, 4121 | 46.15385%, 4122 | 53.84615%, 4123 | 61.53846%, 4124 | 69.23077%, 4125 | 7.69231% { 4126 | -webkit-transform: translateY(0) rotate(50deg); 4127 | -moz-transform: translateY(0) rotate(50deg); 4128 | -ms-transform: translateY(0) rotate(50deg); 4129 | -o-transform: translateY(0) rotate(50deg); 4130 | transform: translateY(0) rotate(50deg); 4131 | } 4132 | 4133 | 11.53846%, 4134 | 19.23077%, 4135 | 26.92308%, 4136 | 3.84615%, 4137 | 50%, 4138 | 57.69231%, 4139 | 65.38462%, 4140 | 73.07692% { 4141 | -webkit-transform: translateY(2%) rotate(56deg); 4142 | -moz-transform: translateY(2%) rotate(56deg); 4143 | -ms-transform: translateY(2%) rotate(56deg); 4144 | -o-transform: translateY(2%) rotate(56deg); 4145 | transform: translateY(2%) rotate(56deg); 4146 | } 4147 | } 4148 | 4149 | @-webkit-keyframes fur-right-patch { 4150 | 0%, 4151 | 100%, 4152 | 15.38462%, 4153 | 23.07692%, 4154 | 30.76923%, 4155 | 46.15385%, 4156 | 53.84615%, 4157 | 61.53846%, 4158 | 69.23077%, 4159 | 7.69231% { 4160 | -webkit-transform: translateY(0) rotate(50deg); 4161 | -moz-transform: translateY(0) rotate(50deg); 4162 | -ms-transform: translateY(0) rotate(50deg); 4163 | -o-transform: translateY(0) rotate(50deg); 4164 | transform: translateY(0) rotate(50deg); 4165 | } 4166 | 4167 | 11.53846%, 4168 | 19.23077%, 4169 | 26.92308%, 4170 | 3.84615%, 4171 | 50%, 4172 | 57.69231%, 4173 | 65.38462%, 4174 | 73.07692% { 4175 | -webkit-transform: translateY(2%) rotate(56deg); 4176 | -moz-transform: translateY(2%) rotate(56deg); 4177 | -ms-transform: translateY(2%) rotate(56deg); 4178 | -o-transform: translateY(2%) rotate(56deg); 4179 | transform: translateY(2%) rotate(56deg); 4180 | } 4181 | } 4182 | 4183 | @-o-keyframes fur-right-patch { 4184 | 0%, 4185 | 100%, 4186 | 15.38462%, 4187 | 23.07692%, 4188 | 30.76923%, 4189 | 46.15385%, 4190 | 53.84615%, 4191 | 61.53846%, 4192 | 69.23077%, 4193 | 7.69231% { 4194 | -webkit-transform: translateY(0) rotate(50deg); 4195 | -moz-transform: translateY(0) rotate(50deg); 4196 | -ms-transform: translateY(0) rotate(50deg); 4197 | -o-transform: translateY(0) rotate(50deg); 4198 | transform: translateY(0) rotate(50deg); 4199 | } 4200 | 4201 | 11.53846%, 4202 | 19.23077%, 4203 | 26.92308%, 4204 | 3.84615%, 4205 | 50%, 4206 | 57.69231%, 4207 | 65.38462%, 4208 | 73.07692% { 4209 | -webkit-transform: translateY(2%) rotate(56deg); 4210 | -moz-transform: translateY(2%) rotate(56deg); 4211 | -ms-transform: translateY(2%) rotate(56deg); 4212 | -o-transform: translateY(2%) rotate(56deg); 4213 | transform: translateY(2%) rotate(56deg); 4214 | } 4215 | } 4216 | 4217 | @keyframes fur-right-patch { 4218 | 0%, 4219 | 100%, 4220 | 15.38462%, 4221 | 23.07692%, 4222 | 30.76923%, 4223 | 46.15385%, 4224 | 53.84615%, 4225 | 61.53846%, 4226 | 69.23077%, 4227 | 7.69231% { 4228 | -webkit-transform: translateY(0) rotate(50deg); 4229 | -moz-transform: translateY(0) rotate(50deg); 4230 | -ms-transform: translateY(0) rotate(50deg); 4231 | -o-transform: translateY(0) rotate(50deg); 4232 | transform: translateY(0) rotate(50deg); 4233 | } 4234 | 4235 | 11.53846%, 4236 | 19.23077%, 4237 | 26.92308%, 4238 | 3.84615%, 4239 | 50%, 4240 | 57.69231%, 4241 | 65.38462%, 4242 | 73.07692% { 4243 | -webkit-transform: translateY(2%) rotate(56deg); 4244 | -moz-transform: translateY(2%) rotate(56deg); 4245 | -ms-transform: translateY(2%) rotate(56deg); 4246 | -o-transform: translateY(2%) rotate(56deg); 4247 | transform: translateY(2%) rotate(56deg); 4248 | } 4249 | } 4250 | 4251 | @-moz-keyframes body { 4252 | 0%, 4253 | 100%, 4254 | 15.38462%, 4255 | 23.07692%, 4256 | 30.76923%, 4257 | 46.15385%, 4258 | 53.84615%, 4259 | 61.53846%, 4260 | 69.23077%, 4261 | 7.69231% { 4262 | -webkit-transform: translateY(1%); 4263 | -moz-transform: translateY(1%); 4264 | -ms-transform: translateY(1%); 4265 | -o-transform: translateY(1%); 4266 | transform: translateY(1%); 4267 | } 4268 | 4269 | 11.53846%, 4270 | 19.23077%, 4271 | 26.92308%, 4272 | 3.84615%, 4273 | 50%, 4274 | 57.69231%, 4275 | 65.38462%, 4276 | 73.07692% { 4277 | -webkit-transform: translateY(0); 4278 | -moz-transform: translateY(0); 4279 | -ms-transform: translateY(0); 4280 | -o-transform: translateY(0); 4281 | transform: translateY(0); 4282 | } 4283 | 4284 | 34.61538% { 4285 | -webkit-transform: translateY(4%); 4286 | -moz-transform: translateY(4%); 4287 | -ms-transform: translateY(4%); 4288 | -o-transform: translateY(4%); 4289 | transform: translateY(4%); 4290 | } 4291 | 4292 | 38.46154% { 4293 | -webkit-transform: translateY(0); 4294 | -moz-transform: translateY(0); 4295 | -ms-transform: translateY(0); 4296 | -o-transform: translateY(0); 4297 | transform: translateY(0); 4298 | } 4299 | 4300 | 76.92308% { 4301 | -webkit-transform: translateY(3%); 4302 | -moz-transform: translateY(3%); 4303 | -ms-transform: translateY(3%); 4304 | -o-transform: translateY(3%); 4305 | transform: translateY(3%); 4306 | } 4307 | 4308 | 79.23077%, 4309 | 92.30769% { 4310 | -webkit-transform: translateY(-5%); 4311 | -moz-transform: translateY(-5%); 4312 | -ms-transform: translateY(-5%); 4313 | -o-transform: translateY(-5%); 4314 | transform: translateY(-5%); 4315 | } 4316 | } 4317 | 4318 | @-webkit-keyframes body { 4319 | 0%, 4320 | 100%, 4321 | 15.38462%, 4322 | 23.07692%, 4323 | 30.76923%, 4324 | 46.15385%, 4325 | 53.84615%, 4326 | 61.53846%, 4327 | 69.23077%, 4328 | 7.69231% { 4329 | -webkit-transform: translateY(1%); 4330 | -moz-transform: translateY(1%); 4331 | -ms-transform: translateY(1%); 4332 | -o-transform: translateY(1%); 4333 | transform: translateY(1%); 4334 | } 4335 | 4336 | 11.53846%, 4337 | 19.23077%, 4338 | 26.92308%, 4339 | 3.84615%, 4340 | 50%, 4341 | 57.69231%, 4342 | 65.38462%, 4343 | 73.07692% { 4344 | -webkit-transform: translateY(0); 4345 | -moz-transform: translateY(0); 4346 | -ms-transform: translateY(0); 4347 | -o-transform: translateY(0); 4348 | transform: translateY(0); 4349 | } 4350 | 4351 | 34.61538% { 4352 | -webkit-transform: translateY(4%); 4353 | -moz-transform: translateY(4%); 4354 | -ms-transform: translateY(4%); 4355 | -o-transform: translateY(4%); 4356 | transform: translateY(4%); 4357 | } 4358 | 4359 | 38.46154% { 4360 | -webkit-transform: translateY(0); 4361 | -moz-transform: translateY(0); 4362 | -ms-transform: translateY(0); 4363 | -o-transform: translateY(0); 4364 | transform: translateY(0); 4365 | } 4366 | 4367 | 76.92308% { 4368 | -webkit-transform: translateY(3%); 4369 | -moz-transform: translateY(3%); 4370 | -ms-transform: translateY(3%); 4371 | -o-transform: translateY(3%); 4372 | transform: translateY(3%); 4373 | } 4374 | 4375 | 79.23077%, 4376 | 92.30769% { 4377 | -webkit-transform: translateY(-5%); 4378 | -moz-transform: translateY(-5%); 4379 | -ms-transform: translateY(-5%); 4380 | -o-transform: translateY(-5%); 4381 | transform: translateY(-5%); 4382 | } 4383 | } 4384 | 4385 | @-o-keyframes body { 4386 | 0%, 4387 | 100%, 4388 | 15.38462%, 4389 | 23.07692%, 4390 | 30.76923%, 4391 | 46.15385%, 4392 | 53.84615%, 4393 | 61.53846%, 4394 | 69.23077%, 4395 | 7.69231% { 4396 | -webkit-transform: translateY(1%); 4397 | -moz-transform: translateY(1%); 4398 | -ms-transform: translateY(1%); 4399 | -o-transform: translateY(1%); 4400 | transform: translateY(1%); 4401 | } 4402 | 4403 | 11.53846%, 4404 | 19.23077%, 4405 | 26.92308%, 4406 | 3.84615%, 4407 | 50%, 4408 | 57.69231%, 4409 | 65.38462%, 4410 | 73.07692% { 4411 | -webkit-transform: translateY(0); 4412 | -moz-transform: translateY(0); 4413 | -ms-transform: translateY(0); 4414 | -o-transform: translateY(0); 4415 | transform: translateY(0); 4416 | } 4417 | 4418 | 34.61538% { 4419 | -webkit-transform: translateY(4%); 4420 | -moz-transform: translateY(4%); 4421 | -ms-transform: translateY(4%); 4422 | -o-transform: translateY(4%); 4423 | transform: translateY(4%); 4424 | } 4425 | 4426 | 38.46154% { 4427 | -webkit-transform: translateY(0); 4428 | -moz-transform: translateY(0); 4429 | -ms-transform: translateY(0); 4430 | -o-transform: translateY(0); 4431 | transform: translateY(0); 4432 | } 4433 | 4434 | 76.92308% { 4435 | -webkit-transform: translateY(3%); 4436 | -moz-transform: translateY(3%); 4437 | -ms-transform: translateY(3%); 4438 | -o-transform: translateY(3%); 4439 | transform: translateY(3%); 4440 | } 4441 | 4442 | 79.23077%, 4443 | 92.30769% { 4444 | -webkit-transform: translateY(-5%); 4445 | -moz-transform: translateY(-5%); 4446 | -ms-transform: translateY(-5%); 4447 | -o-transform: translateY(-5%); 4448 | transform: translateY(-5%); 4449 | } 4450 | } 4451 | 4452 | @keyframes body { 4453 | 0%, 4454 | 100%, 4455 | 15.38462%, 4456 | 23.07692%, 4457 | 30.76923%, 4458 | 46.15385%, 4459 | 53.84615%, 4460 | 61.53846%, 4461 | 69.23077%, 4462 | 7.69231% { 4463 | -webkit-transform: translateY(1%); 4464 | -moz-transform: translateY(1%); 4465 | -ms-transform: translateY(1%); 4466 | -o-transform: translateY(1%); 4467 | transform: translateY(1%); 4468 | } 4469 | 4470 | 11.53846%, 4471 | 19.23077%, 4472 | 26.92308%, 4473 | 3.84615%, 4474 | 50%, 4475 | 57.69231%, 4476 | 65.38462%, 4477 | 73.07692% { 4478 | -webkit-transform: translateY(0); 4479 | -moz-transform: translateY(0); 4480 | -ms-transform: translateY(0); 4481 | -o-transform: translateY(0); 4482 | transform: translateY(0); 4483 | } 4484 | 4485 | 34.61538% { 4486 | -webkit-transform: translateY(4%); 4487 | -moz-transform: translateY(4%); 4488 | -ms-transform: translateY(4%); 4489 | -o-transform: translateY(4%); 4490 | transform: translateY(4%); 4491 | } 4492 | 4493 | 38.46154% { 4494 | -webkit-transform: translateY(0); 4495 | -moz-transform: translateY(0); 4496 | -ms-transform: translateY(0); 4497 | -o-transform: translateY(0); 4498 | transform: translateY(0); 4499 | } 4500 | 4501 | 76.92308% { 4502 | -webkit-transform: translateY(3%); 4503 | -moz-transform: translateY(3%); 4504 | -ms-transform: translateY(3%); 4505 | -o-transform: translateY(3%); 4506 | transform: translateY(3%); 4507 | } 4508 | 4509 | 79.23077%, 4510 | 92.30769% { 4511 | -webkit-transform: translateY(-5%); 4512 | -moz-transform: translateY(-5%); 4513 | -ms-transform: translateY(-5%); 4514 | -o-transform: translateY(-5%); 4515 | transform: translateY(-5%); 4516 | } 4517 | } 4518 | 4519 | @-moz-keyframes leg { 4520 | 0%, 4521 | 100%, 4522 | 15.38462%, 4523 | 23.07692%, 4524 | 30.76923%, 4525 | 46.15385%, 4526 | 53.84615%, 4527 | 61.53846%, 4528 | 69.23077%, 4529 | 7.69231% { 4530 | -webkit-transform: rotate(-12deg); 4531 | -moz-transform: rotate(-12deg); 4532 | -ms-transform: rotate(-12deg); 4533 | -o-transform: rotate(-12deg); 4534 | transform: rotate(-12deg); 4535 | } 4536 | 4537 | 11.53846%, 4538 | 19.23077%, 4539 | 26.92308%, 4540 | 3.84615%, 4541 | 50%, 4542 | 57.69231%, 4543 | 65.38462%, 4544 | 73.07692% { 4545 | -webkit-transform: rotate(-6deg); 4546 | -moz-transform: rotate(-6deg); 4547 | -ms-transform: rotate(-6deg); 4548 | -o-transform: rotate(-6deg); 4549 | transform: rotate(-6deg); 4550 | } 4551 | 4552 | 34.61538% { 4553 | -webkit-transform: rotate(-16deg); 4554 | -moz-transform: rotate(-16deg); 4555 | -ms-transform: rotate(-16deg); 4556 | -o-transform: rotate(-16deg); 4557 | transform: rotate(-16deg); 4558 | } 4559 | 4560 | 38.46154% { 4561 | -webkit-transform: rotate(9deg); 4562 | -moz-transform: rotate(9deg); 4563 | -ms-transform: rotate(9deg); 4564 | -o-transform: rotate(9deg); 4565 | transform: rotate(9deg); 4566 | } 4567 | 4568 | 76.92308% { 4569 | -webkit-transform: translateY(-10%) rotate(-18deg); 4570 | -moz-transform: translateY(-10%) rotate(-18deg); 4571 | -ms-transform: translateY(-10%) rotate(-18deg); 4572 | -o-transform: translateY(-10%) rotate(-18deg); 4573 | transform: translateY(-10%) rotate(-18deg); 4574 | } 4575 | 4576 | 79.23077%, 4577 | 92.30769% { 4578 | -webkit-transform: translateY(5%) rotate(0); 4579 | -moz-transform: translateY(5%) rotate(0); 4580 | -ms-transform: translateY(5%) rotate(0); 4581 | -o-transform: translateY(5%) rotate(0); 4582 | transform: translateY(5%) rotate(0); 4583 | } 4584 | } 4585 | 4586 | @-webkit-keyframes leg { 4587 | 0%, 4588 | 100%, 4589 | 15.38462%, 4590 | 23.07692%, 4591 | 30.76923%, 4592 | 46.15385%, 4593 | 53.84615%, 4594 | 61.53846%, 4595 | 69.23077%, 4596 | 7.69231% { 4597 | -webkit-transform: rotate(-12deg); 4598 | -moz-transform: rotate(-12deg); 4599 | -ms-transform: rotate(-12deg); 4600 | -o-transform: rotate(-12deg); 4601 | transform: rotate(-12deg); 4602 | } 4603 | 4604 | 11.53846%, 4605 | 19.23077%, 4606 | 26.92308%, 4607 | 3.84615%, 4608 | 50%, 4609 | 57.69231%, 4610 | 65.38462%, 4611 | 73.07692% { 4612 | -webkit-transform: rotate(-6deg); 4613 | -moz-transform: rotate(-6deg); 4614 | -ms-transform: rotate(-6deg); 4615 | -o-transform: rotate(-6deg); 4616 | transform: rotate(-6deg); 4617 | } 4618 | 4619 | 34.61538% { 4620 | -webkit-transform: rotate(-16deg); 4621 | -moz-transform: rotate(-16deg); 4622 | -ms-transform: rotate(-16deg); 4623 | -o-transform: rotate(-16deg); 4624 | transform: rotate(-16deg); 4625 | } 4626 | 4627 | 38.46154% { 4628 | -webkit-transform: rotate(9deg); 4629 | -moz-transform: rotate(9deg); 4630 | -ms-transform: rotate(9deg); 4631 | -o-transform: rotate(9deg); 4632 | transform: rotate(9deg); 4633 | } 4634 | 4635 | 76.92308% { 4636 | -webkit-transform: translateY(-10%) rotate(-18deg); 4637 | -moz-transform: translateY(-10%) rotate(-18deg); 4638 | -ms-transform: translateY(-10%) rotate(-18deg); 4639 | -o-transform: translateY(-10%) rotate(-18deg); 4640 | transform: translateY(-10%) rotate(-18deg); 4641 | } 4642 | 4643 | 79.23077%, 4644 | 92.30769% { 4645 | -webkit-transform: translateY(5%) rotate(0); 4646 | -moz-transform: translateY(5%) rotate(0); 4647 | -ms-transform: translateY(5%) rotate(0); 4648 | -o-transform: translateY(5%) rotate(0); 4649 | transform: translateY(5%) rotate(0); 4650 | } 4651 | } 4652 | 4653 | @-o-keyframes leg { 4654 | 0%, 4655 | 100%, 4656 | 15.38462%, 4657 | 23.07692%, 4658 | 30.76923%, 4659 | 46.15385%, 4660 | 53.84615%, 4661 | 61.53846%, 4662 | 69.23077%, 4663 | 7.69231% { 4664 | -webkit-transform: rotate(-12deg); 4665 | -moz-transform: rotate(-12deg); 4666 | -ms-transform: rotate(-12deg); 4667 | -o-transform: rotate(-12deg); 4668 | transform: rotate(-12deg); 4669 | } 4670 | 4671 | 11.53846%, 4672 | 19.23077%, 4673 | 26.92308%, 4674 | 3.84615%, 4675 | 50%, 4676 | 57.69231%, 4677 | 65.38462%, 4678 | 73.07692% { 4679 | -webkit-transform: rotate(-6deg); 4680 | -moz-transform: rotate(-6deg); 4681 | -ms-transform: rotate(-6deg); 4682 | -o-transform: rotate(-6deg); 4683 | transform: rotate(-6deg); 4684 | } 4685 | 4686 | 34.61538% { 4687 | -webkit-transform: rotate(-16deg); 4688 | -moz-transform: rotate(-16deg); 4689 | -ms-transform: rotate(-16deg); 4690 | -o-transform: rotate(-16deg); 4691 | transform: rotate(-16deg); 4692 | } 4693 | 4694 | 38.46154% { 4695 | -webkit-transform: rotate(9deg); 4696 | -moz-transform: rotate(9deg); 4697 | -ms-transform: rotate(9deg); 4698 | -o-transform: rotate(9deg); 4699 | transform: rotate(9deg); 4700 | } 4701 | 4702 | 76.92308% { 4703 | -webkit-transform: translateY(-10%) rotate(-18deg); 4704 | -moz-transform: translateY(-10%) rotate(-18deg); 4705 | -ms-transform: translateY(-10%) rotate(-18deg); 4706 | -o-transform: translateY(-10%) rotate(-18deg); 4707 | transform: translateY(-10%) rotate(-18deg); 4708 | } 4709 | 4710 | 79.23077%, 4711 | 92.30769% { 4712 | -webkit-transform: translateY(5%) rotate(0); 4713 | -moz-transform: translateY(5%) rotate(0); 4714 | -ms-transform: translateY(5%) rotate(0); 4715 | -o-transform: translateY(5%) rotate(0); 4716 | transform: translateY(5%) rotate(0); 4717 | } 4718 | } 4719 | 4720 | @keyframes leg { 4721 | 0%, 4722 | 100%, 4723 | 15.38462%, 4724 | 23.07692%, 4725 | 30.76923%, 4726 | 46.15385%, 4727 | 53.84615%, 4728 | 61.53846%, 4729 | 69.23077%, 4730 | 7.69231% { 4731 | -webkit-transform: rotate(-12deg); 4732 | -moz-transform: rotate(-12deg); 4733 | -ms-transform: rotate(-12deg); 4734 | -o-transform: rotate(-12deg); 4735 | transform: rotate(-12deg); 4736 | } 4737 | 4738 | 11.53846%, 4739 | 19.23077%, 4740 | 26.92308%, 4741 | 3.84615%, 4742 | 50%, 4743 | 57.69231%, 4744 | 65.38462%, 4745 | 73.07692% { 4746 | -webkit-transform: rotate(-6deg); 4747 | -moz-transform: rotate(-6deg); 4748 | -ms-transform: rotate(-6deg); 4749 | -o-transform: rotate(-6deg); 4750 | transform: rotate(-6deg); 4751 | } 4752 | 4753 | 34.61538% { 4754 | -webkit-transform: rotate(-16deg); 4755 | -moz-transform: rotate(-16deg); 4756 | -ms-transform: rotate(-16deg); 4757 | -o-transform: rotate(-16deg); 4758 | transform: rotate(-16deg); 4759 | } 4760 | 4761 | 38.46154% { 4762 | -webkit-transform: rotate(9deg); 4763 | -moz-transform: rotate(9deg); 4764 | -ms-transform: rotate(9deg); 4765 | -o-transform: rotate(9deg); 4766 | transform: rotate(9deg); 4767 | } 4768 | 4769 | 76.92308% { 4770 | -webkit-transform: translateY(-10%) rotate(-18deg); 4771 | -moz-transform: translateY(-10%) rotate(-18deg); 4772 | -ms-transform: translateY(-10%) rotate(-18deg); 4773 | -o-transform: translateY(-10%) rotate(-18deg); 4774 | transform: translateY(-10%) rotate(-18deg); 4775 | } 4776 | 4777 | 79.23077%, 4778 | 92.30769% { 4779 | -webkit-transform: translateY(5%) rotate(0); 4780 | -moz-transform: translateY(5%) rotate(0); 4781 | -ms-transform: translateY(5%) rotate(0); 4782 | -o-transform: translateY(5%) rotate(0); 4783 | transform: translateY(5%) rotate(0); 4784 | } 4785 | } 4786 | 4787 | @-moz-keyframes leg-inner { 4788 | 0%, 4789 | 100%, 4790 | 15.38462%, 4791 | 23.07692%, 4792 | 30.76923%, 4793 | 46.15385%, 4794 | 53.84615%, 4795 | 61.53846%, 4796 | 69.23077%, 4797 | 7.69231% { 4798 | -webkit-transform: rotate(28deg); 4799 | -moz-transform: rotate(28deg); 4800 | -ms-transform: rotate(28deg); 4801 | -o-transform: rotate(28deg); 4802 | transform: rotate(28deg); 4803 | } 4804 | 4805 | 11.53846%, 4806 | 19.23077%, 4807 | 26.92308%, 4808 | 3.84615%, 4809 | 50%, 4810 | 57.69231%, 4811 | 65.38462%, 4812 | 73.07692% { 4813 | -webkit-transform: rotate(16deg); 4814 | -moz-transform: rotate(16deg); 4815 | -ms-transform: rotate(16deg); 4816 | -o-transform: rotate(16deg); 4817 | transform: rotate(16deg); 4818 | } 4819 | 4820 | 34.61538% { 4821 | -webkit-transform: rotate(40deg); 4822 | -moz-transform: rotate(40deg); 4823 | -ms-transform: rotate(40deg); 4824 | -o-transform: rotate(40deg); 4825 | transform: rotate(40deg); 4826 | } 4827 | 4828 | 38.46154% { 4829 | -webkit-transform: rotate(-10deg); 4830 | -moz-transform: rotate(-10deg); 4831 | -ms-transform: rotate(-10deg); 4832 | -o-transform: rotate(-10deg); 4833 | transform: rotate(-10deg); 4834 | } 4835 | 4836 | 76.92308% { 4837 | -webkit-transform: rotate(32deg); 4838 | -moz-transform: rotate(32deg); 4839 | -ms-transform: rotate(32deg); 4840 | -o-transform: rotate(32deg); 4841 | transform: rotate(32deg); 4842 | } 4843 | 4844 | 79.23077%, 4845 | 92.30769% { 4846 | -webkit-transform: rotate(0); 4847 | -moz-transform: rotate(0); 4848 | -ms-transform: rotate(0); 4849 | -o-transform: rotate(0); 4850 | transform: rotate(0); 4851 | } 4852 | } 4853 | 4854 | @-webkit-keyframes leg-inner { 4855 | 0%, 4856 | 100%, 4857 | 15.38462%, 4858 | 23.07692%, 4859 | 30.76923%, 4860 | 46.15385%, 4861 | 53.84615%, 4862 | 61.53846%, 4863 | 69.23077%, 4864 | 7.69231% { 4865 | -webkit-transform: rotate(28deg); 4866 | -moz-transform: rotate(28deg); 4867 | -ms-transform: rotate(28deg); 4868 | -o-transform: rotate(28deg); 4869 | transform: rotate(28deg); 4870 | } 4871 | 4872 | 11.53846%, 4873 | 19.23077%, 4874 | 26.92308%, 4875 | 3.84615%, 4876 | 50%, 4877 | 57.69231%, 4878 | 65.38462%, 4879 | 73.07692% { 4880 | -webkit-transform: rotate(16deg); 4881 | -moz-transform: rotate(16deg); 4882 | -ms-transform: rotate(16deg); 4883 | -o-transform: rotate(16deg); 4884 | transform: rotate(16deg); 4885 | } 4886 | 4887 | 34.61538% { 4888 | -webkit-transform: rotate(40deg); 4889 | -moz-transform: rotate(40deg); 4890 | -ms-transform: rotate(40deg); 4891 | -o-transform: rotate(40deg); 4892 | transform: rotate(40deg); 4893 | } 4894 | 4895 | 38.46154% { 4896 | -webkit-transform: rotate(-10deg); 4897 | -moz-transform: rotate(-10deg); 4898 | -ms-transform: rotate(-10deg); 4899 | -o-transform: rotate(-10deg); 4900 | transform: rotate(-10deg); 4901 | } 4902 | 4903 | 76.92308% { 4904 | -webkit-transform: rotate(32deg); 4905 | -moz-transform: rotate(32deg); 4906 | -ms-transform: rotate(32deg); 4907 | -o-transform: rotate(32deg); 4908 | transform: rotate(32deg); 4909 | } 4910 | 4911 | 79.23077%, 4912 | 92.30769% { 4913 | -webkit-transform: rotate(0); 4914 | -moz-transform: rotate(0); 4915 | -ms-transform: rotate(0); 4916 | -o-transform: rotate(0); 4917 | transform: rotate(0); 4918 | } 4919 | } 4920 | 4921 | @-o-keyframes leg-inner { 4922 | 0%, 4923 | 100%, 4924 | 15.38462%, 4925 | 23.07692%, 4926 | 30.76923%, 4927 | 46.15385%, 4928 | 53.84615%, 4929 | 61.53846%, 4930 | 69.23077%, 4931 | 7.69231% { 4932 | -webkit-transform: rotate(28deg); 4933 | -moz-transform: rotate(28deg); 4934 | -ms-transform: rotate(28deg); 4935 | -o-transform: rotate(28deg); 4936 | transform: rotate(28deg); 4937 | } 4938 | 4939 | 11.53846%, 4940 | 19.23077%, 4941 | 26.92308%, 4942 | 3.84615%, 4943 | 50%, 4944 | 57.69231%, 4945 | 65.38462%, 4946 | 73.07692% { 4947 | -webkit-transform: rotate(16deg); 4948 | -moz-transform: rotate(16deg); 4949 | -ms-transform: rotate(16deg); 4950 | -o-transform: rotate(16deg); 4951 | transform: rotate(16deg); 4952 | } 4953 | 4954 | 34.61538% { 4955 | -webkit-transform: rotate(40deg); 4956 | -moz-transform: rotate(40deg); 4957 | -ms-transform: rotate(40deg); 4958 | -o-transform: rotate(40deg); 4959 | transform: rotate(40deg); 4960 | } 4961 | 4962 | 38.46154% { 4963 | -webkit-transform: rotate(-10deg); 4964 | -moz-transform: rotate(-10deg); 4965 | -ms-transform: rotate(-10deg); 4966 | -o-transform: rotate(-10deg); 4967 | transform: rotate(-10deg); 4968 | } 4969 | 4970 | 76.92308% { 4971 | -webkit-transform: rotate(32deg); 4972 | -moz-transform: rotate(32deg); 4973 | -ms-transform: rotate(32deg); 4974 | -o-transform: rotate(32deg); 4975 | transform: rotate(32deg); 4976 | } 4977 | 4978 | 79.23077%, 4979 | 92.30769% { 4980 | -webkit-transform: rotate(0); 4981 | -moz-transform: rotate(0); 4982 | -ms-transform: rotate(0); 4983 | -o-transform: rotate(0); 4984 | transform: rotate(0); 4985 | } 4986 | } 4987 | 4988 | @keyframes leg-inner { 4989 | 0%, 4990 | 100%, 4991 | 15.38462%, 4992 | 23.07692%, 4993 | 30.76923%, 4994 | 46.15385%, 4995 | 53.84615%, 4996 | 61.53846%, 4997 | 69.23077%, 4998 | 7.69231% { 4999 | -webkit-transform: rotate(28deg); 5000 | -moz-transform: rotate(28deg); 5001 | -ms-transform: rotate(28deg); 5002 | -o-transform: rotate(28deg); 5003 | transform: rotate(28deg); 5004 | } 5005 | 5006 | 11.53846%, 5007 | 19.23077%, 5008 | 26.92308%, 5009 | 3.84615%, 5010 | 50%, 5011 | 57.69231%, 5012 | 65.38462%, 5013 | 73.07692% { 5014 | -webkit-transform: rotate(16deg); 5015 | -moz-transform: rotate(16deg); 5016 | -ms-transform: rotate(16deg); 5017 | -o-transform: rotate(16deg); 5018 | transform: rotate(16deg); 5019 | } 5020 | 5021 | 34.61538% { 5022 | -webkit-transform: rotate(40deg); 5023 | -moz-transform: rotate(40deg); 5024 | -ms-transform: rotate(40deg); 5025 | -o-transform: rotate(40deg); 5026 | transform: rotate(40deg); 5027 | } 5028 | 5029 | 38.46154% { 5030 | -webkit-transform: rotate(-10deg); 5031 | -moz-transform: rotate(-10deg); 5032 | -ms-transform: rotate(-10deg); 5033 | -o-transform: rotate(-10deg); 5034 | transform: rotate(-10deg); 5035 | } 5036 | 5037 | 76.92308% { 5038 | -webkit-transform: rotate(32deg); 5039 | -moz-transform: rotate(32deg); 5040 | -ms-transform: rotate(32deg); 5041 | -o-transform: rotate(32deg); 5042 | transform: rotate(32deg); 5043 | } 5044 | 5045 | 79.23077%, 5046 | 92.30769% { 5047 | -webkit-transform: rotate(0); 5048 | -moz-transform: rotate(0); 5049 | -ms-transform: rotate(0); 5050 | -o-transform: rotate(0); 5051 | transform: rotate(0); 5052 | } 5053 | } 5054 | 5055 | @-moz-keyframes paw-inner { 5056 | 0%, 5057 | 100%, 5058 | 15.38462%, 5059 | 23.07692%, 5060 | 30.76923%, 5061 | 46.15385%, 5062 | 53.84615%, 5063 | 61.53846%, 5064 | 69.23077%, 5065 | 7.69231% { 5066 | -webkit-transform: rotate(-16deg); 5067 | -moz-transform: rotate(-16deg); 5068 | -ms-transform: rotate(-16deg); 5069 | -o-transform: rotate(-16deg); 5070 | transform: rotate(-16deg); 5071 | } 5072 | 5073 | 11.53846%, 5074 | 19.23077%, 5075 | 26.92308%, 5076 | 3.84615%, 5077 | 50%, 5078 | 57.69231%, 5079 | 65.38462%, 5080 | 73.07692% { 5081 | -webkit-transform: rotate(-10deg); 5082 | -moz-transform: rotate(-10deg); 5083 | -ms-transform: rotate(-10deg); 5084 | -o-transform: rotate(-10deg); 5085 | transform: rotate(-10deg); 5086 | } 5087 | 5088 | 34.61538% { 5089 | -webkit-transform: rotate(-20deg); 5090 | -moz-transform: rotate(-20deg); 5091 | -ms-transform: rotate(-20deg); 5092 | -o-transform: rotate(-20deg); 5093 | transform: rotate(-20deg); 5094 | } 5095 | 5096 | 38.46154% { 5097 | -webkit-transform: rotate(0); 5098 | -moz-transform: rotate(0); 5099 | -ms-transform: rotate(0); 5100 | -o-transform: rotate(0); 5101 | transform: rotate(0); 5102 | } 5103 | 5104 | 76.92308% { 5105 | -webkit-transform: rotate(-14deg); 5106 | -moz-transform: rotate(-14deg); 5107 | -ms-transform: rotate(-14deg); 5108 | -o-transform: rotate(-14deg); 5109 | transform: rotate(-14deg); 5110 | } 5111 | 5112 | 79.23077%, 5113 | 92.30769% { 5114 | -webkit-transform: rotate(0); 5115 | -moz-transform: rotate(0); 5116 | -ms-transform: rotate(0); 5117 | -o-transform: rotate(0); 5118 | transform: rotate(0); 5119 | } 5120 | } 5121 | 5122 | @-webkit-keyframes paw-inner { 5123 | 0%, 5124 | 100%, 5125 | 15.38462%, 5126 | 23.07692%, 5127 | 30.76923%, 5128 | 46.15385%, 5129 | 53.84615%, 5130 | 61.53846%, 5131 | 69.23077%, 5132 | 7.69231% { 5133 | -webkit-transform: rotate(-16deg); 5134 | -moz-transform: rotate(-16deg); 5135 | -ms-transform: rotate(-16deg); 5136 | -o-transform: rotate(-16deg); 5137 | transform: rotate(-16deg); 5138 | } 5139 | 5140 | 11.53846%, 5141 | 19.23077%, 5142 | 26.92308%, 5143 | 3.84615%, 5144 | 50%, 5145 | 57.69231%, 5146 | 65.38462%, 5147 | 73.07692% { 5148 | -webkit-transform: rotate(-10deg); 5149 | -moz-transform: rotate(-10deg); 5150 | -ms-transform: rotate(-10deg); 5151 | -o-transform: rotate(-10deg); 5152 | transform: rotate(-10deg); 5153 | } 5154 | 5155 | 34.61538% { 5156 | -webkit-transform: rotate(-20deg); 5157 | -moz-transform: rotate(-20deg); 5158 | -ms-transform: rotate(-20deg); 5159 | -o-transform: rotate(-20deg); 5160 | transform: rotate(-20deg); 5161 | } 5162 | 5163 | 38.46154% { 5164 | -webkit-transform: rotate(0); 5165 | -moz-transform: rotate(0); 5166 | -ms-transform: rotate(0); 5167 | -o-transform: rotate(0); 5168 | transform: rotate(0); 5169 | } 5170 | 5171 | 76.92308% { 5172 | -webkit-transform: rotate(-14deg); 5173 | -moz-transform: rotate(-14deg); 5174 | -ms-transform: rotate(-14deg); 5175 | -o-transform: rotate(-14deg); 5176 | transform: rotate(-14deg); 5177 | } 5178 | 5179 | 79.23077%, 5180 | 92.30769% { 5181 | -webkit-transform: rotate(0); 5182 | -moz-transform: rotate(0); 5183 | -ms-transform: rotate(0); 5184 | -o-transform: rotate(0); 5185 | transform: rotate(0); 5186 | } 5187 | } 5188 | 5189 | @-o-keyframes paw-inner { 5190 | 0%, 5191 | 100%, 5192 | 15.38462%, 5193 | 23.07692%, 5194 | 30.76923%, 5195 | 46.15385%, 5196 | 53.84615%, 5197 | 61.53846%, 5198 | 69.23077%, 5199 | 7.69231% { 5200 | -webkit-transform: rotate(-16deg); 5201 | -moz-transform: rotate(-16deg); 5202 | -ms-transform: rotate(-16deg); 5203 | -o-transform: rotate(-16deg); 5204 | transform: rotate(-16deg); 5205 | } 5206 | 5207 | 11.53846%, 5208 | 19.23077%, 5209 | 26.92308%, 5210 | 3.84615%, 5211 | 50%, 5212 | 57.69231%, 5213 | 65.38462%, 5214 | 73.07692% { 5215 | -webkit-transform: rotate(-10deg); 5216 | -moz-transform: rotate(-10deg); 5217 | -ms-transform: rotate(-10deg); 5218 | -o-transform: rotate(-10deg); 5219 | transform: rotate(-10deg); 5220 | } 5221 | 5222 | 34.61538% { 5223 | -webkit-transform: rotate(-20deg); 5224 | -moz-transform: rotate(-20deg); 5225 | -ms-transform: rotate(-20deg); 5226 | -o-transform: rotate(-20deg); 5227 | transform: rotate(-20deg); 5228 | } 5229 | 5230 | 38.46154% { 5231 | -webkit-transform: rotate(0); 5232 | -moz-transform: rotate(0); 5233 | -ms-transform: rotate(0); 5234 | -o-transform: rotate(0); 5235 | transform: rotate(0); 5236 | } 5237 | 5238 | 76.92308% { 5239 | -webkit-transform: rotate(-14deg); 5240 | -moz-transform: rotate(-14deg); 5241 | -ms-transform: rotate(-14deg); 5242 | -o-transform: rotate(-14deg); 5243 | transform: rotate(-14deg); 5244 | } 5245 | 5246 | 79.23077%, 5247 | 92.30769% { 5248 | -webkit-transform: rotate(0); 5249 | -moz-transform: rotate(0); 5250 | -ms-transform: rotate(0); 5251 | -o-transform: rotate(0); 5252 | transform: rotate(0); 5253 | } 5254 | } 5255 | 5256 | @keyframes paw-inner { 5257 | 0%, 5258 | 100%, 5259 | 15.38462%, 5260 | 23.07692%, 5261 | 30.76923%, 5262 | 46.15385%, 5263 | 53.84615%, 5264 | 61.53846%, 5265 | 69.23077%, 5266 | 7.69231% { 5267 | -webkit-transform: rotate(-16deg); 5268 | -moz-transform: rotate(-16deg); 5269 | -ms-transform: rotate(-16deg); 5270 | -o-transform: rotate(-16deg); 5271 | transform: rotate(-16deg); 5272 | } 5273 | 5274 | 11.53846%, 5275 | 19.23077%, 5276 | 26.92308%, 5277 | 3.84615%, 5278 | 50%, 5279 | 57.69231%, 5280 | 65.38462%, 5281 | 73.07692% { 5282 | -webkit-transform: rotate(-10deg); 5283 | -moz-transform: rotate(-10deg); 5284 | -ms-transform: rotate(-10deg); 5285 | -o-transform: rotate(-10deg); 5286 | transform: rotate(-10deg); 5287 | } 5288 | 5289 | 34.61538% { 5290 | -webkit-transform: rotate(-20deg); 5291 | -moz-transform: rotate(-20deg); 5292 | -ms-transform: rotate(-20deg); 5293 | -o-transform: rotate(-20deg); 5294 | transform: rotate(-20deg); 5295 | } 5296 | 5297 | 38.46154% { 5298 | -webkit-transform: rotate(0); 5299 | -moz-transform: rotate(0); 5300 | -ms-transform: rotate(0); 5301 | -o-transform: rotate(0); 5302 | transform: rotate(0); 5303 | } 5304 | 5305 | 76.92308% { 5306 | -webkit-transform: rotate(-14deg); 5307 | -moz-transform: rotate(-14deg); 5308 | -ms-transform: rotate(-14deg); 5309 | -o-transform: rotate(-14deg); 5310 | transform: rotate(-14deg); 5311 | } 5312 | 5313 | 79.23077%, 5314 | 92.30769% { 5315 | -webkit-transform: rotate(0); 5316 | -moz-transform: rotate(0); 5317 | -ms-transform: rotate(0); 5318 | -o-transform: rotate(0); 5319 | transform: rotate(0); 5320 | } 5321 | } 5322 | --------------------------------------------------------------------------------