rev |
line source |
pankso@1
|
1 /*
|
pankso@1
|
2 CSS style for SliTaz GNU/Linux website
|
pankso@1
|
3 www.slitaz.org - (c) 2007 Pankso
|
pankso@1
|
4 */
|
pankso@1
|
5
|
pankso@555
|
6 html {
|
pankso@555
|
7 height: 102%;
|
pankso@555
|
8 }
|
pankso@555
|
9
|
pankso@1
|
10 body {
|
pankso@555
|
11 background: #ffffff;
|
pankso@1
|
12 color: black;
|
pankso@1
|
13 font: 13px sans-serif, vernada, arial;
|
pankso@1
|
14 margin: 0;
|
pankso@697
|
15 border-top: 34px solid #f1f1f1;
|
pankso@1
|
16 }
|
pankso@1
|
17
|
pankso@1
|
18 /* Accessibility */
|
pankso@1
|
19
|
pankso@1
|
20 #access {
|
pankso@1
|
21 position: absolute;
|
pankso@697
|
22 top: 4px;
|
pankso@693
|
23 right: 0px;
|
pankso@1
|
24 text-align: right;
|
pankso@693
|
25 width: auto;
|
pankso@1
|
26 margin: 0;
|
pankso@693
|
27 padding: 4px 4px 4px 20px;
|
pankso@555
|
28 font-size: 11px;
|
pankso@1
|
29 font-weight: bold;
|
pankso@1
|
30 }
|
pankso@1
|
31
|
pankso@1
|
32 #access a {
|
pankso@697
|
33 background: transparent;
|
pankso@697
|
34 color: #0F314E;
|
pankso@1
|
35 text-decoration: none;
|
pankso@1
|
36 }
|
pankso@1
|
37
|
pankso@1
|
38 #access a:hover {
|
pankso@1
|
39 background: inherit;
|
pankso@697
|
40 color: #b64b22;
|
pankso@1
|
41 }
|
pankso@1
|
42
|
pankso@1
|
43 /* Header and title */
|
pankso@1
|
44
|
pankso@1
|
45 #header{
|
pankso@697
|
46 /*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
|
paul@702
|
47 /*background: #351a0a url(pics/website/header-img.png) no-repeat top right;*/
|
paul@702
|
48 background: #c3c3c3 url(pics/website/header-img.png) no-repeat top right;
|
pankso@1
|
49 color: black;
|
pankso@1
|
50 width: 100%;
|
pankso@697
|
51 height: 42px;
|
pankso@1
|
52 border-top: 1px solid black;
|
pankso@1
|
53 border-bottom: 1px solid black;
|
pankso@1
|
54 margin-bottom: 30px;
|
pankso@697
|
55 -moz-box-shadow: 0 1px 5px #333;
|
pankso@697
|
56 -webkit-box-shadow: 0 1px 5px #333;
|
pankso@697
|
57 box-shadow: 0 1px 5px #333;
|
pankso@1
|
58 }
|
pankso@1
|
59
|
pankso@555
|
60 #titre {
|
pankso@555
|
61 position: absolute;
|
pankso@697
|
62 font-size: 14px;
|
pankso@1
|
63 font-weight: bolder ;
|
pankso@697
|
64 left: 180px;
|
pankso@697
|
65 top: 4px;
|
pankso@1
|
66 }
|
pankso@1
|
67
|
pankso@1
|
68 #logo {
|
pankso@1
|
69 position: absolute;
|
pankso@1
|
70 float: left;
|
pankso@697
|
71 left: 16px;
|
pankso@697
|
72 top: -10px;
|
pankso@1
|
73 }
|
pankso@1
|
74
|
pankso@1
|
75 /* Navigation */
|
pankso@1
|
76
|
pankso@1
|
77 #nav {
|
pankso@1
|
78 position: absolute;
|
pankso@697
|
79 top: 102px;
|
pankso@565
|
80 right: 80px;
|
pankso@555
|
81 color: #555555;
|
pankso@1
|
82 float: right;
|
pankso@555
|
83 width: 250px;
|
pankso@563
|
84 line-height: 1.5em;
|
pankso@1
|
85 text-align: left;
|
pankso@555
|
86 font-size: 12px;
|
pankso@1
|
87 }
|
pankso@1
|
88
|
pankso@555
|
89 #nav .nav_box ul {
|
pankso@1
|
90 list-style-type: none;
|
pankso@555
|
91 margin: 0;
|
pankso@555
|
92 padding: 10px 24px 10px 0px;
|
pankso@694
|
93 background-color: inherit;
|
pankso@1
|
94 }
|
pankso@1
|
95
|
pankso@1
|
96 #nav li {
|
pankso@1
|
97 display: inline;
|
pankso@1
|
98 }
|
pankso@1
|
99
|
pankso@555
|
100 #nav h4 {
|
pankso@693
|
101 font-size: 120%;
|
pankso@555
|
102 color: #666666;
|
pankso@555
|
103 font-weight: bold;
|
pankso@555
|
104 margin: 0;
|
pankso@555
|
105 padding: 0 0 1px 0;
|
pankso@555
|
106 border-bottom: 1px solid #cecece;
|
pankso@555
|
107 }
|
pankso@555
|
108
|
pankso@1
|
109 #nav a {
|
pankso@555
|
110 color: #0F314E;
|
pankso@1
|
111 background: inherit;
|
pankso@1
|
112 display: block;
|
pankso@1
|
113 text-decoration: none;
|
pankso@555
|
114 font-weight: bold;
|
pankso@1
|
115 }
|
pankso@1
|
116
|
pankso@1
|
117 #nav a:hover {
|
pankso@697
|
118 color: #b64b22;
|
pankso@1
|
119 text-decoration: none;
|
pankso@1
|
120 display: block;
|
pankso@1
|
121 }
|
pankso@1
|
122
|
pankso@74
|
123 #nav hr {
|
pankso@74
|
124 margin: 2px 0px 1px 0px;
|
pankso@74
|
125 border: 0px;
|
pankso@74
|
126 border-top: 1px solid #BDBDBD;
|
pankso@74
|
127 }
|
pankso@555
|
128
|
pankso@694
|
129 #nav ul {
|
pankso@694
|
130 -moz-border-radius: 8px;
|
pankso@694
|
131 -webkit-border-radius: 8px;
|
pankso@694
|
132 list-style-type: none;
|
pankso@694
|
133 margin: 10px 0;
|
pankso@694
|
134 padding: 10px 24px 10px 24px;
|
pankso@694
|
135 background-color: #eaeaea;
|
pankso@694
|
136 }
|
pankso@694
|
137
|
pankso@694
|
138 .nav_box {
|
pankso@555
|
139 margin: 10px 0;
|
pankso@555
|
140 padding: 10px 24px 10px 24px;
|
pankso@555
|
141 background-color: #eaeaea;
|
pankso@555
|
142 text-align: justify;
|
pankso@693
|
143 -moz-border-radius: 8px;
|
pankso@693
|
144 -webkit-border-radius: 8px;
|
pankso@693
|
145 border-radius: 8px;
|
pankso@693
|
146 -moz-box-shadow: 0 1px 3px #666;
|
pankso@693
|
147 -webkit-box-shadow: 0 1px 3px #666;
|
pankso@693
|
148 box-shadow: 0 1px 3px #666;
|
pankso@693
|
149 /* CSS3 transition */
|
pankso@693
|
150 -webkit-transition-property: background-color;
|
pankso@698
|
151 -webkit-transition-duration: 2s;
|
pankso@693
|
152 -moz-transition-property: background-color;
|
pankso@693
|
153 -moz-transition-duration: 2s;
|
pankso@693
|
154 transition-property: background-color;
|
pankso@693
|
155 transition-duration: 2s;
|
pankso@555
|
156 }
|
pankso@555
|
157
|
pankso@694
|
158 .nav_box:hover { background-color: #f8f8f8; }
|
pankso@693
|
159
|
pankso@563
|
160 #nav .nav_box p {
|
pankso@563
|
161 line-height: 1.3em;
|
pankso@563
|
162 }
|
pankso@563
|
163
|
pankso@555
|
164 #nav .nav_box p a {
|
pankso@555
|
165 display: inline;
|
pankso@555
|
166 font-weight: normal;
|
pankso@555
|
167 text-decoration: underline;
|
pankso@555
|
168 }
|
pankso@555
|
169
|
pankso@555
|
170 #nav .nav_box p a:hover {
|
pankso@555
|
171 text-decoration: none;
|
pankso@555
|
172 color: blue;
|
pankso@555
|
173 background: inherit;
|
pankso@555
|
174 }
|
pankso@555
|
175
|
pankso@555
|
176 #nav hr {
|
pankso@555
|
177 height: 0px;
|
pankso@555
|
178 border: 0px solid #eaeaea;
|
pankso@555
|
179 }
|
pankso@555
|
180
|
pankso@1
|
181 /* Page content */
|
pankso@1
|
182
|
pankso@693
|
183 #content {
|
pankso@1
|
184 background: white;
|
pankso@1
|
185 color: black;
|
pankso@1
|
186 text-align: justify;
|
pankso@1
|
187 height: auto;
|
pankso@565
|
188 margin: 6px 320px 0px 0px;
|
pankso@565
|
189 padding: 0px 40px 60px 80px;
|
pankso@1
|
190 }
|
pankso@1
|
191
|
pankso@693
|
192 #content-full {
|
pankso@693
|
193 background: white;
|
pankso@693
|
194 color: black;
|
pankso@693
|
195 text-align: justify;
|
pankso@693
|
196 height: auto;
|
pankso@693
|
197 margin: 6px 0px 0px 0px;
|
pankso@693
|
198 padding: 0px 80px 35% 80px;
|
pankso@693
|
199 }
|
pankso@693
|
200
|
pankso@693
|
201 #content li, #content-full li {
|
pankso@1
|
202 line-height: 1.5em;
|
pankso@1
|
203 text-align: left;
|
pankso@1
|
204 }
|
pankso@1
|
205
|
pankso@1
|
206 /* Legal informations */
|
pankso@1
|
207
|
pankso@1
|
208 #copy {
|
pankso@1
|
209 font-size: 11px ;
|
pankso@565
|
210 text-align: left ;
|
pankso@1
|
211 background: transparent;
|
pankso@1
|
212 color: #a8a8a8;
|
pankso@1
|
213 padding-top: 10px;
|
pankso@565
|
214 margin: 0 0 0 80px;
|
pankso@1
|
215 }
|
pankso@1
|
216
|
pankso@1
|
217 #copy a {
|
pankso@1
|
218 background: inherit;
|
pankso@1
|
219 color: #a8a8a8;
|
pankso@1
|
220 }
|
pankso@1
|
221
|
pankso@1
|
222 #copy a:hover {
|
pankso@1
|
223 background: inherit;
|
pankso@555
|
224 color: #666666;
|
pankso@1
|
225 }
|
pankso@1
|
226
|
pankso@1
|
227 /* Footer */
|
pankso@1
|
228
|
pankso@1
|
229 #bottom {
|
pankso@1
|
230 float: none;
|
pankso@1
|
231 background: inherit;
|
pankso@1
|
232 color: black;
|
pankso@1
|
233 width: auto;
|
pankso@1
|
234 clear: both;
|
pankso@1
|
235 padding: 0;
|
pankso@565
|
236 margin: 0 0 0 80px;
|
pankso@565
|
237 text-align: left;
|
pankso@1
|
238 vertical-align: middle;
|
pankso@1
|
239 }
|
pankso@1
|
240
|
pankso@1
|
241 #news li {
|
pankso@1
|
242 list-style-type: square;
|
pankso@1
|
243 border-bottom: 1px dotted #BEBEBE;
|
pankso@1
|
244 margin-left: -25px;
|
pankso@1
|
245 padding: 4px 0px 4px 0px;
|
pankso@1
|
246 }
|
pankso@375
|
247
|
pankso@678
|
248 #news a {
|
pankso@678
|
249 text-decoration: none;
|
pankso@678
|
250 }
|
pankso@678
|
251
|
pankso@1
|
252 #gallery {
|
pankso@1
|
253 text-align: center;
|
pankso@1
|
254 }
|
pankso@375
|
255
|
pankso@286
|
256 #gallery table {
|
pankso@286
|
257 margin: 30px 0px 30px 0px;
|
pankso@286
|
258 }
|
pankso@1
|
259
|
pankso@375
|
260 /* Clouds */
|
pankso@375
|
261
|
pankso@375
|
262 #cloud {
|
pankso@375
|
263 padding: 20px 0px 20px 0px;
|
pankso@375
|
264 line-height: 3em;
|
pankso@375
|
265 text-align: center;
|
pankso@375
|
266 }
|
pankso@375
|
267 #cloud a { padding: 4px; color: #956411; }
|
pankso@375
|
268 #cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
|
pankso@375
|
269 #cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
|
pankso@375
|
270 #cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
|
pankso@375
|
271 #cloud a.tag4 { font-size: 1.0em; font-weight: 400; }
|
pankso@375
|
272 #cloud a.tag5 { font-size: 1.2em; font-weight: 500; }
|
pankso@375
|
273 #cloud a.tag6 { font-size: 1.4em; font-weight: 600; }
|
pankso@375
|
274 #cloud a.tag7 { font-size: 1.6em; font-weight: 700; }
|
pankso@375
|
275 #cloud a.tag8 { font-size: 1.8em; font-weight: 800; }
|
pankso@375
|
276 #cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
|
pankso@375
|
277 #cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
|
pankso@375
|
278
|
pankso@1
|
279 /* CSS class. */
|
pankso@1
|
280
|
pankso@555
|
281 .infobox {
|
pankso@555
|
282 margin: 10px;
|
pankso@555
|
283 padding: 12px;
|
pankso@693
|
284 background: #f8f8f8;
|
pankso@555
|
285 -moz-border-radius: 8px;
|
pankso@555
|
286 -webkit-border-radius: 8px;
|
pankso@693
|
287 border-radius: 8px;
|
pankso@693
|
288 -moz-box-shadow: 0 1px 3px #666;
|
pankso@693
|
289 -webkit-box-shadow: 0 1px 3px #666;
|
pankso@693
|
290 box-shadow: 0 1px 3px #666;
|
pankso@693
|
291 }
|
pankso@693
|
292
|
pankso@697
|
293 .imagebox {
|
pankso@699
|
294 min-width: 300px;
|
pankso@700
|
295 margin: 10px 15%;
|
pankso@697
|
296 padding: 8px;
|
pankso@697
|
297 background: transparent;
|
pankso@697
|
298 text-align: center;
|
pankso@697
|
299 /* CSS3 transition */
|
pankso@697
|
300 -webkit-transition-property: background-color;
|
pankso@698
|
301 -webkit-transition-duration: 3s;
|
pankso@697
|
302 -moz-transition-property: background-color;
|
pankso@697
|
303 -moz-transition-duration: 3s;
|
pankso@697
|
304 transition-property: background-color;
|
pankso@697
|
305 transition-duration: 3s;
|
pankso@697
|
306 }
|
pankso@697
|
307
|
pankso@697
|
308 .imagebox:hover, .imagebox img {
|
pankso@697
|
309 -moz-border-radius: 8px;
|
pankso@697
|
310 -webkit-border-radius: 8px;
|
pankso@697
|
311 border-radius: 8px;
|
pankso@697
|
312 -moz-box-shadow: 0 1px 3px #666;
|
pankso@697
|
313 -webkit-box-shadow: 0 1px 3px #666;
|
pankso@697
|
314 box-shadow: 0 1px 3px #666;
|
pankso@697
|
315 }
|
pankso@697
|
316
|
pankso@693
|
317 .block {
|
pankso@693
|
318 /*padding-bottom: 35%;*/
|
pankso@693
|
319 color: black;
|
pankso@697
|
320 min-height: 200px;
|
pankso@693
|
321 }
|
pankso@693
|
322
|
pankso@693
|
323 .block h3 img {
|
pankso@697
|
324 padding: 0 2px 2px 0;
|
pankso@697
|
325 margin: 0;
|
pankso@697
|
326 }
|
pankso@697
|
327
|
pankso@697
|
328 .block ul {
|
pankso@697
|
329 list-style-type: square;
|
pankso@693
|
330 }
|
pankso@693
|
331
|
pankso@693
|
332 .block_left {
|
pankso@693
|
333 width: 46%;
|
pankso@693
|
334 float: left;
|
pankso@697
|
335 background-color: #eaeaea;
|
pankso@693
|
336 margin: 4px 2px;
|
pankso@693
|
337 padding: 0 6px;
|
pankso@693
|
338 }
|
pankso@693
|
339
|
pankso@693
|
340 .block_right {
|
pankso@693
|
341 width: 46%;
|
pankso@693
|
342 float: right;
|
pankso@697
|
343 background-color: #eaeaea;
|
pankso@693
|
344 margin: 4px 2px;
|
pankso@693
|
345 padding: 0 6px;
|
pankso@693
|
346 }
|
pankso@693
|
347
|
pankso@693
|
348 .block_left, .block_right {
|
pankso@693
|
349 -moz-border-radius: 8px;
|
pankso@693
|
350 -webkit-border-radius: 8px;
|
pankso@693
|
351 border-radius: 8px;
|
pankso@693
|
352 -moz-box-shadow: 0 1px 3px #666;
|
pankso@693
|
353 -webkit-box-shadow: 0 1px 3px #666;
|
pankso@693
|
354 box-shadow: 0 1px 3px #666;
|
pankso@693
|
355 /* CSS3 transition */
|
pankso@693
|
356 -webkit-transition-property: background-color;
|
pankso@698
|
357 -webkit-transition-duration: 2s;
|
pankso@693
|
358 -moz-transition-property: background-color;
|
pankso@693
|
359 -moz-transition-duration: 2s;
|
pankso@693
|
360 transition-property: background-color;
|
pankso@693
|
361 transition-duration: 2s;
|
pankso@698
|
362 /* For browsers that don't support RGBa
|
pankso@697
|
363 background: rgb(0, 0, 0);*/
|
pankso@698
|
364 /* RGBa with 0.6 opacity
|
pankso@697
|
365 background: rgba(0, 0, 0, 0.2);*/
|
pankso@693
|
366 }
|
pankso@693
|
367
|
pankso@700
|
368 .block_left:hover, .block_right:hover, .imagebox:hover, #slidebox:hover {
|
pankso@693
|
369 background-color: #f2b21d;
|
pankso@1
|
370 }
|
pankso@1
|
371
|
pankso@1
|
372 /* HTML styles */
|
pankso@1
|
373
|
pankso@1
|
374 h1 {
|
pankso@697
|
375 color: #444444;
|
pankso@1
|
376 background: inherit;
|
pankso@1
|
377 text-align: left;
|
pankso@700
|
378 margin: 0px 0px 4px 0px;
|
pankso@697
|
379 font-size: 150%;
|
pankso@555
|
380 font-weight: bold;
|
pankso@1
|
381 }
|
pankso@1
|
382
|
pankso@1
|
383 h2 {
|
pankso@697
|
384 color: #b64b22;
|
pankso@697
|
385 padding: 0;
|
pankso@698
|
386 margin: 4px 0 0 0;
|
pankso@697
|
387 font-size: 130%;
|
pankso@555
|
388 font-weight: bold;
|
pankso@1
|
389 }
|
pankso@1
|
390
|
pankso@1
|
391 h3 {
|
pankso@1
|
392 font-weight: bold;
|
pankso@697
|
393 color: #390012;
|
pankso@697
|
394 background: transparent;
|
pankso@1
|
395 }
|
pankso@1
|
396
|
pankso@1
|
397 a {
|
pankso@1
|
398 text-decoration: underline;
|
pankso@1
|
399 color: #0F314E;
|
pankso@1
|
400 background: inherit;
|
pankso@1
|
401 }
|
pankso@1
|
402
|
pankso@1
|
403 a:hover {
|
pankso@1
|
404 text-decoration: none;
|
pankso@1
|
405 color: blue;
|
pankso@1
|
406 background: inherit;
|
pankso@1
|
407 }
|
pankso@1
|
408
|
pankso@1
|
409 code {
|
pankso@1
|
410 font-size: 12px;
|
pankso@1
|
411 color: #669900;
|
pankso@1
|
412 background: inherit;
|
pankso@1
|
413 }
|
pankso@1
|
414
|
pankso@1
|
415 tt {
|
pankso@1
|
416 color: #15EE15;
|
pankso@1
|
417 background: inherit;
|
pankso@1
|
418 }
|
pankso@1
|
419
|
pankso@1
|
420 img {
|
pankso@1
|
421 border: 0pt none;
|
pankso@1
|
422 }
|
pankso@1
|
423
|
pankso@1
|
424 fieldset {
|
pankso@555
|
425 background: #E2ECf6;
|
pankso@1
|
426 color: black;
|
pankso@1
|
427 margin-top: 25px;
|
pankso@1
|
428 border: 1px solid black;
|
pankso@1
|
429 }
|
pankso@1
|
430
|
pankso@1
|
431 legend {
|
pankso@1
|
432 border: 1px solid black;
|
pankso@1
|
433 color: #6c0023;
|
pankso@1
|
434 background: #eaeaea;
|
pankso@1
|
435 font-weight: bold;
|
pankso@1
|
436 }
|
pankso@1
|
437
|
pankso@1
|
438 pre {
|
pankso@1
|
439 padding: 5px;
|
pankso@1
|
440 color: black;
|
pankso@1
|
441 background: #E1E0B0;
|
pankso@1
|
442 }
|
pankso@1
|
443
|
pankso@1
|
444 pre.script {
|
pankso@1
|
445 padding: 10px;
|
pankso@1
|
446 color: black;
|
pankso@1
|
447 background: #E8E8E8;
|
pankso@1
|
448 border: 1px inset #606060;
|
pankso@1
|
449 }
|
pankso@1
|
450
|
pankso@555
|
451 textarea {
|
pankso@555
|
452 background: #E5E5E5;
|
pankso@555
|
453 margin-top: 12px;
|
pankso@555
|
454 }
|
pankso@555
|
455
|
pankso@1
|
456 /* Packages pages */
|
pankso@1
|
457
|
pankso@1
|
458 .pkg_nav {
|
pankso@1
|
459 border-top: 1px solid black;
|
pankso@1
|
460 margin-top: 10px;
|
pankso@1
|
461 padding-top: 10px;
|
pankso@1
|
462 }
|
pankso@1
|
463
|
pankso@1
|
464 pre.package {
|
pankso@1
|
465 padding: 0px;
|
pankso@1
|
466 color: black;
|
pankso@1
|
467 background: white;
|
pankso@1
|
468 }
|
pankso@1
|
469
|
pankso@1
|
470 p.get {
|
pankso@1
|
471 text-align: center;
|
pankso@1
|
472 padding: 10px;
|
pankso@1
|
473 color: black;
|
pankso@1
|
474 background: #F3F3F3;
|
pankso@1
|
475 border: 1px solid #DEDEDE;
|
pankso@1
|
476 }
|
pascal@669
|
477
|
pascal@669
|
478 .year:after {
|
pascal@669
|
479 /* content: "2007-2010"; */
|
pascal@669
|
480 content: "2010";
|
pascal@669
|
481 }
|
pankso@698
|
482
|
pankso@698
|
483 /* Slideshow */
|
pankso@698
|
484
|
pankso@698
|
485 @-webkit-keyframes 'AutoSlide' {
|
pankso@698
|
486 0% {
|
pankso@698
|
487 left: 0px; /*1ère image*/
|
pankso@698
|
488 }
|
pankso@700
|
489 10% {
|
pankso@698
|
490 left: 0px; /*idem pour attente*/
|
pankso@698
|
491 }
|
pankso@700
|
492 25% {
|
pankso@700
|
493 left: -240px; /*2ème image*/
|
pankso@700
|
494 }
|
pankso@698
|
495 35% {
|
pankso@700
|
496 left: -240px; /*idem pour attente*/
|
pankso@698
|
497 }
|
pankso@698
|
498 70% {
|
pankso@700
|
499 left: -480px; /*3ème image*/
|
pankso@698
|
500 }
|
pankso@698
|
501 75% {
|
pankso@700
|
502 left: -480px; /*idem pour attente*/
|
pankso@698
|
503 }
|
pankso@698
|
504 80% {
|
pankso@700
|
505 left: -720px; /*idem pour attente*/
|
pankso@698
|
506 }
|
pankso@698
|
507 90% {
|
pankso@700
|
508 left: -720px; /*idem pour attente*/
|
pankso@698
|
509 }
|
pankso@698
|
510 100% {
|
pankso@698
|
511 left: 0px; /*1ère image*/
|
pankso@698
|
512 }
|
pankso@698
|
513 }
|
pankso@698
|
514
|
pankso@700
|
515 #slidebox {
|
pankso@700
|
516 margin: 10px 15%;
|
pankso@700
|
517 padding: 8px;
|
pankso@700
|
518 min-width: 300px;
|
pankso@700
|
519 /* CSS3 transition */
|
pankso@700
|
520 -webkit-transition-property: background-color;
|
pankso@700
|
521 -webkit-transition-duration: 3s;
|
pankso@700
|
522 -moz-transition-property: background-color;
|
pankso@700
|
523 -moz-transition-duration: 3s;
|
pankso@700
|
524 transition-property: background-color;
|
pankso@700
|
525 transition-duration: 3s;
|
pankso@700
|
526 }
|
pankso@700
|
527 #slidebox:hover {
|
pankso@700
|
528 -moz-box-shadow: 0 1px 3px #666;
|
pankso@700
|
529 -webkit-box-shadow: 0 1px 3px #666;
|
pankso@700
|
530 box-shadow: 0 1px 3px #666;
|
pankso@700
|
531 }
|
pankso@700
|
532 #slidebox:hover, #slidebox img {
|
pankso@700
|
533 -moz-border-radius: 8px;
|
pankso@700
|
534 -webkit-border-radius: 8px;
|
pankso@700
|
535 border-radius: 8px;
|
pankso@700
|
536 }
|
pankso@700
|
537
|
pankso@698
|
538 #slideshow {
|
pankso@698
|
539 position: relative;
|
pankso@700
|
540 width: 240px;
|
pankso@700
|
541 height: 150px;
|
pankso@700
|
542 margin: 10px auto;
|
pankso@698
|
543 overflow: hidden;
|
pankso@698
|
544 }
|
pankso@700
|
545
|
pankso@698
|
546 #sContent li {
|
pankso@698
|
547 display: inline;
|
pankso@698
|
548 }
|
pankso@698
|
549 #sContent {
|
pankso@698
|
550 position: absolute;
|
pankso@698
|
551 top: 0;
|
pankso@698
|
552 left: 0;
|
pankso@700
|
553 width: 1000px;
|
pankso@698
|
554 margin: 0;
|
pankso@698
|
555 padding: 0;
|
pankso@698
|
556 /*CSS3 keyframes animation*/
|
pankso@698
|
557 -webkit-animation-name: AutoSlide;
|
pankso@698
|
558 -webkit-animation-duration: 10s;
|
pankso@698
|
559 -webkit-animation-iteration-count: infinite;
|
pankso@698
|
560 -webkit-animation-timing-function: ease-in-out;
|
pankso@698
|
561 }
|