]>
Commit | Line | Data |
---|---|---|
19f2f11e NL |
1 | /* ========================================================================== |
2 | Sommaire | |
3 | ||
4 | 1 = Style Guide | |
5 | 2 = Layout | |
6 | 3 = Pictos | |
7 | 4 = Messages | |
8 | 5 = Article | |
9 | 6 = Media queries | |
371ac69a | 10 | |
19f2f11e NL |
11 | ========================================================================== */ |
12 | ||
13 | html { | |
14 | min-height: 100%; | |
15 | } | |
16 | ||
17 | body { | |
5ecdfcd0 | 18 | background-color: #eee; |
19f2f11e NL |
19 | } |
20 | ||
21 | .login { | |
22 | background-color: #333; | |
23 | } | |
24 | ||
25 | .login #main { | |
26 | padding: 0; | |
27 | margin: 0; | |
28 | } | |
29 | ||
30 | .login form { | |
5ecdfcd0 | 31 | background-color: #fff; |
19f2f11e | 32 | padding: 1.5em; |
5ecdfcd0 | 33 | box-shadow: 0 1px 8px rgba(0, 0, 0, 0.9); |
19f2f11e NL |
34 | width: 20em; |
35 | position: absolute; | |
36 | top: 8em; | |
37 | left: 50%; | |
38 | margin-left: -10em; | |
39 | } | |
40 | ||
41 | .login .logo { | |
42 | position: absolute; | |
43 | top: 2em; | |
44 | left: 50%; | |
371ac69a | 45 | margin-left: -55px; |
19f2f11e NL |
46 | } |
47 | ||
48 | /* ========================================================================== | |
49 | 1 = Style Guide | |
50 | ========================================================================== */ | |
51 | ||
371ac69a | 52 | ::selection { |
5ecdfcd0 | 53 | color: #fff; |
19f2f11e | 54 | background-color: #000; |
371ac69a | 55 | } |
19f2f11e NL |
56 | |
57 | .desktopHide { | |
58 | display: none; | |
59 | } | |
60 | ||
61 | .logo { | |
62 | position: fixed; | |
63 | z-index: 20; | |
64 | top: 0.4em; | |
371ac69a | 65 | left: 0.6em; |
19f2f11e NL |
66 | } |
67 | ||
5ecdfcd0 TC |
68 | h2, |
69 | h3, | |
70 | h4 { | |
71 | font-family: "PT Sans", sans-serif; | |
19f2f11e NL |
72 | text-transform: uppercase; |
73 | } | |
74 | ||
5ecdfcd0 TC |
75 | p, |
76 | li, | |
77 | label { | |
19f2f11e NL |
78 | color: #666; |
79 | } | |
80 | ||
81 | a { | |
82 | color: #000; | |
83 | font-weight: bold; | |
84 | } | |
85 | ||
5ecdfcd0 | 86 | a.nostyle { |
1d4d9aaf | 87 | text-decoration: none; |
5ecdfcd0 TC |
88 | } |
89 | ||
90 | a:hover, | |
91 | a:focus { | |
19f2f11e NL |
92 | text-decoration: none; |
93 | } | |
94 | ||
95 | form fieldset { | |
5ecdfcd0 | 96 | border: 0; |
19f2f11e NL |
97 | padding: 0; |
98 | margin: 0; | |
99 | } | |
100 | ||
5ecdfcd0 TC |
101 | form input[type="text"], |
102 | form input[type="number"], | |
103 | select, | |
104 | form input[type="password"], | |
105 | form input[type="url"], | |
106 | form input[type="email"] { | |
19f2f11e NL |
107 | border: 1px solid #999; |
108 | padding: 0.5em 1em; | |
109 | min-width: 12em; | |
110 | color: #666; | |
111 | } | |
112 | ||
5ecdfcd0 TC |
113 | @media screen and (-webkit-min-device-pixel-ratio: 0) { |
114 | select { | |
19f2f11e NL |
115 | -webkit-appearance: none; |
116 | border-radius: 0; | |
5ecdfcd0 | 117 | background: #fff url("../../_global/img/bg-select.png") no-repeat right center; |
19f2f11e NL |
118 | } |
119 | } | |
120 | ||
121 | .inline .row { | |
122 | display: inline-block; | |
123 | margin-right: 0.5em; | |
124 | } | |
125 | ||
126 | .inline label { | |
127 | min-width: 6em; | |
128 | } | |
129 | ||
130 | fieldset label { | |
131 | display: inline-block; | |
132 | min-width: 12.5em; | |
133 | color: #666; | |
134 | } | |
135 | ||
136 | label { | |
137 | margin-right: 0.5em; | |
138 | } | |
139 | ||
140 | form .row { | |
141 | margin-bottom: 0.5em; | |
142 | } | |
143 | ||
5ecdfcd0 TC |
144 | form button, |
145 | input[type="submit"] { | |
146 | cursor: pointer; | |
19f2f11e | 147 | background-color: #000; |
5ecdfcd0 | 148 | color: #fff; |
19f2f11e NL |
149 | padding: 0.5em 1em; |
150 | display: inline-block; | |
5ecdfcd0 | 151 | border: 1px solid #000; |
19f2f11e NL |
152 | } |
153 | ||
5ecdfcd0 TC |
154 | form button:hover, |
155 | form button:focus, | |
156 | input[type="submit"]:hover, | |
157 | input[type="submit"]:focus { | |
158 | background-color: #fff; | |
159 | color: #000; | |
160 | -webkit-transition: all 0.5s ease; | |
161 | -moz-transition: all 0.5s ease; | |
162 | -ms-transition: all 0.5s ease; | |
163 | -o-transition: all 0.5s ease; | |
164 | transition: all 0.5s ease; | |
165 | } | |
19f2f11e NL |
166 | |
167 | #bookmarklet { | |
168 | cursor: move; | |
371ac69a | 169 | } |
19f2f11e | 170 | |
5ecdfcd0 | 171 | h2::after { |
19f2f11e NL |
172 | content: ""; |
173 | height: 4px; | |
174 | width: 70px; | |
175 | background-color: #000; | |
176 | display: block; | |
177 | } | |
178 | ||
179 | .links { | |
180 | padding: 0; | |
181 | margin: 0; | |
182 | } | |
19f2f11e | 183 | |
5ecdfcd0 TC |
184 | .links li { |
185 | list-style: none; | |
186 | margin: 0; | |
187 | padding: 0; | |
188 | } | |
19f2f11e NL |
189 | |
190 | #links { | |
191 | position: fixed; | |
192 | top: 0; | |
193 | width: 10em; | |
194 | left: 0; | |
195 | text-align: right; | |
196 | background-color: #333; | |
197 | padding-top: 9.5em; | |
198 | height: 100%; | |
5ecdfcd0 | 199 | box-shadow: inset -4px 0 20px rgba(0, 0, 0, 0.6); |
19f2f11e NL |
200 | z-index: 15; |
201 | } | |
202 | ||
203 | #main { | |
1d4d9aaf | 204 | margin-left: 12em; |
19f2f11e NL |
205 | position: relative; |
206 | z-index: 10; | |
207 | padding-right: 5%; | |
208 | padding-bottom: 1em; | |
209 | } | |
210 | ||
5ecdfcd0 TC |
211 | #links > li > a { |
212 | display: block; | |
213 | padding: 0.5em 2em 0.5em 1em; | |
214 | color: #fff; | |
215 | position: relative; | |
216 | text-transform: uppercase; | |
217 | text-decoration: none; | |
218 | font-weight: normal; | |
219 | font-family: "PT Sans", sans-serif; | |
220 | -webkit-transition: all 0.5s ease; | |
221 | -moz-transition: all 0.5s ease; | |
222 | -ms-transition: all 0.5s ease; | |
223 | -o-transition: all 0.5s ease; | |
224 | transition: all 0.5s ease; | |
225 | } | |
19f2f11e | 226 | |
5ecdfcd0 TC |
227 | #links > li > a:hover, |
228 | #links > li > a:focus { | |
229 | background-color: #999; | |
230 | color: #000; | |
231 | } | |
19f2f11e | 232 | |
5ecdfcd0 TC |
233 | #links .current::after { |
234 | content: ""; | |
235 | width: 0; | |
236 | height: 0; | |
237 | position: absolute; | |
238 | border-style: solid; | |
239 | border-width: 10px; | |
240 | border-color: transparent #eee transparent transparent; | |
241 | right: 0; | |
242 | top: 50%; | |
243 | margin-top: -10px; | |
244 | } | |
19f2f11e | 245 | |
5ecdfcd0 TC |
246 | #links li:last-child { |
247 | position: fixed; | |
248 | bottom: 1em; | |
249 | width: 10em; | |
250 | } | |
19f2f11e | 251 | |
5ecdfcd0 TC |
252 | #links li:last-child a::before { |
253 | font-size: 1.2em; | |
254 | position: relative; | |
255 | top: 2px; | |
256 | } | |
19f2f11e NL |
257 | |
258 | #sort { | |
5ecdfcd0 TC |
259 | padding: 0; |
260 | list-style-type: none; | |
261 | opacity: 0.5; | |
262 | display: inline-block; | |
19f2f11e NL |
263 | } |
264 | ||
265 | #sort li { | |
5ecdfcd0 TC |
266 | display: inline; |
267 | font-size: 0.9em; | |
19f2f11e NL |
268 | } |
269 | ||
270 | #sort li + li { | |
5ecdfcd0 | 271 | margin-left: 10px; |
19f2f11e NL |
272 | } |
273 | ||
274 | #sort a { | |
5ecdfcd0 TC |
275 | padding: 2px 2px 0; |
276 | vertical-align: middle; | |
19f2f11e NL |
277 | } |
278 | ||
279 | #sort img { | |
5ecdfcd0 | 280 | vertical-align: baseline; |
19f2f11e | 281 | } |
5ecdfcd0 | 282 | |
19f2f11e | 283 | #sort img:hover { |
5ecdfcd0 | 284 | cursor: pointer; |
19f2f11e NL |
285 | } |
286 | ||
287 | #display-mode { | |
288 | float: right; | |
19f2f11e NL |
289 | margin-top: 10px; |
290 | margin-bottom: 10px; | |
291 | opacity: 0.5; | |
292 | } | |
5ecdfcd0 | 293 | |
19f2f11e NL |
294 | #listmode { |
295 | width: 16px; | |
296 | display: inline-block; | |
297 | text-decoration: none; | |
298 | } | |
5ecdfcd0 | 299 | |
19f2f11e | 300 | #listmode.tablemode { |
9f01d0fd | 301 | background-image: url("../../_global/img/table.png"); |
19f2f11e NL |
302 | background-repeat: no-repeat; |
303 | background-position: bottom; | |
304 | } | |
5ecdfcd0 | 305 | |
19f2f11e | 306 | #listmode.listmode { |
9f01d0fd | 307 | background-image: url("../../_global/img/list.png"); |
19f2f11e NL |
308 | background-repeat: no-repeat; |
309 | background-position: bottom; | |
310 | } | |
311 | ||
5ecdfcd0 TC |
312 | #warning_message { |
313 | position: fixed; | |
314 | background-color: #ff6347; | |
315 | z-index: 1000; | |
316 | bottom: 0; | |
317 | left: 0; | |
318 | width: 100%; | |
319 | color: #000; | |
320 | } | |
19f2f11e NL |
321 | |
322 | /* ========================================================================== | |
323 | 2 = Layout | |
324 | ========================================================================== */ | |
371ac69a | 325 | |
19f2f11e | 326 | #content { |
56349e47 | 327 | margin-top: 2em; |
19f2f11e NL |
328 | min-height: 30em; |
329 | } | |
330 | ||
331 | footer { | |
332 | text-align: right; | |
333 | position: relative; | |
334 | bottom: 0; | |
335 | right: 5em; | |
336 | color: #999; | |
337 | font-size: 0.8em; | |
338 | font-style: italic; | |
339 | z-index: 20; | |
340 | } | |
341 | ||
342 | footer a { | |
343 | color: #999; | |
344 | font-weight: normal; | |
345 | } | |
346 | ||
347 | .list-entries { | |
5ecdfcd0 | 348 | letter-spacing: -5px; |
19f2f11e NL |
349 | } |
350 | ||
9f01d0fd NL |
351 | .listmode.entry { |
352 | width: 100%; | |
353 | height: inherit; | |
19f2f11e NL |
354 | } |
355 | ||
1d4d9aaf TC |
356 | .card-entry-labels { |
357 | position: absolute; | |
358 | top: 100px; | |
359 | left: -1em; | |
360 | z-index: 90; | |
361 | max-width: 50%; | |
362 | padding-left: 0; | |
363 | } | |
364 | ||
365 | .card-entry-labels li { | |
366 | margin: 10px 10px 10px auto; | |
367 | padding: 5px 12px 5px 25px; | |
368 | background-color: rgba(0, 0, 0, 0.6); | |
369 | border-radius: 0 3px 3px 0; | |
370 | color: #fff; | |
371 | cursor: default; | |
372 | max-height: 2em; | |
373 | overflow: hidden; | |
374 | text-overflow: ellipsis; | |
375 | white-space: nowrap; | |
376 | } | |
377 | ||
378 | .card-entry-tags { | |
379 | max-height: 2em; | |
380 | overflow-y: hidden; | |
381 | padding: 0; | |
645c0d5b | 382 | margin: 0; |
1d4d9aaf TC |
383 | } |
384 | ||
645c0d5b TC |
385 | .card-entry-tags li, |
386 | .card-entry-tags span { | |
1d4d9aaf TC |
387 | display: inline-block; |
388 | margin: 0 5px; | |
389 | padding: 5px 12px; | |
390 | background-color: rgba(0, 0, 0, 0.6); | |
391 | border-radius: 3px; | |
392 | max-height: 2em; | |
393 | overflow: hidden; | |
394 | text-overflow: ellipsis; | |
645c0d5b TC |
395 | } |
396 | ||
397 | .card-entry-tags a, | |
398 | .card-entry-labels a { | |
399 | text-decoration: none; | |
400 | font-weight: normal; | |
1d4d9aaf TC |
401 | color: #fff; |
402 | } | |
403 | ||
645c0d5b TC |
404 | .nav-panel-add-tag { |
405 | margin-top: 10px; | |
406 | } | |
407 | ||
19f2f11e NL |
408 | .list-entries + .results { |
409 | margin-bottom: 2em; | |
410 | } | |
411 | ||
1c282b1d NL |
412 | .reading-time, |
413 | .created-at { | |
19f2f11e NL |
414 | color: #999; |
415 | font-style: italic; | |
416 | font-weight: normal; | |
417 | font-size: 0.9em; | |
418 | } | |
419 | ||
420 | .estimatedTime small { | |
421 | position: relative; | |
422 | top: -1px; | |
423 | } | |
424 | ||
26864574 | 425 | .entry { |
5ecdfcd0 TC |
426 | background-color: #fff; |
427 | letter-spacing: normal; | |
428 | box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); | |
19f2f11e NL |
429 | display: inline-block; |
430 | width: 32%; | |
431 | margin-bottom: 1.5em; | |
432 | vertical-align: top; | |
1d4d9aaf | 433 | margin-right: 1%; |
19f2f11e NL |
434 | position: relative; |
435 | overflow: hidden; | |
1d4d9aaf TC |
436 | padding: 1.5em 1.5em 3em; |
437 | height: 440px; | |
19f2f11e NL |
438 | } |
439 | ||
5ecdfcd0 | 440 | .entry::before { |
19f2f11e NL |
441 | content: ""; |
442 | width: 0; | |
443 | height: 0; | |
5ecdfcd0 | 444 | border-style: solid; |
1d4d9aaf | 445 | border-color: transparent transparent #000; |
19f2f11e NL |
446 | border-width: 10px; |
447 | position: absolute; | |
448 | bottom: 0.3em; | |
449 | z-index: 10; | |
450 | right: 1.5em; | |
451 | -webkit-transition: all 0.5s ease; | |
5ecdfcd0 TC |
452 | -moz-transition: all 0.5s ease; |
453 | -ms-transition: all 0.5s ease; | |
454 | -o-transition: all 0.5s ease; | |
455 | transition: all 0.5s ease; | |
19f2f11e NL |
456 | } |
457 | ||
5ecdfcd0 | 458 | .entry::after { |
19f2f11e NL |
459 | content: ""; |
460 | position: absolute; | |
461 | height: 7px; | |
462 | width: 100%; | |
463 | bottom: 0; | |
464 | left: 0; | |
465 | background-color: #000; | |
466 | -webkit-transition: all 0.5s ease; | |
5ecdfcd0 TC |
467 | -moz-transition: all 0.5s ease; |
468 | -ms-transition: all 0.5s ease; | |
469 | -o-transition: all 0.5s ease; | |
470 | transition: all 0.5s ease; | |
19f2f11e NL |
471 | } |
472 | ||
26864574 | 473 | .entry:hover { |
5ecdfcd0 | 474 | box-shadow: 0 3px 10px rgba(0, 0, 0, 1); |
19f2f11e NL |
475 | } |
476 | ||
5ecdfcd0 | 477 | .entry:hover::after { |
19f2f11e NL |
478 | height: 40px; |
479 | } | |
480 | ||
5ecdfcd0 | 481 | .entry:hover::before { |
19f2f11e NL |
482 | bottom: 2.4em; |
483 | } | |
484 | ||
26864574 | 485 | .entry:hover h2 a { |
19f2f11e NL |
486 | color: #666; |
487 | } | |
488 | ||
26864574 | 489 | .entry h2 { |
19f2f11e NL |
490 | text-transform: none; |
491 | margin-bottom: 0; | |
492 | line-height: 1.2; | |
493 | } | |
494 | ||
5ecdfcd0 TC |
495 | .entry h2::after { |
496 | content: none; | |
497 | } | |
19f2f11e | 498 | |
26864574 | 499 | .entry h2 a { |
19f2f11e NL |
500 | display: block; |
501 | text-decoration: none; | |
502 | color: #000; | |
503 | word-wrap: break-word; | |
504 | -webkit-transition: all 0.5s ease; | |
5ecdfcd0 TC |
505 | -moz-transition: all 0.5s ease; |
506 | -ms-transition: all 0.5s ease; | |
507 | -o-transition: all 0.5s ease; | |
508 | transition: all 0.5s ease; | |
19f2f11e | 509 | } |
19f2f11e | 510 | |
b026d3b1 | 511 | img.preview { |
1d4d9aaf TC |
512 | max-width: calc(100% + 3em); |
513 | left: -1.5em; | |
514 | position: relative; | |
b026d3b1 NL |
515 | } |
516 | ||
26864574 | 517 | .entry p { |
19f2f11e NL |
518 | color: #666; |
519 | font-size: 0.9em; | |
520 | line-height: 1.7; | |
645c0d5b | 521 | margin-top: 5px; |
19f2f11e NL |
522 | } |
523 | ||
5ecdfcd0 TC |
524 | .entry h2 a::first-letter { |
525 | text-transform: uppercase; | |
526 | } | |
19f2f11e | 527 | |
26864574 | 528 | .entry:hover .tools { |
19f2f11e NL |
529 | bottom: 0; |
530 | } | |
531 | ||
26864574 | 532 | .entry .tools { |
19f2f11e NL |
533 | position: absolute; |
534 | bottom: -50px; | |
535 | left: 0; | |
536 | width: 100%; | |
537 | z-index: 10; | |
538 | padding-right: 0.5em; | |
539 | text-align: right; | |
540 | -webkit-transition: all 0.5s ease; | |
5ecdfcd0 TC |
541 | -moz-transition: all 0.5s ease; |
542 | -ms-transition: all 0.5s ease; | |
543 | -o-transition: all 0.5s ease; | |
544 | transition: all 0.5s ease; | |
19f2f11e NL |
545 | } |
546 | ||
5ecdfcd0 TC |
547 | .entry .tools a { |
548 | color: #666; | |
549 | text-decoration: none; | |
550 | display: block; | |
551 | padding: 0.4em; | |
552 | } | |
19f2f11e | 553 | |
5ecdfcd0 TC |
554 | .entry .tools a:hover { |
555 | color: #fff; | |
556 | } | |
19f2f11e | 557 | |
5ecdfcd0 TC |
558 | .entry .tools li { |
559 | display: inline-block; | |
560 | } | |
19f2f11e | 561 | |
26864574 | 562 | .entry:nth-child(3n+1) { |
19f2f11e NL |
563 | margin-left: 0; |
564 | } | |
565 | ||
566 | .results { | |
567 | letter-spacing: -5px; | |
568 | padding: 0 0 0.5em; | |
569 | } | |
570 | ||
571 | .results > * { | |
572 | display: inline-block; | |
573 | vertical-align: top; | |
574 | letter-spacing: normal; | |
575 | width: 50%; | |
5ecdfcd0 | 576 | text-align: right; |
19f2f11e NL |
577 | } |
578 | ||
624a7c6d | 579 | div.pagination ul { |
19f2f11e | 580 | text-align: right; |
19f2f11e NL |
581 | } |
582 | ||
583 | .nb-results { | |
584 | text-align: left; | |
585 | font-style: italic; | |
586 | color: #999; | |
9f01d0fd | 587 | display: inline-flex; |
19f2f11e NL |
588 | } |
589 | ||
624a7c6d | 590 | div.pagination ul > * { |
19f2f11e NL |
591 | display: inline-block; |
592 | margin-left: 0.5em; | |
593 | } | |
594 | ||
624a7c6d | 595 | div.pagination ul a { |
19f2f11e NL |
596 | color: #999; |
597 | text-decoration: none; | |
598 | } | |
599 | ||
5ecdfcd0 TC |
600 | div.pagination ul a:hover, |
601 | div.pagination ul a:focus { | |
602 | text-decoration: underline; | |
624a7c6d | 603 | } |
19f2f11e | 604 | |
5ecdfcd0 TC |
605 | div.pagination ul .prev.disabled, |
606 | div.pagination ul .next.disabled { | |
19f2f11e NL |
607 | display: none; |
608 | } | |
609 | ||
624a7c6d | 610 | div.pagination ul .current { |
9fb6ac83 FG |
611 | height: 25px; |
612 | padding: 4px 8px; | |
613 | border: 1px solid #d5d5d5; | |
614 | text-decoration: none; | |
615 | font-weight: bold; | |
616 | color: #000; | |
617 | background-color: #ccc; | |
618 | } | |
619 | ||
9aa99128 NL |
620 | .hide { |
621 | display: none; | |
622 | } | |
623 | ||
19f2f11e NL |
624 | /* ========================================================================== |
625 | 2.1 = "save a link" related styles | |
626 | ========================================================================== */ | |
627 | ||
628 | .popup-form { | |
5ecdfcd0 | 629 | background: rgba(0, 0, 0, 0.5); |
19f2f11e NL |
630 | position: absolute; |
631 | top: 0; | |
632 | left: 10em; | |
633 | z-index: 20; | |
634 | height: 100%; | |
635 | width: 100%; | |
636 | margin: 0; | |
b0b893ea | 637 | margin-top: -30% !important; |
19f2f11e NL |
638 | padding: 2em; |
639 | display: none; | |
5ecdfcd0 | 640 | border-left: 1px #eee solid; |
19f2f11e NL |
641 | } |
642 | ||
5ecdfcd0 TC |
643 | .popup-form form { |
644 | background-color: #fff; | |
0d3bafdf JB |
645 | position: absolute; |
646 | top: 0; | |
647 | left: 0; | |
648 | z-index: 20; | |
649 | border: 10px solid #000; | |
650 | width: 400px; | |
651 | height: 200px; | |
652 | padding: 2em; | |
5ecdfcd0 | 653 | } |
19f2f11e NL |
654 | |
655 | #bagit-form-form .addurl { | |
5ecdfcd0 | 656 | margin-left: 0; |
19f2f11e NL |
657 | } |
658 | ||
659 | .closeMessage, | |
660 | .close-button { | |
661 | background-color: #000; | |
5ecdfcd0 TC |
662 | color: #fff; |
663 | font-size: 1.2em; | |
664 | line-height: 1.6; | |
665 | width: 1.6em; | |
666 | height: 1.6em; | |
667 | text-align: center; | |
19f2f11e NL |
668 | text-decoration: none; |
669 | } | |
5ecdfcd0 TC |
670 | |
671 | .closeMessage:hover, | |
672 | .closeMessage:focus, | |
673 | .close-button:hover, | |
674 | .close-button:focus { | |
0d3bafdf JB |
675 | background-color: #999; |
676 | color: #000; | |
5ecdfcd0 | 677 | } |
19f2f11e NL |
678 | |
679 | .close-button--popup { | |
5ecdfcd0 TC |
680 | display: inline-block; |
681 | position: absolute; | |
682 | top: 0; | |
683 | right: 0; | |
684 | font-size: 1.4em; | |
19f2f11e NL |
685 | } |
686 | ||
687 | .active-current { | |
688 | background-color: #999; | |
689 | } | |
690 | ||
5ecdfcd0 | 691 | .active-current::after { |
19f2f11e NL |
692 | content: ""; |
693 | width: 0; | |
694 | height: 0; | |
695 | position: absolute; | |
696 | border-style: solid; | |
697 | border-width: 10px; | |
5ecdfcd0 | 698 | border-color: transparent #eee transparent transparent; |
19f2f11e NL |
699 | right: 0; |
700 | top: 50%; | |
701 | margin-top: -10px; | |
702 | } | |
703 | ||
704 | .opacity03 { | |
705 | opacity: 0.3; | |
706 | } | |
707 | ||
708 | .add-to-wallabag-link-after { | |
709 | background-color: #000; | |
710 | color: #fff; | |
1d4d9aaf | 711 | padding: 0 3px 2px; |
19f2f11e NL |
712 | } |
713 | ||
714 | a.add-to-wallabag-link-after { | |
5ecdfcd0 TC |
715 | visibility: hidden; |
716 | position: absolute; | |
717 | opacity: 0; | |
718 | transition-duration: 2s; | |
719 | transition-timing-function: ease-out; | |
19f2f11e NL |
720 | } |
721 | ||
5ecdfcd0 TC |
722 | #article article a:hover + a.add-to-wallabag-link-after, |
723 | a.add-to-wallabag-link-after:hover { | |
724 | opacity: 1; | |
725 | visibility: visible; | |
726 | transition-duration: 0.3s; | |
727 | transition-timing-function: ease-in; | |
19f2f11e NL |
728 | } |
729 | ||
5ecdfcd0 TC |
730 | a.add-to-wallabag-link-after::after { |
731 | content: "w"; | |
19f2f11e NL |
732 | } |
733 | ||
734 | #add-link-result { | |
735 | font-weight: bold; | |
736 | font-size: 0.9em; | |
737 | } | |
738 | ||
5ecdfcd0 | 739 | .btn-clickable { |
1d4d9aaf | 740 | cursor: pointer; |
5ecdfcd0 TC |
741 | } |
742 | ||
19f2f11e NL |
743 | /* ========================================================================== |
744 | 3 = Pictos | |
745 | ========================================================================== */ | |
371ac69a | 746 | |
19f2f11e | 747 | @font-face { |
5ecdfcd0 | 748 | font-family: icomoon; |
0471e905 | 749 | src: url("../fonts/IcoMoon-Free.ttf"); |
19f2f11e NL |
750 | font-weight: normal; |
751 | font-style: normal; | |
752 | } | |
753 | ||
5ecdfcd0 TC |
754 | @font-face { |
755 | font-family: 'Material Icons'; | |
756 | font-style: normal; | |
757 | font-weight: 400; | |
758 | src: url(../fonts/MaterialIcons-Regular.eot); | |
1d4d9aaf | 759 | |
5ecdfcd0 TC |
760 | /* For IE6-8 */ |
761 | src: local("Material Icons"), local("MaterialIcons-Regular"), url(../fonts/MaterialIcons-Regular.woff2) format("woff2"), url(../fonts/MaterialIcons-Regular.woff) format("woff"), url(../fonts/MaterialIcons-Regular.ttf) format("truetype"); | |
762 | } | |
763 | ||
764 | .material-icons { | |
765 | font-family: 'Material Icons'; | |
766 | font-weight: normal; | |
767 | font-style: normal; | |
768 | font-size: 1em; /* Preferred icon size */ | |
769 | width: 1em; | |
770 | height: 1em; | |
771 | display: inline-block; | |
772 | line-height: 1; | |
773 | text-transform: none; | |
774 | letter-spacing: normal; | |
775 | word-wrap: normal; | |
776 | white-space: nowrap; | |
777 | direction: ltr; | |
778 | ||
779 | /* Support for all WebKit browsers. */ | |
780 | -webkit-font-smoothing: antialiased; | |
1d4d9aaf | 781 | |
5ecdfcd0 TC |
782 | /* Support for Safari and Chrome. */ |
783 | text-rendering: optimizeLegibility; | |
784 | ||
785 | /* Support for Firefox. */ | |
786 | -moz-osx-font-smoothing: grayscale; | |
787 | ||
788 | /* Support for IE. */ | |
789 | font-feature-settings: 'liga'; | |
790 | } | |
791 | ||
792 | .material-icons.md-18 { font-size: 18px; } | |
793 | .material-icons.md-24 { font-size: 24px; } | |
794 | .material-icons.md-36 { font-size: 36px; } | |
795 | .material-icons.md-48 { font-size: 48px; } | |
796 | ||
19f2f11e NL |
797 | .icon span, |
798 | .icon-image span { | |
799 | position: absolute; | |
800 | top: -9999px; | |
801 | } | |
802 | ||
5ecdfcd0 TC |
803 | [class^="icon-"]::before, |
804 | [class*=" icon-"]::before { | |
805 | font-family: icomoon; | |
19f2f11e NL |
806 | speak: none; |
807 | font-style: normal; | |
808 | font-weight: normal; | |
809 | font-variant: normal; | |
810 | text-transform: none; | |
811 | line-height: 1; | |
812 | ||
a494c33e TC |
813 | /* Enable Ligatures ================ */ |
814 | letter-spacing: 0; | |
815 | -webkit-font-feature-settings: "liga"; | |
816 | -moz-font-feature-settings: "liga=1"; | |
817 | -moz-font-feature-settings: "liga"; | |
818 | -ms-font-feature-settings: "liga" 1; | |
819 | -o-font-feature-settings: "liga"; | |
820 | font-feature-settings: "liga"; | |
821 | ||
19f2f11e NL |
822 | /* Better Font Rendering =========== */ |
823 | -webkit-font-smoothing: antialiased; | |
824 | -moz-osx-font-smoothing: grayscale; | |
825 | } | |
826 | ||
5ecdfcd0 TC |
827 | .icon-flattr::before { |
828 | content: "\ead4"; | |
19f2f11e | 829 | } |
5ecdfcd0 TC |
830 | |
831 | .icon-mail::before { | |
832 | content: "\ea86"; | |
19f2f11e | 833 | } |
5ecdfcd0 TC |
834 | |
835 | .icon-up-open::before { | |
19f2f11e NL |
836 | content: "\e80b"; |
837 | } | |
5ecdfcd0 TC |
838 | |
839 | .icon-star::before { | |
840 | content: "\e9d9"; | |
19f2f11e | 841 | } |
5ecdfcd0 TC |
842 | |
843 | .icon-check::before { | |
844 | content: "\ea10"; | |
19f2f11e | 845 | } |
5ecdfcd0 TC |
846 | |
847 | .icon-link::before { | |
848 | content: "\e9cb"; | |
19f2f11e | 849 | } |
5ecdfcd0 TC |
850 | |
851 | .icon-reply::before { | |
19f2f11e NL |
852 | content: "\e806"; |
853 | } | |
5ecdfcd0 TC |
854 | |
855 | .icon-menu::before { | |
856 | content: "\e9bd"; | |
19f2f11e | 857 | } |
5ecdfcd0 TC |
858 | |
859 | .icon-clock::before { | |
19f2f11e NL |
860 | content: "\e803"; |
861 | } | |
5ecdfcd0 TC |
862 | |
863 | .icon-twitter::before { | |
a494c33e | 864 | content: "\ea96"; |
19f2f11e | 865 | } |
5ecdfcd0 TC |
866 | |
867 | .icon-down-open::before { | |
19f2f11e NL |
868 | content: "\e809"; |
869 | } | |
5ecdfcd0 TC |
870 | |
871 | .icon-trash::before { | |
872 | content: "\e9ac"; | |
19f2f11e | 873 | } |
5ecdfcd0 TC |
874 | |
875 | .icon-delete::before { | |
876 | content: "\ea0d"; | |
19f2f11e | 877 | } |
5ecdfcd0 TC |
878 | |
879 | .icon-power::before { | |
880 | content: "\ea14"; | |
19f2f11e | 881 | } |
5ecdfcd0 TC |
882 | |
883 | .icon-arrow-up-thick::before { | |
884 | content: "\ea3a"; | |
19f2f11e | 885 | } |
5ecdfcd0 TC |
886 | |
887 | .icon-rss::before { | |
19f2f11e NL |
888 | content: "\e808"; |
889 | } | |
5ecdfcd0 TC |
890 | |
891 | .icon-print::before { | |
892 | content: "\e954"; | |
19f2f11e | 893 | } |
5ecdfcd0 TC |
894 | |
895 | .icon-reload::before { | |
0cf434c0 JB |
896 | content: "\ea2e"; |
897 | } | |
19f2f11e | 898 | |
5ecdfcd0 TC |
899 | .icon-price-tags::before { |
900 | content: "\e936"; | |
901 | } | |
19f2f11e | 902 | |
a494c33e TC |
903 | .icon-eye::before { |
904 | content: "\e9ce"; | |
905 | } | |
906 | ||
907 | .icon-no-eye::before { | |
908 | content: "\e9d1"; | |
909 | } | |
910 | ||
911 | .icon-calendar::before { | |
912 | content: "\e953"; | |
913 | } | |
914 | ||
5e9009ce NL |
915 | .icon-pencil2::before { |
916 | content: "\e906"; | |
917 | } | |
918 | ||
7b0b3622 NL |
919 | .icon-users::before { |
920 | content: "\e972"; | |
921 | } | |
922 | ||
a494c33e TC |
923 | .icon-time::before { |
924 | content: "\e952"; | |
925 | } | |
926 | ||
19f2f11e | 927 | /* .icon-image class, for image-based icons |
0d3bafdf | 928 | ========================================================================== */ |
19f2f11e NL |
929 | |
930 | .icon-image { | |
5ecdfcd0 | 931 | background-size: 16px 16px; |
9f7d154e TC |
932 | background-repeat: no-repeat; |
933 | background-position: center; | |
5ecdfcd0 TC |
934 | padding-right: 1em !important; |
935 | padding-left: 1em !important; | |
19f2f11e NL |
936 | } |
937 | ||
938 | /* Carrot (http://carrot.org) */ | |
939 | .icon-image--carrot { | |
5ecdfcd0 | 940 | background-image: url("../../_global/img/icons/carrot-icon--white.png"); |
19f2f11e NL |
941 | } |
942 | ||
943 | /* Diaspora */ | |
944 | .icon-image--diaspora { | |
5ecdfcd0 | 945 | background-image: url("../../_global/img/icons/diaspora-icon--black.png"); |
a24c1ee3 | 946 | } |
19f2f11e | 947 | |
8a9604aa NL |
948 | /* Unmark.it */ |
949 | .icon-image--unmark { | |
950 | background-image: url("../../_global/img/icons/unmark-icon--black.png"); | |
951 | } | |
952 | ||
9f3a1cd2 | 953 | /* shaarli */ |
a494c33e TC |
954 | .icon-image--shaarli { |
955 | background-image: url("../../_global/img/icons/shaarli.png"); | |
956 | } | |
957 | ||
fb9f100e F |
958 | /* scuttle */ |
959 | .icon-image--scuttle { | |
960 | background-image: url("../../_global/img/icons/scuttle.png"); | |
961 | } | |
962 | ||
19f2f11e NL |
963 | /* ========================================================================== |
964 | Icon selected | |
965 | ========================================================================== */ | |
966 | ||
5ecdfcd0 TC |
967 | .icon-star.fav::before { |
968 | color: #fff; | |
19f2f11e NL |
969 | } |
970 | ||
5ecdfcd0 TC |
971 | .icon-check.archive::before { |
972 | color: #fff; | |
19f2f11e NL |
973 | } |
974 | ||
975 | /* ========================================================================== | |
976 | 4 = Messages | |
977 | ========================================================================== */ | |
978 | ||
979 | .messages { | |
980 | text-align: left; | |
981 | margin-top: 1em; | |
982 | } | |
983 | ||
5ecdfcd0 TC |
984 | .messages > * { |
985 | display: inline-block; | |
986 | } | |
19f2f11e NL |
987 | |
988 | .warning { | |
19f2f11e NL |
989 | font-weight: bold; |
990 | display: block; | |
991 | width: 100%; | |
992 | } | |
993 | ||
994 | .more-info { | |
5ecdfcd0 | 995 | font-size: 0.85em; |
19f2f11e | 996 | line-height: 1.5; |
5ecdfcd0 | 997 | color: #aaa; |
19f2f11e NL |
998 | } |
999 | ||
5ecdfcd0 | 1000 | .more-info a { |
0d3bafdf | 1001 | color: #aaa; |
5ecdfcd0 | 1002 | } |
19f2f11e NL |
1003 | |
1004 | /* ========================================================================== | |
1005 | 5 = Article | |
1006 | ========================================================================== */ | |
1007 | ||
1008 | #article { | |
1009 | width: 70%; | |
1010 | margin-bottom: 3em; | |
1011 | text-align: justify; | |
1012 | } | |
1013 | ||
1014 | #article .tags { | |
1015 | margin-bottom: 1em; | |
1016 | } | |
1017 | ||
1018 | #article i { | |
1019 | font-style: normal; | |
1020 | } | |
1021 | ||
1022 | blockquote { | |
5ecdfcd0 TC |
1023 | border: 1px solid #999; |
1024 | background-color: #fff; | |
19f2f11e NL |
1025 | padding: 1em; |
1026 | margin: 0; | |
1027 | } | |
1028 | ||
1029 | #article h1 { | |
1030 | text-align: left; | |
1031 | } | |
1032 | ||
5ecdfcd0 TC |
1033 | #article h2, |
1034 | #article h3, | |
1035 | #article h4 { | |
19f2f11e NL |
1036 | text-transform: none; |
1037 | } | |
1038 | ||
5ecdfcd0 | 1039 | #article h2::after { |
19f2f11e NL |
1040 | content: none; |
1041 | } | |
1042 | ||
1043 | .topPosF { | |
1044 | position: fixed; | |
1045 | right: 20%; | |
1046 | bottom: 2em; | |
1047 | font-size: 1.5em; | |
1048 | } | |
1049 | ||
1050 | #article_toolbar { | |
1051 | margin-bottom: 1em; | |
1052 | } | |
1053 | ||
1054 | #article_toolbar li { | |
1055 | display: inline-block; | |
645c0d5b | 1056 | margin: 3px auto; |
19f2f11e NL |
1057 | } |
1058 | ||
1059 | #article_toolbar a { | |
1060 | background-color: #000; | |
1061 | padding: 0.3em 0.5em 0.2em; | |
5ecdfcd0 | 1062 | color: #fff; |
19f2f11e NL |
1063 | text-decoration: none; |
1064 | } | |
371ac69a | 1065 | |
5ecdfcd0 TC |
1066 | #article_toolbar a:hover, |
1067 | #article_toolbar a:focus { | |
56349e47 TC |
1068 | background-color: #999; |
1069 | } | |
1070 | ||
1071 | #nav-btn-add-tag { | |
5ecdfcd0 | 1072 | cursor: pointer; |
56349e47 | 1073 | } |
19f2f11e | 1074 | |
5ecdfcd0 | 1075 | .shaarli::before { |
19f2f11e NL |
1076 | content: "*"; |
1077 | } | |
1078 | ||
fb9f100e F |
1079 | .scuttle::before { |
1080 | content: "*"; | |
1081 | } | |
1082 | ||
19f2f11e NL |
1083 | .return { |
1084 | text-decoration: none; | |
1085 | margin-top: 1em; | |
1086 | display: block; | |
1087 | } | |
1088 | ||
5ecdfcd0 | 1089 | .return::before { |
19f2f11e NL |
1090 | margin-right: 0.5em; |
1091 | } | |
1092 | ||
1093 | .notags { | |
1094 | font-style: italic; | |
1095 | color: #999; | |
1096 | } | |
1097 | ||
1098 | .icon-rss { | |
1099 | background-color: #000; | |
5ecdfcd0 | 1100 | color: #fff; |
19f2f11e NL |
1101 | padding: 0.2em 0.5em; |
1102 | } | |
1103 | ||
5ecdfcd0 | 1104 | .icon-rss::before { |
19f2f11e NL |
1105 | position: relative; |
1106 | top: 2px; | |
1107 | } | |
1108 | ||
1109 | .list-tags li { | |
1110 | margin-bottom: 0.5em; | |
1111 | } | |
1112 | ||
5ecdfcd0 TC |
1113 | .list-tags .icon-rss:hover, |
1114 | .list-tags .icon-rss:focus { | |
1115 | background-color: #fff; | |
19f2f11e NL |
1116 | color: #000; |
1117 | text-decoration: none; | |
1118 | } | |
1119 | ||
1120 | .list-tags a { | |
1121 | text-decoration: none; | |
1122 | } | |
1123 | ||
5ecdfcd0 TC |
1124 | .list-tags a:hover, |
1125 | .list-tags a:focus { | |
19f2f11e NL |
1126 | text-decoration: underline; |
1127 | } | |
1128 | ||
1129 | pre code { | |
0d3bafdf | 1130 | font-family: "Courier New", Courier, monospace; |
19f2f11e NL |
1131 | } |
1132 | ||
c146f694 | 1133 | #filters { |
5def3f58 | 1134 | position: fixed; |
1a5f7e2d | 1135 | width: 20%; |
5def3f58 JB |
1136 | height: 100%; |
1137 | top: 0; | |
1138 | right: 0; | |
5ecdfcd0 | 1139 | background-color: #fff; |
5def3f58 JB |
1140 | padding: 15px; |
1141 | padding-right: 30px; | |
1142 | padding-top: 30px; | |
0d3bafdf | 1143 | border-left: 1px #333 solid; |
5def3f58 | 1144 | z-index: 12; |
5ecdfcd0 | 1145 | min-width: 300px; |
5def3f58 JB |
1146 | } |
1147 | ||
c146f694 | 1148 | #filters form .filter-group { |
5def3f58 | 1149 | margin: 5px; |
d2fcbf5d JB |
1150 | } |
1151 | ||
5ecdfcd0 | 1152 | #download-form { |
1d4d9aaf TC |
1153 | position: fixed; |
1154 | width: 10%; | |
1155 | height: 100%; | |
1156 | top: 0; | |
1157 | right: 0; | |
1158 | background-color: #fff; | |
1159 | padding: 15px; | |
1160 | padding-right: 30px; | |
1161 | padding-top: 30px; | |
1162 | border-left: 1px #333 solid; | |
1163 | z-index: 12; | |
1164 | min-width: 200px; | |
5ecdfcd0 TC |
1165 | } |
1166 | ||
1167 | #download-form li { | |
1d4d9aaf TC |
1168 | display: block; |
1169 | padding: 0.5em 2em 0.5em 1em; | |
1170 | color: #fff; | |
1171 | position: relative; | |
1172 | text-transform: uppercase; | |
1173 | text-decoration: none; | |
1174 | font-weight: 400; | |
1175 | font-family: PT Sans, sans-serif; | |
1176 | transition: all 0.5s ease; | |
5ecdfcd0 | 1177 | } |
19f2f11e NL |
1178 | |
1179 | /* ========================================================================== | |
1180 | 6 = Media Queries | |
1181 | ========================================================================== */ | |
1182 | ||
1183 | @media screen and (max-width: 1050px) { | |
26864574 | 1184 | .entry { |
19f2f11e NL |
1185 | width: 49%; |
1186 | } | |
c146f694 | 1187 | |
26864574 | 1188 | .entry:nth-child(3n+1) { |
19f2f11e NL |
1189 | margin-left: 1.5%; |
1190 | } | |
c146f694 | 1191 | |
26864574 | 1192 | .entry:nth-child(2n+1) { |
19f2f11e NL |
1193 | margin-left: 0; |
1194 | } | |
1195 | } | |
1196 | ||
1197 | @media screen and (max-width: 900px) { | |
1198 | #article { | |
1199 | width: 80%; | |
1200 | } | |
c146f694 | 1201 | |
19f2f11e NL |
1202 | .topPosF { |
1203 | right: 2.5em; | |
1204 | } | |
1205 | } | |
1206 | ||
1207 | @media screen and (max-width: 700px) { | |
26864574 | 1208 | .entry { |
19f2f11e NL |
1209 | width: 100%; |
1210 | margin-left: 0; | |
1211 | } | |
c146f694 | 1212 | |
19f2f11e NL |
1213 | #display-mode { |
1214 | display: none; | |
1215 | } | |
1216 | } | |
1217 | ||
d32e1c42 TC |
1218 | @media screen and (max-height: 770px) { |
1219 | .menu.users, | |
1220 | .menu.internal, | |
1221 | .menu.developer { | |
1222 | display: none; | |
1223 | } | |
1224 | } | |
1225 | ||
19f2f11e | 1226 | @media screen and (max-width: 500px) { |
26864574 | 1227 | .entry { |
19f2f11e NL |
1228 | width: 100%; |
1229 | margin-left: 0; | |
1230 | } | |
5ecdfcd0 | 1231 | |
19f2f11e NL |
1232 | body > header { |
1233 | background-color: #333; | |
1234 | position: fixed; | |
1235 | top: 0; | |
1236 | width: 100%; | |
1237 | height: 3em; | |
1238 | z-index: 11; | |
1239 | } | |
5ecdfcd0 | 1240 | |
19f2f11e NL |
1241 | #links li:last-child { |
1242 | position: static; | |
1243 | width: auto; | |
1244 | } | |
5ecdfcd0 TC |
1245 | |
1246 | #links li:last-child a::before { | |
19f2f11e NL |
1247 | content: none; |
1248 | } | |
5ecdfcd0 | 1249 | |
19f2f11e NL |
1250 | .logo { |
1251 | width: 1.25em; | |
1252 | height: 1.25em; | |
1253 | left: 0; | |
1254 | top: 0; | |
1255 | } | |
5ecdfcd0 | 1256 | |
19f2f11e NL |
1257 | .login > header { |
1258 | position: static; | |
1259 | } | |
5ecdfcd0 | 1260 | |
19f2f11e NL |
1261 | .login form { |
1262 | width: 100%; | |
1263 | position: static; | |
1264 | margin-left: 0; | |
1265 | } | |
5ecdfcd0 | 1266 | |
19f2f11e | 1267 | .login .logo { |
19f2f11e NL |
1268 | height: auto; |
1269 | top: 0.5em; | |
1270 | width: 75px; | |
19f2f11e NL |
1271 | margin-left: -37.5px; |
1272 | } | |
5ecdfcd0 | 1273 | |
19f2f11e NL |
1274 | .desktopHide { |
1275 | display: block; | |
1276 | position: fixed; | |
1277 | z-index: 20; | |
1278 | top: 0; | |
1279 | right: 0; | |
5ecdfcd0 | 1280 | border: 0; |
19f2f11e NL |
1281 | width: 2.5em; |
1282 | height: 2.5em; | |
1283 | cursor: pointer; | |
1284 | background-color: #999; | |
1285 | font-size: 1.2em; | |
1286 | } | |
c146f694 | 1287 | |
5ecdfcd0 TC |
1288 | .desktopHide:hover, |
1289 | .desktopHide:focus { | |
1290 | background-color: #fff; | |
1291 | } | |
1292 | ||
19f2f11e NL |
1293 | #links { |
1294 | display: none; | |
1295 | width: 100%; | |
1296 | height: auto; | |
1297 | padding-top: 3em; | |
1298 | } | |
5ecdfcd0 | 1299 | |
19f2f11e NL |
1300 | #links.menu--open { |
1301 | display: block; | |
1302 | } | |
5ecdfcd0 TC |
1303 | |
1304 | footer { | |
19f2f11e NL |
1305 | position: static; |
1306 | margin-right: 3em; | |
1307 | } | |
5ecdfcd0 | 1308 | |
19f2f11e NL |
1309 | #main { |
1310 | margin-left: 1.5em; | |
1311 | padding-right: 1.5em; | |
1312 | position: static; | |
1313 | margin-top: 3em; | |
1314 | } | |
5ecdfcd0 | 1315 | |
1d4d9aaf TC |
1316 | .card-entry-labels { |
1317 | display: none; | |
1318 | } | |
1319 | ||
19f2f11e NL |
1320 | #article_toolbar .topPosF { |
1321 | display: none; | |
1322 | } | |
1323 | ||
1324 | #article { | |
1325 | width: 100%; | |
1326 | } | |
1327 | ||
1328 | #article h1 { | |
1329 | font-size: 1.5em; | |
1330 | } | |
5ecdfcd0 | 1331 | |
19f2f11e NL |
1332 | #article_toolbar a { |
1333 | padding: 0.3em 0.4em 0.2em; | |
1334 | } | |
371ac69a | 1335 | |
19f2f11e NL |
1336 | #display-mode { |
1337 | display: none; | |
1338 | } | |
1339 | ||
5ecdfcd0 TC |
1340 | .popup-form, |
1341 | #bagit-form, | |
1342 | #search-form { | |
19f2f11e NL |
1343 | left: 0; |
1344 | width: 100%; | |
1345 | border-left: none; | |
1346 | } | |
1347 | ||
1348 | .popup-form form, | |
1349 | #bagit-form form, | |
1350 | #search-form form { | |
1351 | width: 100%; | |
1352 | } | |
1353 | } |