tpl/default/css/shaarli.css

   1 /**
   2  * General
   3  */
   4 body {
   5     background: url(../img/noise.png) #c5c5c5;
   6 }
   7
   8 .strong {
   9     font-weight: bold;
  10 }
  11
  12 .clear {
  13     clear: both;
  14 }
  15
  16 .center {
  17     text-align: center;
  18     margin: auto;
  19 }
  20
  21 .label {
  22     display: inline-block;
  23     padding: .25em .4em;
  24     font-size: 75%;
  25     font-weight: 700;
  26     line-height: 1;
  27     text-align: center;
  28     white-space: nowrap;
  29     vertical-align: baseline;
  30     border-radius: .25rem;
  31 }
  32
  33 pre {
  34     max-width: 100%;
  35 }
  36
  37 @font-face {
  38     font-family: 'Roboto Slab';
  39     font-weight: 400;
  40     font-style: normal;
  41     src:
  42     local('Fira Sans'),
  43     local('Fira-Sans-regular'),
  44     url('../fonts/Fira-Sans-regular.woff2') format('woff2'),
  45     url('../fonts/Fira-Sans-regular.woff') format('woff');
  46 }
  47
  48 /**
  49  * Extends Pure grids responsive to hide items.
  50  * Use xx-0 to hide an item on xx screen.
  51  * Display it at any level with xx-visible.
  52  */
  53 .pure-u-0 { display: none !important; }
  54 @media screen and (min-width: 35.5em) {
  55     .pure-u-sm-0 { display: none !important; }
  56     .pure-u-sm-visible { display: inline-block !important; }
  57 }
  58 @media screen and (min-width: 48em) {
  59     .pure-u-md-0 { display: none !important; }
  60     .pure-u-md-visible { display: inline-block !important; }
  61 }
  62 @media screen and (min-width: 64em) {
  63     .pure-u-lg-0 { display: none !important; }
  64     .pure-u-lg-visible { display: inline-block !important; }
  65 }
  66 @media screen and (min-width: 80em) {
  67     .pure-u-xl-0 { display: none !important; }
  68     .pure-u-xl-visible { display: inline-block !important; }
  69 }
  70
  71 .pure-g [class*="pure-u"]{
  72     font-family: Roboto Slab, Arial, sans-serif;
  73 }
  74
  75 /**
  76  * Make pure-extras alert closable.
  77  */
  78 .pure-alert-closable .fa-times {
  79     float: right;
  80 }
  81 .pure-alert-close {
  82     cursor: pointer;
  83 }
  84
  85 .pure-alert-success {
  86     background-color: #1b926c;
  87 }
  88
  89 /**
  90  * MENU
  91  **/
  92 .shaarli-menu {
  93     position: fixed;
  94     top: 0;
  95     width: 100%;
  96     background: #1b926c;
  97     -webkit-font-smoothing: antialiased;
  98     /* Hack to transition with auto height: http://stackoverflow.com/a/8331169/1484919 */
  99     max-height: 2.1em;
 100     transition: max-height 0.5s;
 101     overflow: hidden;
 102     z-index: 999;
 103 }
 104
 105 /* Chrome bugfix: with 100% height, it only displays the first element. */
 106 .pure-menu-item {
 107     height: inherit;
 108 }
 109
 110 .shaarli-menu.open {
 111     max-height: 500px;
 112     transition: max-height 0.75s;
 113 }
 114
 115 .pure-menu-link,
 116 .pure-menu-link:visited,
 117 .pure-menu-selected .pure-menu-link,
 118 .pure-menu-selected .pure-menu-link:visited {
 119     color: #f5f5f5;
 120 }
 121
 122 .pure-menu-link:hover, .pure-menu-link:focus,
 123 .pure-menu-selected .pure-menu-link:hover,
 124 .pure-menu-selected .pure-menu-link:focus {
 125     color: #fff;
 126     background: transparent;
 127
 128 }
 129
 130 .menu-toggle {
 131     width: 34px;
 132     height: 34px;
 133     position: absolute;
 134     top: 0;
 135     right: 0;
 136     display: none;
 137 }
 138
 139 .menu-toggle .bar {
 140     background-color: #b0ddce;
 141     display: block;
 142     width: 20px;
 143     height: 2px;
 144     border-radius: 100px;
 145     position: absolute;
 146     top: 18px;
 147     right: 7px;
 148     transition: all 0.5s;
 149 }
 150
 151 .menu-toggle .bar:first-child {
 152     transform: translateY(-6px);
 153 }
 154
 155 .menu-toggle.x .bar {
 156     transform: rotate(45deg);
 157 }
 158
 159 .menu-toggle.x .bar:first-child {
 160     transform: rotate(-45deg);
 161 }
 162
 163 @media screen and (max-width: 64em) {
 164     .menu-toggle {
 165         display: block;
 166     }
 167 }
 168
 169 .header-buttons {
 170     text-align: right;
 171 }
 172
 173 #linkcount {
 174     color: #252525;
 175     font-size: 0.8em;
 176 }
 177
 178 #search {
 179     position: fixed;
 180     width: 100%;
 181 }
 182
 183 #search input[type="text"] {
 184     width: 250px;
 185     color: #252525;
 186 }
 187
 188 /* because chrome */
 189 #search input[type="text"]::-webkit-input-placeholder {
 190     color: #252525;
 191 }
 192
 193 #search button {
 194     background: transparent;
 195     border: none;
 196     color: #f5f5f5;
 197 }
 198
 199 #search button:hover {
 200     color: #fff;
 201 }
 202
 203 @media screen and (min-width: 64em) {
 204     #search .searchform {
 205         margin-right: 25px;
 206         text-align: right;
 207     }
 208
 209     #search .tagfilter {
 210         margin-left: 25px;
 211         text-align: left;
 212     }
 213 }
 214 @media screen and (max-width: 64em) {
 215     #search {
 216         position: relative;
 217         height: 60px;
 218     }
 219 }
 220
 221 #header-login-form input[type="text"], #header-login-form input[type="password"] {
 222     width: 200px;
 223 }
 224
 225 .subheader-form {
 226     visibility: hidden;
 227     position: fixed;
 228     width: 100%;
 229     text-align: center;
 230     background: #1b926c;
 231     display: block;
 232     z-index: 9999;
 233     height: 30px;
 234     padding: 5px 0;
 235 }
 236
 237 @media screen and (min-width: 64em) {
 238     .subheader-form.open, .subheader-form.open * {
 239         visibility: visible;
 240     }
 241 }
 242 @media screen and (max-width: 64em) {
 243     #search.subheader-form, .subheader-form.open * {
 244         visibility: visible;
 245     }
 246 }
 247
 248 .subheader-form input[type="text"], .subheader-form input[type="password"], .subheader-form .remember-me {
 249     margin: 0 0 5px 0;
 250     padding: 5px 5px 3px 15px;
 251     height: 20px;
 252     width: 20%;
 253     background: #f5f5f5;
 254     border: medium none currentColor;
 255     border-radius: 5px;
 256     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 4px rgba(0, 0, 0, 0.298) inset;
 257     color: #252525;
 258 }
 259
 260 /* because chrome */
 261 .subheader-form input[type="text"]::-webkit-input-placeholder,
 262 .subheader-form input[type="password"]::-webkit-input-placeholder
 263 {
 264     color: #252525;
 265 }
 266
 267 .subheader-form .remember-me {
 268     display: inline-block;
 269     width: auto;
 270     padding: 5px 20px 3px 20px;
 271     cursor: pointer;
 272 }
 273
 274 .subheader-form .remember-me label, .subheader-form .remember-me input {
 275     cursor: pointer;
 276 }
 277
 278 .subheader-form input[type="submit"] {
 279     display: inline-block;
 280     margin: 0 0 5px 0;
 281     height: 25px;
 282     width: 100px;
 283     background: #0C7653;
 284     border: medium none currentColor;
 285     box-shadow: 1px 1px 2px #005C3E, -1px -1px 2px #005C3E;
 286     color: #f5f5f5;
 287 }
 288
 289 .new-version-message {
 290     text-align: center;
 291 }
 292
 293 .new-version-message a {
 294     color: rgb(151, 96, 13);
 295     font-weight: bold;
 296 }
 297
 298 /**
 299  * CONTENT - GENERAL
 300  */
 301 #content {
 302     position: relative;
 303     z-index: 2;
 304 }
 305
 306 @media screen and (max-width: 64em) {
 307     #content {
 308         margin: 2.1em 0 0 0;
 309     }
 310 }
 311
 312 @media screen and (min-width: 64em) {
 313     #content {
 314         margin-top: 33px;
 315     }
 316 }
 317
 318 /**
 319  * CONTENT - LINKLIST PAGING
 320  * 64em -> lg
 321  */
 322 .linklist-filters {
 323     margin: 10px 0;
 324     color: #252525;
 325     font-size: 0.9em;
 326 }
 327
 328 .linklist-filters a {
 329     padding: 2px 5px;
 330     text-decoration: none;
 331 }
 332
 333 .linklist-filters .filter-off {
 334     color: #252525;
 335     background: #f5f5f5;
 336 }
 337
 338 .linklist-filters .filter-on {
 339     color: #b0ddce;
 340     background: #1b926c;
 341 }
 342
 343 .linklist-pages {
 344     margin: 10px 0;
 345     color: #252525;
 346     text-align: center;
 347 }
 348
 349 .linklist-pages a {
 350     color: #252525;
 351     text-decoration: none;
 352 }
 353
 354 .linklist-pages a:hover {
 355     color: #fff;
 356 }
 357
 358 .linksperpage {
 359     margin: 10px 0;
 360     text-align: right;
 361     color: #252525;
 362     font-size: 0.9em;
 363 }
 364
 365 .linksperpage a {
 366     padding: 2px 5px;
 367     text-decoration: none;
 368     color: #252525;
 369     background: #f5f5f5;
 370 }
 371
 372 .linksperpage form {
 373     display: inline;
 374     margin: 0 10px 0 0;
 375 }
 376
 377 .linksperpage input[type="text"] {
 378     width: 28px;
 379     height: 12px;
 380     margin: 0;
 381     padding: 3px 5px 3px 8px;
 382     background: #f5f5f5;
 383     border: medium none currentColor;
 384     color: #252525;
 385     font-size: 0.8em;
 386 }
 387
 388 /**
 389  * CONTENT - LINKLIST ITEMS
 390  */
 391 .linklist-item {
 392     margin: 0 0 15px 0;
 393     background: #f5f5f5;
 394     box-shadow: 2px 2px 0.5em #797979;
 395 }
 396
 397 .linklist-item-title, .linklist-item-title h2  {
 398     margin: 0;
 399     word-wrap: break-word;
 400 }
 401
 402 .linklist-item-title {
 403     background: #f5f5f5;
 404 }
 405
 406 .linklist-item-title h2 {
 407     padding: 3px 10px 0 10px;
 408     line-height: 25px;
 409 }
 410
 411 .linklist-item-title a {
 412     font-size: 0.7em;
 413     color: #252525;
 414     text-decoration: none;
 415     vertical-align: middle;
 416     font-family: Roboto Slab, Arial, sans-serif;
 417 }
 418
 419 .linklist-item-title .linklist-link {
 420     color: #1b926c;
 421 }
 422
 423 .linklist-item-title .linklist-link:visited {
 424     color: #1b926c;
 425 }
 426
 427 .linklist-item-title a:hover, .linklist-item-title .linklist-link:hover{
 428     color: #252525;
 429 }
 430
 431
 432 .linklist-item-title .label-private {
 433     border: solid 1px #F89406;
 434     font-family: Arial, sans-serif;
 435     font-size: 0.65em;
 436     color: #F89406;
 437 }
 438
 439 .linklist-item-title .fold-button {
 440     display: none;
 441 }
 442
 443 .linklist-item-title:after {
 444     display: block;
 445     content:"";
 446     background: linear-gradient(to right, #f5f5f5, #8e8e8e, #f5f5f5);
 447     height: 1px;
 448     width: 90%;
 449     margin: 1px auto 0 auto;
 450 }
 451
 452 .linklist-item-editbuttons {
 453     float: right;
 454     padding: 5px;
 455 }
 456
 457 .linklist-item-editbuttons a {
 458     font-size: 1em;
 459 }
 460
 461 .edit-link {
 462     font-size: 1.2em;
 463     color: #0b5ea6;
 464 }
 465
 466 .delete-link {
 467     font-size: 1.1em;
 468     color: #ac2925 !important;
 469 }
 470
 471 .linklist-item-description {
 472     padding: 10px;
 473     background: #f5f5f5;
 474     font-family: Roboto Slab, Arial, sans-serif;
 475     word-wrap: break-word;
 476     color: #252525;
 477 }
 478
 479 .linklist-item-description a {
 480     text-decoration: none;
 481     color: #1b926c;
 482 }
 483
 484 .linklist-item-description a:hover {
 485     color: #252525;
 486 }
 487
 488 .linklist-item-description a:visited {
 489     color: #14553f;
 490 }
 491
 492 .linklist-item-thumbnail {
 493     margin-top: 10px;
 494     padding: 10px;
 495     float: left;
 496 }
 497
 498 .linklist-item-infos {
 499     padding: 5px 5px 0 5px;
 500     background: #ddd;
 501     color: #252525;
 502 }
 503
 504 .linklist-item-infos a {
 505     color: #505050;
 506     text-decoration: none;
 507 }
 508
 509 .linklist-item-infos a:hover {
 510     color: #000;
 511 }
 512
 513 .linklist-item-infos .linklist-item-tags {
 514     margin: 0 0 5px 0;
 515     font-size: 0.8em;
 516 }
 517
 518 .linklist-item-infos .label-tag {
 519     border: 1px solid #505050;
 520     font-size: 0.9em;
 521 }
 522
 523 .linklist-item-infos .label-tag:hover {
 524     border: 1px solid #000;
 525 }
 526
 527 .linklist-item-infos-dateblock {
 528     font-size: 0.9em;
 529 }
 530
 531 .linklist-plugin-icon {
 532     width: 13px;
 533     height: 13px;
 534 }
 535
 536 .linklist-item-infos-url {
 537     text-align: right;
 538     white-space: nowrap;
 539     overflow: hidden;
 540     text-overflow: ellipsis;
 541     font-size: 0.8em;
 542 }
 543
 544 /** 64em -> lg **/
 545 @media screen and (max-width: 64em) {
 546     .linklist-item-infos-url {
 547         text-align: left;
 548     }
 549 }
 550
 551 /**
 552  * Footer
 553  */
 554 #footer {
 555     margin: 20px 0;
 556     padding: 5px;
 557     text-align: center;
 558     color: #252525;
 559 }
 560
 561 #footer:before {
 562     display: block;
 563     content:"";
 564     background: linear-gradient(to right, #949393, #252525, #949393);
 565     height: 1px;
 566     width: 80%;
 567     margin: 10px auto;
 568 }
 569
 570 #footer a {
 571     color: #252525;
 572 }
 573
 574 /**
 575  * PAGE FORM
 576  */
 577 .page-form {
 578     margin: 20px 0 0 0;
 579     padding: 0 10px 0 10px;
 580     background: #f5f5f5;
 581     box-shadow: 1px 1px 2px #797979;
 582     color: #252525;
 583 }
 584
 585 .page-form .window-title {
 586     margin: 0 0 10px 0;
 587     padding: 10px 0;
 588     width: 100%;
 589     color: #1b926c;
 590     background: #f5f5f5;
 591     text-align: center;
 592 }
 593
 594 .page-form .window-title:after {
 595     display: block;
 596     content:"";
 597     background: linear-gradient(to right, #f5f5f5, #1b926c, #f5f5f5);
 598     height: 1px;
 599     width: 80%;
 600     margin: auto;
 601 }
 602
 603 .page-form .window-subtitle {
 604     text-align: center;
 605 }
 606
 607 .page-form a {
 608     color: #1b926c;
 609     font-weight: bold;
 610 }
 611
 612 .page-form input[type="text"],
 613 .page-form input[type="password"],
 614 .page-form textarea {
 615     margin: 10px 0;
 616     padding: 5px 5px 3px 15px;
 617     height: 30px;
 618     width: 80%;
 619     background: #f5f5f5;
 620     border: medium none currentColor;
 621     border-radius: 5px;
 622     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 4px rgba(0, 0, 0, 0.298) inset;
 623     color: #252525;
 624 }
 625
 626 .page-form textarea {
 627     height: 240px;
 628     padding: 15px 5px 3px 15px;
 629     resize: vertical;
 630     overflow-y: auto;
 631     word-wrap:break-word
 632 }
 633
 634 /* because chrome */
 635 .page-form input[type="text"]::-webkit-input-placeholder,
 636 .page-form input[type="password"]::-webkit-input-placeholder {
 637     color: #252525;
 638 }
 639
 640 .page-form input[type="submit"] {
 641     margin: 15px 5px;
 642     height: 35px;
 643     width: 150px;
 644     background: #1b926c;
 645     border: none;
 646     box-shadow: 1px 1px 1px #ddd, -1px -1px 6px #ddd, -1px 1px 2px #ddd, 1px -1px 2px #ddd;
 647     font-size: 1.2em;
 648     color: #f5f5f5;
 649 }
 650
 651 .page-form select {
 652     color: #252525;
 653 }
 654
 655 /**
 656  * PAGE FORM - LIGHT
 657  */
 658 .page-form-light div, .page-form-light p {
 659     text-align: center;
 660 }
 661
 662 /**
 663  * PAGE FORM - COMPLETE
 664  */
 665 .page-form-complete {
 666     #background: #f5f5f5;
 667 }
 668
 669 .page-form-complete div, .page-form-complete p {
 670     color: #252525;
 671 }
 672
 673 .page-form-complete .form-label, .page-form-complete .form-input {
 674     position: relative;
 675     height: 60px;
 676 }
 677
 678 .page-form-complete .form-label label,
 679 .page-form-complete .form-input input,
 680 .page-form-complete .timezone {
 681     position: absolute;
 682     top: 50%;
 683     transform: translateY(-50%);
 684 }
 685
 686 .page-form-complete .form-label label {
 687     text-align: right;
 688     right: 0;
 689     padding: 0 20px;
 690 }
 691
 692 .page-form-complete .label-name {
 693     font-weight: bold;
 694 }
 695
 696 .page-form-complete .label-desc {
 697     font-size: 0.8em;
 698 }
 699
 700 .page-form-complete input[type="text"],
 701 .page-form-complete input[type="password"],
 702 .page-form-complete textarea {
 703     margin: 0;
 704 }
 705
 706 .page-form section {
 707     margin-top: 20px;
 708 }
 709
 710
 711 .page-form table {
 712     margin: auto;
 713     width: 90%;
 714 }
 715
 716 .page-form table .order {
 717     text-decoration: none;
 718 }
 719
 720 .page-form table, .page-form th, .page-form td {
 721     border-width: 1px 0;
 722     border-style: solid;
 723     border-color: #b0ddce;
 724 }
 725
 726 .page-form th, .page-form td {
 727     padding: 5px;
 728
 729 }
 730
 731 /* Awesomeplete fix */
 732 .page-form .awesomplete {
 733     width: 80%;
 734 }
 735
 736 .page-form .awesomplete input {
 737     width: 100%;
 738 }
 739
 740 .page-form div.awesomplete > ul {
 741     color: black;
 742 }
 743
 744 @media screen and (max-width: 64em) {
 745     .page-form-complete .form-label {
 746         height: inherit;
 747     }
 748
 749     .page-form-complete .form-label label,
 750     .page-form-complete .form-input input,
 751     .page-form-complete .timezone {
 752         position: inherit;
 753         top: inherit;
 754         transform: translateY(0);
 755     }
 756
 757     .page-form-complete .form-input input[type="checkbox"] {
 758         position: absolute;
 759         top: 50%;
 760         right: 50%;
 761         transform: translateY(-50%);
 762     }
 763
 764     .page-form-complete .form-input {
 765         text-align: center;
 766     }
 767
 768     .page-form-complete .form-label label {
 769         display: block;
 770         text-align: left;
 771         margin: 10px 0 0 0;
 772     }
 773
 774     .timezone-continent:after {
 775         content:"\a\a";
 776         white-space: pre;
 777     }
 778
 779     .page-form-complete .radio-buttons {
 780         text-align: left;
 781         padding: 5px 15px;
 782     }
 783 }
 784
 785 /**
 786  * Page visitor (page form extended)
 787  */
 788 .page-visitor {
 789     color: #252525;
 790 }
 791
 792 #page404 {
 793     color: #3f3f3f;
 794 }
 795
 796 /**
 797  * LOGIN
 798  */
 799 #login-form .remember-me {
 800     margin: 5px 0;
 801 }
 802
 803 /**
 804  * Search results
 805  */
 806 .search-result a {
 807     color: white;
 808     text-decoration: none;
 809 }
 810
 811 .search-result .label-tag {
 812     border-color: white;
 813 }
 814
 815 .search-result .label-tag .remove {
 816     border-left: white 1px solid;
 817     padding: 0 0 0 5px;
 818     margin: 0 0 0 5px;
 819 }
 820
 821 /**
 822  * TOOLS
 823  */
 824 .tools-item {
 825     margin: 10px 0;
 826 }
 827
 828 .tools-item .pure-button:hover {
 829     background-image: none;
 830     background-color: #1b926c;
 831     color: #f5f5f5;
 832 }
 833
 834 /**
 835  * PLUGIN ADMIN
 836  */
 837 #pluginform .mobile-row {
 838     font-size: 0.9em;
 839 }
 840
 841 #pluginform .more {
 842     margin-top: 10px;
 843 }
 844
 845 @media screen and (max-width: 64em) {
 846     #pluginform .main-row, #pluginform .main-row td {
 847         border-bottom-style: none;
 848     }
 849
 850     #pluginform .mobile-row, #pluginform .mobile-row td {
 851         border-top-style: none;
 852     }
 853 }
 854
 855
 856 /**
 857  * IMPORT
 858  */
 859 #import-field {
 860     margin: 15px 0;
 861 }
 862
 863 /**
 864  * TAG CLOUD
 865  */
 866 #cloudtag {
 867     padding: 10px;
 868     text-align: center;
 869 }
 870
 871 #cloudtag, #cloudtag a {
 872     color: #000;
 873     text-decoration: none;
 874 }
 875
 876 #cloudtag .count {
 877     color: #7f7f7f;
 878 }
 879
 880 /**
 881  * Picture wall CSS
 882  */
 883 #picwall_container {
 884     margin: 0 10px 10px 10px;
 885     color: #fff;
 886     background-color: #000;
 887     clear: both;
 888 }
 889
 890 .picwall_pictureframe {
 891     background-color: #000;
 892     z-index: 5;
 893     position: relative;
 894     display: table-cell;
 895     vertical-align: middle;
 896     width: 90px;
 897     height: 90px;
 898     overflow: hidden;
 899     text-align: center;
 900     float: left;
 901 }
 902
 903 .b-lazy {
 904     -webkit-transition: opacity 500ms ease-in-out;
 905     -moz-transition: opacity 500ms ease-in-out;
 906     -o-transition: opacity 500ms ease-in-out;
 907     transition: opacity 500ms ease-in-out;
 908     opacity: 0;
 909 }
 910 .b-lazy.b-loaded {
 911     opacity: 1;
 912 }
 913
 914 .picwall_pictureframe img {
 915     max-width: 100%;
 916     height: auto;
 917     color: transparent;
 918 } /* Adapt the width of the image */
 919
 920 .picwall_pictureframe a {
 921     text-decoration: none;
 922 }
 923
 924 /* CSS to show title when hovering an image - no javascript required. */
 925 .picwall_pictureframe span.info {
 926     display: none;
 927 }
 928
 929 .picwall_pictureframe:hover span.info {
 930     display: block;
 931     position: absolute;
 932     top: 0;
 933     left: 0;
 934     width: 90px;
 935     font-weight: bold;
 936     font-size: 8pt;
 937     color: #fff;
 938     text-align: left;
 939     background-color: transparent;
 940     background-color: rgba(0, 0, 0, 0.4);
 941     /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
 942     filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000);
 943     /* IE6\96IE9 */
 944     text-shadow: 2px 2px 1px #000000;
 945 }
 946
 947 /**
 948  * DAILY
 949  */
 950 .daily-desc {
 951     color: #7f7f7f;
 952     font-size: 0.8em;
 953 }
 954
 955 .daily-about a {
 956     color: #343434;
 957     text-decoration: none;
 958 }
 959
 960 .daily-about a:hover {
 961     color: #7f7f7f;
 962 }
 963
 964 .daily-about h3:before, .daily-about h3:after {
 965     display: block;
 966     content:"";
 967     background: linear-gradient(to right, #d5d4d4, #252525, #d5d4d4);
 968     height: 1px;
 969     width: 90%;
 970     margin: 10px auto;
 971 }
 972
 973 .daily-entry {
 974     padding: 0 10px;
 975 }
 976
 977 .daily-entry .daily-entry-title:after {
 978     display: block;
 979     content:"";
 980     background: linear-gradient(to right, #fff, #515151, #fff);
 981     height: 1px;
 982     width: 70%;
 983     margin: 5px auto;
 984 }
 985
 986 .daily-entry .daily-entry-title {
 987     margin: 10px 0 0 0;
 988 }
 989
 990 .daily-entry .daily-entry-title a {
 991     color: #000;
 992     text-decoration: none;
 993 }
 994
 995 .daily-entry .daily-entry-description {
 996     padding: 5px 5px 0 5px;
 997     font-size: 0.9em;
 998     text-align: justify;
 999 }
1000
1001 .daily-entry .daily-entry-tags {
1002     padding: 0 5px 5px 5px;
1003     font-size: 0.8em;
1004 }
1005
1006 .daily-entry-thumbnail {
1007     float: left;
1008     margin: 15px 5px 5px 5px;
1009 }
1010
1011 .daily-entry-description a {
1012     text-decoration: none;
1013     color: #1b926c;
1014 }
1015
1016 .daily-entry-description a:hover {
1017     text-shadow: 1px 1px #ddd;
1018 }
1019
1020 .daily-entry-description a:visited {
1021     color: #20b988;
1022 }