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