animate.css 67 KB

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