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