openo-portal/portal-common/src/main/webapp/common/css/animate.css

   1 /**\r
   2  * Copyright 2016-2017, CMCC Technologies Co., Ltd.\r
   3  *\r
   4  * Licensed under the Apache License, Version 2.0 (the "License");\r
   5  * you may not use this file except in compliance with the License.\r
   6  * You may obtain a copy of the License at\r
   7  *\r
   8  *         http://www.apache.org/licenses/LICENSE-2.0\r
   9  *\r
  10  * Unless required by applicable law or agreed to in writing, software\r
  11  * distributed under the License is distributed on an "AS IS" BASIS,\r
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
  13  * See the License for the specific language governing permissions and\r
  14  * limitations under the License.\r
  15  */\r
  16 @charset "UTF-8";\r
  17 /*\r
  18 Animate.css - http://daneden.me/animate\r
  19 Licensed under the MIT license\r
  20 \r
  21 Copyright (c) 2013 Daniel Eden\r
  22 \r
  23 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\r
  24 \r
  25 The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r
  26 \r
  27 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\r
  28 */\r
  29 body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */\r
  30         -webkit-backface-visibility: hidden;\r
  31 }\r
  32 .animated {\r
  33         -webkit-animation-duration: 1s;\r
  34            -moz-animation-duration: 1s;\r
  35              -o-animation-duration: 1s;\r
  36                 animation-duration: 1s;\r
  37         -webkit-animation-fill-mode: both;\r
  38            -moz-animation-fill-mode: both;\r
  39              -o-animation-fill-mode: both;\r
  40                 animation-fill-mode: both;\r
  41 }\r
  42 \r
  43 .animated.hinge {\r
  44         -webkit-animation-duration: 2s;\r
  45            -moz-animation-duration: 2s;\r
  46              -o-animation-duration: 2s;\r
  47                 animation-duration: 2s;\r
  48 }\r
  49 \r
  50 @-webkit-keyframes flash {\r
  51         0%, 50%, 100% {opacity: 1;}     \r
  52         25%, 75% {opacity: 0;}\r
  53 }\r
  54 \r
  55 @-moz-keyframes flash {\r
  56         0%, 50%, 100% {opacity: 1;}     \r
  57         25%, 75% {opacity: 0;}\r
  58 }\r
  59 \r
  60 @-o-keyframes flash {\r
  61         0%, 50%, 100% {opacity: 1;}     \r
  62         25%, 75% {opacity: 0;}\r
  63 }\r
  64 \r
  65 @keyframes flash {\r
  66         0%, 50%, 100% {opacity: 1;}     \r
  67         25%, 75% {opacity: 0;}\r
  68 }\r
  69 \r
  70 .flash {\r
  71         -webkit-animation-name: flash;\r
  72         -moz-animation-name: flash;\r
  73         -o-animation-name: flash;\r
  74         animation-name: flash;\r
  75 }\r
  76 @-webkit-keyframes shake {\r
  77         0%, 100% {-webkit-transform: translateX(0);}\r
  78         10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}\r
  79         20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}\r
  80 }\r
  81 \r
  82 @-moz-keyframes shake {\r
  83         0%, 100% {-moz-transform: translateX(0);}\r
  84         10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}\r
  85         20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}\r
  86 }\r
  87 \r
  88 @-o-keyframes shake {\r
  89         0%, 100% {-o-transform: translateX(0);}\r
  90         10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}\r
  91         20%, 40%, 60%, 80% {-o-transform: translateX(10px);}\r
  92 }\r
  93 \r
  94 @keyframes shake {\r
  95         0%, 100% {transform: translateX(0);}\r
  96         10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}\r
  97         20%, 40%, 60%, 80% {transform: translateX(10px);}\r
  98 }\r
  99 \r
 100 .shake {\r
 101         -webkit-animation-name: shake;\r
 102         -moz-animation-name: shake;\r
 103         -o-animation-name: shake;\r
 104         animation-name: shake;\r
 105 }\r
 106 @-webkit-keyframes bounce {\r
 107         0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}\r
 108         40% {-webkit-transform: translateY(-30px);}\r
 109         60% {-webkit-transform: translateY(-15px);}\r
 110 }\r
 111 \r
 112 @-moz-keyframes bounce {\r
 113         0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}\r
 114         40% {-moz-transform: translateY(-30px);}\r
 115         60% {-moz-transform: translateY(-15px);}\r
 116 }\r
 117 \r
 118 @-o-keyframes bounce {\r
 119         0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}\r
 120         40% {-o-transform: translateY(-30px);}\r
 121         60% {-o-transform: translateY(-15px);}\r
 122 }\r
 123 @keyframes bounce {\r
 124         0%, 20%, 50%, 80%, 100% {transform: translateY(0);}\r
 125         40% {transform: translateY(-30px);}\r
 126         60% {transform: translateY(-15px);}\r
 127 }\r
 128 \r
 129 .bounce {\r
 130         -webkit-animation-name: bounce;\r
 131         -moz-animation-name: bounce;\r
 132         -o-animation-name: bounce;\r
 133         animation-name: bounce;\r
 134 }\r
 135 @-webkit-keyframes tada {\r
 136         0% {-webkit-transform: scale(1);}       \r
 137         10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}\r
 138         30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}\r
 139         40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}\r
 140         100% {-webkit-transform: scale(1) rotate(0);}\r
 141 }\r
 142 \r
 143 @-moz-keyframes tada {\r
 144         0% {-moz-transform: scale(1);}  \r
 145         10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}\r
 146         30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}\r
 147         40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}\r
 148         100% {-moz-transform: scale(1) rotate(0);}\r
 149 }\r
 150 \r
 151 @-o-keyframes tada {\r
 152         0% {-o-transform: scale(1);}    \r
 153         10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}\r
 154         30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}\r
 155         40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}\r
 156         100% {-o-transform: scale(1) rotate(0);}\r
 157 }\r
 158 \r
 159 @keyframes tada {\r
 160         0% {transform: scale(1);}       \r
 161         10%, 20% {transform: scale(0.9) rotate(-3deg);}\r
 162         30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}\r
 163         40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}\r
 164         100% {transform: scale(1) rotate(0);}\r
 165 }\r
 166 \r
 167 .tada {\r
 168         -webkit-animation-name: tada;\r
 169         -moz-animation-name: tada;\r
 170         -o-animation-name: tada;\r
 171         animation-name: tada;\r
 172 }\r
 173 @-webkit-keyframes swing {\r
 174         20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }\r
 175         20% { -webkit-transform: rotate(15deg); }       \r
 176         40% { -webkit-transform: rotate(-10deg); }\r
 177         60% { -webkit-transform: rotate(5deg); }        \r
 178         80% { -webkit-transform: rotate(-5deg); }       \r
 179         100% { -webkit-transform: rotate(0deg); }\r
 180 }\r
 181 \r
 182 @-moz-keyframes swing {\r
 183         20% { -moz-transform: rotate(15deg); }  \r
 184         40% { -moz-transform: rotate(-10deg); }\r
 185         60% { -moz-transform: rotate(5deg); }   \r
 186         80% { -moz-transform: rotate(-5deg); }  \r
 187         100% { -moz-transform: rotate(0deg); }\r
 188 }\r
 189 \r
 190 @-o-keyframes swing {\r
 191         20% { -o-transform: rotate(15deg); }    \r
 192         40% { -o-transform: rotate(-10deg); }\r
 193         60% { -o-transform: rotate(5deg); }     \r
 194         80% { -o-transform: rotate(-5deg); }    \r
 195         100% { -o-transform: rotate(0deg); }\r
 196 }\r
 197 \r
 198 @keyframes swing {\r
 199         20% { transform: rotate(15deg); }       \r
 200         40% { transform: rotate(-10deg); }\r
 201         60% { transform: rotate(5deg); }        \r
 202         80% { transform: rotate(-5deg); }       \r
 203         100% { transform: rotate(0deg); }\r
 204 }\r
 205 \r
 206 .swing {\r
 207         -webkit-transform-origin: top center;\r
 208         -moz-transform-origin: top center;\r
 209         -o-transform-origin: top center;\r
 210         transform-origin: top center;\r
 211         -webkit-animation-name: swing;\r
 212         -moz-animation-name: swing;\r
 213         -o-animation-name: swing;\r
 214         animation-name: swing;\r
 215 }\r
 216 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */\r
 217 \r
 218 @-webkit-keyframes wobble {\r
 219   0% { -webkit-transform: translateX(0%); }\r
 220   15% { -webkit-transform: translateX(-25%) rotate(-5deg); }\r
 221   30% { -webkit-transform: translateX(20%) rotate(3deg); }\r
 222   45% { -webkit-transform: translateX(-15%) rotate(-3deg); }\r
 223   60% { -webkit-transform: translateX(10%) rotate(2deg); }\r
 224   75% { -webkit-transform: translateX(-5%) rotate(-1deg); }\r
 225   100% { -webkit-transform: translateX(0%); }\r
 226 }\r
 227 \r
 228 @-moz-keyframes wobble {\r
 229   0% { -moz-transform: translateX(0%); }\r
 230   15% { -moz-transform: translateX(-25%) rotate(-5deg); }\r
 231   30% { -moz-transform: translateX(20%) rotate(3deg); }\r
 232   45% { -moz-transform: translateX(-15%) rotate(-3deg); }\r
 233   60% { -moz-transform: translateX(10%) rotate(2deg); }\r
 234   75% { -moz-transform: translateX(-5%) rotate(-1deg); }\r
 235   100% { -moz-transform: translateX(0%); }\r
 236 }\r
 237 \r
 238 @-o-keyframes wobble {\r
 239   0% { -o-transform: translateX(0%); }\r
 240   15% { -o-transform: translateX(-25%) rotate(-5deg); }\r
 241   30% { -o-transform: translateX(20%) rotate(3deg); }\r
 242   45% { -o-transform: translateX(-15%) rotate(-3deg); }\r
 243   60% { -o-transform: translateX(10%) rotate(2deg); }\r
 244   75% { -o-transform: translateX(-5%) rotate(-1deg); }\r
 245   100% { -o-transform: translateX(0%); }\r
 246 }\r
 247 \r
 248 @keyframes wobble {\r
 249   0% { transform: translateX(0%); }\r
 250   15% { transform: translateX(-25%) rotate(-5deg); }\r
 251   30% { transform: translateX(20%) rotate(3deg); }\r
 252   45% { transform: translateX(-15%) rotate(-3deg); }\r
 253   60% { transform: translateX(10%) rotate(2deg); }\r
 254   75% { transform: translateX(-5%) rotate(-1deg); }\r
 255   100% { transform: translateX(0%); }\r
 256 }\r
 257 \r
 258 .wobble {\r
 259         -webkit-animation-name: wobble;\r
 260         -moz-animation-name: wobble;\r
 261         -o-animation-name: wobble;\r
 262         animation-name: wobble;\r
 263 }\r
 264 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */\r
 265 \r
 266 @-webkit-keyframes pulse {\r
 267     0% { -webkit-transform: scale(1); } \r
 268         50% { -webkit-transform: scale(1.1); }\r
 269     100% { -webkit-transform: scale(1); }\r
 270 }\r
 271 @-moz-keyframes pulse {\r
 272     0% { -moz-transform: scale(1); }    \r
 273         50% { -moz-transform: scale(1.1); }\r
 274     100% { -moz-transform: scale(1); }\r
 275 }\r
 276 @-o-keyframes pulse {\r
 277     0% { -o-transform: scale(1); }      \r
 278         50% { -o-transform: scale(1.1); }\r
 279     100% { -o-transform: scale(1); }\r
 280 }\r
 281 @keyframes pulse {\r
 282     0% { transform: scale(1); } \r
 283         50% { transform: scale(1.1); }\r
 284     100% { transform: scale(1); }\r
 285 }\r
 286 \r
 287 .pulse {\r
 288         -webkit-animation-name: pulse;\r
 289         -moz-animation-name: pulse;\r
 290         -o-animation-name: pulse;\r
 291         animation-name: pulse;\r
 292 }\r
 293 @-webkit-keyframes flip {\r
 294         0% {\r
 295                 -webkit-transform: perspective(400px) rotateY(0);\r
 296                 -webkit-animation-timing-function: ease-out;\r
 297         }\r
 298         40% {\r
 299                 -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);\r
 300                 -webkit-animation-timing-function: ease-out;\r
 301         }\r
 302         50% {\r
 303                 -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);\r
 304                 -webkit-animation-timing-function: ease-in;\r
 305         }\r
 306         80% {\r
 307                 -webkit-transform: perspective(400px) rotateY(360deg) scale(.95);\r
 308                 -webkit-animation-timing-function: ease-in;\r
 309         }\r
 310         100% {\r
 311                 -webkit-transform: perspective(400px) scale(1);\r
 312                 -webkit-animation-timing-function: ease-in;\r
 313         }\r
 314 }\r
 315 @-moz-keyframes flip {\r
 316         0% {\r
 317                 -moz-transform: perspective(400px) rotateY(0);\r
 318                 -moz-animation-timing-function: ease-out;\r
 319         }\r
 320         40% {\r
 321                 -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);\r
 322                 -moz-animation-timing-function: ease-out;\r
 323         }\r
 324         50% {\r
 325                 -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);\r
 326                 -moz-animation-timing-function: ease-in;\r
 327         }\r
 328         80% {\r
 329                 -moz-transform: perspective(400px) rotateY(360deg) scale(.95);\r
 330                 -moz-animation-timing-function: ease-in;\r
 331         }\r
 332         100% {\r
 333                 -moz-transform: perspective(400px) scale(1);\r
 334                 -moz-animation-timing-function: ease-in;\r
 335         }\r
 336 }\r
 337 @-o-keyframes flip {\r
 338         0% {\r
 339                 -o-transform: perspective(400px) rotateY(0);\r
 340                 -o-animation-timing-function: ease-out;\r
 341         }\r
 342         40% {\r
 343                 -o-transform: perspective(400px) translateZ(150px) rotateY(170deg);\r
 344                 -o-animation-timing-function: ease-out;\r
 345         }\r
 346         50% {\r
 347                 -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);\r
 348                 -o-animation-timing-function: ease-in;\r
 349         }\r
 350         80% {\r
 351                 -o-transform: perspective(400px) rotateY(360deg) scale(.95);\r
 352                 -o-animation-timing-function: ease-in;\r
 353         }\r
 354         100% {\r
 355                 -o-transform: perspective(400px) scale(1);\r
 356                 -o-animation-timing-function: ease-in;\r
 357         }\r
 358 }\r
 359 @keyframes flip {\r
 360         0% {\r
 361                 transform: perspective(400px) rotateY(0);\r
 362                 animation-timing-function: ease-out;\r
 363         }\r
 364         40% {\r
 365                 transform: perspective(400px) translateZ(150px) rotateY(170deg);\r
 366                 animation-timing-function: ease-out;\r
 367         }\r
 368         50% {\r
 369                 transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);\r
 370                 animation-timing-function: ease-in;\r
 371         }\r
 372         80% {\r
 373                 transform: perspective(400px) rotateY(360deg) scale(.95);\r
 374                 animation-timing-function: ease-in;\r
 375         }\r
 376         100% {\r
 377                 transform: perspective(400px) scale(1);\r
 378                 animation-timing-function: ease-in;\r
 379         }\r
 380 }\r
 381 \r
 382 .flip {\r
 383         -webkit-backface-visibility: visible !important;\r
 384         -webkit-animation-name: flip;\r
 385         -moz-backface-visibility: visible !important;\r
 386         -moz-animation-name: flip;\r
 387         -o-backface-visibility: visible !important;\r
 388         -o-animation-name: flip;\r
 389         backface-visibility: visible !important;\r
 390         animation-name: flip;\r
 391 }\r
 392 @-webkit-keyframes flipInX {\r
 393     0% {\r
 394         -webkit-transform: perspective(400px) rotateX(90deg);\r
 395         opacity: 0;\r
 396     }\r
 397     \r
 398     40% {\r
 399         -webkit-transform: perspective(400px) rotateX(-10deg);\r
 400     }\r
 401     \r
 402     70% {\r
 403         -webkit-transform: perspective(400px) rotateX(10deg);\r
 404     }\r
 405     \r
 406     100% {\r
 407         -webkit-transform: perspective(400px) rotateX(0deg);\r
 408         opacity: 1;\r
 409     }\r
 410 }\r
 411 @-moz-keyframes flipInX {\r
 412     0% {\r
 413         -moz-transform: perspective(400px) rotateX(90deg);\r
 414         opacity: 0;\r
 415     }\r
 416     \r
 417     40% {\r
 418         -moz-transform: perspective(400px) rotateX(-10deg);\r
 419     }\r
 420     \r
 421     70% {\r
 422         -moz-transform: perspective(400px) rotateX(10deg);\r
 423     }\r
 424     \r
 425     100% {\r
 426         -moz-transform: perspective(400px) rotateX(0deg);\r
 427         opacity: 1;\r
 428     }\r
 429 }\r
 430 @-o-keyframes flipInX {\r
 431     0% {\r
 432         -o-transform: perspective(400px) rotateX(90deg);\r
 433         opacity: 0;\r
 434     }\r
 435     \r
 436     40% {\r
 437         -o-transform: perspective(400px) rotateX(-10deg);\r
 438     }\r
 439     \r
 440     70% {\r
 441         -o-transform: perspective(400px) rotateX(10deg);\r
 442     }\r
 443     \r
 444     100% {\r
 445         -o-transform: perspective(400px) rotateX(0deg);\r
 446         opacity: 1;\r
 447     }\r
 448 }\r
 449 @keyframes flipInX {\r
 450     0% {\r
 451         transform: perspective(400px) rotateX(90deg);\r
 452         opacity: 0;\r
 453     }\r
 454     \r
 455     40% {\r
 456         transform: perspective(400px) rotateX(-10deg);\r
 457     }\r
 458     \r
 459     70% {\r
 460         transform: perspective(400px) rotateX(10deg);\r
 461     }\r
 462     \r
 463     100% {\r
 464         transform: perspective(400px) rotateX(0deg);\r
 465         opacity: 1;\r
 466     }\r
 467 }\r
 468 \r
 469 .flipInX {\r
 470         -webkit-backface-visibility: visible !important;\r
 471         -webkit-animation-name: flipInX;\r
 472         -moz-backface-visibility: visible !important;\r
 473         -moz-animation-name: flipInX;\r
 474         -o-backface-visibility: visible !important;\r
 475         -o-animation-name: flipInX;\r
 476         backface-visibility: visible !important;\r
 477         animation-name: flipInX;\r
 478 }\r
 479 @-webkit-keyframes flipOutX {\r
 480     0% {\r
 481         -webkit-transform: perspective(400px) rotateX(0deg);\r
 482         opacity: 1;\r
 483     }\r
 484         100% {\r
 485         -webkit-transform: perspective(400px) rotateX(90deg);\r
 486         opacity: 0;\r
 487     }\r
 488 }\r
 489 \r
 490 @-moz-keyframes flipOutX {\r
 491     0% {\r
 492         -moz-transform: perspective(400px) rotateX(0deg);\r
 493         opacity: 1;\r
 494     }\r
 495         100% {\r
 496         -moz-transform: perspective(400px) rotateX(90deg);\r
 497         opacity: 0;\r
 498     }\r
 499 }\r
 500 \r
 501 @-o-keyframes flipOutX {\r
 502     0% {\r
 503         -o-transform: perspective(400px) rotateX(0deg);\r
 504         opacity: 1;\r
 505     }\r
 506         100% {\r
 507         -o-transform: perspective(400px) rotateX(90deg);\r
 508         opacity: 0;\r
 509     }\r
 510 }\r
 511 \r
 512 @keyframes flipOutX {\r
 513     0% {\r
 514         transform: perspective(400px) rotateX(0deg);\r
 515         opacity: 1;\r
 516     }\r
 517         100% {\r
 518         transform: perspective(400px) rotateX(90deg);\r
 519         opacity: 0;\r
 520     }\r
 521 }\r
 522 \r
 523 .flipOutX {\r
 524         -webkit-animation-name: flipOutX;\r
 525         -webkit-backface-visibility: visible !important;\r
 526         -moz-animation-name: flipOutX;\r
 527         -moz-backface-visibility: visible !important;\r
 528         -o-animation-name: flipOutX;\r
 529         -o-backface-visibility: visible !important;\r
 530         animation-name: flipOutX;\r
 531         backface-visibility: visible !important;\r
 532 }\r
 533 @-webkit-keyframes flipInY {\r
 534     0% {\r
 535         -webkit-transform: perspective(400px) rotateY(90deg);\r
 536         opacity: 0;\r
 537     }\r
 538     \r
 539     40% {\r
 540         -webkit-transform: perspective(400px) rotateY(-10deg);\r
 541     }\r
 542     \r
 543     70% {\r
 544         -webkit-transform: perspective(400px) rotateY(10deg);\r
 545     }\r
 546     \r
 547     100% {\r
 548         -webkit-transform: perspective(400px) rotateY(0deg);\r
 549         opacity: 1;\r
 550     }\r
 551 }\r
 552 @-moz-keyframes flipInY {\r
 553     0% {\r
 554         -moz-transform: perspective(400px) rotateY(90deg);\r
 555         opacity: 0;\r
 556     }\r
 557     \r
 558     40% {\r
 559         -moz-transform: perspective(400px) rotateY(-10deg);\r
 560     }\r
 561     \r
 562     70% {\r
 563         -moz-transform: perspective(400px) rotateY(10deg);\r
 564     }\r
 565     \r
 566     100% {\r
 567         -moz-transform: perspective(400px) rotateY(0deg);\r
 568         opacity: 1;\r
 569     }\r
 570 }\r
 571 @-o-keyframes flipInY {\r
 572     0% {\r
 573         -o-transform: perspective(400px) rotateY(90deg);\r
 574         opacity: 0;\r
 575     }\r
 576     \r
 577     40% {\r
 578         -o-transform: perspective(400px) rotateY(-10deg);\r
 579     }\r
 580     \r
 581     70% {\r
 582         -o-transform: perspective(400px) rotateY(10deg);\r
 583     }\r
 584     \r
 585     100% {\r
 586         -o-transform: perspective(400px) rotateY(0deg);\r
 587         opacity: 1;\r
 588     }\r
 589 }\r
 590 @keyframes flipInY {\r
 591     0% {\r
 592         transform: perspective(400px) rotateY(90deg);\r
 593         opacity: 0;\r
 594     }\r
 595     \r
 596     40% {\r
 597         transform: perspective(400px) rotateY(-10deg);\r
 598     }\r
 599     \r
 600     70% {\r
 601         transform: perspective(400px) rotateY(10deg);\r
 602     }\r
 603     \r
 604     100% {\r
 605         transform: perspective(400px) rotateY(0deg);\r
 606         opacity: 1;\r
 607     }\r
 608 }\r
 609 \r
 610 .flipInY {\r
 611         -webkit-backface-visibility: visible !important;\r
 612         -webkit-animation-name: flipInY;\r
 613         -moz-backface-visibility: visible !important;\r
 614         -moz-animation-name: flipInY;\r
 615         -o-backface-visibility: visible !important;\r
 616         -o-animation-name: flipInY;\r
 617         backface-visibility: visible !important;\r
 618         animation-name: flipInY;\r
 619 }\r
 620 @-webkit-keyframes flipOutY {\r
 621     0% {\r
 622         -webkit-transform: perspective(400px) rotateY(0deg);\r
 623         opacity: 1;\r
 624     }\r
 625         100% {\r
 626         -webkit-transform: perspective(400px) rotateY(90deg);\r
 627         opacity: 0;\r
 628     }\r
 629 }\r
 630 @-moz-keyframes flipOutY {\r
 631     0% {\r
 632         -moz-transform: perspective(400px) rotateY(0deg);\r
 633         opacity: 1;\r
 634     }\r
 635         100% {\r
 636         -moz-transform: perspective(400px) rotateY(90deg);\r
 637         opacity: 0;\r
 638     }\r
 639 }\r
 640 @-o-keyframes flipOutY {\r
 641     0% {\r
 642         -o-transform: perspective(400px) rotateY(0deg);\r
 643         opacity: 1;\r
 644     }\r
 645         100% {\r
 646         -o-transform: perspective(400px) rotateY(90deg);\r
 647         opacity: 0;\r
 648     }\r
 649 }\r
 650 @keyframes flipOutY {\r
 651     0% {\r
 652         transform: perspective(400px) rotateY(0deg);\r
 653         opacity: 1;\r
 654     }\r
 655         100% {\r
 656         transform: perspective(400px) rotateY(90deg);\r
 657         opacity: 0;\r
 658     }\r
 659 }\r
 660 \r
 661 .flipOutY {\r
 662         -webkit-backface-visibility: visible !important;\r
 663         -webkit-animation-name: flipOutY;\r
 664         -moz-backface-visibility: visible !important;\r
 665         -moz-animation-name: flipOutY;\r
 666         -o-backface-visibility: visible !important;\r
 667         -o-animation-name: flipOutY;\r
 668         backface-visibility: visible !important;\r
 669         animation-name: flipOutY;\r
 670 }\r
 671 @-webkit-keyframes fadeIn {\r
 672         0% {opacity: 0;}        \r
 673         100% {opacity: 1;}\r
 674 }\r
 675 \r
 676 @-moz-keyframes fadeIn {\r
 677         0% {opacity: 0;}        \r
 678         100% {opacity: 1;}\r
 679 }\r
 680 \r
 681 @-o-keyframes fadeIn {\r
 682         0% {opacity: 0;}        \r
 683         100% {opacity: 1;}\r
 684 }\r
 685 \r
 686 @keyframes fadeIn {\r
 687         0% {opacity: 0;}        \r
 688         100% {opacity: 1;}\r
 689 }\r
 690 \r
 691 .fadeIn {\r
 692         -webkit-animation-name: fadeIn;\r
 693         -moz-animation-name: fadeIn;\r
 694         -o-animation-name: fadeIn;\r
 695         animation-name: fadeIn;\r
 696 }\r
 697 @-webkit-keyframes fadeInUp {\r
 698         0% {\r
 699                 opacity: 0;\r
 700                 -webkit-transform: translateY(20px);\r
 701         }\r
 702         \r
 703         100% {\r
 704                 opacity: 1;\r
 705                 -webkit-transform: translateY(0);\r
 706         }\r
 707 }\r
 708 \r
 709 @-moz-keyframes fadeInUp {\r
 710         0% {\r
 711                 opacity: 0;\r
 712                 -moz-transform: translateY(20px);\r
 713         }\r
 714         \r
 715         100% {\r
 716                 opacity: 1;\r
 717                 -moz-transform: translateY(0);\r
 718         }\r
 719 }\r
 720 \r
 721 @-o-keyframes fadeInUp {\r
 722         0% {\r
 723                 opacity: 0;\r
 724                 -o-transform: translateY(20px);\r
 725         }\r
 726         \r
 727         100% {\r
 728                 opacity: 1;\r
 729                 -o-transform: translateY(0);\r
 730         }\r
 731 }\r
 732 \r
 733 @keyframes fadeInUp {\r
 734         0% {\r
 735                 opacity: 0;\r
 736                 transform: translateY(20px);\r
 737         }\r
 738         \r
 739         100% {\r
 740                 opacity: 1;\r
 741                 transform: translateY(0);\r
 742         }\r
 743 }\r
 744 \r
 745 .fadeInUp {\r
 746         -webkit-animation-name: fadeInUp;\r
 747         -moz-animation-name: fadeInUp;\r
 748         -o-animation-name: fadeInUp;\r
 749         animation-name: fadeInUp;\r
 750 }\r
 751 @-webkit-keyframes fadeInDown {\r
 752         0% {\r
 753                 opacity: 0;\r
 754                 -webkit-transform: translateY(-20px);\r
 755         }\r
 756         \r
 757         100% {\r
 758                 opacity: 1;\r
 759                 -webkit-transform: translateY(0);\r
 760         }\r
 761 }\r
 762 \r
 763 @-moz-keyframes fadeInDown {\r
 764         0% {\r
 765                 opacity: 0;\r
 766                 -moz-transform: translateY(-20px);\r
 767         }\r
 768         \r
 769         100% {\r
 770                 opacity: 1;\r
 771                 -moz-transform: translateY(0);\r
 772         }\r
 773 }\r
 774 \r
 775 @-o-keyframes fadeInDown {\r
 776         0% {\r
 777                 opacity: 0;\r
 778                 -o-transform: translateY(-20px);\r
 779         }\r
 780         \r
 781         100% {\r
 782                 opacity: 1;\r
 783                 -o-transform: translateY(0);\r
 784         }\r
 785 }\r
 786 \r
 787 @keyframes fadeInDown {\r
 788         0% {\r
 789                 opacity: 0;\r
 790                 transform: translateY(-20px);\r
 791         }\r
 792         \r
 793         100% {\r
 794                 opacity: 1;\r
 795                 transform: translateY(0);\r
 796         }\r
 797 }\r
 798 \r
 799 .fadeInDown {\r
 800         -webkit-animation-name: fadeInDown;\r
 801         -moz-animation-name: fadeInDown;\r
 802         -o-animation-name: fadeInDown;\r
 803         animation-name: fadeInDown;\r
 804 }\r
 805 @-webkit-keyframes fadeInLeft {\r
 806         0% {\r
 807                 opacity: 0;\r
 808                 -webkit-transform: translateX(-20px);\r
 809         }\r
 810         \r
 811         100% {\r
 812                 opacity: 1;\r
 813                 -webkit-transform: translateX(0);\r
 814         }\r
 815 }\r
 816 \r
 817 @-moz-keyframes fadeInLeft {\r
 818         0% {\r
 819                 opacity: 0;\r
 820                 -moz-transform: translateX(-20px);\r
 821         }\r
 822         \r
 823         100% {\r
 824                 opacity: 1;\r
 825                 -moz-transform: translateX(0);\r
 826         }\r
 827 }\r
 828 \r
 829 @-o-keyframes fadeInLeft {\r
 830         0% {\r
 831                 opacity: 0;\r
 832                 -o-transform: translateX(-20px);\r
 833         }\r
 834         \r
 835         100% {\r
 836                 opacity: 1;\r
 837                 -o-transform: translateX(0);\r
 838         }\r
 839 }\r
 840 \r
 841 @keyframes fadeInLeft {\r
 842         0% {\r
 843                 opacity: 0;\r
 844                 transform: translateX(-20px);\r
 845         }\r
 846         \r
 847         100% {\r
 848                 opacity: 1;\r
 849                 transform: translateX(0);\r
 850         }\r
 851 }\r
 852 \r
 853 .fadeInLeft {\r
 854         -webkit-animation-name: fadeInLeft;\r
 855         -moz-animation-name: fadeInLeft;\r
 856         -o-animation-name: fadeInLeft;\r
 857         animation-name: fadeInLeft;\r
 858 }\r
 859 @-webkit-keyframes fadeInRight {\r
 860         0% {\r
 861                 opacity: 0;\r
 862                 -webkit-transform: translateX(20px);\r
 863         }\r
 864         \r
 865         100% {\r
 866                 opacity: 1;\r
 867                 -webkit-transform: translateX(0);\r
 868         }\r
 869 }\r
 870 \r
 871 @-moz-keyframes fadeInRight {\r
 872         0% {\r
 873                 opacity: 0;\r
 874                 -moz-transform: translateX(20px);\r
 875         }\r
 876         \r
 877         100% {\r
 878                 opacity: 1;\r
 879                 -moz-transform: translateX(0);\r
 880         }\r
 881 }\r
 882 \r
 883 @-o-keyframes fadeInRight {\r
 884         0% {\r
 885                 opacity: 0;\r
 886                 -o-transform: translateX(20px);\r
 887         }\r
 888         \r
 889         100% {\r
 890                 opacity: 1;\r
 891                 -o-transform: translateX(0);\r
 892         }\r
 893 }\r
 894 \r
 895 @keyframes fadeInRight {\r
 896         0% {\r
 897                 opacity: 0;\r
 898                 transform: translateX(20px);\r
 899         }\r
 900         \r
 901         100% {\r
 902                 opacity: 1;\r
 903                 transform: translateX(0);\r
 904         }\r
 905 }\r
 906 \r
 907 .fadeInRight {\r
 908         -webkit-animation-name: fadeInRight;\r
 909         -moz-animation-name: fadeInRight;\r
 910         -o-animation-name: fadeInRight;\r
 911         animation-name: fadeInRight;\r
 912 }\r
 913 @-webkit-keyframes fadeInUpBig {\r
 914         0% {\r
 915                 opacity: 0;\r
 916                 -webkit-transform: translateY(2000px);\r
 917         }\r
 918         \r
 919         100% {\r
 920                 opacity: 1;\r
 921                 -webkit-transform: translateY(0);\r
 922         }\r
 923 }\r
 924 \r
 925 @-moz-keyframes fadeInUpBig {\r
 926         0% {\r
 927                 opacity: 0;\r
 928                 -moz-transform: translateY(2000px);\r
 929         }\r
 930         \r
 931         100% {\r
 932                 opacity: 1;\r
 933                 -moz-transform: translateY(0);\r
 934         }\r
 935 }\r
 936 \r
 937 @-o-keyframes fadeInUpBig {\r
 938         0% {\r
 939                 opacity: 0;\r
 940                 -o-transform: translateY(2000px);\r
 941         }\r
 942         \r
 943         100% {\r
 944                 opacity: 1;\r
 945                 -o-transform: translateY(0);\r
 946         }\r
 947 }\r
 948 \r
 949 @keyframes fadeInUpBig {\r
 950         0% {\r
 951                 opacity: 0;\r
 952                 transform: translateY(2000px);\r
 953         }\r
 954         \r
 955         100% {\r
 956                 opacity: 1;\r
 957                 transform: translateY(0);\r
 958         }\r
 959 }\r
 960 \r
 961 .fadeInUpBig {\r
 962         -webkit-animation-name: fadeInUpBig;\r
 963         -moz-animation-name: fadeInUpBig;\r
 964         -o-animation-name: fadeInUpBig;\r
 965         animation-name: fadeInUpBig;\r
 966 }\r
 967 @-webkit-keyframes fadeInDownBig {\r
 968         0% {\r
 969                 opacity: 0;\r
 970                 -webkit-transform: translateY(-2000px);\r
 971         }\r
 972         \r
 973         100% {\r
 974                 opacity: 1;\r
 975                 -webkit-transform: translateY(0);\r
 976         }\r
 977 }\r
 978 \r
 979 @-moz-keyframes fadeInDownBig {\r
 980         0% {\r
 981                 opacity: 0;\r
 982                 -moz-transform: translateY(-2000px);\r
 983         }\r
 984         \r
 985         100% {\r
 986                 opacity: 1;\r
 987                 -moz-transform: translateY(0);\r
 988         }\r
 989 }\r
 990 \r
 991 @-o-keyframes fadeInDownBig {\r
 992         0% {\r
 993                 opacity: 0;\r
 994                 -o-transform: translateY(-2000px);\r
 995         }\r
 996         \r
 997         100% {\r
 998                 opacity: 1;\r
 999                 -o-transform: translateY(0);\r
1000         }\r
1001 }\r
1002 \r
1003 @keyframes fadeInDownBig {\r
1004         0% {\r
1005                 opacity: 0;\r
1006                 transform: translateY(-2000px);\r
1007         }\r
1008         \r
1009         100% {\r
1010                 opacity: 1;\r
1011                 transform: translateY(0);\r
1012         }\r
1013 }\r
1014 \r
1015 .fadeInDownBig {\r
1016         -webkit-animation-name: fadeInDownBig;\r
1017         -moz-animation-name: fadeInDownBig;\r
1018         -o-animation-name: fadeInDownBig;\r
1019         animation-name: fadeInDownBig;\r
1020 }\r
1021 @-webkit-keyframes fadeInLeftBig {\r
1022         0% {\r
1023                 opacity: 0;\r
1024                 -webkit-transform: translateX(-2000px);\r
1025         }\r
1026         \r
1027         100% {\r
1028                 opacity: 1;\r
1029                 -webkit-transform: translateX(0);\r
1030         }\r
1031 }\r
1032 @-moz-keyframes fadeInLeftBig {\r
1033         0% {\r
1034                 opacity: 0;\r
1035                 -moz-transform: translateX(-2000px);\r
1036         }\r
1037         \r
1038         100% {\r
1039                 opacity: 1;\r
1040                 -moz-transform: translateX(0);\r
1041         }\r
1042 }\r
1043 @-o-keyframes fadeInLeftBig {\r
1044         0% {\r
1045                 opacity: 0;\r
1046                 -o-transform: translateX(-2000px);\r
1047         }\r
1048         \r
1049         100% {\r
1050                 opacity: 1;\r
1051                 -o-transform: translateX(0);\r
1052         }\r
1053 }\r
1054 @keyframes fadeInLeftBig {\r
1055         0% {\r
1056                 opacity: 0;\r
1057                 transform: translateX(-2000px);\r
1058         }\r
1059         \r
1060         100% {\r
1061                 opacity: 1;\r
1062                 transform: translateX(0);\r
1063         }\r
1064 }\r
1065 \r
1066 .fadeInLeftBig {\r
1067         -webkit-animation-name: fadeInLeftBig;\r
1068         -moz-animation-name: fadeInLeftBig;\r
1069         -o-animation-name: fadeInLeftBig;\r
1070         animation-name: fadeInLeftBig;\r
1071 }\r
1072 @-webkit-keyframes fadeInRightBig {\r
1073         0% {\r
1074                 opacity: 0;\r
1075                 -webkit-transform: translateX(2000px);\r
1076         }\r
1077         \r
1078         100% {\r
1079                 opacity: 1;\r
1080                 -webkit-transform: translateX(0);\r
1081         }\r
1082 }\r
1083 \r
1084 @-moz-keyframes fadeInRightBig {\r
1085         0% {\r
1086                 opacity: 0;\r
1087                 -moz-transform: translateX(2000px);\r
1088         }\r
1089         \r
1090         100% {\r
1091                 opacity: 1;\r
1092                 -moz-transform: translateX(0);\r
1093         }\r
1094 }\r
1095 \r
1096 @-o-keyframes fadeInRightBig {\r
1097         0% {\r
1098                 opacity: 0;\r
1099                 -o-transform: translateX(2000px);\r
1100         }\r
1101         \r
1102         100% {\r
1103                 opacity: 1;\r
1104                 -o-transform: translateX(0);\r
1105         }\r
1106 }\r
1107 \r
1108 @keyframes fadeInRightBig {\r
1109         0% {\r
1110                 opacity: 0;\r
1111                 transform: translateX(2000px);\r
1112         }\r
1113         \r
1114         100% {\r
1115                 opacity: 1;\r
1116                 transform: translateX(0);\r
1117         }\r
1118 }\r
1119 \r
1120 .fadeInRightBig {\r
1121         -webkit-animation-name: fadeInRightBig;\r
1122         -moz-animation-name: fadeInRightBig;\r
1123         -o-animation-name: fadeInRightBig;\r
1124         animation-name: fadeInRightBig;\r
1125 }\r
1126 @-webkit-keyframes fadeOut {\r
1127         0% {opacity: 1;}\r
1128         100% {opacity: 0;}\r
1129 }\r
1130 \r
1131 @-moz-keyframes fadeOut {\r
1132         0% {opacity: 1;}\r
1133         100% {opacity: 0;}\r
1134 }\r
1135 \r
1136 @-o-keyframes fadeOut {\r
1137         0% {opacity: 1;}\r
1138         100% {opacity: 0;}\r
1139 }\r
1140 \r
1141 @keyframes fadeOut {\r
1142         0% {opacity: 1;}\r
1143         100% {opacity: 0;}\r
1144 }\r
1145 \r
1146 .fadeOut {\r
1147         -webkit-animation-name: fadeOut;\r
1148         -moz-animation-name: fadeOut;\r
1149         -o-animation-name: fadeOut;\r
1150         animation-name: fadeOut;\r
1151 }\r
1152 @-webkit-keyframes fadeOutUp {\r
1153         0% {\r
1154                 opacity: 1;\r
1155                 -webkit-transform: translateY(0);\r
1156         }\r
1157         \r
1158         100% {\r
1159                 opacity: 0;\r
1160                 -webkit-transform: translateY(-20px);\r
1161         }\r
1162 }\r
1163 @-moz-keyframes fadeOutUp {\r
1164         0% {\r
1165                 opacity: 1;\r
1166                 -moz-transform: translateY(0);\r
1167         }\r
1168         \r
1169         100% {\r
1170                 opacity: 0;\r
1171                 -moz-transform: translateY(-20px);\r
1172         }\r
1173 }\r
1174 @-o-keyframes fadeOutUp {\r
1175         0% {\r
1176                 opacity: 1;\r
1177                 -o-transform: translateY(0);\r
1178         }\r
1179         \r
1180         100% {\r
1181                 opacity: 0;\r
1182                 -o-transform: translateY(-20px);\r
1183         }\r
1184 }\r
1185 @keyframes fadeOutUp {\r
1186         0% {\r
1187                 opacity: 1;\r
1188                 transform: translateY(0);\r
1189         }\r
1190         \r
1191         100% {\r
1192                 opacity: 0;\r
1193                 transform: translateY(-20px);\r
1194         }\r
1195 }\r
1196 \r
1197 .fadeOutUp {\r
1198         -webkit-animation-name: fadeOutUp;\r
1199         -moz-animation-name: fadeOutUp;\r
1200         -o-animation-name: fadeOutUp;\r
1201         animation-name: fadeOutUp;\r
1202 }\r
1203 @-webkit-keyframes fadeOutDown {\r
1204         0% {\r
1205                 opacity: 1;\r
1206                 -webkit-transform: translateY(0);\r
1207         }\r
1208         \r
1209         100% {\r
1210                 opacity: 0;\r
1211                 -webkit-transform: translateY(20px);\r
1212         }\r
1213 }\r
1214 \r
1215 @-moz-keyframes fadeOutDown {\r
1216         0% {\r
1217                 opacity: 1;\r
1218                 -moz-transform: translateY(0);\r
1219         }\r
1220         \r
1221         100% {\r
1222                 opacity: 0;\r
1223                 -moz-transform: translateY(20px);\r
1224         }\r
1225 }\r
1226 \r
1227 @-o-keyframes fadeOutDown {\r
1228         0% {\r
1229                 opacity: 1;\r
1230                 -o-transform: translateY(0);\r
1231         }\r
1232         \r
1233         100% {\r
1234                 opacity: 0;\r
1235                 -o-transform: translateY(20px);\r
1236         }\r
1237 }\r
1238 \r
1239 @keyframes fadeOutDown {\r
1240         0% {\r
1241                 opacity: 1;\r
1242                 transform: translateY(0);\r
1243         }\r
1244         \r
1245         100% {\r
1246                 opacity: 0;\r
1247                 transform: translateY(20px);\r
1248         }\r
1249 }\r
1250 \r
1251 .fadeOutDown {\r
1252         -webkit-animation-name: fadeOutDown;\r
1253         -moz-animation-name: fadeOutDown;\r
1254         -o-animation-name: fadeOutDown;\r
1255         animation-name: fadeOutDown;\r
1256 }\r
1257 @-webkit-keyframes fadeOutLeft {\r
1258         0% {\r
1259                 opacity: 1;\r
1260                 -webkit-transform: translateX(0);\r
1261         }\r
1262         \r
1263         100% {\r
1264                 opacity: 0;\r
1265                 -webkit-transform: translateX(-20px);\r
1266         }\r
1267 }\r
1268 \r
1269 @-moz-keyframes fadeOutLeft {\r
1270         0% {\r
1271                 opacity: 1;\r
1272                 -moz-transform: translateX(0);\r
1273         }\r
1274         \r
1275         100% {\r
1276                 opacity: 0;\r
1277                 -moz-transform: translateX(-20px);\r
1278         }\r
1279 }\r
1280 \r
1281 @-o-keyframes fadeOutLeft {\r
1282         0% {\r
1283                 opacity: 1;\r
1284                 -o-transform: translateX(0);\r
1285         }\r
1286         \r
1287         100% {\r
1288                 opacity: 0;\r
1289                 -o-transform: translateX(-20px);\r
1290         }\r
1291 }\r
1292 \r
1293 @keyframes fadeOutLeft {\r
1294         0% {\r
1295                 opacity: 1;\r
1296                 transform: translateX(0);\r
1297         }\r
1298         \r
1299         100% {\r
1300                 opacity: 0;\r
1301                 transform: translateX(-20px);\r
1302         }\r
1303 }\r
1304 \r
1305 .fadeOutLeft {\r
1306         -webkit-animation-name: fadeOutLeft;\r
1307         -moz-animation-name: fadeOutLeft;\r
1308         -o-animation-name: fadeOutLeft;\r
1309         animation-name: fadeOutLeft;\r
1310 }\r
1311 @-webkit-keyframes fadeOutRight {\r
1312         0% {\r
1313                 opacity: 1;\r
1314                 -webkit-transform: translateX(0);\r
1315         }\r
1316         \r
1317         100% {\r
1318                 opacity: 0;\r
1319                 -webkit-transform: translateX(20px);\r
1320         }\r
1321 }\r
1322 \r
1323 @-moz-keyframes fadeOutRight {\r
1324         0% {\r
1325                 opacity: 1;\r
1326                 -moz-transform: translateX(0);\r
1327         }\r
1328         \r
1329         100% {\r
1330                 opacity: 0;\r
1331                 -moz-transform: translateX(20px);\r
1332         }\r
1333 }\r
1334 \r
1335 @-o-keyframes fadeOutRight {\r
1336         0% {\r
1337                 opacity: 1;\r
1338                 -o-transform: translateX(0);\r
1339         }\r
1340         \r
1341         100% {\r
1342                 opacity: 0;\r
1343                 -o-transform: translateX(20px);\r
1344         }\r
1345 }\r
1346 \r
1347 @keyframes fadeOutRight {\r
1348         0% {\r
1349                 opacity: 1;\r
1350                 transform: translateX(0);\r
1351         }\r
1352         \r
1353         100% {\r
1354                 opacity: 0;\r
1355                 transform: translateX(20px);\r
1356         }\r
1357 }\r
1358 \r
1359 .fadeOutRight {\r
1360         -webkit-animation-name: fadeOutRight;\r
1361         -moz-animation-name: fadeOutRight;\r
1362         -o-animation-name: fadeOutRight;\r
1363         animation-name: fadeOutRight;\r
1364 }\r
1365 @-webkit-keyframes fadeOutUpBig {\r
1366         0% {\r
1367                 opacity: 1;\r
1368                 -webkit-transform: translateY(0);\r
1369         }\r
1370         \r
1371         100% {\r
1372                 opacity: 0;\r
1373                 -webkit-transform: translateY(-2000px);\r
1374         }\r
1375 }\r
1376 \r
1377 @-moz-keyframes fadeOutUpBig {\r
1378         0% {\r
1379                 opacity: 1;\r
1380                 -moz-transform: translateY(0);\r
1381         }\r
1382         \r
1383         100% {\r
1384                 opacity: 0;\r
1385                 -moz-transform: translateY(-2000px);\r
1386         }\r
1387 }\r
1388 \r
1389 @-o-keyframes fadeOutUpBig {\r
1390         0% {\r
1391                 opacity: 1;\r
1392                 -o-transform: translateY(0);\r
1393         }\r
1394         \r
1395         100% {\r
1396                 opacity: 0;\r
1397                 -o-transform: translateY(-2000px);\r
1398         }\r
1399 }\r
1400 \r
1401 @keyframes fadeOutUpBig {\r
1402         0% {\r
1403                 opacity: 1;\r
1404                 transform: translateY(0);\r
1405         }\r
1406         \r
1407         100% {\r
1408                 opacity: 0;\r
1409                 transform: translateY(-2000px);\r
1410         }\r
1411 }\r
1412 \r
1413 .fadeOutUpBig {\r
1414         -webkit-animation-name: fadeOutUpBig;\r
1415         -moz-animation-name: fadeOutUpBig;\r
1416         -o-animation-name: fadeOutUpBig;\r
1417         animation-name: fadeOutUpBig;\r
1418 }\r
1419 @-webkit-keyframes fadeOutDownBig {\r
1420         0% {\r
1421                 opacity: 1;\r
1422                 -webkit-transform: translateY(0);\r
1423         }\r
1424         \r
1425         100% {\r
1426                 opacity: 0;\r
1427                 -webkit-transform: translateY(2000px);\r
1428         }\r
1429 }\r
1430 \r
1431 @-moz-keyframes fadeOutDownBig {\r
1432         0% {\r
1433                 opacity: 1;\r
1434                 -moz-transform: translateY(0);\r
1435         }\r
1436         \r
1437         100% {\r
1438                 opacity: 0;\r
1439                 -moz-transform: translateY(2000px);\r
1440         }\r
1441 }\r
1442 \r
1443 @-o-keyframes fadeOutDownBig {\r
1444         0% {\r
1445                 opacity: 1;\r
1446                 -o-transform: translateY(0);\r
1447         }\r
1448         \r
1449         100% {\r
1450                 opacity: 0;\r
1451                 -o-transform: translateY(2000px);\r
1452         }\r
1453 }\r
1454 \r
1455 @keyframes fadeOutDownBig {\r
1456         0% {\r
1457                 opacity: 1;\r
1458                 transform: translateY(0);\r
1459         }\r
1460         \r
1461         100% {\r
1462                 opacity: 0;\r
1463                 transform: translateY(2000px);\r
1464         }\r
1465 }\r
1466 \r
1467 .fadeOutDownBig {\r
1468         -webkit-animation-name: fadeOutDownBig;\r
1469         -moz-animation-name: fadeOutDownBig;\r
1470         -o-animation-name: fadeOutDownBig;\r
1471         animation-name: fadeOutDownBig;\r
1472 }\r
1473 @-webkit-keyframes fadeOutLeftBig {\r
1474         0% {\r
1475                 opacity: 1;\r
1476                 -webkit-transform: translateX(0);\r
1477         }\r
1478         \r
1479         100% {\r
1480                 opacity: 0;\r
1481                 -webkit-transform: translateX(-2000px);\r
1482         }\r
1483 }\r
1484 \r
1485 @-moz-keyframes fadeOutLeftBig {\r
1486         0% {\r
1487                 opacity: 1;\r
1488                 -moz-transform: translateX(0);\r
1489         }\r
1490         \r
1491         100% {\r
1492                 opacity: 0;\r
1493                 -moz-transform: translateX(-2000px);\r
1494         }\r
1495 }\r
1496 \r
1497 @-o-keyframes fadeOutLeftBig {\r
1498         0% {\r
1499                 opacity: 1;\r
1500                 -o-transform: translateX(0);\r
1501         }\r
1502         \r
1503         100% {\r
1504                 opacity: 0;\r
1505                 -o-transform: translateX(-2000px);\r
1506         }\r
1507 }\r
1508 \r
1509 @keyframes fadeOutLeftBig {\r
1510         0% {\r
1511                 opacity: 1;\r
1512                 transform: translateX(0);\r
1513         }\r
1514         \r
1515         100% {\r
1516                 opacity: 0;\r
1517                 transform: translateX(-2000px);\r
1518         }\r
1519 }\r
1520 \r
1521 .fadeOutLeftBig {\r
1522         -webkit-animation-name: fadeOutLeftBig;\r
1523         -moz-animation-name: fadeOutLeftBig;\r
1524         -o-animation-name: fadeOutLeftBig;\r
1525         animation-name: fadeOutLeftBig;\r
1526 }\r
1527 @-webkit-keyframes fadeOutRightBig {\r
1528         0% {\r
1529                 opacity: 1;\r
1530                 -webkit-transform: translateX(0);\r
1531         }\r
1532         \r
1533         100% {\r
1534                 opacity: 0;\r
1535                 -webkit-transform: translateX(2000px);\r
1536         }\r
1537 }\r
1538 @-moz-keyframes fadeOutRightBig {\r
1539         0% {\r
1540                 opacity: 1;\r
1541                 -moz-transform: translateX(0);\r
1542         }\r
1543         \r
1544         100% {\r
1545                 opacity: 0;\r
1546                 -moz-transform: translateX(2000px);\r
1547         }\r
1548 }\r
1549 @-o-keyframes fadeOutRightBig {\r
1550         0% {\r
1551                 opacity: 1;\r
1552                 -o-transform: translateX(0);\r
1553         }\r
1554         \r
1555         100% {\r
1556                 opacity: 0;\r
1557                 -o-transform: translateX(2000px);\r
1558         }\r
1559 }\r
1560 @keyframes fadeOutRightBig {\r
1561         0% {\r
1562                 opacity: 1;\r
1563                 transform: translateX(0);\r
1564         }\r
1565         \r
1566         100% {\r
1567                 opacity: 0;\r
1568                 transform: translateX(2000px);\r
1569         }\r
1570 }\r
1571 \r
1572 .fadeOutRightBig {\r
1573         -webkit-animation-name: fadeOutRightBig;\r
1574         -moz-animation-name: fadeOutRightBig;\r
1575         -o-animation-name: fadeOutRightBig;\r
1576         animation-name: fadeOutRightBig;\r
1577 }\r
1578 @-webkit-keyframes bounceIn {\r
1579         0% {\r
1580                 opacity: 0;\r
1581                 -webkit-transform: scale(.3);\r
1582         }\r
1583         \r
1584         50% {\r
1585                 opacity: 1;\r
1586                 -webkit-transform: scale(1.05);\r
1587         }\r
1588         \r
1589         70% {\r
1590                 -webkit-transform: scale(.9);\r
1591         }\r
1592         \r
1593         100% {\r
1594                 -webkit-transform: scale(1);\r
1595         }\r
1596 }\r
1597 \r
1598 @-moz-keyframes bounceIn {\r
1599         0% {\r
1600                 opacity: 0;\r
1601                 -moz-transform: scale(.3);\r
1602         }\r
1603         \r
1604         50% {\r
1605                 opacity: 1;\r
1606                 -moz-transform: scale(1.05);\r
1607         }\r
1608         \r
1609         70% {\r
1610                 -moz-transform: scale(.9);\r
1611         }\r
1612         \r
1613         100% {\r
1614                 -moz-transform: scale(1);\r
1615         }\r
1616 }\r
1617 \r
1618 @-o-keyframes bounceIn {\r
1619         0% {\r
1620                 opacity: 0;\r
1621                 -o-transform: scale(.3);\r
1622         }\r
1623         \r
1624         50% {\r
1625                 opacity: 1;\r
1626                 -o-transform: scale(1.05);\r
1627         }\r
1628         \r
1629         70% {\r
1630                 -o-transform: scale(.9);\r
1631         }\r
1632         \r
1633         100% {\r
1634                 -o-transform: scale(1);\r
1635         }\r
1636 }\r
1637 \r
1638 @keyframes bounceIn {\r
1639         0% {\r
1640                 opacity: 0;\r
1641                 transform: scale(.3);\r
1642         }\r
1643         \r
1644         50% {\r
1645                 opacity: 1;\r
1646                 transform: scale(1.05);\r
1647         }\r
1648         \r
1649         70% {\r
1650                 transform: scale(.9);\r
1651         }\r
1652         \r
1653         100% {\r
1654                 transform: scale(1);\r
1655         }\r
1656 }\r
1657 \r
1658 .bounceIn {\r
1659         -webkit-animation-name: bounceIn;\r
1660         -moz-animation-name: bounceIn;\r
1661         -o-animation-name: bounceIn;\r
1662         animation-name: bounceIn;\r
1663 }\r
1664 @-webkit-keyframes bounceInUp {\r
1665         0% {\r
1666                 opacity: 0;\r
1667                 -webkit-transform: translateY(2000px);\r
1668         }\r
1669         \r
1670         60% {\r
1671                 opacity: 1;\r
1672                 -webkit-transform: translateY(-30px);\r
1673         }\r
1674         \r
1675         80% {\r
1676                 -webkit-transform: translateY(10px);\r
1677         }\r
1678         \r
1679         100% {\r
1680                 -webkit-transform: translateY(0);\r
1681         }\r
1682 }\r
1683 @-moz-keyframes bounceInUp {\r
1684         0% {\r
1685                 opacity: 0;\r
1686                 -moz-transform: translateY(2000px);\r
1687         }\r
1688         \r
1689         60% {\r
1690                 opacity: 1;\r
1691                 -moz-transform: translateY(-30px);\r
1692         }\r
1693         \r
1694         80% {\r
1695                 -moz-transform: translateY(10px);\r
1696         }\r
1697         \r
1698         100% {\r
1699                 -moz-transform: translateY(0);\r
1700         }\r
1701 }\r
1702 \r
1703 @-o-keyframes bounceInUp {\r
1704         0% {\r
1705                 opacity: 0;\r
1706                 -o-transform: translateY(2000px);\r
1707         }\r
1708         \r
1709         60% {\r
1710                 opacity: 1;\r
1711                 -o-transform: translateY(-30px);\r
1712         }\r
1713         \r
1714         80% {\r
1715                 -o-transform: translateY(10px);\r
1716         }\r
1717         \r
1718         100% {\r
1719                 -o-transform: translateY(0);\r
1720         }\r
1721 }\r
1722 \r
1723 @keyframes bounceInUp {\r
1724         0% {\r
1725                 opacity: 0;\r
1726                 transform: translateY(2000px);\r
1727         }\r
1728         \r
1729         60% {\r
1730                 opacity: 1;\r
1731                 transform: translateY(-30px);\r
1732         }\r
1733         \r
1734         80% {\r
1735                 transform: translateY(10px);\r
1736         }\r
1737         \r
1738         100% {\r
1739                 transform: translateY(0);\r
1740         }\r
1741 }\r
1742 \r
1743 .bounceInUp {\r
1744         -webkit-animation-name: bounceInUp;\r
1745         -moz-animation-name: bounceInUp;\r
1746         -o-animation-name: bounceInUp;\r
1747         animation-name: bounceInUp;\r
1748 }\r
1749 @-webkit-keyframes bounceInDown {\r
1750         0% {\r
1751                 opacity: 0;\r
1752                 -webkit-transform: translateY(-2000px);\r
1753         }\r
1754         \r
1755         60% {\r
1756                 opacity: 1;\r
1757                 -webkit-transform: translateY(30px);\r
1758         }\r
1759         \r
1760         80% {\r
1761                 -webkit-transform: translateY(-10px);\r
1762         }\r
1763         \r
1764         100% {\r
1765                 -webkit-transform: translateY(0);\r
1766         }\r
1767 }\r
1768 \r
1769 @-moz-keyframes bounceInDown {\r
1770         0% {\r
1771                 opacity: 0;\r
1772                 -moz-transform: translateY(-2000px);\r
1773         }\r
1774         \r
1775         60% {\r
1776                 opacity: 1;\r
1777                 -moz-transform: translateY(30px);\r
1778         }\r
1779         \r
1780         80% {\r
1781                 -moz-transform: translateY(-10px);\r
1782         }\r
1783         \r
1784         100% {\r
1785                 -moz-transform: translateY(0);\r
1786         }\r
1787 }\r
1788 \r
1789 @-o-keyframes bounceInDown {\r
1790         0% {\r
1791                 opacity: 0;\r
1792                 -o-transform: translateY(-2000px);\r
1793         }\r
1794         \r
1795         60% {\r
1796                 opacity: 1;\r
1797                 -o-transform: translateY(30px);\r
1798         }\r
1799         \r
1800         80% {\r
1801                 -o-transform: translateY(-10px);\r
1802         }\r
1803         \r
1804         100% {\r
1805                 -o-transform: translateY(0);\r
1806         }\r
1807 }\r
1808 \r
1809 @keyframes bounceInDown {\r
1810         0% {\r
1811                 opacity: 0;\r
1812                 transform: translateY(-2000px);\r
1813         }\r
1814         \r
1815         60% {\r
1816                 opacity: 1;\r
1817                 transform: translateY(30px);\r
1818         }\r
1819         \r
1820         80% {\r
1821                 transform: translateY(-10px);\r
1822         }\r
1823         \r
1824         100% {\r
1825                 transform: translateY(0);\r
1826         }\r
1827 }\r
1828 \r
1829 .bounceInDown {\r
1830         -webkit-animation-name: bounceInDown;\r
1831         -moz-animation-name: bounceInDown;\r
1832         -o-animation-name: bounceInDown;\r
1833         animation-name: bounceInDown;\r
1834 }\r
1835 @-webkit-keyframes bounceInLeft {\r
1836         0% {\r
1837                 opacity: 0;\r
1838                 -webkit-transform: translateX(-2000px);\r
1839         }\r
1840         \r
1841         60% {\r
1842                 opacity: 1;\r
1843                 -webkit-transform: translateX(30px);\r
1844         }\r
1845         \r
1846         80% {\r
1847                 -webkit-transform: translateX(-10px);\r
1848         }\r
1849         \r
1850         100% {\r
1851                 -webkit-transform: translateX(0);\r
1852         }\r
1853 }\r
1854 \r
1855 @-moz-keyframes bounceInLeft {\r
1856         0% {\r
1857                 opacity: 0;\r
1858                 -moz-transform: translateX(-2000px);\r
1859         }\r
1860         \r
1861         60% {\r
1862                 opacity: 1;\r
1863                 -moz-transform: translateX(30px);\r
1864         }\r
1865         \r
1866         80% {\r
1867                 -moz-transform: translateX(-10px);\r
1868         }\r
1869         \r
1870         100% {\r
1871                 -moz-transform: translateX(0);\r
1872         }\r
1873 }\r
1874 \r
1875 @-o-keyframes bounceInLeft {\r
1876         0% {\r
1877                 opacity: 0;\r
1878                 -o-transform: translateX(-2000px);\r
1879         }\r
1880         \r
1881         60% {\r
1882                 opacity: 1;\r
1883                 -o-transform: translateX(30px);\r
1884         }\r
1885         \r
1886         80% {\r
1887                 -o-transform: translateX(-10px);\r
1888         }\r
1889         \r
1890         100% {\r
1891                 -o-transform: translateX(0);\r
1892         }\r
1893 }\r
1894 \r
1895 @keyframes bounceInLeft {\r
1896         0% {\r
1897                 opacity: 0;\r
1898                 transform: translateX(-2000px);\r
1899         }\r
1900         \r
1901         60% {\r
1902                 opacity: 1;\r
1903                 transform: translateX(30px);\r
1904         }\r
1905         \r
1906         80% {\r
1907                 transform: translateX(-10px);\r
1908         }\r
1909         \r
1910         100% {\r
1911                 transform: translateX(0);\r
1912         }\r
1913 }\r
1914 \r
1915 .bounceInLeft {\r
1916         -webkit-animation-name: bounceInLeft;\r
1917         -moz-animation-name: bounceInLeft;\r
1918         -o-animation-name: bounceInLeft;\r
1919         animation-name: bounceInLeft;\r
1920 }\r
1921 @-webkit-keyframes bounceInRight {\r
1922         0% {\r
1923                 opacity: 0;\r
1924                 -webkit-transform: translateX(2000px);\r
1925         }\r
1926         \r
1927         60% {\r
1928                 opacity: 1;\r
1929                 -webkit-transform: translateX(-30px);\r
1930         }\r
1931         \r
1932         80% {\r
1933                 -webkit-transform: translateX(10px);\r
1934         }\r
1935         \r
1936         100% {\r
1937                 -webkit-transform: translateX(0);\r
1938         }\r
1939 }\r
1940 \r
1941 @-moz-keyframes bounceInRight {\r
1942         0% {\r
1943                 opacity: 0;\r
1944                 -moz-transform: translateX(2000px);\r
1945         }\r
1946         \r
1947         60% {\r
1948                 opacity: 1;\r
1949                 -moz-transform: translateX(-30px);\r
1950         }\r
1951         \r
1952         80% {\r
1953                 -moz-transform: translateX(10px);\r
1954         }\r
1955         \r
1956         100% {\r
1957                 -moz-transform: translateX(0);\r
1958         }\r
1959 }\r
1960 \r
1961 @-o-keyframes bounceInRight {\r
1962         0% {\r
1963                 opacity: 0;\r
1964                 -o-transform: translateX(2000px);\r
1965         }\r
1966         \r
1967         60% {\r
1968                 opacity: 1;\r
1969                 -o-transform: translateX(-30px);\r
1970         }\r
1971         \r
1972         80% {\r
1973                 -o-transform: translateX(10px);\r
1974         }\r
1975         \r
1976         100% {\r
1977                 -o-transform: translateX(0);\r
1978         }\r
1979 }\r
1980 \r
1981 @keyframes bounceInRight {\r
1982         0% {\r
1983                 opacity: 0;\r
1984                 transform: translateX(2000px);\r
1985         }\r
1986         \r
1987         60% {\r
1988                 opacity: 1;\r
1989                 transform: translateX(-30px);\r
1990         }\r
1991         \r
1992         80% {\r
1993                 transform: translateX(10px);\r
1994         }\r
1995         \r
1996         100% {\r
1997                 transform: translateX(0);\r
1998         }\r
1999 }\r
2000 \r
2001 .bounceInRight {\r
2002         -webkit-animation-name: bounceInRight;\r
2003         -moz-animation-name: bounceInRight;\r
2004         -o-animation-name: bounceInRight;\r
2005         animation-name: bounceInRight;\r
2006 }\r
2007 @-webkit-keyframes bounceOut {\r
2008         0% {\r
2009                 -webkit-transform: scale(1);\r
2010         }\r
2011         \r
2012         25% {\r
2013                 -webkit-transform: scale(.95);\r
2014         }\r
2015         \r
2016         50% {\r
2017                 opacity: 1;\r
2018                 -webkit-transform: scale(1.1);\r
2019         }\r
2020         \r
2021         100% {\r
2022                 opacity: 0;\r
2023                 -webkit-transform: scale(.3);\r
2024         }       \r
2025 }\r
2026 \r
2027 @-moz-keyframes bounceOut {\r
2028         0% {\r
2029                 -moz-transform: scale(1);\r
2030         }\r
2031         \r
2032         25% {\r
2033                 -moz-transform: scale(.95);\r
2034         }\r
2035         \r
2036         50% {\r
2037                 opacity: 1;\r
2038                 -moz-transform: scale(1.1);\r
2039         }\r
2040         \r
2041         100% {\r
2042                 opacity: 0;\r
2043                 -moz-transform: scale(.3);\r
2044         }       \r
2045 }\r
2046 \r
2047 @-o-keyframes bounceOut {\r
2048         0% {\r
2049                 -o-transform: scale(1);\r
2050         }\r
2051         \r
2052         25% {\r
2053                 -o-transform: scale(.95);\r
2054         }\r
2055         \r
2056         50% {\r
2057                 opacity: 1;\r
2058                 -o-transform: scale(1.1);\r
2059         }\r
2060         \r
2061         100% {\r
2062                 opacity: 0;\r
2063                 -o-transform: scale(.3);\r
2064         }       \r
2065 }\r
2066 \r
2067 @keyframes bounceOut {\r
2068         0% {\r
2069                 transform: scale(1);\r
2070         }\r
2071         \r
2072         25% {\r
2073                 transform: scale(.95);\r
2074         }\r
2075         \r
2076         50% {\r
2077                 opacity: 1;\r
2078                 transform: scale(1.1);\r
2079         }\r
2080         \r
2081         100% {\r
2082                 opacity: 0;\r
2083                 transform: scale(.3);\r
2084         }       \r
2085 }\r
2086 \r
2087 .bounceOut {\r
2088         -webkit-animation-name: bounceOut;\r
2089         -moz-animation-name: bounceOut;\r
2090         -o-animation-name: bounceOut;\r
2091         animation-name: bounceOut;\r
2092 }\r
2093 @-webkit-keyframes bounceOutUp {\r
2094         0% {\r
2095                 -webkit-transform: translateY(0);\r
2096         }\r
2097         \r
2098         20% {\r
2099                 opacity: 1;\r
2100                 -webkit-transform: translateY(20px);\r
2101         }\r
2102         \r
2103         100% {\r
2104                 opacity: 0;\r
2105                 -webkit-transform: translateY(-2000px);\r
2106         }\r
2107 }\r
2108 \r
2109 @-moz-keyframes bounceOutUp {\r
2110         0% {\r
2111                 -moz-transform: translateY(0);\r
2112         }\r
2113         \r
2114         20% {\r
2115                 opacity: 1;\r
2116                 -moz-transform: translateY(20px);\r
2117         }\r
2118         \r
2119         100% {\r
2120                 opacity: 0;\r
2121                 -moz-transform: translateY(-2000px);\r
2122         }\r
2123 }\r
2124 \r
2125 @-o-keyframes bounceOutUp {\r
2126         0% {\r
2127                 -o-transform: translateY(0);\r
2128         }\r
2129         \r
2130         20% {\r
2131                 opacity: 1;\r
2132                 -o-transform: translateY(20px);\r
2133         }\r
2134         \r
2135         100% {\r
2136                 opacity: 0;\r
2137                 -o-transform: translateY(-2000px);\r
2138         }\r
2139 }\r
2140 \r
2141 @keyframes bounceOutUp {\r
2142         0% {\r
2143                 transform: translateY(0);\r
2144         }\r
2145         \r
2146         20% {\r
2147                 opacity: 1;\r
2148                 transform: translateY(20px);\r
2149         }\r
2150         \r
2151         100% {\r
2152                 opacity: 0;\r
2153                 transform: translateY(-2000px);\r
2154         }\r
2155 }\r
2156 \r
2157 .bounceOutUp {\r
2158         -webkit-animation-name: bounceOutUp;\r
2159         -moz-animation-name: bounceOutUp;\r
2160         -o-animation-name: bounceOutUp;\r
2161         animation-name: bounceOutUp;\r
2162 }\r
2163 @-webkit-keyframes bounceOutDown {\r
2164         0% {\r
2165                 -webkit-transform: translateY(0);\r
2166         }\r
2167         \r
2168         20% {\r
2169                 opacity: 1;\r
2170                 -webkit-transform: translateY(-20px);\r
2171         }\r
2172         \r
2173         100% {\r
2174                 opacity: 0;\r
2175                 -webkit-transform: translateY(2000px);\r
2176         }\r
2177 }\r
2178 \r
2179 @-moz-keyframes bounceOutDown {\r
2180         0% {\r
2181                 -moz-transform: translateY(0);\r
2182         }\r
2183         \r
2184         20% {\r
2185                 opacity: 1;\r
2186                 -moz-transform: translateY(-20px);\r
2187         }\r
2188         \r
2189         100% {\r
2190                 opacity: 0;\r
2191                 -moz-transform: translateY(2000px);\r
2192         }\r
2193 }\r
2194 \r
2195 @-o-keyframes bounceOutDown {\r
2196         0% {\r
2197                 -o-transform: translateY(0);\r
2198         }\r
2199         \r
2200         20% {\r
2201                 opacity: 1;\r
2202                 -o-transform: translateY(-20px);\r
2203         }\r
2204         \r
2205         100% {\r
2206                 opacity: 0;\r
2207                 -o-transform: translateY(2000px);\r
2208         }\r
2209 }\r
2210 \r
2211 @keyframes bounceOutDown {\r
2212         0% {\r
2213                 transform: translateY(0);\r
2214         }\r
2215         \r
2216         20% {\r
2217                 opacity: 1;\r
2218                 transform: translateY(-20px);\r
2219         }\r
2220         \r
2221         100% {\r
2222                 opacity: 0;\r
2223                 transform: translateY(2000px);\r
2224         }\r
2225 }\r
2226 \r
2227 .bounceOutDown {\r
2228         -webkit-animation-name: bounceOutDown;\r
2229         -moz-animation-name: bounceOutDown;\r
2230         -o-animation-name: bounceOutDown;\r
2231         animation-name: bounceOutDown;\r
2232 }\r
2233 @-webkit-keyframes bounceOutLeft {\r
2234         0% {\r
2235                 -webkit-transform: translateX(0);\r
2236         }\r
2237         \r
2238         20% {\r
2239                 opacity: 1;\r
2240                 -webkit-transform: translateX(20px);\r
2241         }\r
2242         \r
2243         100% {\r
2244                 opacity: 0;\r
2245                 -webkit-transform: translateX(-2000px);\r
2246         }\r
2247 }\r
2248 \r
2249 @-moz-keyframes bounceOutLeft {\r
2250         0% {\r
2251                 -moz-transform: translateX(0);\r
2252         }\r
2253         \r
2254         20% {\r
2255                 opacity: 1;\r
2256                 -moz-transform: translateX(20px);\r
2257         }\r
2258         \r
2259         100% {\r
2260                 opacity: 0;\r
2261                 -moz-transform: translateX(-2000px);\r
2262         }\r
2263 }\r
2264 \r
2265 @-o-keyframes bounceOutLeft {\r
2266         0% {\r
2267                 -o-transform: translateX(0);\r
2268         }\r
2269         \r
2270         20% {\r
2271                 opacity: 1;\r
2272                 -o-transform: translateX(20px);\r
2273         }\r
2274         \r
2275         100% {\r
2276                 opacity: 0;\r
2277                 -o-transform: translateX(-2000px);\r
2278         }\r
2279 }\r
2280 \r
2281 @keyframes bounceOutLeft {\r
2282         0% {\r
2283                 transform: translateX(0);\r
2284         }\r
2285         \r
2286         20% {\r
2287                 opacity: 1;\r
2288                 transform: translateX(20px);\r
2289         }\r
2290         \r
2291         100% {\r
2292                 opacity: 0;\r
2293                 transform: translateX(-2000px);\r
2294         }\r
2295 }\r
2296 \r
2297 .bounceOutLeft {\r
2298         -webkit-animation-name: bounceOutLeft;\r
2299         -moz-animation-name: bounceOutLeft;\r
2300         -o-animation-name: bounceOutLeft;\r
2301         animation-name: bounceOutLeft;\r
2302 }\r
2303 @-webkit-keyframes bounceOutRight {\r
2304         0% {\r
2305                 -webkit-transform: translateX(0);\r
2306         }\r
2307         \r
2308         20% {\r
2309                 opacity: 1;\r
2310                 -webkit-transform: translateX(-20px);\r
2311         }\r
2312         \r
2313         100% {\r
2314                 opacity: 0;\r
2315                 -webkit-transform: translateX(2000px);\r
2316         }\r
2317 }\r
2318 \r
2319 @-moz-keyframes bounceOutRight {\r
2320         0% {\r
2321                 -moz-transform: translateX(0);\r
2322         }\r
2323         \r
2324         20% {\r
2325                 opacity: 1;\r
2326                 -moz-transform: translateX(-20px);\r
2327         }\r
2328         \r
2329         100% {\r
2330                 opacity: 0;\r
2331                 -moz-transform: translateX(2000px);\r
2332         }\r
2333 }\r
2334 \r
2335 @-o-keyframes bounceOutRight {\r
2336         0% {\r
2337                 -o-transform: translateX(0);\r
2338         }\r
2339         \r
2340         20% {\r
2341                 opacity: 1;\r
2342                 -o-transform: translateX(-20px);\r
2343         }\r
2344         \r
2345         100% {\r
2346                 opacity: 0;\r
2347                 -o-transform: translateX(2000px);\r
2348         }\r
2349 }\r
2350 \r
2351 @keyframes bounceOutRight {\r
2352         0% {\r
2353                 transform: translateX(0);\r
2354         }\r
2355         \r
2356         20% {\r
2357                 opacity: 1;\r
2358                 transform: translateX(-20px);\r
2359         }\r
2360         \r
2361         100% {\r
2362                 opacity: 0;\r
2363                 transform: translateX(2000px);\r
2364         }\r
2365 }\r
2366 \r
2367 .bounceOutRight {\r
2368         -webkit-animation-name: bounceOutRight;\r
2369         -moz-animation-name: bounceOutRight;\r
2370         -o-animation-name: bounceOutRight;\r
2371         animation-name: bounceOutRight;\r
2372 }\r
2373 @-webkit-keyframes rotateIn {\r
2374         0% {\r
2375                 -webkit-transform-origin: center center;\r
2376                 -webkit-transform: rotate(-200deg);\r
2377                 opacity: 0;\r
2378         }\r
2379         \r
2380         100% {\r
2381                 -webkit-transform-origin: center center;\r
2382                 -webkit-transform: rotate(0);\r
2383                 opacity: 1;\r
2384         }\r
2385 }\r
2386 @-moz-keyframes rotateIn {\r
2387         0% {\r
2388                 -moz-transform-origin: center center;\r
2389                 -moz-transform: rotate(-200deg);\r
2390                 opacity: 0;\r
2391         }\r
2392         \r
2393         100% {\r
2394                 -moz-transform-origin: center center;\r
2395                 -moz-transform: rotate(0);\r
2396                 opacity: 1;\r
2397         }\r
2398 }\r
2399 @-o-keyframes rotateIn {\r
2400         0% {\r
2401                 -o-transform-origin: center center;\r
2402                 -o-transform: rotate(-200deg);\r
2403                 opacity: 0;\r
2404         }\r
2405         \r
2406         100% {\r
2407                 -o-transform-origin: center center;\r
2408                 -o-transform: rotate(0);\r
2409                 opacity: 1;\r
2410         }\r
2411 }\r
2412 @keyframes rotateIn {\r
2413         0% {\r
2414                 transform-origin: center center;\r
2415                 transform: rotate(-200deg);\r
2416                 opacity: 0;\r
2417         }\r
2418         \r
2419         100% {\r
2420                 transform-origin: center center;\r
2421                 transform: rotate(0);\r
2422                 opacity: 1;\r
2423         }\r
2424 }\r
2425 \r
2426 .rotateIn {\r
2427         -webkit-animation-name: rotateIn;\r
2428         -moz-animation-name: rotateIn;\r
2429         -o-animation-name: rotateIn;\r
2430         animation-name: rotateIn;\r
2431 }\r
2432 @-webkit-keyframes rotateInUpLeft {\r
2433         0% {\r
2434                 -webkit-transform-origin: left bottom;\r
2435                 -webkit-transform: rotate(90deg);\r
2436                 opacity: 0;\r
2437         }\r
2438         \r
2439         100% {\r
2440                 -webkit-transform-origin: left bottom;\r
2441                 -webkit-transform: rotate(0);\r
2442                 opacity: 1;\r
2443         }\r
2444 }\r
2445 \r
2446 @-moz-keyframes rotateInUpLeft {\r
2447         0% {\r
2448                 -moz-transform-origin: left bottom;\r
2449                 -moz-transform: rotate(90deg);\r
2450                 opacity: 0;\r
2451         }\r
2452         \r
2453         100% {\r
2454                 -moz-transform-origin: left bottom;\r
2455                 -moz-transform: rotate(0);\r
2456                 opacity: 1;\r
2457         }\r
2458 }\r
2459 \r
2460 @-o-keyframes rotateInUpLeft {\r
2461         0% {\r
2462                 -o-transform-origin: left bottom;\r
2463                 -o-transform: rotate(90deg);\r
2464                 opacity: 0;\r
2465         }\r
2466         \r
2467         100% {\r
2468                 -o-transform-origin: left bottom;\r
2469                 -o-transform: rotate(0);\r
2470                 opacity: 1;\r
2471         }\r
2472 }\r
2473 \r
2474 @keyframes rotateInUpLeft {\r
2475         0% {\r
2476                 transform-origin: left bottom;\r
2477                 transform: rotate(90deg);\r
2478                 opacity: 0;\r
2479         }\r
2480         \r
2481         100% {\r
2482                 transform-origin: left bottom;\r
2483                 transform: rotate(0);\r
2484                 opacity: 1;\r
2485         }\r
2486 }\r
2487 \r
2488 .rotateInUpLeft {\r
2489         -webkit-animation-name: rotateInUpLeft;\r
2490         -moz-animation-name: rotateInUpLeft;\r
2491         -o-animation-name: rotateInUpLeft;\r
2492         animation-name: rotateInUpLeft;\r
2493 }\r
2494 @-webkit-keyframes rotateInDownLeft {\r
2495         0% {\r
2496                 -webkit-transform-origin: left bottom;\r
2497                 -webkit-transform: rotate(-90deg);\r
2498                 opacity: 0;\r
2499         }\r
2500         \r
2501         100% {\r
2502                 -webkit-transform-origin: left bottom;\r
2503                 -webkit-transform: rotate(0);\r
2504                 opacity: 1;\r
2505         }\r
2506 }\r
2507 \r
2508 @-moz-keyframes rotateInDownLeft {\r
2509         0% {\r
2510                 -moz-transform-origin: left bottom;\r
2511                 -moz-transform: rotate(-90deg);\r
2512                 opacity: 0;\r
2513         }\r
2514         \r
2515         100% {\r
2516                 -moz-transform-origin: left bottom;\r
2517                 -moz-transform: rotate(0);\r
2518                 opacity: 1;\r
2519         }\r
2520 }\r
2521 \r
2522 @-o-keyframes rotateInDownLeft {\r
2523         0% {\r
2524                 -o-transform-origin: left bottom;\r
2525                 -o-transform: rotate(-90deg);\r
2526                 opacity: 0;\r
2527         }\r
2528         \r
2529         100% {\r
2530                 -o-transform-origin: left bottom;\r
2531                 -o-transform: rotate(0);\r
2532                 opacity: 1;\r
2533         }\r
2534 }\r
2535 \r
2536 @keyframes rotateInDownLeft {\r
2537         0% {\r
2538                 transform-origin: left bottom;\r
2539                 transform: rotate(-90deg);\r
2540                 opacity: 0;\r
2541         }\r
2542         \r
2543         100% {\r
2544                 transform-origin: left bottom;\r
2545                 transform: rotate(0);\r
2546                 opacity: 1;\r
2547         }\r
2548 }\r
2549 \r
2550 .rotateInDownLeft {\r
2551         -webkit-animation-name: rotateInDownLeft;\r
2552         -moz-animation-name: rotateInDownLeft;\r
2553         -o-animation-name: rotateInDownLeft;\r
2554         animation-name: rotateInDownLeft;\r
2555 }\r
2556 @-webkit-keyframes rotateInUpRight {\r
2557         0% {\r
2558                 -webkit-transform-origin: right bottom;\r
2559                 -webkit-transform: rotate(-90deg);\r
2560                 opacity: 0;\r
2561         }\r
2562         \r
2563         100% {\r
2564                 -webkit-transform-origin: right bottom;\r
2565                 -webkit-transform: rotate(0);\r
2566                 opacity: 1;\r
2567         }\r
2568 }\r
2569 \r
2570 @-moz-keyframes rotateInUpRight {\r
2571         0% {\r
2572                 -moz-transform-origin: right bottom;\r
2573                 -moz-transform: rotate(-90deg);\r
2574                 opacity: 0;\r
2575         }\r
2576         \r
2577         100% {\r
2578                 -moz-transform-origin: right bottom;\r
2579                 -moz-transform: rotate(0);\r
2580                 opacity: 1;\r
2581         }\r
2582 }\r
2583 \r
2584 @-o-keyframes rotateInUpRight {\r
2585         0% {\r
2586                 -o-transform-origin: right bottom;\r
2587                 -o-transform: rotate(-90deg);\r
2588                 opacity: 0;\r
2589         }\r
2590         \r
2591         100% {\r
2592                 -o-transform-origin: right bottom;\r
2593                 -o-transform: rotate(0);\r
2594                 opacity: 1;\r
2595         }\r
2596 }\r
2597 \r
2598 @keyframes rotateInUpRight {\r
2599         0% {\r
2600                 transform-origin: right bottom;\r
2601                 transform: rotate(-90deg);\r
2602                 opacity: 0;\r
2603         }\r
2604         \r
2605         100% {\r
2606                 transform-origin: right bottom;\r
2607                 transform: rotate(0);\r
2608                 opacity: 1;\r
2609         }\r
2610 }\r
2611 \r
2612 .rotateInUpRight {\r
2613         -webkit-animation-name: rotateInUpRight;\r
2614         -moz-animation-name: rotateInUpRight;\r
2615         -o-animation-name: rotateInUpRight;\r
2616         animation-name: rotateInUpRight;\r
2617 }\r
2618 @-webkit-keyframes rotateInDownRight {\r
2619         0% {\r
2620                 -webkit-transform-origin: right bottom;\r
2621                 -webkit-transform: rotate(90deg);\r
2622                 opacity: 0;\r
2623         }\r
2624         \r
2625         100% {\r
2626                 -webkit-transform-origin: right bottom;\r
2627                 -webkit-transform: rotate(0);\r
2628                 opacity: 1;\r
2629         }\r
2630 }\r
2631 \r
2632 @-moz-keyframes rotateInDownRight {\r
2633         0% {\r
2634                 -moz-transform-origin: right bottom;\r
2635                 -moz-transform: rotate(90deg);\r
2636                 opacity: 0;\r
2637         }\r
2638         \r
2639         100% {\r
2640                 -moz-transform-origin: right bottom;\r
2641                 -moz-transform: rotate(0);\r
2642                 opacity: 1;\r
2643         }\r
2644 }\r
2645 \r
2646 @-o-keyframes rotateInDownRight {\r
2647         0% {\r
2648                 -o-transform-origin: right bottom;\r
2649                 -o-transform: rotate(90deg);\r
2650                 opacity: 0;\r
2651         }\r
2652         \r
2653         100% {\r
2654                 -o-transform-origin: right bottom;\r
2655                 -o-transform: rotate(0);\r
2656                 opacity: 1;\r
2657         }\r
2658 }\r
2659 \r
2660 @keyframes rotateInDownRight {\r
2661         0% {\r
2662                 transform-origin: right bottom;\r
2663                 transform: rotate(90deg);\r
2664                 opacity: 0;\r
2665         }\r
2666         \r
2667         100% {\r
2668                 transform-origin: right bottom;\r
2669                 transform: rotate(0);\r
2670                 opacity: 1;\r
2671         }\r
2672 }\r
2673 \r
2674 .rotateInDownRight {\r
2675         -webkit-animation-name: rotateInDownRight;\r
2676         -moz-animation-name: rotateInDownRight;\r
2677         -o-animation-name: rotateInDownRight;\r
2678         animation-name: rotateInDownRight;\r
2679 }\r
2680 @-webkit-keyframes rotateOut {\r
2681         0% {\r
2682                 -webkit-transform-origin: center center;\r
2683                 -webkit-transform: rotate(0);\r
2684                 opacity: 1;\r
2685         }\r
2686         \r
2687         100% {\r
2688                 -webkit-transform-origin: center center;\r
2689                 -webkit-transform: rotate(200deg);\r
2690                 opacity: 0;\r
2691         }\r
2692 }\r
2693 \r
2694 @-moz-keyframes rotateOut {\r
2695         0% {\r
2696                 -moz-transform-origin: center center;\r
2697                 -moz-transform: rotate(0);\r
2698                 opacity: 1;\r
2699         }\r
2700         \r
2701         100% {\r
2702                 -moz-transform-origin: center center;\r
2703                 -moz-transform: rotate(200deg);\r
2704                 opacity: 0;\r
2705         }\r
2706 }\r
2707 \r
2708 @-o-keyframes rotateOut {\r
2709         0% {\r
2710                 -o-transform-origin: center center;\r
2711                 -o-transform: rotate(0);\r
2712                 opacity: 1;\r
2713         }\r
2714         \r
2715         100% {\r
2716                 -o-transform-origin: center center;\r
2717                 -o-transform: rotate(200deg);\r
2718                 opacity: 0;\r
2719         }\r
2720 }\r
2721 \r
2722 @keyframes rotateOut {\r
2723         0% {\r
2724                 transform-origin: center center;\r
2725                 transform: rotate(0);\r
2726                 opacity: 1;\r
2727         }\r
2728         \r
2729         100% {\r
2730                 transform-origin: center center;\r
2731                 transform: rotate(200deg);\r
2732                 opacity: 0;\r
2733         }\r
2734 }\r
2735 \r
2736 .rotateOut {\r
2737         -webkit-animation-name: rotateOut;\r
2738         -moz-animation-name: rotateOut;\r
2739         -o-animation-name: rotateOut;\r
2740         animation-name: rotateOut;\r
2741 }\r
2742 @-webkit-keyframes rotateOutUpLeft {\r
2743         0% {\r
2744                 -webkit-transform-origin: left bottom;\r
2745                 -webkit-transform: rotate(0);\r
2746                 opacity: 1;\r
2747         }\r
2748         \r
2749         100% {\r
2750                 -webkit-transform-origin: left bottom;\r
2751                 -webkit-transform: rotate(-90deg);\r
2752                 opacity: 0;\r
2753         }\r
2754 }\r
2755 \r
2756 @-moz-keyframes rotateOutUpLeft {\r
2757         0% {\r
2758                 -moz-transform-origin: left bottom;\r
2759                 -moz-transform: rotate(0);\r
2760                 opacity: 1;\r
2761         }\r
2762         \r
2763         100% {\r
2764                 -moz-transform-origin: left bottom;\r
2765                 -moz-transform: rotate(-90deg);\r
2766                 opacity: 0;\r
2767         }\r
2768 }\r
2769 \r
2770 @-o-keyframes rotateOutUpLeft {\r
2771         0% {\r
2772                 -o-transform-origin: left bottom;\r
2773                 -o-transform: rotate(0);\r
2774                 opacity: 1;\r
2775         }\r
2776         \r
2777         100% {\r
2778                 -o-transform-origin: left bottom;\r
2779                 -o-transform: rotate(-90deg);\r
2780                 opacity: 0;\r
2781         }\r
2782 }\r
2783 \r
2784 @keyframes rotateOutUpLeft {\r
2785         0% {\r
2786                 transform-origin: left bottom;\r
2787                 transform: rotate(0);\r
2788                 opacity: 1;\r
2789         }\r
2790         \r
2791         100% {\r
2792                 transform-origin: left bottom;\r
2793                 transform: rotate(-90deg);\r
2794                 opacity: 0;\r
2795         }\r
2796 }\r
2797 \r
2798 .rotateOutUpLeft {\r
2799         -webkit-animation-name: rotateOutUpLeft;\r
2800         -moz-animation-name: rotateOutUpLeft;\r
2801         -o-animation-name: rotateOutUpLeft;\r
2802         animation-name: rotateOutUpLeft;\r
2803 }\r
2804 @-webkit-keyframes rotateOutDownLeft {\r
2805         0% {\r
2806                 -webkit-transform-origin: left bottom;\r
2807                 -webkit-transform: rotate(0);\r
2808                 opacity: 1;\r
2809         }\r
2810         \r
2811         100% {\r
2812                 -webkit-transform-origin: left bottom;\r
2813                 -webkit-transform: rotate(90deg);\r
2814                 opacity: 0;\r
2815         }\r
2816 }\r
2817 \r
2818 @-moz-keyframes rotateOutDownLeft {\r
2819         0% {\r
2820                 -moz-transform-origin: left bottom;\r
2821                 -moz-transform: rotate(0);\r
2822                 opacity: 1;\r
2823         }\r
2824         \r
2825         100% {\r
2826                 -moz-transform-origin: left bottom;\r
2827                 -moz-transform: rotate(90deg);\r
2828                 opacity: 0;\r
2829         }\r
2830 }\r
2831 \r
2832 @-o-keyframes rotateOutDownLeft {\r
2833         0% {\r
2834                 -o-transform-origin: left bottom;\r
2835                 -o-transform: rotate(0);\r
2836                 opacity: 1;\r
2837         }\r
2838         \r
2839         100% {\r
2840                 -o-transform-origin: left bottom;\r
2841                 -o-transform: rotate(90deg);\r
2842                 opacity: 0;\r
2843         }\r
2844 }\r
2845 \r
2846 @keyframes rotateOutDownLeft {\r
2847         0% {\r
2848                 transform-origin: left bottom;\r
2849                 transform: rotate(0);\r
2850                 opacity: 1;\r
2851         }\r
2852         \r
2853         100% {\r
2854                 transform-origin: left bottom;\r
2855                 transform: rotate(90deg);\r
2856                 opacity: 0;\r
2857         }\r
2858 }\r
2859 \r
2860 .rotateOutDownLeft {\r
2861         -webkit-animation-name: rotateOutDownLeft;\r
2862         -moz-animation-name: rotateOutDownLeft;\r
2863         -o-animation-name: rotateOutDownLeft;\r
2864         animation-name: rotateOutDownLeft;\r
2865 }\r
2866 @-webkit-keyframes rotateOutUpRight {\r
2867         0% {\r
2868                 -webkit-transform-origin: right bottom;\r
2869                 -webkit-transform: rotate(0);\r
2870                 opacity: 1;\r
2871         }\r
2872         \r
2873         100% {\r
2874                 -webkit-transform-origin: right bottom;\r
2875                 -webkit-transform: rotate(90deg);\r
2876                 opacity: 0;\r
2877         }\r
2878 }\r
2879 \r
2880 @-moz-keyframes rotateOutUpRight {\r
2881         0% {\r
2882                 -moz-transform-origin: right bottom;\r
2883                 -moz-transform: rotate(0);\r
2884                 opacity: 1;\r
2885         }\r
2886         \r
2887         100% {\r
2888                 -moz-transform-origin: right bottom;\r
2889                 -moz-transform: rotate(90deg);\r
2890                 opacity: 0;\r
2891         }\r
2892 }\r
2893 \r
2894 @-o-keyframes rotateOutUpRight {\r
2895         0% {\r
2896                 -o-transform-origin: right bottom;\r
2897                 -o-transform: rotate(0);\r
2898                 opacity: 1;\r
2899         }\r
2900         \r
2901         100% {\r
2902                 -o-transform-origin: right bottom;\r
2903                 -o-transform: rotate(90deg);\r
2904                 opacity: 0;\r
2905         }\r
2906 }\r
2907 \r
2908 @keyframes rotateOutUpRight {\r
2909         0% {\r
2910                 transform-origin: right bottom;\r
2911                 transform: rotate(0);\r
2912                 opacity: 1;\r
2913         }\r
2914         \r
2915         100% {\r
2916                 transform-origin: right bottom;\r
2917                 transform: rotate(90deg);\r
2918                 opacity: 0;\r
2919         }\r
2920 }\r
2921 \r
2922 .rotateOutUpRight {\r
2923         -webkit-animation-name: rotateOutUpRight;\r
2924         -moz-animation-name: rotateOutUpRight;\r
2925         -o-animation-name: rotateOutUpRight;\r
2926         animation-name: rotateOutUpRight;\r
2927 }\r
2928 @-webkit-keyframes rotateOutDownRight {\r
2929         0% {\r
2930                 -webkit-transform-origin: right bottom;\r
2931                 -webkit-transform: rotate(0);\r
2932                 opacity: 1;\r
2933         }\r
2934         \r
2935         100% {\r
2936                 -webkit-transform-origin: right bottom;\r
2937                 -webkit-transform: rotate(-90deg);\r
2938                 opacity: 0;\r
2939         }\r
2940 }\r
2941 \r
2942 @-moz-keyframes rotateOutDownRight {\r
2943         0% {\r
2944                 -moz-transform-origin: right bottom;\r
2945                 -moz-transform: rotate(0);\r
2946                 opacity: 1;\r
2947         }\r
2948         \r
2949         100% {\r
2950                 -moz-transform-origin: right bottom;\r
2951                 -moz-transform: rotate(-90deg);\r
2952                 opacity: 0;\r
2953         }\r
2954 }\r
2955 \r
2956 @-o-keyframes rotateOutDownRight {\r
2957         0% {\r
2958                 -o-transform-origin: right bottom;\r
2959                 -o-transform: rotate(0);\r
2960                 opacity: 1;\r
2961         }\r
2962         \r
2963         100% {\r
2964                 -o-transform-origin: right bottom;\r
2965                 -o-transform: rotate(-90deg);\r
2966                 opacity: 0;\r
2967         }\r
2968 }\r
2969 \r
2970 @keyframes rotateOutDownRight {\r
2971         0% {\r
2972                 transform-origin: right bottom;\r
2973                 transform: rotate(0);\r
2974                 opacity: 1;\r
2975         }\r
2976         \r
2977         100% {\r
2978                 transform-origin: right bottom;\r
2979                 transform: rotate(-90deg);\r
2980                 opacity: 0;\r
2981         }\r
2982 }\r
2983 \r
2984 .rotateOutDownRight {\r
2985         -webkit-animation-name: rotateOutDownRight;\r
2986         -moz-animation-name: rotateOutDownRight;\r
2987         -o-animation-name: rotateOutDownRight;\r
2988         animation-name: rotateOutDownRight;\r
2989 }\r
2990 @-webkit-keyframes hinge {\r
2991         0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }        \r
2992         20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }      \r
2993         40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }   \r
2994         80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } \r
2995         100% { -webkit-transform: translateY(700px); opacity: 0; }\r
2996 }\r
2997 \r
2998 @-moz-keyframes hinge {\r
2999         0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } \r
3000         20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }       \r
3001         40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }    \r
3002         80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }  \r
3003         100% { -moz-transform: translateY(700px); opacity: 0; }\r
3004 }\r
3005 \r
3006 @-o-keyframes hinge {\r
3007         0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }       \r
3008         20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }     \r
3009         40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }  \r
3010         80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }        \r
3011         100% { -o-transform: translateY(700px); opacity: 0; }\r
3012 }\r
3013 \r
3014 @keyframes hinge {\r
3015         0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }        \r
3016         20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; }      \r
3017         40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; }   \r
3018         80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } \r
3019         100% { transform: translateY(700px); opacity: 0; }\r
3020 }\r
3021 \r
3022 .hinge {\r
3023         -webkit-animation-name: hinge;\r
3024         -moz-animation-name: hinge;\r
3025         -o-animation-name: hinge;\r
3026         animation-name: hinge;\r
3027 }\r
3028 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */\r
3029 \r
3030 @-webkit-keyframes rollIn {\r
3031         0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }\r
3032         100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }\r
3033 }\r
3034 \r
3035 @-moz-keyframes rollIn {\r
3036         0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }\r
3037         100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }\r
3038 }\r
3039 \r
3040 @-o-keyframes rollIn {\r
3041         0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }\r
3042         100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }\r
3043 }\r
3044 \r
3045 @keyframes rollIn {\r
3046         0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }\r
3047         100% { opacity: 1; transform: translateX(0px) rotate(0deg); }\r
3048 }\r
3049 \r
3050 .rollIn {\r
3051         -webkit-animation-name: rollIn;\r
3052         -moz-animation-name: rollIn;\r
3053         -o-animation-name: rollIn;\r
3054         animation-name: rollIn;\r
3055 }\r
3056 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */\r
3057 \r
3058 @-webkit-keyframes rollOut {\r
3059     0% {\r
3060                 opacity: 1;\r
3061                 -webkit-transform: translateX(0px) rotate(0deg);\r
3062         }\r
3063 \r
3064     100% {\r
3065                 opacity: 0;\r
3066                 -webkit-transform: translateX(100%) rotate(120deg);\r
3067         }\r
3068 }\r
3069 \r
3070 @-moz-keyframes rollOut {\r
3071     0% {\r
3072                 opacity: 1;\r
3073                 -moz-transform: translateX(0px) rotate(0deg);\r
3074         }\r
3075 \r
3076     100% {\r
3077                 opacity: 0;\r
3078                 -moz-transform: translateX(100%) rotate(120deg);\r
3079         }\r
3080 }\r
3081 \r
3082 @-o-keyframes rollOut {\r
3083     0% {\r
3084                 opacity: 1;\r
3085                 -o-transform: translateX(0px) rotate(0deg);\r
3086         }\r
3087 \r
3088     100% {\r
3089                 opacity: 0;\r
3090                 -o-transform: translateX(100%) rotate(120deg);\r
3091         }\r
3092 }\r
3093 \r
3094 @keyframes rollOut {\r
3095     0% {\r
3096                 opacity: 1;\r
3097                 transform: translateX(0px) rotate(0deg);\r
3098         }\r
3099 \r
3100     100% {\r
3101                 opacity: 0;\r
3102                 transform: translateX(100%) rotate(120deg);\r
3103         }\r
3104 }\r
3105 \r
3106 .rollOut {\r
3107         -webkit-animation-name: rollOut;\r
3108         -moz-animation-name: rollOut;\r
3109         -o-animation-name: rollOut;\r
3110         animation-name: rollOut;\r
3111 }\r
3112 \r
3113 /* originally authored by Angelo Rohit - https://github.com/angelorohit */\r
3114 \r
3115 @-webkit-keyframes lightSpeedIn {\r
3116         0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3117         60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }\r
3118         80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }\r
3119         100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3120 }\r
3121 \r
3122 @-moz-keyframes lightSpeedIn {\r
3123         0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3124         60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }\r
3125         80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; }\r
3126         100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3127 }\r
3128 \r
3129 @-o-keyframes lightSpeedIn {\r
3130         0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3131         60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; }\r
3132         80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; }\r
3133         100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3134 }\r
3135 \r
3136 @keyframes lightSpeedIn {\r
3137         0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3138         60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }\r
3139         80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }\r
3140         100% { transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3141 }\r
3142 \r
3143 .lightSpeedIn {\r
3144     -webkit-animation-name: lightSpeedIn;\r
3145     -moz-animation-name: lightSpeedIn;\r
3146     -o-animation-name: lightSpeedIn;\r
3147     animation-name: lightSpeedIn;\r
3148 \r
3149     -webkit-animation-timing-function: ease-out;\r
3150     -moz-animation-timing-function: ease-out;\r
3151     -o-animation-timing-function: ease-out;\r
3152     animation-timing-function: ease-out;\r
3153 }\r
3154 \r
3155 .animated.lightSpeedIn {\r
3156     -webkit-animation-duration: 0.5s;\r
3157     -moz-animation-duration: 0.5s;\r
3158     -o-animation-duration: 0.5s;\r
3159     animation-duration: 0.5s;\r
3160 }\r
3161 \r
3162 /* originally authored by Angelo Rohit - https://github.com/angelorohit */\r
3163 \r
3164 @-webkit-keyframes lightSpeedOut {\r
3165     0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3166         100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3167 }\r
3168 \r
3169 @-moz-keyframes lightSpeedOut {\r
3170         0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3171         100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3172 }\r
3173 \r
3174 @-o-keyframes lightSpeedOut {\r
3175         0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3176         100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3177 }\r
3178 \r
3179 @keyframes lightSpeedOut {\r
3180         0% { transform: translateX(0%) skewX(0deg); opacity: 1; }\r
3181         100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }\r
3182 }\r
3183 \r
3184 .lightSpeedOut {\r
3185     -webkit-animation-name: lightSpeedOut;\r
3186     -moz-animation-name: lightSpeedOut;\r
3187     -o-animation-name: lightSpeedOut;\r
3188     animation-name: lightSpeedOut;\r
3189 \r
3190     -webkit-animation-timing-function: ease-in;\r
3191     -moz-animation-timing-function: ease-in;\r
3192     -o-animation-timing-function: ease-in;\r
3193     animation-timing-function: ease-in;\r
3194 }\r
3195 \r
3196 .animated.lightSpeedOut {\r
3197     -webkit-animation-duration: 0.25s;\r
3198     -moz-animation-duration: 0.25s;\r
3199     -o-animation-duration: 0.25s;\r
3200     animation-duration: 0.25s;\r
3201 }\r
3202 \r
3203 /* originally authored by Angelo Rohit - https://github.com/angelorohit */\r
3204 \r
3205 @-webkit-keyframes wiggle {\r
3206     0% { -webkit-transform: skewX(9deg); }\r
3207     10% { -webkit-transform: skewX(-8deg); }\r
3208     20% { -webkit-transform: skewX(7deg); }\r
3209     30% { -webkit-transform: skewX(-6deg); }\r
3210     40% { -webkit-transform: skewX(5deg); }\r
3211     50% { -webkit-transform: skewX(-4deg); }\r
3212     60% { -webkit-transform: skewX(3deg); }\r
3213     70% { -webkit-transform: skewX(-2deg); }\r
3214     80% { -webkit-transform: skewX(1deg); }\r
3215     90% { -webkit-transform: skewX(0deg); }\r
3216         100% { -webkit-transform: skewX(0deg); }\r
3217 }\r
3218 \r
3219 @-moz-keyframes wiggle {\r
3220     0% { -moz-transform: skewX(9deg); }\r
3221     10% { -moz-transform: skewX(-8deg); }\r
3222     20% { -moz-transform: skewX(7deg); }\r
3223     30% { -moz-transform: skewX(-6deg); }\r
3224     40% { -moz-transform: skewX(5deg); }\r
3225     50% { -moz-transform: skewX(-4deg); }\r
3226     60% { -moz-transform: skewX(3deg); }\r
3227     70% { -moz-transform: skewX(-2deg); }\r
3228     80% { -moz-transform: skewX(1deg); }\r
3229     90% { -moz-transform: skewX(0deg); }\r
3230         100% { -moz-transform: skewX(0deg); }\r
3231 }\r
3232 \r
3233 @-o-keyframes wiggle {\r
3234     0% { -o-transform: skewX(9deg); }\r
3235     10% { -o-transform: skewX(-8deg); }\r
3236     20% { -o-transform: skewX(7deg); }\r
3237     30% { -o-transform: skewX(-6deg); }\r
3238     40% { -o-transform: skewX(5deg); }\r
3239     50% { -o-transform: skewX(-4deg); }\r
3240     60% { -o-transform: skewX(3deg); }\r
3241     70% { -o-transform: skewX(-2deg); }\r
3242     80% { -o-transform: skewX(1deg); }\r
3243     90% { -o-transform: skewX(0deg); }\r
3244         100% { -o-transform: skewX(0deg); }\r
3245 }\r
3246 \r
3247 @keyframes wiggle {\r
3248     0% { transform: skewX(9deg); }\r
3249     10% { transform: skewX(-8deg); }\r
3250     20% { transform: skewX(7deg); }\r
3251     30% { transform: skewX(-6deg); }\r
3252     40% { transform: skewX(5deg); }\r
3253     50% { transform: skewX(-4deg); }\r
3254     60% { transform: skewX(3deg); }\r
3255     70% { transform: skewX(-2deg); }\r
3256     80% { transform: skewX(1deg); }\r
3257     90% { transform: skewX(0deg); }\r
3258         100% { transform: skewX(0deg); }\r
3259 }\r
3260 \r
3261 .wiggle {\r
3262     -webkit-animation-name: wiggle;\r
3263     -moz-animation-name: wiggle;\r
3264     -o-animation-name: wiggle;\r
3265     animation-name: wiggle;\r
3266 \r
3267     -webkit-animation-timing-function: ease-in;\r
3268     -moz-animation-timing-function: ease-in;\r
3269     -o-animation-timing-function: ease-in;\r
3270     animation-timing-function: ease-in;\r
3271 }\r
3272 \r
3273 .animated.wiggle {\r
3274     -webkit-animation-duration: 0.75s;\r
3275     -moz-animation-duration: 0.75s;\r
3276     -o-animation-duration: 0.75s;\r
3277     animation-duration: 0.75s;\r
3278 }\r