Contact
CoCalc Logo Icon
StoreFeaturesDocsShareSupport News AboutSign UpSign In
| Download
Views: 18639
1
/*! lightslider - v1.1.3 - 2015-04-14
2
* https://github.com/sachinchoolur/lightslider
3
* Copyright (c) 2015 Sachin N; Licensed MIT */
4
/** /!!! core css Should not edit !!!/**/
5
6
7
8
.lSSlideOuter {
9
overflow: hidden;
10
-webkit-touch-callout: none;
11
-webkit-user-select: none;
12
-khtml-user-select: none;
13
-moz-user-select: none;
14
-ms-user-select: none;
15
user-select: none
16
}
17
.lightSlider:before, .lightSlider:after {
18
content: " ";
19
display: table;
20
}
21
.lightSlider {
22
overflow: hidden;
23
margin: 0;
24
}
25
.lSSlideWrapper {
26
max-width: 100%;
27
overflow: hidden;
28
position: relative;
29
}
30
.lSSlideWrapper > .lightSlider:after {
31
clear: both;
32
}
33
.lSSlideWrapper .lSSlide {
34
-webkit-transform: translate(0px, 0px);
35
-ms-transform: translate(0px, 0px);
36
transform: translate(0px, 0px);
37
-webkit-transition: all 1s;
38
-webkit-transition-property: -webkit-transform,height;
39
-moz-transition-property: -moz-transform,height;
40
transition-property: transform,height;
41
-webkit-transition-duration: inherit !important;
42
transition-duration: inherit !important;
43
-webkit-transition-timing-function: inherit !important;
44
transition-timing-function: inherit !important;
45
}
46
.lSSlideWrapper .lSFade {
47
position: relative;
48
}
49
.lSSlideWrapper .lSFade > * {
50
position: absolute !important;
51
top: 0;
52
left: 0;
53
z-index: 9;
54
margin-right: 0;
55
width: 100%;
56
}
57
.lSSlideWrapper.usingCss .lSFade > * {
58
opacity: 0;
59
-webkit-transition-delay: 0s;
60
transition-delay: 0s;
61
-webkit-transition-duration: inherit !important;
62
transition-duration: inherit !important;
63
-webkit-transition-property: opacity;
64
transition-property: opacity;
65
-webkit-transition-timing-function: inherit !important;
66
transition-timing-function: inherit !important;
67
}
68
.lSSlideWrapper .lSFade > *.active {
69
z-index: 10;
70
}
71
.lSSlideWrapper.usingCss .lSFade > *.active {
72
opacity: 1;
73
}
74
/** /!!! End of core css Should not edit !!!/**/
75
76
/* Pager */
77
.lSSlideOuter .lSPager.lSpg {
78
margin: 10px 0 0;
79
padding: 0;
80
text-align: center;
81
}
82
.lSSlideOuter .lSPager.lSpg > li {
83
cursor: pointer;
84
display: inline-block;
85
padding: 0 5px;
86
}
87
.lSSlideOuter .lSPager.lSpg > li a {
88
background-color: #222222;
89
border-radius: 30px;
90
display: inline-block;
91
height: 8px;
92
overflow: hidden;
93
text-indent: -999em;
94
width: 8px;
95
position: relative;
96
z-index: 99;
97
-webkit-transition: all 0.5s linear 0s;
98
transition: all 0.5s linear 0s;
99
}
100
.lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a {
101
background-color: #428bca;
102
}
103
.lSSlideOuter .media {
104
opacity: 0.8;
105
}
106
.lSSlideOuter .media.active {
107
opacity: 1;
108
}
109
/* End of pager */
110
111
/** Gallery */
112
.lSSlideOuter .lSPager.lSGallery {
113
list-style: none outside none;
114
padding-left: 0;
115
margin: 0;
116
overflow: hidden;
117
transform: translate3d(0px, 0px, 0px);
118
-moz-transform: translate3d(0px, 0px, 0px);
119
-ms-transform: translate3d(0px, 0px, 0px);
120
-webkit-transform: translate3d(0px, 0px, 0px);
121
-o-transform: translate3d(0px, 0px, 0px);
122
-webkit-transition-property: -webkit-transform;
123
-moz-transition-property: -moz-transform;
124
-webkit-touch-callout: none;
125
-webkit-user-select: none;
126
-khtml-user-select: none;
127
-moz-user-select: none;
128
-ms-user-select: none;
129
user-select: none;
130
}
131
.lSSlideOuter .lSPager.lSGallery li {
132
overflow: hidden;
133
-webkit-transition: border-radius 0.12s linear 0s 0.35s linear 0s;
134
transition: border-radius 0.12s linear 0s 0.35s linear 0s;
135
}
136
.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
137
border-radius: 3px; border:#ccc 1px solid;
138
}
139
.lSSlideOuter .lSPager.lSGallery img {
140
display: block;
141
height: auto;
142
max-width: 100%;
143
}
144
.lSSlideOuter .lSPager.lSGallery:before, .lSSlideOuter .lSPager.lSGallery:after {
145
content: " ";
146
display: table;
147
}
148
.lSSlideOuter .lSPager.lSGallery:after {
149
clear: both;
150
}
151
/* End of Gallery*/
152
153
/* slider actions */
154
.lSAction > a {
155
width: 32px;
156
display: block;
157
top: 50%;
158
height: 32px;
159
background-image: url('../img/controls.png');
160
cursor: pointer;
161
position: absolute;
162
z-index: 99;
163
margin-top: -16px;
164
opacity: 0.5;
165
-webkit-transition: opacity 0.35s linear 0s;
166
transition: opacity 0.35s linear 0s;
167
}
168
.lSAction > a:hover {
169
opacity: 1;
170
}
171
.lSAction > .lSPrev {
172
background-position: 0 0;
173
left: 10px;
174
}
175
.lSAction > .lSNext {
176
background-position: -32px 0;
177
right: 10px;
178
}
179
.lSAction > a.disabled {
180
pointer-events: none;
181
}
182
.cS-hidden {
183
height: 1px;
184
opacity: 0;
185
filter: alpha(opacity=0);
186
overflow: hidden;
187
}
188
189
190
/* vertical */
191
.lSSlideOuter.vertical {
192
position: relative;
193
}
194
.lSSlideOuter.vertical.noPager {
195
padding-right: 0px !important;
196
}
197
.lSSlideOuter.vertical .lSGallery {
198
position: absolute !important;
199
right: 0;
200
top: 0;
201
}
202
.lSSlideOuter.vertical .lightSlider > * {
203
width: 100% !important;
204
max-width: none !important;
205
}
206
207
/* vertical controlls */
208
.lSSlideOuter.vertical .lSAction > a {
209
left: 50%;
210
margin-left: -14px;
211
margin-top: 0;
212
}
213
.lSSlideOuter.vertical .lSAction > .lSNext {
214
background-position: 31px -31px;
215
bottom: 10px;
216
top: auto;
217
}
218
.lSSlideOuter.vertical .lSAction > .lSPrev {
219
background-position: 0 -31px;
220
bottom: auto;
221
top: 10px;
222
}
223
/* vertical */
224
225
226
/* Rtl */
227
.lSSlideOuter.lSrtl {
228
direction: rtl;
229
}
230
.lSSlideOuter .lightSlider, .lSSlideOuter .lSPager {
231
padding-left: 0;
232
list-style: none outside none;
233
}
234
.lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager {
235
padding-right: 0;
236
}
237
.lSSlideOuter .lightSlider > *, .lSSlideOuter .lSGallery li {
238
float: left;
239
}
240
.lSSlideOuter.lSrtl .lightSlider > *, .lSSlideOuter.lSrtl .lSGallery li {
241
float: right !important;
242
}
243
/* Rtl */
244
245
@-webkit-keyframes rightEnd {
246
0% {
247
left: 0;
248
}
249
250
50% {
251
left: -15px;
252
}
253
254
100% {
255
left: 0;
256
}
257
}
258
@keyframes rightEnd {
259
0% {
260
left: 0;
261
}
262
263
50% {
264
left: -15px;
265
}
266
267
100% {
268
left: 0;
269
}
270
}
271
@-webkit-keyframes topEnd {
272
0% {
273
top: 0;
274
}
275
276
50% {
277
top: -15px;
278
}
279
280
100% {
281
top: 0;
282
}
283
}
284
@keyframes topEnd {
285
0% {
286
top: 0;
287
}
288
289
50% {
290
top: -15px;
291
}
292
293
100% {
294
top: 0;
295
}
296
}
297
@-webkit-keyframes leftEnd {
298
0% {
299
left: 0;
300
}
301
302
50% {
303
left: 15px;
304
}
305
306
100% {
307
left: 0;
308
}
309
}
310
@keyframes leftEnd {
311
0% {
312
left: 0;
313
}
314
315
50% {
316
left: 15px;
317
}
318
319
100% {
320
left: 0;
321
}
322
}
323
@-webkit-keyframes bottomEnd {
324
0% {
325
bottom: 0;
326
}
327
328
50% {
329
bottom: -15px;
330
}
331
332
100% {
333
bottom: 0;
334
}
335
}
336
@keyframes bottomEnd {
337
0% {
338
bottom: 0;
339
}
340
341
50% {
342
bottom: -15px;
343
}
344
345
100% {
346
bottom: 0;
347
}
348
}
349
.lSSlideOuter .rightEnd {
350
-webkit-animation: rightEnd 0.3s;
351
animation: rightEnd 0.3s;
352
position: relative;
353
}
354
.lSSlideOuter .leftEnd {
355
-webkit-animation: leftEnd 0.3s;
356
animation: leftEnd 0.3s;
357
position: relative;
358
}
359
.lSSlideOuter.vertical .rightEnd {
360
-webkit-animation: topEnd 0.3s;
361
animation: topEnd 0.3s;
362
position: relative;
363
}
364
.lSSlideOuter.vertical .leftEnd {
365
-webkit-animation: bottomEnd 0.3s;
366
animation: bottomEnd 0.3s;
367
position: relative;
368
}
369
.lSSlideOuter.lSrtl .rightEnd {
370
-webkit-animation: leftEnd 0.3s;
371
animation: leftEnd 0.3s;
372
position: relative;
373
}
374
.lSSlideOuter.lSrtl .leftEnd {
375
-webkit-animation: rightEnd 0.3s;
376
animation: rightEnd 0.3s;
377
position: relative;
378
}
379
/*/ GRab cursor */
380
.lightSlider.lsGrab > * {
381
cursor: -webkit-grab;
382
cursor: -moz-grab;
383
cursor: -o-grab;
384
cursor: -ms-grab;
385
cursor: grab;
386
}
387
.lightSlider.lsGrabbing > * {
388
cursor: move;
389
cursor: -webkit-grabbing;
390
cursor: -moz-grabbing;
391
cursor: -o-grabbing;
392
cursor: -ms-grabbing;
393
cursor: grabbing;
394
}
395