animate-css-rails 3.2.2 → 3.5.1

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