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