]> git.immae.eu Git - github/shaarli/Shaarli.git/blob - inc/shaarli.css
Fix menu dynamic resize, padding, private icon pixelation
[github/shaarli/Shaarli.git] / inc / shaarli.css
1 /* Cascading Stylesheet for Shaarli - https://github.com/shaarli/Shaarli */
2
3 body {
4 font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
5 font-size: 10pt;
6 background-color: #ffffff;
7 word-wrap: break-word;
8 }
9
10 input, textarea {
11 background-color: #dedede;
12 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#dedede), to(#ffffff));
13 background: -webkit-linear-gradient(#dedede, #ffffff);
14 background: -moz-linear-gradient(#dedede, #ffffff);
15 background: -ms-linear-gradient(#dedede, #ffffff);
16 background: -o-linear-gradient(#dedede, #ffffff);
17 background: linear-gradient(#dedede, #ffffff);
18 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
19 padding: 5px;
20 border-radius: 5px 5px 5px 5px;
21 border: none;
22 color: #000;
23 }
24
25 a {
26 text-decoration: none;
27 }
28
29 h1 {
30 font-size: 20pt;
31 font-weight: bold;
32 font-style: italic;
33 margin-bottom: 20px;
34 }
35
36 /* Buttons */
37 .bigbutton {
38 background-color: #c0c0c0;
39 background: -moz-linear-gradient(#c0c0c0, #ffffff) repeat scroll 0 0 transparent;
40 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#c0c0c0), to(#ffffff));
41 background: -webkit-linear-gradient(#c0c0c0, #ffffff);
42 background: -ms-linear-gradient(#c0c0c0, #ffffff);
43 background: -o-linear-gradient(#c0c0c0, #ffffff);
44 background: linear-gradient(#c0c0c0, #ffffff);
45 border-radius: 3px 3px 3px 3px;
46 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
47 cursor: pointer;
48 height: 24px;
49 margin-left: 5px;
50 padding: 0 5px;
51 color: #606060;
52 border-style: outset;
53 border-width: 1px;
54 }
55
56 .smallbutton {
57 background-color: #c0c0c0;
58 background: -moz-linear-gradient(#c0c0c0, #ffffff) repeat scroll 0 0 transparent;
59 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#c0c0c0), to(#ffffff));
60 background: -webkit-linear-gradient(#c0c0c0, #ffffff);
61 background: -ms-linear-gradient(#c0c0c0, #ffffff);
62 background: -o-linear-gradient(#c0c0c0, #ffffff);
63 background: linear-gradient(#c0c0c0, #ffffff);
64 border-radius: 3px 3px 3px 3px;
65 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
66 cursor: pointer;
67 height: 20px;
68 margin-left: 5px;
69 padding: 0 5px;
70 color: #606060;
71 border-style: outset;
72 border-width: 1px;
73 }
74
75 /* Small tab on the left of each link with edit/delete buttons. */
76 .button_edit, .button_delete {
77 border-radius: 0;
78 box-shadow: none;
79 border-style: none;
80 border-width: 0;
81 padding: 0;
82 background: none;
83 }
84
85 .linkeditbuttons {
86 position: absolute;
87 left: 2px;
88 padding: 4px 2px 2px 2px;
89
90 -webkit-border-radius: 0px 6px 6px 0px;
91 -moz-border-radius: 0px 6px 6px 0px;
92 -o-border-radius: 0px 6px 6px 0px;
93 -ms-border-radius: 0px 6px 6px 0px;
94 border-radius: 0px 6px 6px 0px;
95 }
96
97 #pageheader #logo {
98 background-image: url('../images/logo.png');
99 background-repeat: no-repeat;
100 float: left;
101 margin: 0 10px 0 10px;
102 width: 105px;
103 height: 55px;
104 cursor: pointer;
105 }
106
107 #pageheader #menu {
108 width: 100%;
109 }
110
111 #pageheader #menu ul {
112 margin: auto;
113 padding: 7px 0px 0px 0px;
114 float: none;
115 }
116
117 #pageheader #menu ul li {
118 list-style: none;
119 display: inline;
120 position: relative;
121 box-sizing: border-box;
122 }
123
124 #pageheader a {
125 background-color: #333333;
126 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#333333), to(#000000));
127 background: -webkit-linear-gradient(#333333, #000000);
128 background: -moz-linear-gradient(#333333, #000000);
129 background: -ms-linear-gradient(#333333, #000000);
130 background: -o-linear-gradient(#333333, #000000);
131 background: linear-gradient(#333333, #000000);
132 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
133 padding: 5px;
134 border-radius: 5px 5px 5px 5px;
135 margin: 10px 3px 3px 3px;
136 color: #A2DD42;
137 text-decoration: none;
138 line-height: 2.5;
139 white-space: nowrap;
140 }
141
142 #pageheader #linkcount {
143 float: right;
144 font-style: italic;
145 color: #bbb;
146 text-align: right;
147 padding-right: 5px;
148 margin: 3px 3px 0px 0px;
149 }
150
151 #pageheader {
152 background-color: #333333;
153 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#333333), to(#111111));
154 background: -webkit-linear-gradient(#333333, #111111);
155 background: -moz-linear-gradient(#333333, #111111);
156 background: -ms-linear-gradient(#333333, #111111);
157 background: -o-linear-gradient(#333333, #111111);
158 background: linear-gradient(#333333, #111111);
159 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
160 width: auto;
161 padding: 0 10px 5px 10px;
162 margin: auto;
163 }
164
165 #pageheader .search {
166 width: 100%;
167 white-space: nowrap;
168 }
169
170 #toolsdiv a {
171 clear: both;
172 }
173
174 #toolsdiv #bookmark {
175 clear: none;
176 }
177
178 #toolsdiv a span {
179 color: #ffffff;
180 }
181
182 .linksperpage, .tagfilter, .searchform, .addform {
183 background-color: #dedede;
184 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#dedede), to(#ffffff));
185 background: -webkit-linear-gradient(#dedede, #ffffff);
186 background: -moz-linear-gradient(#dedede, #ffffff);
187 background: -ms-linear-gradient(#dedede, #ffffff);
188 background: -o-linear-gradient(#dedede, #ffffff);
189 background: linear-gradient(#dedede, #ffffff);
190 display: inline;
191 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
192 padding: 5px;
193 border: none;
194 border-radius: 5px 5px 5px 5px;
195 margin: 10px 3px 3px 3px;
196 color: #cecece;
197 }
198
199 .linksperpage {
200 box-shadow: 0 0 0 rgba(0, 0, 0, 0.5);
201 padding: 3px;
202 }
203
204 .linksperpage input, .tagfilter input, .searchform input, .addform input {
205 border: none;
206 color: #606060;
207 background: none;
208 box-shadow: none;
209 padding: 5px;
210 }
211
212 .linksperpage input {
213 padding: 0;
214 }
215
216 .searchform #searchform_value {
217 width: 30%;
218 }
219
220 .tagfilter {
221 margin-left:24px;
222 }
223
224 .tagfilter #tagfilter_value {
225 width: 10%;
226 }
227
228 .tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton {
229 background-color: #dedede;
230 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#dedede), to(#ffffff));
231 background: -webkit-linear-gradient(#dedede, #ffffff);
232 background: -moz-linear-gradient(#dedede, #ffffff);
233 background: -ms-linear-gradient(#dedede, #ffffff);
234 background: -o-linear-gradient(#dedede, #ffffff);
235 background: linear-gradient(#dedede, #ffffff);
236 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
237 padding: 0 5px 0 5px;
238 margin: 5px 0 5px 0;
239 height: 20px;
240 border-radius: 5px 5px 5px 5px;
241 cursor: pointer;
242 }
243
244 #shaarli_title {
245 font-weight: bold;
246 font-style: italic;
247 margin-top: 0;
248 }
249
250 #shaarli_title a {
251 color: #fff !important;
252 }
253
254 #pageheader a:visited {
255 color: #98C943;
256 text-decoration: none;
257 }
258
259 #pageheader a:hover {
260 color: #FFFFC9;
261 text-decoration: none;
262 }
263
264 #pageheader a:active {
265 color: #bbb;
266 text-decoration: none;
267 }
268
269 #searchcriteria {
270 padding: 4px 0px 5px 5px;
271 font-weight: bold;
272 }
273
274 .paging {
275 padding: 5px;
276 background-color: #777;
277 color: #ccc;
278 text-align: center;
279 clear: both;
280 }
281
282 .paging a:link {
283 color: #ccc;
284 text-decoration: none;
285 }
286
287 .paging a:visited {
288 color: #ccc;
289 }
290
291 .paging a:hover {
292 color: #FFFFC9;
293 }
294
295 .paging a:active {
296 color: #fff;
297 }
298
299 .paging_privatelinks {
300 float: left;
301 }
302
303 .paging_linksperpage {
304 float: right;
305 padding-right: 5px;
306 margin: 0px 10px 2px 0px;
307 }
308
309 .paging_linksperpage form.linksperpage {
310 display: inline;
311 }
312
313 .paging_linksperpage form.linksperpage input {
314 height: 15px;
315 }
316
317 .paging_current {
318 display: inline;
319 color: #fff;
320 padding: 0 20 0 20;
321 }
322
323 .paging_older {
324 margin-right: 15px;
325 }
326
327 .paging_newer {
328 margin-left: 15px;
329 }
330
331 #headerform {
332 color: #ffffff;
333 padding: 5px 5px 5px 5px;
334 clear: both;
335 }
336
337 #headerform input.linkurl {
338 width: 50%;
339 }
340
341 #toolsdiv {
342 color: #ffffff;
343 padding: 5px 5px 5px 5px;
344 clear: left;
345 }
346
347 #uploaddiv {
348 color: #ffffff;
349 padding: 5px 5px 5px 5px;
350 clear: left;
351 }
352
353 #editlinkform {
354 height: 100%;
355 color: #ffffff;
356 padding: 5px 5px 5px 15px;
357 width: 80%;
358 clear: left;
359 }
360
361 #editlinkform textarea, #editlinkform .lf_input {
362 width: 100%;
363 }
364
365 #linklist li {
366 padding: 4px 10px 15px 20px;
367 border-top: 1px solid #bbb;
368 clear: both;
369 background-color: #F2F2F2;
370 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#F2F2F2), to(#ffffff));
371 background: -webkit-linear-gradient(#F2F2F2, #ffffff);
372 background: -moz-linear-gradient(#F2F2F2, #ffffff);
373 background: -ms-linear-gradient(#F2F2F2, #ffffff);
374 background: -o-linear-gradient(#F2F2F2, #ffffff);
375 background: linear-gradient(#F2F2F2, #ffffff);
376 }
377
378 /*
379 #linklist li.publicLinkHightLight:hover, #linklist li:hover {
380 background: #E9FFCE;
381 }
382 */
383
384 .linkdate, .linkarchive {
385 font-size:8pt;
386 color:#888;
387 }
388
389 .linkdate a, .linkarchive a {
390 color:#E28E3F;
391 }
392
393 .linkqrcode {
394 display: inline;
395 position: relative;
396 }
397
398 a.qrcode img {
399 width: 13px;
400 height: 13px;
401 }
402
403 #linklist li.private {
404 background: url('../images/private.png') no-repeat 4px center;
405 padding-left: 30px;
406 }
407
408 #linklist li {
409 padding-left: 30px;
410 }
411
412 .private .linktitle a {
413 color: #969696;
414 }
415
416 .linktitle {
417 font-size: 14pt;
418 font-weight: bold;
419 }
420
421 .linktitle a {
422 text-decoration: none;
423 color: #80AD48;
424 }
425
426 .linktitle a:hover {
427 color: #F57900;
428 }
429
430 .linkdate, .linkarchive {
431 font-size: 8pt;
432 color: #888;
433 }
434
435 .linkdate a, .linkarchive a {
436 background-image: url('../images/calendar.png');
437 padding: 2px 0 3px 20px;
438 background-repeat: no-repeat;
439 text-decoration: none;
440 color: #E28E3F;
441 }
442
443 .linkdate a:hover {
444 color: #F57900 }
445
446 .linkurl {
447 font-size: 8pt;
448 color: #4BAA74;
449 }
450
451 .linkdescription {
452 color: #000;
453 margin-top: 0;
454 margin-bottom: 12px;
455 font-weight: normal;
456 max-height: 400px;
457 overflow: auto;
458 }
459
460 .linkdescription a {
461 text-decoration: none;
462 color: #3465A4;
463 }
464
465 .linkdescription a:hover {
466 color: #F57900;
467 }
468
469 .linktaglist {
470 padding-top: 10px;
471 line-height: 200%;
472 }
473
474 .linktag {
475 font-size: 9pt;
476 background-color: #F2F2F2;
477 background: -webkit-gradient(linear, 0 0, 0 bottom, from(#F2F2F2), to(#ffffff));
478 background: -webkit-linear-gradient(#F2F2F2, #ffffff);
479 background: -moz-linear-gradient(#F2F2F2, #ffffff);
480 background: -ms-linear-gradient(#F2F2F2, #ffffff);
481 background: -o-linear-gradient(#F2F2F2, #ffffff);
482 background: linear-gradient(#F2F2F2, #ffffff);
483 box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
484 padding: 3px 5px 3px 20px;
485 height: 20px;
486 border-radius: 5px;
487 cursor: pointer;
488 background-image: url('../images/tag_blue.png');
489 background-repeat: no-repeat;
490 background-position: 3px center;
491 background-color: #ffffff;
492 }
493
494 .linktag:hover {
495 border-color: #555573;
496 color: #000;
497 }
498
499 .linktag a {
500 color: #777;
501 text-decoration: none;
502 }
503
504 .linktag .remove {
505 border-left: 1px solid #aaa;
506 padding-left: 5px;
507 color:#6767A7;
508 }
509
510 .linkshort {
511 font-size: 8pt;
512 color: #888;
513 }
514
515 .linkshort a {
516 text-decoration: none;
517 color: #393964;
518 }
519
520 .linkshort a:hover {
521 text-decoration: underline;
522 }
523
524 .buttoneditform {
525 display: inline;
526 }
527
528 #footer {
529 font-size: 8pt;
530 text-align: center;
531 color: #888;
532 clear: both;
533 max-width: 30em;
534 margin: 15px auto 15px auto;
535 }
536
537 #footer a {
538 color: #486D08;
539 }
540
541 #footer a:hover {
542 color: #000000;
543 }
544
545 #newversion {
546 background-color: #FFFFA0;
547 color: #000;
548 position: absolute;
549 top: 0;
550 right: 0;
551 padding: 2 7 2 7;
552 font-size: 9pt;
553 }
554
555 #newversion #version_id {
556 text-decoration: blink;
557 }
558
559 #cloudtag {
560 padding-left: 10%;
561 padding-right: 10%;
562 }
563
564 #cloudtag .count {
565 color: #99f;
566 font-size: 9pt;
567 padding-left: 5px;
568 padding-right: 2px;
569 }
570
571 #cloudtag a {
572 color: black;
573 text-decoration: none;
574 }
575
576 #install {
577 margin: 0 20px;
578 }
579
580 #installform {
581 border: 1px solid black;
582 padding: 10px;
583 }
584
585 #installform table {
586 border: none;
587 }
588
589 #installform td {
590 font-size: 10pt;
591 color: black;
592 padding: 10px 5px 10px 5px;
593 clear: left;
594 }
595
596 #installform input.bigbutton {
597 float: right;
598 }
599
600 #changepasswordform {
601 color: #ccc;
602 padding: 10px 5px 10px 5px;
603 clear: left;
604 }
605
606 #changetag {
607 color: #ccc;
608 padding: 10px 5px 10px 5px;
609 clear: left;
610 }
611
612 #changetag #totag {
613 margin-left: 40px;
614 }
615
616 #configform td {
617 color: #ccc;
618 font-size: 10pt;
619 padding: 10px 5px 10px 5px;
620 }
621
622 #configform {
623 color: #ccc;
624 padding: 10px 5px 10px 5px;
625 clear: left;
626 }
627
628 .thumbnail {
629 float: right;
630 margin: 0px 10px 0px 10px;
631 }
632
633 .thumbnail img {
634 border-radius: 5px;
635 box-shadow: 0.5px 0.5px 0.5px 1px #dde4e6;
636 }
637
638 /* If you want thumbnails on the left:
639 .thumbnail {
640 float: left;
641 margin-right: 10px;
642 }
643 .linkcontainer {
644 position: static;
645 margin-left: 130px;
646 }
647 */
648
649 /* --- Picture wall CSS --- */
650 #picwall_container {
651 color: #fff;
652 background-color: #000;
653 clear: both;
654 }
655
656 .picwall_pictureframe {
657 background-color: #000;
658 z-index: 5;
659 position: relative;
660 display: table-cell;
661 vertical-align: middle;
662 width: 90px;
663 height: 90px;
664 overflow: hidden;
665 text-align: center;
666 float: left;
667 }
668
669 .b-lazy {
670 -webkit-transition: opacity 500ms ease-in-out;
671 -moz-transition: opacity 500ms ease-in-out;
672 -o-transition: opacity 500ms ease-in-out;
673 transition: opacity 500ms ease-in-out;
674 opacity: 0;
675 }
676 .b-lazy.b-loaded {
677 opacity: 1;
678 }
679
680 .picwall_pictureframe img {
681 max-width: 100%;
682 height: auto;
683 color: transparent;
684 } /* Adapt the width of the image */
685
686 .picwall_pictureframe a {
687 text-decoration: none;
688 }
689
690 /* CSS to show title when hovering an image - no javascript required. */
691 .picwall_pictureframe span.info {
692 display: none;
693 }
694
695 .picwall_pictureframe:hover span.info {
696 display: block;
697 position: absolute;
698 top: 0;
699 left: 0;
700 width: 90px;
701 font-weight: bold;
702 font-size: 8pt;
703 color: #fff;
704 text-align: left;
705 background-color: transparent;
706 background-color: rgba(0, 0, 0, 0.4);
707 /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
708 filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000);
709 /* IE6\96IE9 */
710 text-shadow: 2px 2px 1px #000000;
711 }
712
713 /* Minimal customisation for jQuery widgets */
714 .ui-autocomplete {
715 background-color: #fff;
716 padding-left: 5px;
717 }
718
719 .ui-state-hover {
720 background-color: #604dff;
721 color: #fff;
722 }
723
724 #linklist li.publicLinkHightLight {
725 background: #ffffff;
726 }
727
728 div#permalinkQrcode {
729 padding: 20px;
730 width: 220px;
731 height: 220px;
732 background-color: #ffffff;
733 border: 1px solid black;
734 position: absolute;
735 top: -100px;
736 left: -100px;
737 text-align: center;
738 font-size: 8pt;
739 z-index: 50;
740 -webkit-box-shadow: 2px 2px 20px 2px #333333;
741 -moz-box-shadow: 2px 2px 20px 2px #333333;
742 -o-box-shadow: 2px 2px 20px 2px #333333;
743 -ms-box-shadow: 2px 2px 20px 2px #333333;
744 box-shadow: 2px 2px 20px 2px #333333;
745 }
746
747 div.daily {
748 font-family: Georgia, 'DejaVu Serif', Norasi, serif;
749 background-color: #E6D6BE;
750 /* Background paper texture by BashCorpo:
751 http://www.bashcorpo.dk/textures.php
752 http://bashcorpo.deviantart.com/art/Grungy-paper-texture-v-5-22966998 */
753 background-image: url("../images/Paper_texture_v5_by_bashcorpo_w1000.jpg");
754 -webkit-background-size: cover;
755 -moz-background-size: cover;
756 -o-background-size: cover;
757 background-size: cover;
758 position: relative;
759 border-bottom: 2px solid black;
760 }
761
762 #daily_col1 {
763 float: left;
764 position: relative;
765 width: 33%;
766 padding-left: 1%;
767 }
768
769 #daily_col2 {
770 float: left;
771 position: relative;
772 width: 33%;
773 }
774
775 #daily_col3 {
776 float: left;
777 position: relative;
778 width: 33%;
779 }
780
781 div.dailyAbout {
782 float: left;
783 border: 1px solid black;
784 font-size: 8pt;
785 position: absolute;
786 left: 10px;
787 top: 15px;
788 padding: 5px 5px 5px 5px;
789 text-align: center;
790 }
791
792 div.dailyAbout a {
793 color: #890500;
794 }
795
796 div.dailyAbout img {
797 position: relative;
798 top: 3px;
799 margin-right: 4px;
800 width: 14px;
801 height: 14px;
802 }
803
804 div.dailyTitle {
805 font-weight: bold;
806 font-size: 44pt;
807 text-align: center;
808 padding: 10px 20px 0px 20px;
809 }
810
811 div.dailyDate {
812 font-size: 12pt;
813 font-weight: bold;
814 text-align: center;
815 padding: 0px 20px 30px 20px;
816 }
817
818 /* Individual entries in "Daily": */
819 div.dailyEntry {
820 margin: 5px 10px 2px 5px;
821 font-size: 11pt;
822 border-top: 1px solid #555;
823 }
824
825 div.dailyEntry a {
826 text-decoration: none;
827 color: #890500;
828 }
829
830 div.dailyEntryTags {
831 font-size: 7.75pt;
832 }
833
834 div.dailyEntryTitle {
835 font-size: 18pt;
836 font-weight: bold;
837 }
838
839 div.dailyEntryLinkdate {
840 font-size: 8pt;
841 }
842
843 div.dailyEntryThumbnail {
844 width: 100%;
845 text-align: center;
846 background-color: rgb(128, 128, 128);
847 background: url(../images/50pc_transparent.png);
848 padding: 4px 0px 2px 0px;
849 }
850
851 div.dailyEntryDescription {
852 margin-top: 10px;
853 margin-bottom: 30px;
854 text-align: justify;
855 overflow: auto;
856 }
857
858 div.dailyNoEntry {
859 text-align: center;
860 padding: 40px 0px 90px 0px;
861 }
862
863 .daily #closing {
864 clear: both;
865 text-align: center;
866 padding-bottom: 20px;
867 }
868
869 /* Common CSS screwdriver */
870 .clear {
871 clear: both;
872 }
873
874 .right {
875 text-align: right;
876 }
877
878 /* For lazy images loading in picture wall.
879 Using http://www.appelsiini.net/projects/lazyload
880 */
881 .lazyimage {
882 display: none;
883 }
884
885 #configuration_table td {
886 border: none;
887 padding: 10px;
888 vertical-align: top;
889 }
890
891 @media print {
892 html {
893 border: none;
894 background: #fff !important;
895 color: #000 !important;
896 }
897
898 body {
899 font-size: 12pt;
900 width: auto !important;
901 margin: auto !important;
902 }
903
904 /* Minimum numer of lines to display when splitting a paragraph
905 over two pages */
906 p {
907 orphans: 3;
908 widows: 3;
909 }
910
911 a {
912 color: #000 !important;
913 text-decoration: none !important;
914 }
915
916 #pageheader, .paging, #linklist li form, #footer {
917 display: none;
918 }
919
920 #linklist li {
921 padding: 2 0 10 0;
922 border-top: 2px solid #000;
923 clear: both;
924 }
925
926 #linklist li.private {
927 background-color: none;
928 border-left: 0;
929 }
930
931 .linkdate {
932 line-height: 2;
933 }
934
935 .linkurl {
936 color: #000;
937 }
938
939 .linkdescription {
940 font-size: 10pt;
941 }
942
943 .linktag {
944 border: 1px solid black;
945 font-style: italic;
946 font-size: 8pt;
947 }
948 }
949
950 @media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 854px) {
951 /* A few fixes for mobile devices (far from perfect). */
952 .nomobile {
953 display: none;
954 }
955
956 #logo {
957 display: none;
958 }
959
960 #pageheader #menu ul {
961 text-align: center;
962 }
963
964 #pageheader #menu a {
965 padding: 5px;
966 border-radius: 5px 5px 5px 5px;
967 margin: 3px;
968 }
969
970 .searchform, .tagfilter {
971 display: block !important;
972 margin: 0px 3px 7px 0px !important;
973 padding: 0px !important;
974 width: 97% !important;
975 }
976
977 .searchform input, .tagfilter input {
978 margin: 0px !important;
979 padding: 0px !important;
980 display: inline !important;
981 }
982
983 .tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton {
984 width: 30%;
985 font-size: smaller;
986 }
987
988 #searchform_value {
989 width: 70% !important;
990 }
991
992 #tagfilter_value {
993 width: 70% !important;
994 }
995
996 div.qrcode {
997 position: relative;
998 float: left;
999 top: -10px;
1000 left: 0px;
1001 }
1002
1003 .paging_privatelinks {
1004 float: none;
1005 }
1006
1007 .paging_linksperpage {
1008 float: none;
1009 margin-bottom: 10px;
1010 font-size: smaller;
1011 }
1012
1013 #paging_older, #paging_newer, .paging_linksperpage a {
1014 border: 1px solid black;
1015 padding: 3px 5px 3px 5px;
1016 background-color: #666;
1017 color: #fff;
1018 border-radius: 5px 5px 5px 5px;
1019 }
1020
1021 .thumbnail {
1022 float: none;
1023 height: auto;
1024 margin: 0px;
1025 text-align: center;
1026 }
1027
1028 #cloudtag {
1029 padding: 0px;
1030 }
1031
1032 div.dailyAbout {
1033 float: none;
1034 position: relative;
1035 width: 100%;
1036 clear: both;
1037 padding: 0px;
1038 top: 0px;
1039 left: 0px;
1040 }
1041
1042 #daily_col1, #daily_col2, #daily_col3 {
1043 float: none;
1044 width: 100%;
1045 padding: 0px;
1046 }
1047
1048 div.dailyTitle {
1049 font-size: 18pt;
1050 margin-top: 5px;
1051 padding: 0px;
1052 }
1053
1054 div.dailyDate {
1055 font-size: 11pt;
1056 padding: 0px;
1057 display: block;
1058 }
1059
1060 div.dailyEntryTitle {
1061 font-size: 16pt;
1062 font-weight: bold;
1063 }
1064
1065 div.dailyEntryDescription {
1066 font-size: 10pt;
1067 }
1068 }
1069
1070 #toolsdiv a.button-description {
1071 clear: none;
1072 }
1073
1074 /* Highlight search results */
1075 .highlight {
1076 background-color: #FFFF33;
1077 }
1078
1079 .center {
1080 text-align: center;
1081 }