parallaxslider-rails 1.0.0
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 +15 -0
- data/Gemfile +4 -0
- data/LICENSE.txt +22 -0
- data/README.md +1 -0
- data/Rakefile +2 -0
- data/app/assets/images/1.png +0 -0
- data/app/assets/images/2.png +0 -0
- data/app/assets/images/3.png +0 -0
- data/app/assets/images/4.png +0 -0
- data/app/assets/images/ImageAttribution.txt +8 -0
- data/app/assets/images/Thumbs.db +0 -0
- data/app/assets/images/arrows.png +0 -0
- data/app/assets/images/bg.png +0 -0
- data/app/assets/images/waves.gif +0 -0
- data/app/assets/javascripts/jquery.cslider.js +320 -0
- data/app/assets/javascripts/modernizr.custom.28468.js +4 -0
- data/app/assets/stylesheets/demo.css +190 -0
- data/app/assets/stylesheets/fonts/BebasNeue-webfont.eot +0 -0
- data/app/assets/stylesheets/fonts/BebasNeue-webfont.svg +146 -0
- data/app/assets/stylesheets/fonts/BebasNeue-webfont.ttf +0 -0
- data/app/assets/stylesheets/fonts/BebasNeue-webfont.woff +0 -0
- data/app/assets/stylesheets/fonts/Dharma Type Font License.txt +57 -0
- data/app/assets/stylesheets/nojs.css +18 -0
- data/app/assets/stylesheets/style.css +704 -0
- data/app/assets/stylesheets/style2.css +694 -0
- data/lib/parallaxslider-rails/version.rb +5 -0
- data/lib/parallaxslider-rails.rb +8 -0
- data/parallaxslider-rails.gemspec +23 -0
- metadata +99 -0
|
@@ -0,0 +1,694 @@
|
|
|
1
|
+
.da-slider{
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-width: 520px;
|
|
4
|
+
height: 400px;
|
|
5
|
+
position: relative;
|
|
6
|
+
margin: 30px auto;
|
|
7
|
+
overflow: hidden;
|
|
8
|
+
background: transparent url(../images/waves.gif) repeat 0% 0%;
|
|
9
|
+
border-top: 8px solid #efc34a;
|
|
10
|
+
border-bottom: 8px solid #efc34a;
|
|
11
|
+
box-shadow: 0px 1px 1px rgba(0,0,0,0.2), 0px -2px 1px #fff;
|
|
12
|
+
-webkit-transition: background-position 1s ease-out 0.3s;
|
|
13
|
+
-moz-transition: background-position 1s ease-out 0.3s;
|
|
14
|
+
-o-transition: background-position 1s ease-out 0.3s;
|
|
15
|
+
-ms-transition: background-position 1s ease-out 0.3s;
|
|
16
|
+
transition: background-position 1s ease-out 0.3s;
|
|
17
|
+
}
|
|
18
|
+
.da-slide{
|
|
19
|
+
position: absolute;
|
|
20
|
+
width: 100%;
|
|
21
|
+
height: 100%;
|
|
22
|
+
top: 0px;
|
|
23
|
+
left: 0px;
|
|
24
|
+
font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
|
|
25
|
+
text-align: left;
|
|
26
|
+
}
|
|
27
|
+
.da-slide-current{
|
|
28
|
+
z-index: 1000;
|
|
29
|
+
}
|
|
30
|
+
.da-slider-fb .da-slide{
|
|
31
|
+
left: 100%;
|
|
32
|
+
}
|
|
33
|
+
.da-slider-fb .da-slide.da-slide-current{
|
|
34
|
+
left: 0px;
|
|
35
|
+
}
|
|
36
|
+
.da-slide h2,
|
|
37
|
+
.da-slide p,
|
|
38
|
+
.da-slide .da-link,
|
|
39
|
+
.da-slide .da-img{
|
|
40
|
+
position: absolute;
|
|
41
|
+
opacity: 0;
|
|
42
|
+
left: 110%;
|
|
43
|
+
}
|
|
44
|
+
.da-slider-fb .da-slide h2,
|
|
45
|
+
.da-slider-fb .da-slide p,
|
|
46
|
+
.da-slider-fb .da-slide .da-link{
|
|
47
|
+
left: 10%;
|
|
48
|
+
opacity: 1;
|
|
49
|
+
}
|
|
50
|
+
.da-slider-fb .da-slide .da-img{
|
|
51
|
+
left: 60%;
|
|
52
|
+
opacity: 1;
|
|
53
|
+
}
|
|
54
|
+
.da-slide h2{
|
|
55
|
+
color: #fff;
|
|
56
|
+
font-size: 66px;
|
|
57
|
+
width: 50%;
|
|
58
|
+
top: 60px;
|
|
59
|
+
white-space: nowrap;
|
|
60
|
+
z-index: 10;
|
|
61
|
+
text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
|
|
62
|
+
font-family: 'Economica', Arial, sans-serif;
|
|
63
|
+
font-weight: 700;
|
|
64
|
+
}
|
|
65
|
+
.da-slide p{
|
|
66
|
+
width: 45%;
|
|
67
|
+
top: 155px;
|
|
68
|
+
color: #916c05;
|
|
69
|
+
font-size: 18px;
|
|
70
|
+
line-height: 26px;
|
|
71
|
+
height: 80px;
|
|
72
|
+
overflow: hidden;
|
|
73
|
+
font-style: italic;
|
|
74
|
+
font-family: 'Economica', Arial, sans-serif;
|
|
75
|
+
font-weight: 400;
|
|
76
|
+
font-style: italic;
|
|
77
|
+
}
|
|
78
|
+
.da-slide .da-img{
|
|
79
|
+
text-align: center;
|
|
80
|
+
width: 30%;
|
|
81
|
+
top: 70px;
|
|
82
|
+
height: 256px;
|
|
83
|
+
line-height: 320px;
|
|
84
|
+
left: 110%; /*60%*/
|
|
85
|
+
}
|
|
86
|
+
.da-slide .da-link{
|
|
87
|
+
top: 270px; /*depends on p height*/
|
|
88
|
+
border-radius: 30px;
|
|
89
|
+
box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
|
|
90
|
+
color: #fff;
|
|
91
|
+
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
|
|
92
|
+
border: 8px solid rgba(255,255,255,0.8);
|
|
93
|
+
padding: 2px 20px 0px;
|
|
94
|
+
font-size: 18px;
|
|
95
|
+
line-height: 30px;
|
|
96
|
+
width: 80px;
|
|
97
|
+
text-align: center;
|
|
98
|
+
background: rgba(255,255,255,0.2);
|
|
99
|
+
}
|
|
100
|
+
.da-slide .da-link:hover{
|
|
101
|
+
background: rgba(255,255,255,0.3);
|
|
102
|
+
}
|
|
103
|
+
.da-dots{
|
|
104
|
+
width: 100%;
|
|
105
|
+
position: absolute;
|
|
106
|
+
text-align: center;
|
|
107
|
+
left: 0px;
|
|
108
|
+
bottom: 20px;
|
|
109
|
+
z-index: 2000;
|
|
110
|
+
-moz-user-select: none;
|
|
111
|
+
-webkit-user-select: none;
|
|
112
|
+
}
|
|
113
|
+
.da-dots span{
|
|
114
|
+
display: inline-block;
|
|
115
|
+
position: relative;
|
|
116
|
+
width: 12px;
|
|
117
|
+
height: 12px;
|
|
118
|
+
border-radius: 50%;
|
|
119
|
+
background: #e4b42d;
|
|
120
|
+
margin: 3px;
|
|
121
|
+
cursor: pointer;
|
|
122
|
+
box-shadow:
|
|
123
|
+
1px 1px 1px rgba(0,0,0,0.1) inset,
|
|
124
|
+
1px 1px 1px rgba(255,255,255,0.1);
|
|
125
|
+
}
|
|
126
|
+
.da-dots span.da-dots-current:after{
|
|
127
|
+
content: '';
|
|
128
|
+
width: 8px;
|
|
129
|
+
height: 8px;
|
|
130
|
+
position: absolute;
|
|
131
|
+
top: 2px;
|
|
132
|
+
left: 2px;
|
|
133
|
+
border-radius: 50%;
|
|
134
|
+
background: rgb(255,255,255);
|
|
135
|
+
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
136
|
+
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(47%,rgba(246,246,246,1)), color-stop(100%,rgba(237,237,237,1)));
|
|
137
|
+
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
|
|
138
|
+
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
|
|
139
|
+
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
|
|
140
|
+
background: linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
|
|
141
|
+
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
|
|
142
|
+
}
|
|
143
|
+
.da-arrows{
|
|
144
|
+
-moz-user-select: none;
|
|
145
|
+
-webkit-user-select: none;
|
|
146
|
+
}
|
|
147
|
+
.da-arrows span{
|
|
148
|
+
position: absolute;
|
|
149
|
+
top: 50%;
|
|
150
|
+
height: 30px;
|
|
151
|
+
width: 30px;
|
|
152
|
+
border-radius: 50%;
|
|
153
|
+
background: #e4b42d;
|
|
154
|
+
cursor: pointer;
|
|
155
|
+
z-index: 2000;
|
|
156
|
+
opacity: 0;
|
|
157
|
+
box-shadow:
|
|
158
|
+
1px 1px 1px rgba(0,0,0,0.1) inset,
|
|
159
|
+
1px 1px 1px rgba(255,255,255,0.1);
|
|
160
|
+
-webkit-transition: opacity 0.4s ease-in-out-out 0.2s;
|
|
161
|
+
-moz-transition: opacity 0.4s ease-in-out-out 0.2s;
|
|
162
|
+
-o-transition: opacity 0.4s ease-in-out-out 0.2s;
|
|
163
|
+
-ms-transition: opacity 0.4s ease-in-out-out 0.2s;
|
|
164
|
+
transition: opacity 0.4s ease-in-out-out 0.2s;
|
|
165
|
+
}
|
|
166
|
+
.da-slider:hover .da-arrows span{
|
|
167
|
+
opacity: 1;
|
|
168
|
+
}
|
|
169
|
+
.da-arrows span:after{
|
|
170
|
+
content: '';
|
|
171
|
+
position: absolute;
|
|
172
|
+
width: 20px;
|
|
173
|
+
height: 20px;
|
|
174
|
+
top: 5px;
|
|
175
|
+
left: 5px;
|
|
176
|
+
background: transparent url(../images/arrows.png) no-repeat top left;
|
|
177
|
+
border-radius: 50%;
|
|
178
|
+
box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
|
|
179
|
+
}
|
|
180
|
+
.da-arrows span:hover:after{
|
|
181
|
+
box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
|
|
182
|
+
}
|
|
183
|
+
.da-arrows span:active:after{
|
|
184
|
+
box-shadow: 1px 1px 1px rgba(255,255,255,0.1);
|
|
185
|
+
}
|
|
186
|
+
.da-arrows span.da-arrows-next:after{
|
|
187
|
+
background-position: top right;
|
|
188
|
+
}
|
|
189
|
+
.da-arrows span.da-arrows-prev{
|
|
190
|
+
left: 15px;
|
|
191
|
+
}
|
|
192
|
+
.da-arrows span.da-arrows-next{
|
|
193
|
+
right: 15px;
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
.da-slide-current h2,
|
|
197
|
+
.da-slide-current p,
|
|
198
|
+
.da-slide-current .da-link{
|
|
199
|
+
left: 10%;
|
|
200
|
+
opacity: 1;
|
|
201
|
+
}
|
|
202
|
+
.da-slide-current .da-img{
|
|
203
|
+
left: 60%;
|
|
204
|
+
opacity: 1;
|
|
205
|
+
}
|
|
206
|
+
/* Animation classes and animations */
|
|
207
|
+
|
|
208
|
+
/* Slide in from the right*/
|
|
209
|
+
.da-slide-fromright h2{
|
|
210
|
+
-webkit-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
|
|
211
|
+
-moz-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
|
|
212
|
+
-o-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
|
|
213
|
+
-ms-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
|
|
214
|
+
animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
|
|
215
|
+
}
|
|
216
|
+
.da-slide-fromright p{
|
|
217
|
+
-webkit-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
|
|
218
|
+
-moz-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
|
|
219
|
+
-o-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
|
|
220
|
+
-ms-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
|
|
221
|
+
animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
|
|
222
|
+
}
|
|
223
|
+
.da-slide-fromright .da-link{
|
|
224
|
+
-webkit-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
|
|
225
|
+
-moz-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
|
|
226
|
+
-o-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
|
|
227
|
+
-ms-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
|
|
228
|
+
animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
|
|
229
|
+
}
|
|
230
|
+
.da-slide-fromright .da-img{
|
|
231
|
+
-webkit-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
|
|
232
|
+
-moz-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
|
|
233
|
+
-o-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
|
|
234
|
+
-ms-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
|
|
235
|
+
animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
|
|
236
|
+
}
|
|
237
|
+
@-webkit-keyframes fromRightAnim1{
|
|
238
|
+
0%{ left: 110%; opacity: 0; }
|
|
239
|
+
100%{ left: 10%; opacity: 1; }
|
|
240
|
+
}
|
|
241
|
+
@-webkit-keyframes fromRightAnim2{
|
|
242
|
+
0%{ left: 110%; opacity: 0; }
|
|
243
|
+
100%{ left: 10%; opacity: 1; }
|
|
244
|
+
}
|
|
245
|
+
@-webkit-keyframes fromRightAnim3{
|
|
246
|
+
0%{ left: 110%; opacity: 0; }
|
|
247
|
+
1%{ left: 10%; opacity: 0; }
|
|
248
|
+
100%{ left: 10%; opacity: 1; }
|
|
249
|
+
}
|
|
250
|
+
@-webkit-keyframes fromRightAnim4{
|
|
251
|
+
0%{ left: 110%; opacity: 0; }
|
|
252
|
+
100%{ left: 60%; opacity: 1; }
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
@-moz-keyframes fromRightAnim1{
|
|
256
|
+
0%{ left: 110%; opacity: 0; }
|
|
257
|
+
100%{ left: 10%; opacity: 1; }
|
|
258
|
+
}
|
|
259
|
+
@-moz-keyframes fromRightAnim2{
|
|
260
|
+
0%{ left: 110%; opacity: 0; }
|
|
261
|
+
100%{ left: 10%; opacity: 1; }
|
|
262
|
+
}
|
|
263
|
+
@-moz-keyframes fromRightAnim3{
|
|
264
|
+
0%{ left: 110%; opacity: 0; }
|
|
265
|
+
1%{ left: 10%; opacity: 0; }
|
|
266
|
+
100%{ left: 10%; opacity: 1; }
|
|
267
|
+
}
|
|
268
|
+
@-moz-keyframes fromRightAnim4{
|
|
269
|
+
0%{ left: 110%; opacity: 0; }
|
|
270
|
+
100%{ left: 60%; opacity: 1; }
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
@-o-keyframes fromRightAnim1{
|
|
274
|
+
0%{ left: 110%; opacity: 0; }
|
|
275
|
+
100%{ left: 10%; opacity: 1; }
|
|
276
|
+
}
|
|
277
|
+
@-o-keyframes fromRightAnim2{
|
|
278
|
+
0%{ left: 110%; opacity: 0; }
|
|
279
|
+
100%{ left: 10%; opacity: 1; }
|
|
280
|
+
}
|
|
281
|
+
@-o-keyframes fromRightAnim3{
|
|
282
|
+
0%{ left: 110%; opacity: 0; }
|
|
283
|
+
1%{ left: 10%; opacity: 0; }
|
|
284
|
+
100%{ left: 10%; opacity: 1; }
|
|
285
|
+
}
|
|
286
|
+
@-o-keyframes fromRightAnim4{
|
|
287
|
+
0%{ left: 110%; opacity: 0; }
|
|
288
|
+
100%{ left: 60%; opacity: 1; }
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
@-ms-keyframes fromRightAnim1{
|
|
292
|
+
0%{ left: 110%; opacity: 0; }
|
|
293
|
+
100%{ left: 10%; opacity: 1; }
|
|
294
|
+
}
|
|
295
|
+
@-ms-keyframes fromRightAnim2{
|
|
296
|
+
0%{ left: 110%; opacity: 0; }
|
|
297
|
+
100%{ left: 10%; opacity: 1; }
|
|
298
|
+
}
|
|
299
|
+
@-ms-keyframes fromRightAnim3{
|
|
300
|
+
0%{ left: 110%; opacity: 0; }
|
|
301
|
+
1%{ left: 10%; opacity: 0; }
|
|
302
|
+
100%{ left: 10%; opacity: 1; }
|
|
303
|
+
}
|
|
304
|
+
@-ms-keyframes fromRightAnim4{
|
|
305
|
+
0%{ left: 110%; opacity: 0; }
|
|
306
|
+
100%{ left: 60%; opacity: 1; }
|
|
307
|
+
}
|
|
308
|
+
|
|
309
|
+
@keyframes fromRightAnim1{
|
|
310
|
+
0%{ left: 110%; opacity: 0; }
|
|
311
|
+
100%{ left: 10%; opacity: 1; }
|
|
312
|
+
}
|
|
313
|
+
@keyframes fromRightAnim2{
|
|
314
|
+
0%{ left: 110%; opacity: 0; }
|
|
315
|
+
100%{ left: 10%; opacity: 1; }
|
|
316
|
+
}
|
|
317
|
+
@keyframes fromRightAnim3{
|
|
318
|
+
0%{ left: 110%; opacity: 0; }
|
|
319
|
+
1%{ left: 10%; opacity: 0; }
|
|
320
|
+
100%{ left: 10%; opacity: 1; }
|
|
321
|
+
}
|
|
322
|
+
@keyframes fromRightAnim4{
|
|
323
|
+
0%{ left: 110%; opacity: 0; }
|
|
324
|
+
100%{ left: 60%; opacity: 1; }
|
|
325
|
+
}
|
|
326
|
+
/* Slide in from the left*/
|
|
327
|
+
.da-slide-fromleft h2{
|
|
328
|
+
-webkit-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
|
|
329
|
+
-moz-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
|
|
330
|
+
-o-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
|
|
331
|
+
-ms-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
|
|
332
|
+
animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
|
|
333
|
+
}
|
|
334
|
+
.da-slide-fromleft p{
|
|
335
|
+
-webkit-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
|
|
336
|
+
-moz-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
|
|
337
|
+
-o-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
|
|
338
|
+
-ms-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
|
|
339
|
+
animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
|
|
340
|
+
}
|
|
341
|
+
.da-slide-fromleft .da-link{
|
|
342
|
+
-webkit-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
|
|
343
|
+
-moz-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
|
|
344
|
+
-o-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
|
|
345
|
+
-ms-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
|
|
346
|
+
animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
|
|
347
|
+
}
|
|
348
|
+
.da-slide-fromleft .da-img{
|
|
349
|
+
-webkit-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
|
|
350
|
+
-moz-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
|
|
351
|
+
-o-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
|
|
352
|
+
-ms-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
|
|
353
|
+
animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
|
|
354
|
+
}
|
|
355
|
+
@-webkit-keyframes fromLeftAnim1{
|
|
356
|
+
0%{ left: -110%; opacity: 0; }
|
|
357
|
+
100%{ left: 10%; opacity: 1; }
|
|
358
|
+
}
|
|
359
|
+
@-webkit-keyframes fromLeftAnim2{
|
|
360
|
+
0%{ left: -110%; opacity: 0; }
|
|
361
|
+
100%{ left: 10%; opacity: 1; }
|
|
362
|
+
}
|
|
363
|
+
@-webkit-keyframes fromLeftAnim3{
|
|
364
|
+
0%{ left: -110%; opacity: 0; }
|
|
365
|
+
1%{ left: 10%; opacity: 0; }
|
|
366
|
+
100%{ left: 10%; opacity: 1; }
|
|
367
|
+
}
|
|
368
|
+
@-webkit-keyframes fromLeftAnim4{
|
|
369
|
+
0%{ left: -110%; opacity: 0; }
|
|
370
|
+
100%{ left: 60%; opacity: 1; }
|
|
371
|
+
}
|
|
372
|
+
|
|
373
|
+
@-moz-keyframes fromLeftAnim1{
|
|
374
|
+
0%{ left: -110%; opacity: 0; }
|
|
375
|
+
100%{ left: 10%; opacity: 1; }
|
|
376
|
+
}
|
|
377
|
+
@-moz-keyframes fromLeftAnim2{
|
|
378
|
+
0%{ left: -110%; opacity: 0; }
|
|
379
|
+
100%{ left: 10%; opacity: 1; }
|
|
380
|
+
}
|
|
381
|
+
@-moz-keyframes fromLeftAnim3{
|
|
382
|
+
0%{ left: -110%; opacity: 0; }
|
|
383
|
+
1%{ left: 10%; opacity: 0; }
|
|
384
|
+
100%{ left: 10%; opacity: 1; }
|
|
385
|
+
}
|
|
386
|
+
@-moz-keyframes fromLeftAnim4{
|
|
387
|
+
0%{ left: -110%; opacity: 0; }
|
|
388
|
+
100%{ left: 60%; opacity: 1; }
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
@-o-keyframes fromLeftAnim1{
|
|
392
|
+
0%{ left: -110%; opacity: 0; }
|
|
393
|
+
100%{ left: 10%; opacity: 1; }
|
|
394
|
+
}
|
|
395
|
+
@-o-keyframes fromLeftAnim2{
|
|
396
|
+
0%{ left: -110%; opacity: 0; }
|
|
397
|
+
100%{ left: 10%; opacity: 1; }
|
|
398
|
+
}
|
|
399
|
+
@-o-keyframes fromLeftAnim3{
|
|
400
|
+
0%{ left: -110%; opacity: 0; }
|
|
401
|
+
1%{ left: 10%; opacity: 0; }
|
|
402
|
+
100%{ left: 10%; opacity: 1; }
|
|
403
|
+
}
|
|
404
|
+
@-o-keyframes fromLeftAnim4{
|
|
405
|
+
0%{ left: -110%; opacity: 0; }
|
|
406
|
+
100%{ left: 60%; opacity: 1; }
|
|
407
|
+
}
|
|
408
|
+
|
|
409
|
+
@-ms-keyframes fromLeftAnim1{
|
|
410
|
+
0%{ left: -110%; opacity: 0; }
|
|
411
|
+
100%{ left: 10%; opacity: 1; }
|
|
412
|
+
}
|
|
413
|
+
@-ms-keyframes fromLeftAnim2{
|
|
414
|
+
0%{ left: -110%; opacity: 0; }
|
|
415
|
+
100%{ left: 10%; opacity: 1; }
|
|
416
|
+
}
|
|
417
|
+
@-ms-keyframes fromLeftAnim3{
|
|
418
|
+
0%{ left: -110%; opacity: 0; }
|
|
419
|
+
1%{ left: 10%; opacity: 0; }
|
|
420
|
+
100%{ left: 10%; opacity: 1; }
|
|
421
|
+
}
|
|
422
|
+
@-ms-keyframes fromLeftAnim4{
|
|
423
|
+
0%{ left: -110%; opacity: 0; }
|
|
424
|
+
100%{ left: 60%; opacity: 1; }
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
@keyframes fromLeftAnim1{
|
|
428
|
+
0%{ left: -110%; opacity: 0; }
|
|
429
|
+
100%{ left: 10%; opacity: 1; }
|
|
430
|
+
}
|
|
431
|
+
@keyframes fromLeftAnim2{
|
|
432
|
+
0%{ left: -110%; opacity: 0; }
|
|
433
|
+
100%{ left: 10%; opacity: 1; }
|
|
434
|
+
}
|
|
435
|
+
@keyframes fromLeftAnim3{
|
|
436
|
+
0%{ left: -110%; opacity: 0; }
|
|
437
|
+
1%{ left: 10%; opacity: 0; }
|
|
438
|
+
100%{ left: 10%; opacity: 1; }
|
|
439
|
+
}
|
|
440
|
+
@keyframes fromLeftAnim4{
|
|
441
|
+
0%{ left: -110%; opacity: 0; }
|
|
442
|
+
100%{ left: 60%; opacity: 1; }
|
|
443
|
+
}
|
|
444
|
+
/* Slide out to the right */
|
|
445
|
+
.da-slide-toright h2{
|
|
446
|
+
-webkit-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
|
|
447
|
+
-moz-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
|
|
448
|
+
-o-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
|
|
449
|
+
-ms-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
|
|
450
|
+
animation: toRightAnim1 0.6s ease-in-out 0.6s both;
|
|
451
|
+
}
|
|
452
|
+
.da-slide-toright p{
|
|
453
|
+
-webkit-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
|
|
454
|
+
-moz-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
|
|
455
|
+
-o-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
|
|
456
|
+
-ms-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
|
|
457
|
+
animation: toRightAnim2 0.6s ease-in-out 0.3s both;
|
|
458
|
+
}
|
|
459
|
+
.da-slide-toright .da-link{
|
|
460
|
+
-webkit-animation: toRightAnim3 0.4s ease-in-out both;
|
|
461
|
+
-moz-animation: toRightAnim3 0.4s ease-in-out both;
|
|
462
|
+
-o-animation: toRightAnim3 0.4s ease-in-out both;
|
|
463
|
+
-ms-animation: toRightAnim3 0.4s ease-in-out both;
|
|
464
|
+
animation: toRightAnim3 0.4s ease-in-out both;
|
|
465
|
+
}
|
|
466
|
+
.da-slide-toright .da-img{
|
|
467
|
+
-webkit-animation: toRightAnim4 0.6s ease-in-out both;
|
|
468
|
+
-moz-animation: toRightAnim4 0.6s ease-in-out both;
|
|
469
|
+
-o-animation: toRightAnim4 0.6s ease-in-out both;
|
|
470
|
+
-ms-animation: toRightAnim4 0.6s ease-in-out both;
|
|
471
|
+
animation: toRightAnim4 0.6s ease-in-out both;
|
|
472
|
+
}
|
|
473
|
+
@-webkit-keyframes toRightAnim1{
|
|
474
|
+
0%{ left: 10%; opacity: 1; }
|
|
475
|
+
100%{ left: 100%; opacity: 0; }
|
|
476
|
+
}
|
|
477
|
+
@-webkit-keyframes toRightAnim2{
|
|
478
|
+
0%{ left: 10%; opacity: 1; }
|
|
479
|
+
100%{ left: 100%; opacity: 0; }
|
|
480
|
+
}
|
|
481
|
+
@-webkit-keyframes toRightAnim3{
|
|
482
|
+
0%{ left: 10%; opacity: 1; }
|
|
483
|
+
99%{ left: 10%; opacity: 0; }
|
|
484
|
+
100%{ left: 100%; opacity: 0; }
|
|
485
|
+
}
|
|
486
|
+
@-webkit-keyframes toRightAnim4{
|
|
487
|
+
0%{ left: 60%; opacity: 1; }
|
|
488
|
+
30%{ left: 55%; opacity: 1; }
|
|
489
|
+
100%{ left: 100%; opacity: 0; }
|
|
490
|
+
}
|
|
491
|
+
|
|
492
|
+
@-moz-keyframes toRightAnim1{
|
|
493
|
+
0%{ left: 10%; opacity: 1; }
|
|
494
|
+
100%{ left: 100%; opacity: 0; }
|
|
495
|
+
}
|
|
496
|
+
@-moz-keyframes toRightAnim2{
|
|
497
|
+
0%{ left: 10%; opacity: 1; }
|
|
498
|
+
100%{ left: 100%; opacity: 0; }
|
|
499
|
+
}
|
|
500
|
+
@-moz-keyframes toRightAnim3{
|
|
501
|
+
0%{ left: 10%; opacity: 1; }
|
|
502
|
+
99%{ left: 10%; opacity: 0; }
|
|
503
|
+
100%{ left: 100%; opacity: 0; }
|
|
504
|
+
}
|
|
505
|
+
@-moz-keyframes toRightAnim4{
|
|
506
|
+
0%{ left: 60%; opacity: 1; }
|
|
507
|
+
30%{ left: 55%; opacity: 1; }
|
|
508
|
+
100%{ left: 100%; opacity: 0; }
|
|
509
|
+
}
|
|
510
|
+
|
|
511
|
+
@-o-keyframes toRightAnim1{
|
|
512
|
+
0%{ left: 10%; opacity: 1; }
|
|
513
|
+
100%{ left: 100%; opacity: 0; }
|
|
514
|
+
}
|
|
515
|
+
@-o-keyframes toRightAnim2{
|
|
516
|
+
0%{ left: 10%; opacity: 1; }
|
|
517
|
+
100%{ left: 100%; opacity: 0; }
|
|
518
|
+
}
|
|
519
|
+
@-o-keyframes toRightAnim3{
|
|
520
|
+
0%{ left: 10%; opacity: 1; }
|
|
521
|
+
99%{ left: 10%; opacity: 0; }
|
|
522
|
+
100%{ left: 100%; opacity: 0; }
|
|
523
|
+
}
|
|
524
|
+
@-o-keyframes toRightAnim4{
|
|
525
|
+
0%{ left: 60%; opacity: 1; }
|
|
526
|
+
30%{ left: 55%; opacity: 1; }
|
|
527
|
+
100%{ left: 100%; opacity: 0; }
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
@-ms-keyframes toRightAnim1{
|
|
531
|
+
0%{ left: 10%; opacity: 1; }
|
|
532
|
+
100%{ left: 100%; opacity: 0; }
|
|
533
|
+
}
|
|
534
|
+
@-ms-keyframes toRightAnim2{
|
|
535
|
+
0%{ left: 10%; opacity: 1; }
|
|
536
|
+
100%{ left: 100%; opacity: 0; }
|
|
537
|
+
}
|
|
538
|
+
@-ms-keyframes toRightAnim3{
|
|
539
|
+
0%{ left: 10%; opacity: 1; }
|
|
540
|
+
99%{ left: 10%; opacity: 0; }
|
|
541
|
+
100%{ left: 100%; opacity: 0; }
|
|
542
|
+
}
|
|
543
|
+
@-ms-keyframes toRightAnim4{
|
|
544
|
+
0%{ left: 60%; opacity: 1; }
|
|
545
|
+
30%{ left: 55%; opacity: 1; }
|
|
546
|
+
100%{ left: 100%; opacity: 0; }
|
|
547
|
+
}
|
|
548
|
+
|
|
549
|
+
@keyframes toRightAnim1{
|
|
550
|
+
0%{ left: 10%; opacity: 1; }
|
|
551
|
+
100%{ left: 100%; opacity: 0; }
|
|
552
|
+
}
|
|
553
|
+
@keyframes toRightAnim2{
|
|
554
|
+
0%{ left: 10%; opacity: 1; }
|
|
555
|
+
100%{ left: 100%; opacity: 0; }
|
|
556
|
+
}
|
|
557
|
+
@keyframes toRightAnim3{
|
|
558
|
+
0%{ left: 10%; opacity: 1; }
|
|
559
|
+
99%{ left: 10%; opacity: 0; }
|
|
560
|
+
100%{ left: 100%; opacity: 0; }
|
|
561
|
+
}
|
|
562
|
+
@keyframes toRightAnim4{
|
|
563
|
+
0%{ left: 60%; opacity: 1; }
|
|
564
|
+
30%{ left: 55%; opacity: 1; }
|
|
565
|
+
100%{ left: 100%; opacity: 0; }
|
|
566
|
+
}
|
|
567
|
+
/* Slide out to the left*/
|
|
568
|
+
.da-slide-toleft h2{
|
|
569
|
+
-webkit-animation: toLeftAnim1 0.6s ease-in-out both;
|
|
570
|
+
-moz-animation: toLeftAnim1 0.6s ease-in-out both;
|
|
571
|
+
-o-animation: toLeftAnim1 0.6s ease-in-out both;
|
|
572
|
+
-ms-animation: toLeftAnim1 0.6s ease-in-out both;
|
|
573
|
+
animation: toLeftAnim1 0.6s ease-in-out both;
|
|
574
|
+
}
|
|
575
|
+
.da-slide-toleft p{
|
|
576
|
+
-webkit-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
|
|
577
|
+
-moz-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
|
|
578
|
+
-o-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
|
|
579
|
+
-ms-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
|
|
580
|
+
animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
|
|
581
|
+
}
|
|
582
|
+
.da-slide-toleft .da-link{
|
|
583
|
+
-webkit-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
|
|
584
|
+
-moz-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
|
|
585
|
+
-o-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
|
|
586
|
+
-ms-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
|
|
587
|
+
animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
|
|
588
|
+
}
|
|
589
|
+
.da-slide-toleft .da-img{
|
|
590
|
+
-webkit-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
|
|
591
|
+
-moz-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
|
|
592
|
+
-o-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
|
|
593
|
+
-ms-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
|
|
594
|
+
animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
|
|
595
|
+
}
|
|
596
|
+
@-webkit-keyframes toLeftAnim1{
|
|
597
|
+
0%{ left: 10%; opacity: 1; }
|
|
598
|
+
30%{ left: 15%; opacity: 1; }
|
|
599
|
+
100%{ left: -50%; opacity: 0; }
|
|
600
|
+
}
|
|
601
|
+
@-webkit-keyframes toLeftAnim2{
|
|
602
|
+
0%{ left: 10%; opacity: 1; }
|
|
603
|
+
30%{ left: 15%; opacity: 1; }
|
|
604
|
+
100%{ left: -50%; opacity: 0; }
|
|
605
|
+
}
|
|
606
|
+
@-webkit-keyframes toLeftAnim3{
|
|
607
|
+
0%{ left: 10%; opacity: 1; }
|
|
608
|
+
100%{ left: -50%; opacity: 0; }
|
|
609
|
+
}
|
|
610
|
+
@-webkit-keyframes toLeftAnim4{
|
|
611
|
+
0%{ left: 60%; opacity: 1; }
|
|
612
|
+
70%{ left: 30%; opacity: 0; }
|
|
613
|
+
100%{ left: -50%; opacity: 0; }
|
|
614
|
+
}
|
|
615
|
+
|
|
616
|
+
@-moz-keyframes toLeftAnim1{
|
|
617
|
+
0%{ left: 10%; opacity: 1; }
|
|
618
|
+
30%{ left: 15%; opacity: 1; }
|
|
619
|
+
100%{ left: -50%; opacity: 0; }
|
|
620
|
+
}
|
|
621
|
+
@-moz-keyframes toLeftAnim2{
|
|
622
|
+
0%{ left: 10%; opacity: 1; }
|
|
623
|
+
30%{ left: 15%; opacity: 1; }
|
|
624
|
+
100%{ left: -50%; opacity: 0; }
|
|
625
|
+
}
|
|
626
|
+
@-moz-keyframes toLeftAnim3{
|
|
627
|
+
0%{ left: 10%; opacity: 1; }
|
|
628
|
+
100%{ left: -50%; opacity: 0; }
|
|
629
|
+
}
|
|
630
|
+
@-moz-keyframes toLeftAnim4{
|
|
631
|
+
0%{ left: 60%; opacity: 1; }
|
|
632
|
+
70%{ left: 30%; opacity: 0; }
|
|
633
|
+
100%{ left: -50%; opacity: 0; }
|
|
634
|
+
}
|
|
635
|
+
|
|
636
|
+
@-o-keyframes toLeftAnim1{
|
|
637
|
+
0%{ left: 10%; opacity: 1; }
|
|
638
|
+
30%{ left: 15%; opacity: 1; }
|
|
639
|
+
100%{ left: -50%; opacity: 0; }
|
|
640
|
+
}
|
|
641
|
+
@-o-keyframes toLeftAnim2{
|
|
642
|
+
0%{ left: 10%; opacity: 1; }
|
|
643
|
+
30%{ left: 15%; opacity: 1; }
|
|
644
|
+
100%{ left: -50%; opacity: 0; }
|
|
645
|
+
}
|
|
646
|
+
@-o-keyframes toLeftAnim3{
|
|
647
|
+
0%{ left: 10%; opacity: 1; }
|
|
648
|
+
100%{ left: -50%; opacity: 0; }
|
|
649
|
+
}
|
|
650
|
+
@-o-keyframes toLeftAnim4{
|
|
651
|
+
0%{ left: 60%; opacity: 1; }
|
|
652
|
+
70%{ left: 30%; opacity: 0; }
|
|
653
|
+
100%{ left: -50%; opacity: 0; }
|
|
654
|
+
}
|
|
655
|
+
|
|
656
|
+
@-ms-keyframes toLeftAnim1{
|
|
657
|
+
0%{ left: 10%; opacity: 1; }
|
|
658
|
+
30%{ left: 15%; opacity: 1; }
|
|
659
|
+
100%{ left: -50%; opacity: 0; }
|
|
660
|
+
}
|
|
661
|
+
@-ms-keyframes toLeftAnim2{
|
|
662
|
+
0%{ left: 10%; opacity: 1; }
|
|
663
|
+
30%{ left: 15%; opacity: 1; }
|
|
664
|
+
100%{ left: -50%; opacity: 0; }
|
|
665
|
+
}
|
|
666
|
+
@-ms-keyframes toLeftAnim3{
|
|
667
|
+
0%{ left: 10%; opacity: 1; }
|
|
668
|
+
100%{ left: -50%; opacity: 0; }
|
|
669
|
+
}
|
|
670
|
+
@-ms-keyframes toLeftAnim4{
|
|
671
|
+
0%{ left: 60%; opacity: 1; }
|
|
672
|
+
70%{ left: 30%; opacity: 0; }
|
|
673
|
+
100%{ left: -50%; opacity: 0; }
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
@keyframes toLeftAnim1{
|
|
677
|
+
0%{ left: 10%; opacity: 1; }
|
|
678
|
+
30%{ left: 15%; opacity: 1; }
|
|
679
|
+
100%{ left: -50%; opacity: 0; }
|
|
680
|
+
}
|
|
681
|
+
@keyframes toLeftAnim2{
|
|
682
|
+
0%{ left: 10%; opacity: 1; }
|
|
683
|
+
30%{ left: 15%; opacity: 1; }
|
|
684
|
+
100%{ left: -50%; opacity: 0; }
|
|
685
|
+
}
|
|
686
|
+
@keyframes toLeftAnim3{
|
|
687
|
+
0%{ left: 10%; opacity: 1; }
|
|
688
|
+
100%{ left: -50%; opacity: 0; }
|
|
689
|
+
}
|
|
690
|
+
@keyframes toLeftAnim4{
|
|
691
|
+
0%{ left: 60%; opacity: 1; }
|
|
692
|
+
70%{ left: 30%; opacity: 0; }
|
|
693
|
+
100%{ left: -50%; opacity: 0; }
|
|
694
|
+
}
|