animate.css 62 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752
  1. @charset "UTF-8";
  2. /*!
  3. Animate.css - http://daneden.me/animate
  4. Licensed under the MIT license
  5. Copyright (c) 2013 Daniel Eden
  6. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
  7. The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
  8. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  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. .animated.hinge {
  17. -webkit-animation-duration: 2s;
  18. animation-duration: 2s;
  19. }
  20. @-webkit-keyframes bounce {
  21. 0%, 20%, 50%, 80%, 100% {
  22. -webkit-transform: translateY(0);
  23. transform: translateY(0);
  24. }
  25. 40% {
  26. -webkit-transform: translateY(-30px);
  27. transform: translateY(-30px);
  28. }
  29. 60% {
  30. -webkit-transform: translateY(-15px);
  31. transform: translateY(-15px);
  32. }
  33. }
  34. @keyframes bounce {
  35. 0%, 20%, 50%, 80%, 100% {
  36. -webkit-transform: translateY(0);
  37. -ms-transform: translateY(0);
  38. transform: translateY(0);
  39. }
  40. 40% {
  41. -webkit-transform: translateY(-30px);
  42. -ms-transform: translateY(-30px);
  43. transform: translateY(-30px);
  44. }
  45. 60% {
  46. -webkit-transform: translateY(-15px);
  47. -ms-transform: translateY(-15px);
  48. transform: translateY(-15px);
  49. }
  50. }
  51. .bounce {
  52. -webkit-animation-name: bounce;
  53. animation-name: bounce;
  54. }
  55. @-webkit-keyframes flash {
  56. 0%, 50%, 100% {
  57. opacity: 1;
  58. }
  59. 25%, 75% {
  60. opacity: 0;
  61. }
  62. }
  63. @keyframes flash {
  64. 0%, 50%, 100% {
  65. opacity: 1;
  66. }
  67. 25%, 75% {
  68. opacity: 0;
  69. }
  70. }
  71. .flash {
  72. -webkit-animation-name: flash;
  73. animation-name: flash;
  74. }
  75. /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
  76. @-webkit-keyframes pulse {
  77. 0% {
  78. -webkit-transform: scale(1);
  79. transform: scale(1);
  80. }
  81. 50% {
  82. -webkit-transform: scale(1.1);
  83. transform: scale(1.1);
  84. }
  85. 100% {
  86. -webkit-transform: scale(1);
  87. transform: scale(1);
  88. }
  89. }
  90. @keyframes pulse {
  91. 0% {
  92. -webkit-transform: scale(1);
  93. -ms-transform: scale(1);
  94. transform: scale(1);
  95. }
  96. 50% {
  97. -webkit-transform: scale(1.1);
  98. -ms-transform: scale(1.1);
  99. transform: scale(1.1);
  100. }
  101. 100% {
  102. -webkit-transform: scale(1);
  103. -ms-transform: scale(1);
  104. transform: scale(1);
  105. }
  106. }
  107. .pulse {
  108. -webkit-animation-name: pulse;
  109. animation-name: pulse;
  110. }
  111. @-webkit-keyframes shake {
  112. 0%, 100% {
  113. -webkit-transform: translateX(0);
  114. transform: translateX(0);
  115. }
  116. 10%, 30%, 50%, 70%, 90% {
  117. -webkit-transform: translateX(-10px);
  118. transform: translateX(-10px);
  119. }
  120. 20%, 40%, 60%, 80% {
  121. -webkit-transform: translateX(10px);
  122. transform: translateX(10px);
  123. }
  124. }
  125. @keyframes shake {
  126. 0%, 100% {
  127. -webkit-transform: translateX(0);
  128. -ms-transform: translateX(0);
  129. transform: translateX(0);
  130. }
  131. 10%, 30%, 50%, 70%, 90% {
  132. -webkit-transform: translateX(-10px);
  133. -ms-transform: translateX(-10px);
  134. transform: translateX(-10px);
  135. }
  136. 20%, 40%, 60%, 80% {
  137. -webkit-transform: translateX(10px);
  138. -ms-transform: translateX(10px);
  139. transform: translateX(10px);
  140. }
  141. }
  142. .shake {
  143. -webkit-animation-name: shake;
  144. animation-name: shake;
  145. }
  146. @-webkit-keyframes swing {
  147. 20% {
  148. -webkit-transform: rotate(15deg);
  149. transform: rotate(15deg);
  150. }
  151. 40% {
  152. -webkit-transform: rotate(-10deg);
  153. transform: rotate(-10deg);
  154. }
  155. 60% {
  156. -webkit-transform: rotate(5deg);
  157. transform: rotate(5deg);
  158. }
  159. 80% {
  160. -webkit-transform: rotate(-5deg);
  161. transform: rotate(-5deg);
  162. }
  163. 100% {
  164. -webkit-transform: rotate(0deg);
  165. transform: rotate(0deg);
  166. }
  167. }
  168. @keyframes swing {
  169. 20% {
  170. -webkit-transform: rotate(15deg);
  171. -ms-transform: rotate(15deg);
  172. transform: rotate(15deg);
  173. }
  174. 40% {
  175. -webkit-transform: rotate(-10deg);
  176. -ms-transform: rotate(-10deg);
  177. transform: rotate(-10deg);
  178. }
  179. 60% {
  180. -webkit-transform: rotate(5deg);
  181. -ms-transform: rotate(5deg);
  182. transform: rotate(5deg);
  183. }
  184. 80% {
  185. -webkit-transform: rotate(-5deg);
  186. -ms-transform: rotate(-5deg);
  187. transform: rotate(-5deg);
  188. }
  189. 100% {
  190. -webkit-transform: rotate(0deg);
  191. -ms-transform: rotate(0deg);
  192. transform: rotate(0deg);
  193. }
  194. }
  195. .swing {
  196. -webkit-transform-origin: top center;
  197. -ms-transform-origin: top center;
  198. transform-origin: top center;
  199. -webkit-animation-name: swing;
  200. animation-name: swing;
  201. }
  202. @-webkit-keyframes tada {
  203. 0% {
  204. -webkit-transform: scale(1);
  205. transform: scale(1);
  206. }
  207. 10%, 20% {
  208. -webkit-transform: scale(0.9) rotate(-3deg);
  209. transform: scale(0.9) rotate(-3deg);
  210. }
  211. 30%, 50%, 70%, 90% {
  212. -webkit-transform: scale(1.1) rotate(3deg);
  213. transform: scale(1.1) rotate(3deg);
  214. }
  215. 40%, 60%, 80% {
  216. -webkit-transform: scale(1.1) rotate(-3deg);
  217. transform: scale(1.1) rotate(-3deg);
  218. }
  219. 100% {
  220. -webkit-transform: scale(1) rotate(0);
  221. transform: scale(1) rotate(0);
  222. }
  223. }
  224. @keyframes tada {
  225. 0% {
  226. -webkit-transform: scale(1);
  227. -ms-transform: scale(1);
  228. transform: scale(1);
  229. }
  230. 10%, 20% {
  231. -webkit-transform: scale(0.9) rotate(-3deg);
  232. -ms-transform: scale(0.9) rotate(-3deg);
  233. transform: scale(0.9) rotate(-3deg);
  234. }
  235. 30%, 50%, 70%, 90% {
  236. -webkit-transform: scale(1.1) rotate(3deg);
  237. -ms-transform: scale(1.1) rotate(3deg);
  238. transform: scale(1.1) rotate(3deg);
  239. }
  240. 40%, 60%, 80% {
  241. -webkit-transform: scale(1.1) rotate(-3deg);
  242. -ms-transform: scale(1.1) rotate(-3deg);
  243. transform: scale(1.1) rotate(-3deg);
  244. }
  245. 100% {
  246. -webkit-transform: scale(1) rotate(0);
  247. -ms-transform: scale(1) rotate(0);
  248. transform: scale(1) rotate(0);
  249. }
  250. }
  251. .tada {
  252. -webkit-animation-name: tada;
  253. animation-name: tada;
  254. }
  255. /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
  256. @-webkit-keyframes wobble {
  257. 0% {
  258. -webkit-transform: translateX(0%);
  259. transform: translateX(0%);
  260. }
  261. 15% {
  262. -webkit-transform: translateX(-25%) rotate(-5deg);
  263. transform: translateX(-25%) rotate(-5deg);
  264. }
  265. 30% {
  266. -webkit-transform: translateX(20%) rotate(3deg);
  267. transform: translateX(20%) rotate(3deg);
  268. }
  269. 45% {
  270. -webkit-transform: translateX(-15%) rotate(-3deg);
  271. transform: translateX(-15%) rotate(-3deg);
  272. }
  273. 60% {
  274. -webkit-transform: translateX(10%) rotate(2deg);
  275. transform: translateX(10%) rotate(2deg);
  276. }
  277. 75% {
  278. -webkit-transform: translateX(-5%) rotate(-1deg);
  279. transform: translateX(-5%) rotate(-1deg);
  280. }
  281. 100% {
  282. -webkit-transform: translateX(0%);
  283. transform: translateX(0%);
  284. }
  285. }
  286. @keyframes wobble {
  287. 0% {
  288. -webkit-transform: translateX(0%);
  289. -ms-transform: translateX(0%);
  290. transform: translateX(0%);
  291. }
  292. 15% {
  293. -webkit-transform: translateX(-25%) rotate(-5deg);
  294. -ms-transform: translateX(-25%) rotate(-5deg);
  295. transform: translateX(-25%) rotate(-5deg);
  296. }
  297. 30% {
  298. -webkit-transform: translateX(20%) rotate(3deg);
  299. -ms-transform: translateX(20%) rotate(3deg);
  300. transform: translateX(20%) rotate(3deg);
  301. }
  302. 45% {
  303. -webkit-transform: translateX(-15%) rotate(-3deg);
  304. -ms-transform: translateX(-15%) rotate(-3deg);
  305. transform: translateX(-15%) rotate(-3deg);
  306. }
  307. 60% {
  308. -webkit-transform: translateX(10%) rotate(2deg);
  309. -ms-transform: translateX(10%) rotate(2deg);
  310. transform: translateX(10%) rotate(2deg);
  311. }
  312. 75% {
  313. -webkit-transform: translateX(-5%) rotate(-1deg);
  314. -ms-transform: translateX(-5%) rotate(-1deg);
  315. transform: translateX(-5%) rotate(-1deg);
  316. }
  317. 100% {
  318. -webkit-transform: translateX(0%);
  319. -ms-transform: translateX(0%);
  320. transform: translateX(0%);
  321. }
  322. }
  323. .wobble {
  324. -webkit-animation-name: wobble;
  325. animation-name: wobble;
  326. }
  327. @-webkit-keyframes bounceIn {
  328. 0% {
  329. opacity: 0;
  330. -webkit-transform: scale(.3);
  331. transform: scale(.3);
  332. }
  333. 50% {
  334. opacity: 1;
  335. -webkit-transform: scale(1.05);
  336. transform: scale(1.05);
  337. }
  338. 70% {
  339. -webkit-transform: scale(.9);
  340. transform: scale(.9);
  341. }
  342. 100% {
  343. -webkit-transform: scale(1);
  344. transform: scale(1);
  345. }
  346. }
  347. @keyframes bounceIn {
  348. 0% {
  349. opacity: 0;
  350. -webkit-transform: scale(.3);
  351. -ms-transform: scale(.3);
  352. transform: scale(.3);
  353. }
  354. 50% {
  355. opacity: 1;
  356. -webkit-transform: scale(1.05);
  357. -ms-transform: scale(1.05);
  358. transform: scale(1.05);
  359. }
  360. 70% {
  361. -webkit-transform: scale(.9);
  362. -ms-transform: scale(.9);
  363. transform: scale(.9);
  364. }
  365. 100% {
  366. -webkit-transform: scale(1);
  367. -ms-transform: scale(1);
  368. transform: scale(1);
  369. }
  370. }
  371. .bounceIn {
  372. -webkit-animation-name: bounceIn;
  373. animation-name: bounceIn;
  374. }
  375. @-webkit-keyframes bounceInDown {
  376. 0% {
  377. opacity: 0;
  378. -webkit-transform: translateY(-2000px);
  379. transform: translateY(-2000px);
  380. }
  381. 60% {
  382. opacity: 1;
  383. -webkit-transform: translateY(30px);
  384. transform: translateY(30px);
  385. }
  386. 80% {
  387. -webkit-transform: translateY(-10px);
  388. transform: translateY(-10px);
  389. }
  390. 100% {
  391. -webkit-transform: translateY(0);
  392. transform: translateY(0);
  393. }
  394. }
  395. @keyframes bounceInDown {
  396. 0% {
  397. opacity: 0;
  398. -webkit-transform: translateY(-2000px);
  399. -ms-transform: translateY(-2000px);
  400. transform: translateY(-2000px);
  401. }
  402. 60% {
  403. opacity: 1;
  404. -webkit-transform: translateY(30px);
  405. -ms-transform: translateY(30px);
  406. transform: translateY(30px);
  407. }
  408. 80% {
  409. -webkit-transform: translateY(-10px);
  410. -ms-transform: translateY(-10px);
  411. transform: translateY(-10px);
  412. }
  413. 100% {
  414. -webkit-transform: translateY(0);
  415. -ms-transform: translateY(0);
  416. transform: translateY(0);
  417. }
  418. }
  419. .bounceInDown {
  420. -webkit-animation-name: bounceInDown;
  421. animation-name: bounceInDown;
  422. }
  423. @-webkit-keyframes bounceInLeft {
  424. 0% {
  425. opacity: 0;
  426. -webkit-transform: translateX(-2000px);
  427. transform: translateX(-2000px);
  428. }
  429. 60% {
  430. opacity: 1;
  431. -webkit-transform: translateX(30px);
  432. transform: translateX(30px);
  433. }
  434. 80% {
  435. opacity: 1;
  436. -webkit-transform: translateX(-10px);
  437. transform: translateX(-10px);
  438. }
  439. 100% {
  440. opacity: 1;
  441. -webkit-transform: translateX(0);
  442. transform: translateX(0);
  443. }
  444. }
  445. @keyframes bounceInLeft {
  446. 0% {
  447. opacity: 0;
  448. -webkit-transform: translateX(-2000px);
  449. -ms-transform: translateX(-2000px);
  450. transform: translateX(-2000px);
  451. }
  452. 60% {
  453. opacity: 1;
  454. -webkit-transform: translateX(30px);
  455. -ms-transform: translateX(30px);
  456. transform: translateX(30px);
  457. }
  458. 80% {
  459. opacity: 1;
  460. -webkit-transform: translateX(-10px);
  461. -ms-transform: translateX(-10px);
  462. transform: translateX(-10px);
  463. }
  464. 100% {
  465. opacity: 1 !important;
  466. -webkit-transform: translateX(0);
  467. -ms-transform: translateX(0);
  468. transform: translateX(0);
  469. }
  470. }
  471. .bounceInLeft {
  472. -webkit-animation-name: bounceInLeft;
  473. animation-name: bounceInLeft;
  474. }
  475. @-webkit-keyframes bounceInRight {
  476. 0% {
  477. opacity: 0;
  478. -webkit-transform: translateX(2000px);
  479. transform: translateX(2000px);
  480. }
  481. 60% {
  482. opacity: 1;
  483. -webkit-transform: translateX(-30px);
  484. transform: translateX(-30px);
  485. }
  486. 80% {
  487. opacity: 1;
  488. -webkit-transform: translateX(10px);
  489. transform: translateX(10px);
  490. }
  491. 100% {
  492. opacity: 1;
  493. -webkit-transform: translateX(0);
  494. transform: translateX(0);
  495. }
  496. }
  497. @keyframes bounceInRight {
  498. 0% {
  499. opacity: 0;
  500. -webkit-transform: translateX(2000px);
  501. -ms-transform: translateX(2000px);
  502. transform: translateX(2000px);
  503. }
  504. 60% {
  505. opacity: 1;
  506. -webkit-transform: translateX(-30px);
  507. -ms-transform: translateX(-30px);
  508. transform: translateX(-30px);
  509. }
  510. 80% {
  511. opacity: 1;
  512. -webkit-transform: translateX(10px);
  513. -ms-transform: translateX(10px);
  514. transform: translateX(10px);
  515. }
  516. 100% {
  517. opacity: 1;
  518. -webkit-transform: translateX(0);
  519. -ms-transform: translateX(0);
  520. transform: translateX(0);
  521. }
  522. }
  523. .bounceInRight {
  524. -webkit-animation-name: bounceInRight;
  525. animation-name: bounceInRight;
  526. }
  527. @-webkit-keyframes bounceInUp {
  528. 0% {
  529. opacity: 0;
  530. -webkit-transform: translateY(2000px);
  531. transform: translateY(2000px);
  532. }
  533. 60% {
  534. opacity: 1;
  535. -webkit-transform: translateY(-30px);
  536. transform: translateY(-30px);
  537. }
  538. 80% {
  539. -webkit-transform: translateY(10px);
  540. transform: translateY(10px);
  541. }
  542. 100% {
  543. -webkit-transform: translateY(0);
  544. transform: translateY(0);
  545. }
  546. }
  547. @keyframes bounceInUp {
  548. 0% {
  549. opacity: 0;
  550. -webkit-transform: translateY(2000px);
  551. -ms-transform: translateY(2000px);
  552. transform: translateY(2000px);
  553. }
  554. 60% {
  555. opacity: 1;
  556. -webkit-transform: translateY(-30px);
  557. -ms-transform: translateY(-30px);
  558. transform: translateY(-30px);
  559. }
  560. 80% {
  561. -webkit-transform: translateY(10px);
  562. -ms-transform: translateY(10px);
  563. transform: translateY(10px);
  564. }
  565. 100% {
  566. -webkit-transform: translateY(0);
  567. -ms-transform: translateY(0);
  568. transform: translateY(0);
  569. }
  570. }
  571. .bounceInUp {
  572. -webkit-animation-name: bounceInUp;
  573. animation-name: bounceInUp;
  574. }
  575. @-webkit-keyframes bounceOut {
  576. 0% {
  577. -webkit-transform: scale(1);
  578. transform: scale(1);
  579. }
  580. 25% {
  581. -webkit-transform: scale(.95);
  582. transform: scale(.95);
  583. }
  584. 50% {
  585. opacity: 1;
  586. -webkit-transform: scale(1.1);
  587. transform: scale(1.1);
  588. }
  589. 100% {
  590. opacity: 0;
  591. -webkit-transform: scale(.3);
  592. transform: scale(.3);
  593. }
  594. }
  595. @keyframes bounceOut {
  596. 0% {
  597. -webkit-transform: scale(1);
  598. -ms-transform: scale(1);
  599. transform: scale(1);
  600. }
  601. 25% {
  602. -webkit-transform: scale(.95);
  603. -ms-transform: scale(.95);
  604. transform: scale(.95);
  605. }
  606. 50% {
  607. opacity: 1;
  608. -webkit-transform: scale(1.1);
  609. -ms-transform: scale(1.1);
  610. transform: scale(1.1);
  611. }
  612. 100% {
  613. opacity: 0;
  614. -webkit-transform: scale(.3);
  615. -ms-transform: scale(.3);
  616. transform: scale(.3);
  617. }
  618. }
  619. .bounceOut {
  620. -webkit-animation-name: bounceOut;
  621. animation-name: bounceOut;
  622. }
  623. @-webkit-keyframes bounceOutDown {
  624. 0% {
  625. -webkit-transform: translateY(0);
  626. transform: translateY(0);
  627. }
  628. 20% {
  629. opacity: 1;
  630. -webkit-transform: translateY(-20px);
  631. transform: translateY(-20px);
  632. }
  633. 100% {
  634. opacity: 0;
  635. -webkit-transform: translateY(2000px);
  636. transform: translateY(2000px);
  637. }
  638. }
  639. @keyframes bounceOutDown {
  640. 0% {
  641. -webkit-transform: translateY(0);
  642. -ms-transform: translateY(0);
  643. transform: translateY(0);
  644. }
  645. 20% {
  646. opacity: 1;
  647. -webkit-transform: translateY(-20px);
  648. -ms-transform: translateY(-20px);
  649. transform: translateY(-20px);
  650. }
  651. 100% {
  652. opacity: 0;
  653. -webkit-transform: translateY(2000px);
  654. -ms-transform: translateY(2000px);
  655. transform: translateY(2000px);
  656. }
  657. }
  658. .bounceOutDown {
  659. -webkit-animation-name: bounceOutDown;
  660. animation-name: bounceOutDown;
  661. }
  662. @-webkit-keyframes bounceOutLeft {
  663. 0% {
  664. -webkit-transform: translateX(0);
  665. transform: translateX(0);
  666. }
  667. 20% {
  668. opacity: 1;
  669. -webkit-transform: translateX(20px);
  670. transform: translateX(20px);
  671. }
  672. 100% {
  673. opacity: 0;
  674. -webkit-transform: translateX(-2000px);
  675. transform: translateX(-2000px);
  676. }
  677. }
  678. @keyframes bounceOutLeft {
  679. 0% {
  680. -webkit-transform: translateX(0);
  681. -ms-transform: translateX(0);
  682. transform: translateX(0);
  683. }
  684. 20% {
  685. opacity: 1;
  686. -webkit-transform: translateX(20px);
  687. -ms-transform: translateX(20px);
  688. transform: translateX(20px);
  689. }
  690. 100% {
  691. opacity: 0;
  692. -webkit-transform: translateX(-2000px);
  693. -ms-transform: translateX(-2000px);
  694. transform: translateX(-2000px);
  695. }
  696. }
  697. .bounceOutLeft {
  698. -webkit-animation-name: bounceOutLeft;
  699. animation-name: bounceOutLeft;
  700. }
  701. @-webkit-keyframes bounceOutRight {
  702. 0% {
  703. -webkit-transform: translateX(0);
  704. transform: translateX(0);
  705. }
  706. 20% {
  707. opacity: 1;
  708. -webkit-transform: translateX(-20px);
  709. transform: translateX(-20px);
  710. }
  711. 100% {
  712. opacity: 0;
  713. -webkit-transform: translateX(2000px);
  714. transform: translateX(2000px);
  715. }
  716. }
  717. @keyframes bounceOutRight {
  718. 0% {
  719. -webkit-transform: translateX(0);
  720. -ms-transform: translateX(0);
  721. transform: translateX(0);
  722. }
  723. 20% {
  724. opacity: 1;
  725. -webkit-transform: translateX(-20px);
  726. -ms-transform: translateX(-20px);
  727. transform: translateX(-20px);
  728. }
  729. 100% {
  730. opacity: 0;
  731. -webkit-transform: translateX(2000px);
  732. -ms-transform: translateX(2000px);
  733. transform: translateX(2000px);
  734. }
  735. }
  736. .bounceOutRight {
  737. -webkit-animation-name: bounceOutRight;
  738. animation-name: bounceOutRight;
  739. }
  740. @-webkit-keyframes bounceOutUp {
  741. 0% {
  742. -webkit-transform: translateY(0);
  743. transform: translateY(0);
  744. }
  745. 20% {
  746. opacity: 1;
  747. -webkit-transform: translateY(20px);
  748. transform: translateY(20px);
  749. }
  750. 100% {
  751. opacity: 0;
  752. -webkit-transform: translateY(-2000px);
  753. transform: translateY(-2000px);
  754. }
  755. }
  756. @keyframes bounceOutUp {
  757. 0% {
  758. -webkit-transform: translateY(0);
  759. -ms-transform: translateY(0);
  760. transform: translateY(0);
  761. }
  762. 20% {
  763. opacity: 1;
  764. -webkit-transform: translateY(20px);
  765. -ms-transform: translateY(20px);
  766. transform: translateY(20px);
  767. }
  768. 100% {
  769. opacity: 0;
  770. -webkit-transform: translateY(-2000px);
  771. -ms-transform: translateY(-2000px);
  772. transform: translateY(-2000px);
  773. }
  774. }
  775. .bounceOutUp {
  776. -webkit-animation-name: bounceOutUp;
  777. animation-name: bounceOutUp;
  778. }
  779. @-webkit-keyframes fadeIn {
  780. 0% {
  781. opacity: 0;
  782. }
  783. 100% {
  784. opacity: 1;
  785. }
  786. }
  787. @keyframes fadeIn {
  788. 0% {
  789. opacity: 0;
  790. }
  791. 100% {
  792. opacity: 1;
  793. }
  794. }
  795. .fadeIn {
  796. -webkit-animation-name: fadeIn;
  797. animation-name: fadeIn;
  798. }
  799. @-webkit-keyframes fadeInDown {
  800. 0% {
  801. opacity: 0;
  802. -webkit-transform: translateY(-20px);
  803. transform: translateY(-20px);
  804. }
  805. 100% {
  806. opacity: 1;
  807. -webkit-transform: translateY(0);
  808. transform: translateY(0);
  809. }
  810. }
  811. @keyframes fadeInDown {
  812. 0% {
  813. opacity: 0;
  814. -webkit-transform: translateY(-20px);
  815. -ms-transform: translateY(-20px);
  816. transform: translateY(-20px);
  817. }
  818. 100% {
  819. opacity: 1;
  820. -webkit-transform: translateY(0);
  821. -ms-transform: translateY(0);
  822. transform: translateY(0);
  823. }
  824. }
  825. .fadeInDown {
  826. -webkit-animation-name: fadeInDown;
  827. animation-name: fadeInDown;
  828. }
  829. @-webkit-keyframes fadeInDownBig {
  830. 0% {
  831. opacity: 0;
  832. -webkit-transform: translateY(-2000px);
  833. transform: translateY(-2000px);
  834. }
  835. 100% {
  836. opacity: 1;
  837. -webkit-transform: translateY(0);
  838. transform: translateY(0);
  839. }
  840. }
  841. @keyframes fadeInDownBig {
  842. 0% {
  843. opacity: 0;
  844. -webkit-transform: translateY(-2000px);
  845. -ms-transform: translateY(-2000px);
  846. transform: translateY(-2000px);
  847. }
  848. 100% {
  849. opacity: 1;
  850. -webkit-transform: translateY(0);
  851. -ms-transform: translateY(0);
  852. transform: translateY(0);
  853. }
  854. }
  855. .fadeInDownBig {
  856. -webkit-animation-name: fadeInDownBig;
  857. animation-name: fadeInDownBig;
  858. }
  859. @-webkit-keyframes fadeInLeft {
  860. 0% {
  861. opacity: 0;
  862. -webkit-transform: translateX(-20px);
  863. transform: translateX(-20px);
  864. }
  865. 100% {
  866. opacity: 1;
  867. -webkit-transform: translateX(0);
  868. transform: translateX(0);
  869. }
  870. }
  871. @keyframes fadeInLeft {
  872. 0% {
  873. opacity: 0;
  874. -webkit-transform: translateX(-20px);
  875. -ms-transform: translateX(-20px);
  876. transform: translateX(-20px);
  877. }
  878. 100% {
  879. opacity: 1;
  880. -webkit-transform: translateX(0);
  881. -ms-transform: translateX(0);
  882. transform: translateX(0);
  883. }
  884. }
  885. .fadeInLeft {
  886. -webkit-animation-name: fadeInLeft;
  887. animation-name: fadeInLeft;
  888. }
  889. @-webkit-keyframes fadeInLeftBig {
  890. 0% {
  891. opacity: 0;
  892. -webkit-transform: translateX(-2000px);
  893. transform: translateX(-2000px);
  894. }
  895. 100% {
  896. opacity: 1;
  897. -webkit-transform: translateX(0);
  898. transform: translateX(0);
  899. }
  900. }
  901. @keyframes fadeInLeftBig {
  902. 0% {
  903. opacity: 0;
  904. -webkit-transform: translateX(-2000px);
  905. -ms-transform: translateX(-2000px);
  906. transform: translateX(-2000px);
  907. }
  908. 100% {
  909. opacity: 1;
  910. -webkit-transform: translateX(0);
  911. -ms-transform: translateX(0);
  912. transform: translateX(0);
  913. }
  914. }
  915. .fadeInLeftBig {
  916. -webkit-animation-name: fadeInLeftBig;
  917. animation-name: fadeInLeftBig;
  918. }
  919. @-webkit-keyframes fadeInRight {
  920. 0% {
  921. opacity: 0;
  922. -webkit-transform: translateX(20px);
  923. transform: translateX(20px);
  924. }
  925. 100% {
  926. opacity: 1;
  927. -webkit-transform: translateX(0);
  928. transform: translateX(0);
  929. }
  930. }
  931. @keyframes fadeInRight {
  932. 0% {
  933. opacity: 0;
  934. -webkit-transform: translateX(20px);
  935. -ms-transform: translateX(20px);
  936. transform: translateX(20px);
  937. }
  938. 100% {
  939. opacity: 1;
  940. -webkit-transform: translateX(0);
  941. -ms-transform: translateX(0);
  942. transform: translateX(0);
  943. }
  944. }
  945. .fadeInRight {
  946. -webkit-animation-name: fadeInRight;
  947. animation-name: fadeInRight;
  948. }
  949. @-webkit-keyframes fadeInRightBig {
  950. 0% {
  951. opacity: 0;
  952. -webkit-transform: translateX(2000px);
  953. transform: translateX(2000px);
  954. }
  955. 100% {
  956. opacity: 1;
  957. -webkit-transform: translateX(0);
  958. transform: translateX(0);
  959. }
  960. }
  961. @keyframes fadeInRightBig {
  962. 0% {
  963. opacity: 0;
  964. -webkit-transform: translateX(2000px);
  965. -ms-transform: translateX(2000px);
  966. transform: translateX(2000px);
  967. }
  968. 100% {
  969. opacity: 1;
  970. -webkit-transform: translateX(0);
  971. -ms-transform: translateX(0);
  972. transform: translateX(0);
  973. }
  974. }
  975. .fadeInRightBig {
  976. -webkit-animation-name: fadeInRightBig;
  977. animation-name: fadeInRightBig;
  978. }
  979. @-webkit-keyframes fadeInUp {
  980. 0% {
  981. opacity: 0;
  982. -webkit-transform: translateY(20px);
  983. transform: translateY(20px);
  984. }
  985. 100% {
  986. opacity: 1;
  987. -webkit-transform: translateY(0);
  988. transform: translateY(0);
  989. }
  990. }
  991. @keyframes fadeInUp {
  992. 0% {
  993. opacity: 0;
  994. -webkit-transform: translateY(20px);
  995. -ms-transform: translateY(20px);
  996. transform: translateY(20px);
  997. }
  998. 100% {
  999. opacity: 1;
  1000. -webkit-transform: translateY(0);
  1001. -ms-transform: translateY(0);
  1002. transform: translateY(0);
  1003. }
  1004. }
  1005. .fadeInUp {
  1006. -webkit-animation-name: fadeInUp;
  1007. animation-name: fadeInUp;
  1008. }
  1009. @-webkit-keyframes fadeInUpBig {
  1010. 0% {
  1011. opacity: 0;
  1012. -webkit-transform: translateY(2000px);
  1013. transform: translateY(2000px);
  1014. }
  1015. 100% {
  1016. opacity: 1;
  1017. -webkit-transform: translateY(0);
  1018. transform: translateY(0);
  1019. }
  1020. }
  1021. @keyframes fadeInUpBig {
  1022. 0% {
  1023. opacity: 0;
  1024. -webkit-transform: translateY(2000px);
  1025. -ms-transform: translateY(2000px);
  1026. transform: translateY(2000px);
  1027. }
  1028. 100% {
  1029. opacity: 1;
  1030. -webkit-transform: translateY(0);
  1031. -ms-transform: translateY(0);
  1032. transform: translateY(0);
  1033. }
  1034. }
  1035. .fadeInUpBig {
  1036. -webkit-animation-name: fadeInUpBig;
  1037. animation-name: fadeInUpBig;
  1038. }
  1039. @-webkit-keyframes fadeOut {
  1040. 0% {
  1041. opacity: 1;
  1042. }
  1043. 100% {
  1044. opacity: 0;
  1045. }
  1046. }
  1047. @keyframes fadeOut {
  1048. 0% {
  1049. opacity: 1;
  1050. }
  1051. 100% {
  1052. opacity: 0;
  1053. }
  1054. }
  1055. .fadeOut {
  1056. -webkit-animation-name: fadeOut;
  1057. animation-name: fadeOut;
  1058. }
  1059. @-webkit-keyframes fadeOutDown {
  1060. 0% {
  1061. opacity: 1;
  1062. -webkit-transform: translateY(0);
  1063. transform: translateY(0);
  1064. }
  1065. 100% {
  1066. opacity: 0;
  1067. -webkit-transform: translateY(20px);
  1068. transform: translateY(20px);
  1069. }
  1070. }
  1071. @keyframes fadeOutDown {
  1072. 0% {
  1073. opacity: 1;
  1074. -webkit-transform: translateY(0);
  1075. -ms-transform: translateY(0);
  1076. transform: translateY(0);
  1077. }
  1078. 100% {
  1079. opacity: 0;
  1080. -webkit-transform: translateY(20px);
  1081. -ms-transform: translateY(20px);
  1082. transform: translateY(20px);
  1083. }
  1084. }
  1085. .fadeOutDown {
  1086. -webkit-animation-name: fadeOutDown;
  1087. animation-name: fadeOutDown;
  1088. }
  1089. @-webkit-keyframes fadeOutDownBig {
  1090. 0% {
  1091. opacity: 1;
  1092. -webkit-transform: translateY(0);
  1093. transform: translateY(0);
  1094. }
  1095. 100% {
  1096. opacity: 0;
  1097. -webkit-transform: translateY(2000px);
  1098. transform: translateY(2000px);
  1099. }
  1100. }
  1101. @keyframes fadeOutDownBig {
  1102. 0% {
  1103. opacity: 1;
  1104. -webkit-transform: translateY(0);
  1105. -ms-transform: translateY(0);
  1106. transform: translateY(0);
  1107. }
  1108. 100% {
  1109. opacity: 0;
  1110. -webkit-transform: translateY(2000px);
  1111. -ms-transform: translateY(2000px);
  1112. transform: translateY(2000px);
  1113. }
  1114. }
  1115. .fadeOutDownBig {
  1116. -webkit-animation-name: fadeOutDownBig;
  1117. animation-name: fadeOutDownBig;
  1118. }
  1119. @-webkit-keyframes fadeOutLeft {
  1120. 0% {
  1121. opacity: 1;
  1122. -webkit-transform: translateX(0);
  1123. transform: translateX(0);
  1124. }
  1125. 100% {
  1126. opacity: 0;
  1127. -webkit-transform: translateX(-20px);
  1128. transform: translateX(-20px);
  1129. }
  1130. }
  1131. @keyframes fadeOutLeft {
  1132. 0% {
  1133. opacity: 1;
  1134. -webkit-transform: translateX(0);
  1135. -ms-transform: translateX(0);
  1136. transform: translateX(0);
  1137. }
  1138. 100% {
  1139. opacity: 0;
  1140. -webkit-transform: translateX(-20px);
  1141. -ms-transform: translateX(-20px);
  1142. transform: translateX(-20px);
  1143. }
  1144. }
  1145. .fadeOutLeft {
  1146. -webkit-animation-name: fadeOutLeft;
  1147. animation-name: fadeOutLeft;
  1148. }
  1149. @-webkit-keyframes fadeOutLeftBig {
  1150. 0% {
  1151. opacity: 1;
  1152. -webkit-transform: translateX(0);
  1153. transform: translateX(0);
  1154. }
  1155. 100% {
  1156. opacity: 0;
  1157. -webkit-transform: translateX(-2000px);
  1158. transform: translateX(-2000px);
  1159. }
  1160. }
  1161. @keyframes fadeOutLeftBig {
  1162. 0% {
  1163. opacity: 1;
  1164. -webkit-transform: translateX(0);
  1165. -ms-transform: translateX(0);
  1166. transform: translateX(0);
  1167. }
  1168. 100% {
  1169. opacity: 0;
  1170. -webkit-transform: translateX(-2000px);
  1171. -ms-transform: translateX(-2000px);
  1172. transform: translateX(-2000px);
  1173. }
  1174. }
  1175. .fadeOutLeftBig {
  1176. -webkit-animation-name: fadeOutLeftBig;
  1177. animation-name: fadeOutLeftBig;
  1178. }
  1179. @-webkit-keyframes fadeOutRight {
  1180. 0% {
  1181. opacity: 1;
  1182. -webkit-transform: translateX(0);
  1183. transform: translateX(0);
  1184. }
  1185. 100% {
  1186. opacity: 0;
  1187. -webkit-transform: translateX(20px);
  1188. transform: translateX(20px);
  1189. }
  1190. }
  1191. @keyframes fadeOutRight {
  1192. 0% {
  1193. opacity: 1;
  1194. -webkit-transform: translateX(0);
  1195. -ms-transform: translateX(0);
  1196. transform: translateX(0);
  1197. }
  1198. 100% {
  1199. opacity: 0;
  1200. -webkit-transform: translateX(20px);
  1201. -ms-transform: translateX(20px);
  1202. transform: translateX(20px);
  1203. }
  1204. }
  1205. .fadeOutRight {
  1206. -webkit-animation-name: fadeOutRight;
  1207. animation-name: fadeOutRight;
  1208. }
  1209. @-webkit-keyframes fadeOutRightBig {
  1210. 0% {
  1211. opacity: 1;
  1212. -webkit-transform: translateX(0);
  1213. transform: translateX(0);
  1214. }
  1215. 100% {
  1216. opacity: 0;
  1217. -webkit-transform: translateX(2000px);
  1218. transform: translateX(2000px);
  1219. }
  1220. }
  1221. @keyframes fadeOutRightBig {
  1222. 0% {
  1223. opacity: 1;
  1224. -webkit-transform: translateX(0);
  1225. -ms-transform: translateX(0);
  1226. transform: translateX(0);
  1227. }
  1228. 100% {
  1229. opacity: 0;
  1230. -webkit-transform: translateX(2000px);
  1231. -ms-transform: translateX(2000px);
  1232. transform: translateX(2000px);
  1233. }
  1234. }
  1235. .fadeOutRightBig {
  1236. -webkit-animation-name: fadeOutRightBig;
  1237. animation-name: fadeOutRightBig;
  1238. }
  1239. @-webkit-keyframes fadeOutUp {
  1240. 0% {
  1241. opacity: 1;
  1242. -webkit-transform: translateY(0);
  1243. transform: translateY(0);
  1244. }
  1245. 100% {
  1246. opacity: 0;
  1247. -webkit-transform: translateY(-20px);
  1248. transform: translateY(-20px);
  1249. }
  1250. }
  1251. @keyframes fadeOutUp {
  1252. 0% {
  1253. opacity: 1;
  1254. -webkit-transform: translateY(0);
  1255. -ms-transform: translateY(0);
  1256. transform: translateY(0);
  1257. }
  1258. 100% {
  1259. opacity: 0;
  1260. -webkit-transform: translateY(-20px);
  1261. -ms-transform: translateY(-20px);
  1262. transform: translateY(-20px);
  1263. }
  1264. }
  1265. .fadeOutUp {
  1266. -webkit-animation-name: fadeOutUp;
  1267. animation-name: fadeOutUp;
  1268. }
  1269. @-webkit-keyframes fadeOutUpBig {
  1270. 0% {
  1271. opacity: 1;
  1272. -webkit-transform: translateY(0);
  1273. transform: translateY(0);
  1274. }
  1275. 100% {
  1276. opacity: 0;
  1277. -webkit-transform: translateY(-2000px);
  1278. transform: translateY(-2000px);
  1279. }
  1280. }
  1281. @keyframes fadeOutUpBig {
  1282. 0% {
  1283. opacity: 1;
  1284. -webkit-transform: translateY(0);
  1285. -ms-transform: translateY(0);
  1286. transform: translateY(0);
  1287. }
  1288. 100% {
  1289. opacity: 0;
  1290. -webkit-transform: translateY(-2000px);
  1291. -ms-transform: translateY(-2000px);
  1292. transform: translateY(-2000px);
  1293. }
  1294. }
  1295. .fadeOutUpBig {
  1296. -webkit-animation-name: fadeOutUpBig;
  1297. animation-name: fadeOutUpBig;
  1298. }
  1299. @-webkit-keyframes flip {
  1300. 0% {
  1301. -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
  1302. transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
  1303. -webkit-animation-timing-function: ease-out;
  1304. animation-timing-function: ease-out;
  1305. }
  1306. 40% {
  1307. -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
  1308. transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
  1309. -webkit-animation-timing-function: ease-out;
  1310. animation-timing-function: ease-out;
  1311. }
  1312. 50% {
  1313. -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
  1314. transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
  1315. -webkit-animation-timing-function: ease-in;
  1316. animation-timing-function: ease-in;
  1317. }
  1318. 80% {
  1319. -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
  1320. transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
  1321. -webkit-animation-timing-function: ease-in;
  1322. animation-timing-function: ease-in;
  1323. }
  1324. 100% {
  1325. -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
  1326. transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
  1327. -webkit-animation-timing-function: ease-in;
  1328. animation-timing-function: ease-in;
  1329. }
  1330. }
  1331. @keyframes flip {
  1332. 0% {
  1333. -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
  1334. -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
  1335. transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
  1336. -webkit-animation-timing-function: ease-out;
  1337. animation-timing-function: ease-out;
  1338. }
  1339. 40% {
  1340. -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
  1341. -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
  1342. transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
  1343. -webkit-animation-timing-function: ease-out;
  1344. animation-timing-function: ease-out;
  1345. }
  1346. 50% {
  1347. -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
  1348. -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
  1349. transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
  1350. -webkit-animation-timing-function: ease-in;
  1351. animation-timing-function: ease-in;
  1352. }
  1353. 80% {
  1354. -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
  1355. -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
  1356. transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
  1357. -webkit-animation-timing-function: ease-in;
  1358. animation-timing-function: ease-in;
  1359. }
  1360. 100% {
  1361. -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
  1362. -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
  1363. transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
  1364. -webkit-animation-timing-function: ease-in;
  1365. animation-timing-function: ease-in;
  1366. }
  1367. }
  1368. .animated.flip {
  1369. -webkit-backface-visibility: visible;
  1370. -ms-backface-visibility: visible;
  1371. backface-visibility: visible;
  1372. -webkit-animation-name: flip;
  1373. animation-name: flip;
  1374. }
  1375. @-webkit-keyframes flipInX {
  1376. 0% {
  1377. -webkit-transform: perspective(400px) rotateX(90deg);
  1378. transform: perspective(400px) rotateX(90deg);
  1379. opacity: 0;
  1380. }
  1381. 40% {
  1382. -webkit-transform: perspective(400px) rotateX(-10deg);
  1383. transform: perspective(400px) rotateX(-10deg);
  1384. }
  1385. 70% {
  1386. -webkit-transform: perspective(400px) rotateX(10deg);
  1387. transform: perspective(400px) rotateX(10deg);
  1388. }
  1389. 100% {
  1390. -webkit-transform: perspective(400px) rotateX(0deg);
  1391. transform: perspective(400px) rotateX(0deg);
  1392. opacity: 1;
  1393. }
  1394. }
  1395. @keyframes flipInX {
  1396. 0% {
  1397. -webkit-transform: perspective(400px) rotateX(90deg);
  1398. -ms-transform: perspective(400px) rotateX(90deg);
  1399. transform: perspective(400px) rotateX(90deg);
  1400. opacity: 0;
  1401. }
  1402. 40% {
  1403. -webkit-transform: perspective(400px) rotateX(-10deg);
  1404. -ms-transform: perspective(400px) rotateX(-10deg);
  1405. transform: perspective(400px) rotateX(-10deg);
  1406. }
  1407. 70% {
  1408. -webkit-transform: perspective(400px) rotateX(10deg);
  1409. -ms-transform: perspective(400px) rotateX(10deg);
  1410. transform: perspective(400px) rotateX(10deg);
  1411. }
  1412. 100% {
  1413. -webkit-transform: perspective(400px) rotateX(0deg);
  1414. -ms-transform: perspective(400px) rotateX(0deg);
  1415. transform: perspective(400px) rotateX(0deg);
  1416. opacity: 1;
  1417. }
  1418. }
  1419. .flipInX {
  1420. -webkit-backface-visibility: visible !important;
  1421. -ms-backface-visibility: visible !important;
  1422. backface-visibility: visible !important;
  1423. -webkit-animation-name: flipInX;
  1424. animation-name: flipInX;
  1425. }
  1426. @-webkit-keyframes flipInY {
  1427. 0% {
  1428. -webkit-transform: perspective(400px) rotateY(90deg);
  1429. transform: perspective(400px) rotateY(90deg);
  1430. opacity: 0;
  1431. }
  1432. 40% {
  1433. -webkit-transform: perspective(400px) rotateY(-10deg);
  1434. transform: perspective(400px) rotateY(-10deg);
  1435. }
  1436. 70% {
  1437. -webkit-transform: perspective(400px) rotateY(10deg);
  1438. transform: perspective(400px) rotateY(10deg);
  1439. }
  1440. 100% {
  1441. -webkit-transform: perspective(400px) rotateY(0deg);
  1442. transform: perspective(400px) rotateY(0deg);
  1443. opacity: 1;
  1444. }
  1445. }
  1446. @keyframes flipInY {
  1447. 0% {
  1448. -webkit-transform: perspective(400px) rotateY(90deg);
  1449. -ms-transform: perspective(400px) rotateY(90deg);
  1450. transform: perspective(400px) rotateY(90deg);
  1451. opacity: 0;
  1452. }
  1453. 40% {
  1454. -webkit-transform: perspective(400px) rotateY(-10deg);
  1455. -ms-transform: perspective(400px) rotateY(-10deg);
  1456. transform: perspective(400px) rotateY(-10deg);
  1457. }
  1458. 70% {
  1459. -webkit-transform: perspective(400px) rotateY(10deg);
  1460. -ms-transform: perspective(400px) rotateY(10deg);
  1461. transform: perspective(400px) rotateY(10deg);
  1462. }
  1463. 100% {
  1464. -webkit-transform: perspective(400px) rotateY(0deg);
  1465. -ms-transform: perspective(400px) rotateY(0deg);
  1466. transform: perspective(400px) rotateY(0deg);
  1467. opacity: 1;
  1468. }
  1469. }
  1470. .flipInY {
  1471. -webkit-backface-visibility: visible !important;
  1472. -ms-backface-visibility: visible !important;
  1473. backface-visibility: visible !important;
  1474. -webkit-animation-name: flipInY;
  1475. animation-name: flipInY;
  1476. }
  1477. @-webkit-keyframes flipOutX {
  1478. 0% {
  1479. -webkit-transform: perspective(400px) rotateX(0deg);
  1480. transform: perspective(400px) rotateX(0deg);
  1481. opacity: 1;
  1482. }
  1483. 100% {
  1484. -webkit-transform: perspective(400px) rotateX(90deg);
  1485. transform: perspective(400px) rotateX(90deg);
  1486. opacity: 0;
  1487. }
  1488. }
  1489. @keyframes flipOutX {
  1490. 0% {
  1491. -webkit-transform: perspective(400px) rotateX(0deg);
  1492. -ms-transform: perspective(400px) rotateX(0deg);
  1493. transform: perspective(400px) rotateX(0deg);
  1494. opacity: 1;
  1495. }
  1496. 100% {
  1497. -webkit-transform: perspective(400px) rotateX(90deg);
  1498. -ms-transform: perspective(400px) rotateX(90deg);
  1499. transform: perspective(400px) rotateX(90deg);
  1500. opacity: 0;
  1501. }
  1502. }
  1503. .flipOutX {
  1504. -webkit-animation-name: flipOutX;
  1505. animation-name: flipOutX;
  1506. -webkit-backface-visibility: visible !important;
  1507. -ms-backface-visibility: visible !important;
  1508. backface-visibility: visible !important;
  1509. }
  1510. @-webkit-keyframes flipOutY {
  1511. 0% {
  1512. -webkit-transform: perspective(400px) rotateY(0deg);
  1513. transform: perspective(400px) rotateY(0deg);
  1514. opacity: 1;
  1515. }
  1516. 100% {
  1517. -webkit-transform: perspective(400px) rotateY(90deg);
  1518. transform: perspective(400px) rotateY(90deg);
  1519. opacity: 0;
  1520. }
  1521. }
  1522. @keyframes flipOutY {
  1523. 0% {
  1524. -webkit-transform: perspective(400px) rotateY(0deg);
  1525. -ms-transform: perspective(400px) rotateY(0deg);
  1526. transform: perspective(400px) rotateY(0deg);
  1527. opacity: 1;
  1528. }
  1529. 100% {
  1530. -webkit-transform: perspective(400px) rotateY(90deg);
  1531. -ms-transform: perspective(400px) rotateY(90deg);
  1532. transform: perspective(400px) rotateY(90deg);
  1533. opacity: 0;
  1534. }
  1535. }
  1536. .flipOutY {
  1537. -webkit-backface-visibility: visible !important;
  1538. -ms-backface-visibility: visible !important;
  1539. backface-visibility: visible !important;
  1540. -webkit-animation-name: flipOutY;
  1541. animation-name: flipOutY;
  1542. }
  1543. @-webkit-keyframes lightSpeedIn {
  1544. 0% {
  1545. -webkit-transform: translateX(100%) skewX(-30deg);
  1546. transform: translateX(100%) skewX(-30deg);
  1547. opacity: 0;
  1548. }
  1549. 60% {
  1550. -webkit-transform: translateX(-20%) skewX(30deg);
  1551. transform: translateX(-20%) skewX(30deg);
  1552. opacity: 1;
  1553. }
  1554. 80% {
  1555. -webkit-transform: translateX(0%) skewX(-15deg);
  1556. transform: translateX(0%) skewX(-15deg);
  1557. opacity: 1;
  1558. }
  1559. 100% {
  1560. -webkit-transform: translateX(0%) skewX(0deg);
  1561. transform: translateX(0%) skewX(0deg);
  1562. opacity: 1;
  1563. }
  1564. }
  1565. @keyframes lightSpeedIn {
  1566. 0% {
  1567. -webkit-transform: translateX(100%) skewX(-30deg);
  1568. -ms-transform: translateX(100%) skewX(-30deg);
  1569. transform: translateX(100%) skewX(-30deg);
  1570. opacity: 0;
  1571. }
  1572. 60% {
  1573. -webkit-transform: translateX(-20%) skewX(30deg);
  1574. -ms-transform: translateX(-20%) skewX(30deg);
  1575. transform: translateX(-20%) skewX(30deg);
  1576. opacity: 1;
  1577. }
  1578. 80% {
  1579. -webkit-transform: translateX(0%) skewX(-15deg);
  1580. -ms-transform: translateX(0%) skewX(-15deg);
  1581. transform: translateX(0%) skewX(-15deg);
  1582. opacity: 1;
  1583. }
  1584. 100% {
  1585. -webkit-transform: translateX(0%) skewX(0deg);
  1586. -ms-transform: translateX(0%) skewX(0deg);
  1587. transform: translateX(0%) skewX(0deg);
  1588. opacity: 1;
  1589. }
  1590. }
  1591. .lightSpeedIn {
  1592. -webkit-animation-name: lightSpeedIn;
  1593. animation-name: lightSpeedIn;
  1594. -webkit-animation-timing-function: ease-out;
  1595. animation-timing-function: ease-out;
  1596. }
  1597. @-webkit-keyframes lightSpeedOut {
  1598. 0% {
  1599. -webkit-transform: translateX(0%) skewX(0deg);
  1600. transform: translateX(0%) skewX(0deg);
  1601. opacity: 1;
  1602. }
  1603. 100% {
  1604. -webkit-transform: translateX(100%) skewX(-30deg);
  1605. transform: translateX(100%) skewX(-30deg);
  1606. opacity: 0;
  1607. }
  1608. }
  1609. @keyframes lightSpeedOut {
  1610. 0% {
  1611. -webkit-transform: translateX(0%) skewX(0deg);
  1612. -ms-transform: translateX(0%) skewX(0deg);
  1613. transform: translateX(0%) skewX(0deg);
  1614. opacity: 1;
  1615. }
  1616. 100% {
  1617. -webkit-transform: translateX(100%) skewX(-30deg);
  1618. -ms-transform: translateX(100%) skewX(-30deg);
  1619. transform: translateX(100%) skewX(-30deg);
  1620. opacity: 0;
  1621. }
  1622. }
  1623. .lightSpeedOut {
  1624. -webkit-animation-name: lightSpeedOut;
  1625. animation-name: lightSpeedOut;
  1626. -webkit-animation-timing-function: ease-in;
  1627. animation-timing-function: ease-in;
  1628. }
  1629. @-webkit-keyframes rotateIn {
  1630. 0% {
  1631. -webkit-transform-origin: center center;
  1632. transform-origin: center center;
  1633. -webkit-transform: rotate(-200deg);
  1634. transform: rotate(-200deg);
  1635. opacity: 0;
  1636. }
  1637. 100% {
  1638. -webkit-transform-origin: center center;
  1639. transform-origin: center center;
  1640. -webkit-transform: rotate(0);
  1641. transform: rotate(0);
  1642. opacity: 1;
  1643. }
  1644. }
  1645. @keyframes rotateIn {
  1646. 0% {
  1647. -webkit-transform-origin: center center;
  1648. -ms-transform-origin: center center;
  1649. transform-origin: center center;
  1650. -webkit-transform: rotate(-200deg);
  1651. -ms-transform: rotate(-200deg);
  1652. transform: rotate(-200deg);
  1653. opacity: 0;
  1654. }
  1655. 100% {
  1656. -webkit-transform-origin: center center;
  1657. -ms-transform-origin: center center;
  1658. transform-origin: center center;
  1659. -webkit-transform: rotate(0);
  1660. -ms-transform: rotate(0);
  1661. transform: rotate(0);
  1662. opacity: 1;
  1663. }
  1664. }
  1665. .rotateIn {
  1666. -webkit-animation-name: rotateIn;
  1667. animation-name: rotateIn;
  1668. }
  1669. @-webkit-keyframes rotateInDownLeft {
  1670. 0% {
  1671. -webkit-transform-origin: left bottom;
  1672. transform-origin: left bottom;
  1673. -webkit-transform: rotate(-90deg);
  1674. transform: rotate(-90deg);
  1675. opacity: 0;
  1676. }
  1677. 100% {
  1678. -webkit-transform-origin: left bottom;
  1679. transform-origin: left bottom;
  1680. -webkit-transform: rotate(0);
  1681. transform: rotate(0);
  1682. opacity: 1;
  1683. }
  1684. }
  1685. @keyframes rotateInDownLeft {
  1686. 0% {
  1687. -webkit-transform-origin: left bottom;
  1688. -ms-transform-origin: left bottom;
  1689. transform-origin: left bottom;
  1690. -webkit-transform: rotate(-90deg);
  1691. -ms-transform: rotate(-90deg);
  1692. transform: rotate(-90deg);
  1693. opacity: 0;
  1694. }
  1695. 100% {
  1696. -webkit-transform-origin: left bottom;
  1697. -ms-transform-origin: left bottom;
  1698. transform-origin: left bottom;
  1699. -webkit-transform: rotate(0);
  1700. -ms-transform: rotate(0);
  1701. transform: rotate(0);
  1702. opacity: 1;
  1703. }
  1704. }
  1705. .rotateInDownLeft {
  1706. -webkit-animation-name: rotateInDownLeft;
  1707. animation-name: rotateInDownLeft;
  1708. }
  1709. @-webkit-keyframes rotateInDownRight {
  1710. 0% {
  1711. -webkit-transform-origin: right bottom;
  1712. transform-origin: right bottom;
  1713. -webkit-transform: rotate(90deg);
  1714. transform: rotate(90deg);
  1715. opacity: 0;
  1716. }
  1717. 100% {
  1718. -webkit-transform-origin: right bottom;
  1719. transform-origin: right bottom;
  1720. -webkit-transform: rotate(0);
  1721. transform: rotate(0);
  1722. opacity: 1;
  1723. }
  1724. }
  1725. @keyframes rotateInDownRight {
  1726. 0% {
  1727. -webkit-transform-origin: right bottom;
  1728. -ms-transform-origin: right bottom;
  1729. transform-origin: right bottom;
  1730. -webkit-transform: rotate(90deg);
  1731. -ms-transform: rotate(90deg);
  1732. transform: rotate(90deg);
  1733. opacity: 0;
  1734. }
  1735. 100% {
  1736. -webkit-transform-origin: right bottom;
  1737. -ms-transform-origin: right bottom;
  1738. transform-origin: right bottom;
  1739. -webkit-transform: rotate(0);
  1740. -ms-transform: rotate(0);
  1741. transform: rotate(0);
  1742. opacity: 1;
  1743. }
  1744. }
  1745. .rotateInDownRight {
  1746. -webkit-animation-name: rotateInDownRight;
  1747. animation-name: rotateInDownRight;
  1748. }
  1749. @-webkit-keyframes rotateInUpLeft {
  1750. 0% {
  1751. -webkit-transform-origin: left bottom;
  1752. transform-origin: left bottom;
  1753. -webkit-transform: rotate(90deg);
  1754. transform: rotate(90deg);
  1755. opacity: 0;
  1756. }
  1757. 100% {
  1758. -webkit-transform-origin: left bottom;
  1759. transform-origin: left bottom;
  1760. -webkit-transform: rotate(0);
  1761. transform: rotate(0);
  1762. opacity: 1;
  1763. }
  1764. }
  1765. @keyframes rotateInUpLeft {
  1766. 0% {
  1767. -webkit-transform-origin: left bottom;
  1768. -ms-transform-origin: left bottom;
  1769. transform-origin: left bottom;
  1770. -webkit-transform: rotate(90deg);
  1771. -ms-transform: rotate(90deg);
  1772. transform: rotate(90deg);
  1773. opacity: 0;
  1774. }
  1775. 100% {
  1776. -webkit-transform-origin: left bottom;
  1777. -ms-transform-origin: left bottom;
  1778. transform-origin: left bottom;
  1779. -webkit-transform: rotate(0);
  1780. -ms-transform: rotate(0);
  1781. transform: rotate(0);
  1782. opacity: 1;
  1783. }
  1784. }
  1785. .rotateInUpLeft {
  1786. -webkit-animation-name: rotateInUpLeft;
  1787. animation-name: rotateInUpLeft;
  1788. }
  1789. @-webkit-keyframes rotateInUpRight {
  1790. 0% {
  1791. -webkit-transform-origin: right bottom;
  1792. transform-origin: right bottom;
  1793. -webkit-transform: rotate(-90deg);
  1794. transform: rotate(-90deg);
  1795. opacity: 0;
  1796. }
  1797. 100% {
  1798. -webkit-transform-origin: right bottom;
  1799. transform-origin: right bottom;
  1800. -webkit-transform: rotate(0);
  1801. transform: rotate(0);
  1802. opacity: 1;
  1803. }
  1804. }
  1805. @keyframes rotateInUpRight {
  1806. 0% {
  1807. -webkit-transform-origin: right bottom;
  1808. -ms-transform-origin: right bottom;
  1809. transform-origin: right bottom;
  1810. -webkit-transform: rotate(-90deg);
  1811. -ms-transform: rotate(-90deg);
  1812. transform: rotate(-90deg);
  1813. opacity: 0;
  1814. }
  1815. 100% {
  1816. -webkit-transform-origin: right bottom;
  1817. -ms-transform-origin: right bottom;
  1818. transform-origin: right bottom;
  1819. -webkit-transform: rotate(0);
  1820. -ms-transform: rotate(0);
  1821. transform: rotate(0);
  1822. opacity: 1;
  1823. }
  1824. }
  1825. .rotateInUpRight {
  1826. -webkit-animation-name: rotateInUpRight;
  1827. animation-name: rotateInUpRight;
  1828. }
  1829. @-webkit-keyframes rotateOut {
  1830. 0% {
  1831. -webkit-transform-origin: center center;
  1832. transform-origin: center center;
  1833. -webkit-transform: rotate(0);
  1834. transform: rotate(0);
  1835. opacity: 1;
  1836. }
  1837. 100% {
  1838. -webkit-transform-origin: center center;
  1839. transform-origin: center center;
  1840. -webkit-transform: rotate(200deg);
  1841. transform: rotate(200deg);
  1842. opacity: 0;
  1843. }
  1844. }
  1845. @keyframes rotateOut {
  1846. 0% {
  1847. -webkit-transform-origin: center center;
  1848. -ms-transform-origin: center center;
  1849. transform-origin: center center;
  1850. -webkit-transform: rotate(0);
  1851. -ms-transform: rotate(0);
  1852. transform: rotate(0);
  1853. opacity: 1;
  1854. }
  1855. 100% {
  1856. -webkit-transform-origin: center center;
  1857. -ms-transform-origin: center center;
  1858. transform-origin: center center;
  1859. -webkit-transform: rotate(200deg);
  1860. -ms-transform: rotate(200deg);
  1861. transform: rotate(200deg);
  1862. opacity: 0;
  1863. }
  1864. }
  1865. .rotateOut {
  1866. -webkit-animation-name: rotateOut;
  1867. animation-name: rotateOut;
  1868. }
  1869. @-webkit-keyframes rotateOutDownLeft {
  1870. 0% {
  1871. -webkit-transform-origin: left bottom;
  1872. transform-origin: left bottom;
  1873. -webkit-transform: rotate(0);
  1874. transform: rotate(0);
  1875. opacity: 1;
  1876. }
  1877. 100% {
  1878. -webkit-transform-origin: left bottom;
  1879. transform-origin: left bottom;
  1880. -webkit-transform: rotate(90deg);
  1881. transform: rotate(90deg);
  1882. opacity: 0;
  1883. }
  1884. }
  1885. @keyframes rotateOutDownLeft {
  1886. 0% {
  1887. -webkit-transform-origin: left bottom;
  1888. -ms-transform-origin: left bottom;
  1889. transform-origin: left bottom;
  1890. -webkit-transform: rotate(0);
  1891. -ms-transform: rotate(0);
  1892. transform: rotate(0);
  1893. opacity: 1;
  1894. }
  1895. 100% {
  1896. -webkit-transform-origin: left bottom;
  1897. -ms-transform-origin: left bottom;
  1898. transform-origin: left bottom;
  1899. -webkit-transform: rotate(90deg);
  1900. -ms-transform: rotate(90deg);
  1901. transform: rotate(90deg);
  1902. opacity: 0;
  1903. }
  1904. }
  1905. .rotateOutDownLeft {
  1906. -webkit-animation-name: rotateOutDownLeft;
  1907. animation-name: rotateOutDownLeft;
  1908. }
  1909. @-webkit-keyframes rotateOutDownRight {
  1910. 0% {
  1911. -webkit-transform-origin: right bottom;
  1912. transform-origin: right bottom;
  1913. -webkit-transform: rotate(0);
  1914. transform: rotate(0);
  1915. opacity: 1;
  1916. }
  1917. 100% {
  1918. -webkit-transform-origin: right bottom;
  1919. transform-origin: right bottom;
  1920. -webkit-transform: rotate(-90deg);
  1921. transform: rotate(-90deg);
  1922. opacity: 0;
  1923. }
  1924. }
  1925. @keyframes rotateOutDownRight {
  1926. 0% {
  1927. -webkit-transform-origin: right bottom;
  1928. -ms-transform-origin: right bottom;
  1929. transform-origin: right bottom;
  1930. -webkit-transform: rotate(0);
  1931. -ms-transform: rotate(0);
  1932. transform: rotate(0);
  1933. opacity: 1;
  1934. }
  1935. 100% {
  1936. -webkit-transform-origin: right bottom;
  1937. -ms-transform-origin: right bottom;
  1938. transform-origin: right bottom;
  1939. -webkit-transform: rotate(-90deg);
  1940. -ms-transform: rotate(-90deg);
  1941. transform: rotate(-90deg);
  1942. opacity: 0;
  1943. }
  1944. }
  1945. .rotateOutDownRight {
  1946. -webkit-animation-name: rotateOutDownRight;
  1947. animation-name: rotateOutDownRight;
  1948. }
  1949. @-webkit-keyframes rotateOutUpLeft {
  1950. 0% {
  1951. -webkit-transform-origin: left bottom;
  1952. transform-origin: left bottom;
  1953. -webkit-transform: rotate(0);
  1954. transform: rotate(0);
  1955. opacity: 1;
  1956. }
  1957. 100% {
  1958. -webkit-transform-origin: left bottom;
  1959. transform-origin: left bottom;
  1960. -webkit-transform: rotate(-90deg);
  1961. transform: rotate(-90deg);
  1962. opacity: 0;
  1963. }
  1964. }
  1965. @keyframes rotateOutUpLeft {
  1966. 0% {
  1967. -webkit-transform-origin: left bottom;
  1968. -ms-transform-origin: left bottom;
  1969. transform-origin: left bottom;
  1970. -webkit-transform: rotate(0);
  1971. -ms-transform: rotate(0);
  1972. transform: rotate(0);
  1973. opacity: 1;
  1974. }
  1975. 100% {
  1976. -webkit-transform-origin: left bottom;
  1977. -ms-transform-origin: left bottom;
  1978. transform-origin: left bottom;
  1979. -webkit-transform: rotate(-90deg);
  1980. -ms-transform: rotate(-90deg);
  1981. transform: rotate(-90deg);
  1982. opacity: 0;
  1983. }
  1984. }
  1985. .rotateOutUpLeft {
  1986. -webkit-animation-name: rotateOutUpLeft;
  1987. animation-name: rotateOutUpLeft;
  1988. }
  1989. @-webkit-keyframes rotateOutUpRight {
  1990. 0% {
  1991. -webkit-transform-origin: right bottom;
  1992. transform-origin: right bottom;
  1993. -webkit-transform: rotate(0);
  1994. transform: rotate(0);
  1995. opacity: 1;
  1996. }
  1997. 100% {
  1998. -webkit-transform-origin: right bottom;
  1999. transform-origin: right bottom;
  2000. -webkit-transform: rotate(90deg);
  2001. transform: rotate(90deg);
  2002. opacity: 0;
  2003. }
  2004. }
  2005. @keyframes rotateOutUpRight {
  2006. 0% {
  2007. -webkit-transform-origin: right bottom;
  2008. -ms-transform-origin: right bottom;
  2009. transform-origin: right bottom;
  2010. -webkit-transform: rotate(0);
  2011. -ms-transform: rotate(0);
  2012. transform: rotate(0);
  2013. opacity: 1;
  2014. }
  2015. 100% {
  2016. -webkit-transform-origin: right bottom;
  2017. -ms-transform-origin: right bottom;
  2018. transform-origin: right bottom;
  2019. -webkit-transform: rotate(90deg);
  2020. -ms-transform: rotate(90deg);
  2021. transform: rotate(90deg);
  2022. opacity: 0;
  2023. }
  2024. }
  2025. .rotateOutUpRight {
  2026. -webkit-animation-name: rotateOutUpRight;
  2027. animation-name: rotateOutUpRight;
  2028. }
  2029. @-webkit-keyframes slideInDown {
  2030. 0% {
  2031. opacity: 0;
  2032. -webkit-transform: translateY(-2000px);
  2033. transform: translateY(-2000px);
  2034. }
  2035. 100% {
  2036. -webkit-transform: translateY(0);
  2037. transform: translateY(0);
  2038. }
  2039. }
  2040. @keyframes slideInDown {
  2041. 0% {
  2042. opacity: 0;
  2043. -webkit-transform: translateY(-2000px);
  2044. -ms-transform: translateY(-2000px);
  2045. transform: translateY(-2000px);
  2046. }
  2047. 100% {
  2048. -webkit-transform: translateY(0);
  2049. -ms-transform: translateY(0);
  2050. transform: translateY(0);
  2051. }
  2052. }
  2053. .slideInDown {
  2054. -webkit-animation-name: slideInDown;
  2055. animation-name: slideInDown;
  2056. }
  2057. @-webkit-keyframes slideInLeft {
  2058. 0% {
  2059. opacity: 0;
  2060. -webkit-transform: translateX(-2000px);
  2061. transform: translateX(-2000px);
  2062. }
  2063. 100% {
  2064. -webkit-transform: translateX(0);
  2065. transform: translateX(0);
  2066. }
  2067. }
  2068. @keyframes slideInLeft {
  2069. 0% {
  2070. opacity: 0;
  2071. -webkit-transform: translateX(-2000px);
  2072. -ms-transform: translateX(-2000px);
  2073. transform: translateX(-2000px);
  2074. }
  2075. 100% {
  2076. -webkit-transform: translateX(0);
  2077. -ms-transform: translateX(0);
  2078. transform: translateX(0);
  2079. }
  2080. }
  2081. .slideInLeft {
  2082. -webkit-animation-name: slideInLeft;
  2083. animation-name: slideInLeft;
  2084. }
  2085. @-webkit-keyframes slideInRight {
  2086. 0% {
  2087. opacity: 0;
  2088. -webkit-transform: translateX(2000px);
  2089. transform: translateX(2000px);
  2090. }
  2091. 100% {
  2092. -webkit-transform: translateX(0);
  2093. transform: translateX(0);
  2094. }
  2095. }
  2096. @keyframes slideInRight {
  2097. 0% {
  2098. opacity: 0;
  2099. -webkit-transform: translateX(2000px);
  2100. -ms-transform: translateX(2000px);
  2101. transform: translateX(2000px);
  2102. }
  2103. 100% {
  2104. -webkit-transform: translateX(0);
  2105. -ms-transform: translateX(0);
  2106. transform: translateX(0);
  2107. }
  2108. }
  2109. .slideInRight {
  2110. -webkit-animation-name: slideInRight;
  2111. animation-name: slideInRight;
  2112. }
  2113. @-webkit-keyframes slideOutLeft {
  2114. 0% {
  2115. -webkit-transform: translateX(0);
  2116. transform: translateX(0);
  2117. }
  2118. 100% {
  2119. opacity: 0;
  2120. -webkit-transform: translateX(-2000px);
  2121. transform: translateX(-2000px);
  2122. }
  2123. }
  2124. @keyframes slideOutLeft {
  2125. 0% {
  2126. -webkit-transform: translateX(0);
  2127. -ms-transform: translateX(0);
  2128. transform: translateX(0);
  2129. }
  2130. 100% {
  2131. opacity: 0;
  2132. -webkit-transform: translateX(-2000px);
  2133. -ms-transform: translateX(-2000px);
  2134. transform: translateX(-2000px);
  2135. }
  2136. }
  2137. .slideOutLeft {
  2138. -webkit-animation-name: slideOutLeft;
  2139. animation-name: slideOutLeft;
  2140. }
  2141. @-webkit-keyframes slideOutRight {
  2142. 0% {
  2143. -webkit-transform: translateX(0);
  2144. transform: translateX(0);
  2145. }
  2146. 100% {
  2147. opacity: 0;
  2148. -webkit-transform: translateX(2000px);
  2149. transform: translateX(2000px);
  2150. }
  2151. }
  2152. @keyframes slideOutRight {
  2153. 0% {
  2154. -webkit-transform: translateX(0);
  2155. -ms-transform: translateX(0);
  2156. transform: translateX(0);
  2157. }
  2158. 100% {
  2159. opacity: 0;
  2160. -webkit-transform: translateX(2000px);
  2161. -ms-transform: translateX(2000px);
  2162. transform: translateX(2000px);
  2163. }
  2164. }
  2165. .slideOutRight {
  2166. -webkit-animation-name: slideOutRight;
  2167. animation-name: slideOutRight;
  2168. }
  2169. @-webkit-keyframes slideOutUp {
  2170. 0% {
  2171. -webkit-transform: translateY(0);
  2172. transform: translateY(0);
  2173. }
  2174. 100% {
  2175. opacity: 0;
  2176. -webkit-transform: translateY(-2000px);
  2177. transform: translateY(-2000px);
  2178. }
  2179. }
  2180. @keyframes slideOutUp {
  2181. 0% {
  2182. -webkit-transform: translateY(0);
  2183. -ms-transform: translateY(0);
  2184. transform: translateY(0);
  2185. }
  2186. 100% {
  2187. opacity: 0;
  2188. -webkit-transform: translateY(-2000px);
  2189. -ms-transform: translateY(-2000px);
  2190. transform: translateY(-2000px);
  2191. }
  2192. }
  2193. .slideOutUp {
  2194. -webkit-animation-name: slideOutUp;
  2195. animation-name: slideOutUp;
  2196. }
  2197. @-webkit-keyframes hinge {
  2198. 0% {
  2199. -webkit-transform: rotate(0);
  2200. transform: rotate(0);
  2201. -webkit-transform-origin: top left;
  2202. transform-origin: top left;
  2203. -webkit-animation-timing-function: ease-in-out;
  2204. animation-timing-function: ease-in-out;
  2205. }
  2206. 20%, 60% {
  2207. -webkit-transform: rotate(80deg);
  2208. transform: rotate(80deg);
  2209. -webkit-transform-origin: top left;
  2210. transform-origin: top left;
  2211. -webkit-animation-timing-function: ease-in-out;
  2212. animation-timing-function: ease-in-out;
  2213. }
  2214. 40% {
  2215. -webkit-transform: rotate(60deg);
  2216. transform: rotate(60deg);
  2217. -webkit-transform-origin: top left;
  2218. transform-origin: top left;
  2219. -webkit-animation-timing-function: ease-in-out;
  2220. animation-timing-function: ease-in-out;
  2221. }
  2222. 80% {
  2223. -webkit-transform: rotate(60deg) translateY(0);
  2224. transform: rotate(60deg) translateY(0);
  2225. opacity: 1;
  2226. -webkit-transform-origin: top left;
  2227. transform-origin: top left;
  2228. -webkit-animation-timing-function: ease-in-out;
  2229. animation-timing-function: ease-in-out;
  2230. }
  2231. 100% {
  2232. -webkit-transform: translateY(700px);
  2233. transform: translateY(700px);
  2234. opacity: 0;
  2235. }
  2236. }
  2237. @keyframes hinge {
  2238. 0% {
  2239. -webkit-transform: rotate(0);
  2240. -ms-transform: rotate(0);
  2241. transform: rotate(0);
  2242. -webkit-transform-origin: top left;
  2243. -ms-transform-origin: top left;
  2244. transform-origin: top left;
  2245. -webkit-animation-timing-function: ease-in-out;
  2246. animation-timing-function: ease-in-out;
  2247. }
  2248. 20%, 60% {
  2249. -webkit-transform: rotate(80deg);
  2250. -ms-transform: rotate(80deg);
  2251. transform: rotate(80deg);
  2252. -webkit-transform-origin: top left;
  2253. -ms-transform-origin: top left;
  2254. transform-origin: top left;
  2255. -webkit-animation-timing-function: ease-in-out;
  2256. animation-timing-function: ease-in-out;
  2257. }
  2258. 40% {
  2259. -webkit-transform: rotate(60deg);
  2260. -ms-transform: rotate(60deg);
  2261. transform: rotate(60deg);
  2262. -webkit-transform-origin: top left;
  2263. -ms-transform-origin: top left;
  2264. transform-origin: top left;
  2265. -webkit-animation-timing-function: ease-in-out;
  2266. animation-timing-function: ease-in-out;
  2267. }
  2268. 80% {
  2269. -webkit-transform: rotate(60deg) translateY(0);
  2270. -ms-transform: rotate(60deg) translateY(0);
  2271. transform: rotate(60deg) translateY(0);
  2272. opacity: 1;
  2273. -webkit-transform-origin: top left;
  2274. -ms-transform-origin: top left;
  2275. transform-origin: top left;
  2276. -webkit-animation-timing-function: ease-in-out;
  2277. animation-timing-function: ease-in-out;
  2278. }
  2279. 100% {
  2280. -webkit-transform: translateY(700px);
  2281. -ms-transform: translateY(700px);
  2282. transform: translateY(700px);
  2283. opacity: 0;
  2284. }
  2285. }
  2286. .hinge {
  2287. -webkit-animation-name: hinge;
  2288. animation-name: hinge;
  2289. }
  2290. /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
  2291. @-webkit-keyframes rollIn {
  2292. 0% {
  2293. opacity: 0;
  2294. -webkit-transform: translateX(-100%) rotate(-120deg);
  2295. transform: translateX(-100%) rotate(-120deg);
  2296. }
  2297. 100% {
  2298. opacity: 1;
  2299. -webkit-transform: translateX(0px) rotate(0deg);
  2300. transform: translateX(0px) rotate(0deg);
  2301. }
  2302. }
  2303. @keyframes rollIn {
  2304. 0% {
  2305. opacity: 0;
  2306. -webkit-transform: translateX(-100%) rotate(-120deg);
  2307. -ms-transform: translateX(-100%) rotate(-120deg);
  2308. transform: translateX(-100%) rotate(-120deg);
  2309. }
  2310. 100% {
  2311. opacity: 1;
  2312. -webkit-transform: translateX(0px) rotate(0deg);
  2313. -ms-transform: translateX(0px) rotate(0deg);
  2314. transform: translateX(0px) rotate(0deg);
  2315. }
  2316. }
  2317. .rollIn {
  2318. -webkit-animation-name: rollIn;
  2319. animation-name: rollIn;
  2320. }
  2321. /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
  2322. @-webkit-keyframes rollOut {
  2323. 0% {
  2324. opacity: 1;
  2325. -webkit-transform: translateX(0px) rotate(0deg);
  2326. transform: translateX(0px) rotate(0deg);
  2327. }
  2328. 100% {
  2329. opacity: 0;
  2330. -webkit-transform: translateX(100%) rotate(120deg);
  2331. transform: translateX(100%) rotate(120deg);
  2332. }
  2333. }
  2334. @keyframes rollOut {
  2335. 0% {
  2336. opacity: 1;
  2337. -webkit-transform: translateX(0px) rotate(0deg);
  2338. -ms-transform: translateX(0px) rotate(0deg);
  2339. transform: translateX(0px) rotate(0deg);
  2340. }
  2341. 100% {
  2342. opacity: 0;
  2343. -webkit-transform: translateX(100%) rotate(120deg);
  2344. -ms-transform: translateX(100%) rotate(120deg);
  2345. transform: translateX(100%) rotate(120deg);
  2346. }
  2347. }
  2348. .rollOut {
  2349. -webkit-animation-name: rollOut;
  2350. animation-name: rollOut;
  2351. }