API tools faq
paste
Aluf

Animated.css

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