wolnelektury/static/css/master.css

   1 body {
   2     margin: 0 2em 2em 2em;
   3     font: 70% Verdana, Arial, Helvetica, sans-serif;
   4     line-height: 1.5em;
   5     background: #FFF url(/static/img/bg.png) repeat-x;
   6     color: #2F4110;
   7 }
   8
   9 #header {
  10     margin-top: -20px;
  11 }
  12
  13 img {
  14     border: none;
  15 }
  16
  17 a {
  18     color: #295158;
  19     text-decoration: none;
  20 }
  21
  22 a:hover, a:active {
  23     text-decoration: underline;
  24 }
  25
  26 input {
  27     font: 1em Verdana, Arial, Helvetica, sans-serif;
  28 }
  29
  30 h1 {
  31     font: normal normal bold 1.75em Arial, sans-serif;
  32     color: #2F4110;
  33     margin: 0.55em 0 0 0;
  34 }
  35
  36 h2 {
  37     font-size: 1.2em;
  38     font-weight: bold;
  39     color: #2F4110;
  40     margin: 0;
  41 }
  42
  43 h3 {
  44     font-size: 1em;
  45     font-weight: bold;
  46     margin: 0.2em 0 -1em 0;
  47     color: #333;
  48 }
  49
  50 em {
  51     font-style: normal;
  52     background-color: #F5DC7D;
  53 }
  54
  55 .clearboth {
  56     clear: both;
  57 }
  58
  59 .blur {
  60     color: #777;
  61 }
  62
  63 /* ================================== */
  64 /* = Header with logo and user-info = */
  65 /* ================================== */
  66 #header {
  67     position: relative;
  68     margin-top: 1.5em;
  69 }
  70
  71 #header #logo {
  72     float: left;
  73 }
  74
  75 #header #user-info {
  76     margin: 0 0 0 auto;
  77     width: 40em;
  78     text-align: right;
  79 }
  80
  81 #site-description {
  82     margin-top: -1.5em;
  83     height:4.5em;
  84     overflow: hidden;
  85     float: right;
  86     width: 42em;
  87     text-align: right;
  88     color: #777;
  89 }
  90
  91 .lang-menu {
  92         margin-right: 0.7em;
  93         line-height: 24px;
  94 }
  95
  96 .lang-menu button {
  97         color: blue;
  98         border: none;
  99         border-right: 1px solid gray;
 100         -moz-border-radius: 2px;
 101         background: inherit;
 102         cursor: pointer;
 103         padding: 0.2em 0.5em;
 104         font-size: 10px;
 105 }
 106
 107 .lang-menu button:hover {
 108         color: blue;
 109         text-decoration: underline;
 110 }
 111
 112 .lang-menu button.active {
 113         color: black;
 114         text-decoration: none;
 115 }
 116
 117 .lang-menu button.last {
 118         border-right: none;
 119 }
 120
 121 /* ======================== */
 122 /* = Footer with sponsors = */
 123 /* ======================== */
 124 #footer {
 125     border-top: 0.1em solid #999;
 126     color: #777;
 127     font-size: 0.8em;
 128     padding-top: 0.5em;
 129     margin: 2em 0 0 0;
 130 }
 131
 132 #footer p {
 133     margin: 0;
 134 }
 135
 136 #footer a {
 137     color: #999;
 138     text-decoration: underline;
 139 }
 140
 141
 142 /* =============== */
 143 /* = Search form = */
 144 /* =============== */
 145 #search-form {
 146     margin: 0.5em 0;
 147     padding: 0.5em;
 148     background-color: rgb(132, 191, 42);
 149 }
 150
 151 #searchContainer {
 152     width: 100%;
 153     min-height: 65px;
 154     background-color: rgb(132, 191, 42);
 155     padding: 0px 5px;
 156     -moz-border-radius: 4px;
 157     -webkit-border-radius: 4px;
 158     border-radius: 4px;
 159     border-bottom: 0.15em solid #7B9C2D;
 160     border-right: 0.15em solid #7B9C2D;
 161 }
 162
 163 #searchContainer #search-form {
 164     padding: 0;
 165     margin: 0;
 166 }
 167
 168 #search-form p {
 169     margin: 0em 0 0 0;
 170 }
 171
 172 #search-form ol {
 173     margin: 0;
 174     padding: 0;
 175 }
 176
 177 #search-form li {
 178     margin: 2px 0 0 5px;
 179     padding: 0;
 180     list-style: none;
 181     display: block;
 182     float: left;
 183     /*margin-left: 5px;*/
 184 }
 185
 186 #search-form li.category, #search-form li.book-title {
 187     padding: 0.2em 0.5em 0.2em 0.5em;
 188     background-color: rgb(242, 163, 15);
 189     border: 1px solid #BA8722;
 190     border-right: 1px solid #555;
 191     border-bottom: 1px solid #555;
 192     -moz-border-radius: 3px;
 193     -webkit-border-radius: 3px;
 194     border-radius: 3px;
 195     margin-right: 0.25em;
 196 }
 197
 198 #search-form li.book-title {
 199     background-color: #DDD;
 200     border: 1px solid #999;
 201     border-right: 1px solid #555;
 202     border-bottom: 1px solid #555;
 203 }
 204
 205 #search-form input[type=submit] {
 206     color: #444;
 207 }
 208
 209 .ac_input {
 210     width: 300px;
 211     border: 0;
 212 }
 213
 214 p .ac_input {
 215     width: 28em;
 216 }
 217
 218 #searchSubmit {
 219     float: left;
 220     margin-top: 10px;
 221     height: 33px;
 222 }
 223 /* ================== */
 224 /* = Search matches = */
 225 /* ================== */
 226
 227 .matches li:first-letter {
 228     text-transform: uppercase;
 229 }
 230
 231 /* ============== */
 232 /* = Search bar = */
 233 /* ============== */
 234
 235 .collections a {
 236     color: white;
 237     margin: 0 0.5em;
 238 }
 239
 240
 241
 242 /* ============= */
 243 /* = Tags list = */
 244 /* ============= */
 245 #intro {
 246     margin: 0 0 2.5em 0;
 247 }
 248
 249 #tags-description {
 250     color: #777;
 251     margin: 0 0.5em -0.75em 0.5em;
 252 }
 253
 254 #main-page #tags-list {
 255     margin-right: 33%;
 256 }
 257
 258 #categories-list ul, #themes-list ul {
 259     -moz-column-width: 12em;
 260     -webkit-column-width: 12em;
 261     column-width: 12em;
 262 }
 263
 264 #tags-list {
 265     margin-top: 1em;
 266     padding: 1em;
 267     background-color: #FBF9E7;
 268     -moz-border-radius: 4px;
 269     -webkit-border-radius: 4px;
 270     border-radius: 4px;
 271     border-bottom: 0.15em solid #E3D888;
 272     border-right: 0.15em solid #E3D888;
 273 }
 274
 275 #tagged-object-list #tags-list, #book-detail #tags-list {
 276     margin-left: 39em;
 277 }
 278
 279 #book-info, #categories-list {
 280     float: left;
 281     width: 47.5%;
 282 }
 283
 284 #themes-list {
 285     margin-left: 52.5%;
 286 }
 287
 288 #tagged-object-list #categories-list, #book-detail #book-info {
 289     width: 12em;
 290 }
 291
 292 #book-detail #formats .change-sets {
 293     margin-right: 0.5em;
 294 }
 295
 296 #formats .wrap p {
 297     display: block;
 298     width: 100%;
 299     height: 1.5em;
 300     background-color: #EEE;
 301     margin-top: 0.5em;
 302     padding: 0.5em 0;
 303     -moz-border-radius: 4px;
 304     -webkit-border-radius: 4px;
 305     border-radius: 4px;
 306     text-align: center;
 307 }
 308
 309 #czytamysluchajac {
 310     margin-top: 2.5em;
 311 }
 312
 313 #czytamy-sluchajac-info {
 314     width: 400px;
 315     height: 80px;
 316 }
 317
 318 #czytamy-sluchajac-info p {
 319     margin-left: 170px;
 320     padding-top: 1em;
 321     padding-bottom: 0em;
 322 }
 323 li.mp3Player {
 324     list-style-type: none;
 325 }
 326 #formats #czytamysluchajac-logo {
 327     background: white;
 328     text-align: left;
 329     float: left;
 330     width: 140px;
 331     height: 62px;
 332     -moz-border-radius: 0px;
 333     -webkit-border-radius: 0px;
 334     border-radius: 0px;
 335     margin: 0px 20px 10px 10px;
 336 }
 337
 338 #tagged-object-list #themes-list, #book-detail #themes-list {
 339     margin-left: 14em;
 340 }
 341
 342 #tags-list ol, #tags-list ul {
 343     padding: 0;
 344     margin: 0.3em 0 1.2em 0;
 345 }
 346
 347 #tags-list li {
 348     list-style: none;
 349     padding: 0;
 350     margin: 0;
 351 }
 352
 353 #books-list {
 354     width: 38em;
 355     float: left;
 356 }
 357
 358 .all-tags {
 359     display: none;
 360 }
 361
 362 div.shown-tags p, div.all-tags p {
 363     margin: -1em 0 1em 0;
 364     text-align: right;
 365 }
 366
 367 .show-all-tags, .hide-all-tags {
 368     text-decoration: underline;
 369     padding-right: 1em;
 370 }
 371
 372 .subcategories {
 373     display: block;
 374     padding-left: 2em;
 375     padding-bottom: 0.5em;
 376 }
 377
 378
 379 /* ============== */
 380 /* = Propaganda = */
 381 /* ============== */
 382 #propaganda {
 383     float: right;
 384     width: 30%;
 385     margin: 0;
 386     padding: 2em 0.5em 0.5em;
 387 }
 388
 389
 390 /* ===================== */
 391 /* = Other info        = */
 392 /* ===================== */
 393 #latest-blog-posts {
 394     padding: 0.5em;
 395     float: left;
 396     width: 30%;
 397 }
 398
 399 #latest-blog-posts ol {
 400     padding: 0 0 0 1.5em;
 401     margin: 1em 0 0 0;
 402     list-style-type: square;
 403     color: #D13628;
 404 }
 405
 406 #you-can-help {
 407     float: right;
 408     padding: 0.5em;
 409     width: 30%;
 410 }
 411
 412 #about-us {
 413     padding: 0.5em;
 414     margin-left: 35%;
 415     margin-right: 35%;
 416 }
 417
 418 /* =============== */
 419 /* = Description = */
 420 /* =============== */
 421 #description {
 422     margin-top: 0.5em;
 423     text-align: justify;
 424     overflow: hidden;
 425 }
 426 #description-short {
 427         display:none;
 428 }
 429
 430 #description .meta {
 431     margin: 0.5em;
 432     width: 18em;
 433     list-style: none;
 434     float: right;
 435 }
 436
 437 #description dt {
 438     font-weight: bold;
 439     display: inline;
 440 }
 441
 442 #description dd {
 443     margin: 0;
 444     display: inline;
 445 }
 446
 447 #toggle-description, #tagged-object-list .pagination, #book-detail .pagination {
 448     width: 100%;
 449     height: 1.5em;
 450     background-color: #EEE;
 451     margin-top: 0.5em;
 452     -moz-border-radius: 4px;
 453     -webkit-border-radius: 4px;
 454     border-radius: 4px;
 455     text-align: center;
 456 }
 457
 458 #toggle-description p {
 459     margin: 0;
 460     padding: 0;
 461     color: #999;
 462 }
 463
 464 #download-shelf {
 465     display: block;
 466     width: 100%;
 467     height: 1.5em;
 468     background-color: #EEE;
 469     margin-top: 0.5em;
 470     padding: 0.5em 0;
 471     -moz-border-radius: 4px;
 472     -webkit-border-radius: 4px;
 473     border-radius: 4px;
 474     text-align: center;
 475     outline: none;
 476 }
 477
 478 #download-shelf-menu {
 479     -moz-border-radius: 4px;
 480     -webkit-border-radius: 4px;
 481     border-radius: 4px;
 482     border: 3px solid #EEE;
 483     padding: 5px;
 484     margin-top: -5px;
 485 }
 486
 487 #download-formats-form li {
 488     float: left;
 489     height: 2em;
 490 }
 491
 492 #download-formats-form input {
 493     float: left;
 494 }
 495
 496 #download-formats-form label {
 497     display: block;
 498     background-color: #EEE;
 499     float: left;
 500     width: 8em;
 501     margin-right: 0.5em;
 502     margin-top: -0.5em;
 503     padding-top: 0.5em;
 504     padding-bottom: 0.75em;
 505 }
 506
 507 #download-formats-form li {
 508     margin: 0;
 509     padding: 0;
 510     list-style: none;
 511 }
 512
 513 #download-formats-form em {
 514     color: #999;
 515     background-color: #FFF;
 516 }
 517
 518 #download-formats-form em strong {
 519     color: #000;
 520     font-weight: normal;
 521 }
 522
 523 #download-formats-form-submit {
 524     margin-left: 0.5em;
 525
 526 }
 527
 528 #download-formats-form #download-formats-form-submit-li {
 529     margin-top: 0.75em;
 530 }
 531
 532 #download-formats-form-cancel {
 533     color: #900;
 534 }
 535
 536 #toggle-share-shelf {
 537     display: block;
 538     width: 100%;
 539     height: 1.5em;
 540     background-color: #EEE;
 541     margin-top: 0.5em;
 542     padding: 0.5em 0;
 543     -moz-border-radius: 4px;
 544     -webkit-border-radius: 4px;
 545     border-radius: 4px;
 546     text-align: center;
 547     outline: none;
 548 }
 549 #toggle-share-shelf p {
 550         margin:0;
 551 }
 552
 553 #share-shelf {
 554     -moz-border-radius: 4px;
 555     -webkit-border-radius: 4px;
 556     border-radius: 4px;
 557     border: 3px solid #EEE;
 558     padding: 5px;
 559     margin-top: -5px;
 560 }
 561 #share-shelf input {
 562         width: 100%;
 563 }
 564
 565
 566 /* ============================ */
 567 /* = Books and fragments list = */
 568 /* ============================ */
 569 #books-list {
 570     margin: 0;
 571 }
 572
 573 #books-list ol {
 574     list-style: none;
 575     padding: 0;
 576     margin: 1.5em 0;
 577 }
 578
 579 .book {
 580     padding: 0.5em;
 581     background-color: #FFF;
 582     -moz-border-radius: 3px;
 583     -webkit-border-radius: 3px;
 584     border-radius: 3px;
 585 }
 586
 587 .fragment {
 588     border-bottom: 0.1em solid #EEE;
 589     margin-top: 0.5em;
 590 }
 591
 592 .fragment-text, .fragment-short-text {
 593     padding: 0.5em;
 594     background-color: #FFF;
 595     -moz-border-radius: 3px;
 596     -webkit-border-radius: 3px;
 597     border-radius: 3px;
 598 }
 599
 600 .fragment-metadata {
 601     padding: 0.5em 0.5em 1.5em 0.5em;
 602     float: right;
 603 }
 604
 605 .change-sets {
 606     float: right;
 607 }
 608
 609 .change-sets a {
 610     padding: 0.2em;
 611     margin: 0.3em;
 612     border: 0.1em solid #EEE;
 613     background-color: #F9F9F9;
 614 }
 615
 616 .book-description {
 617     margin-left: 3.5em;
 618 }
 619
 620 .book-thumbnail, .book-parent-thumbnail {
 621     background: transparent url(/static/img/book.png) no-repeat 0 0;
 622     width: 3em;
 623     height: 3em;
 624     float: left;
 625 }
 626
 627 .book-parent-thumbnail {
 628     background: transparent url(/static/img/book-parent.png) no-repeat 0 0;
 629 }
 630
 631
 632 /* =============== */
 633 /* = Simple form = */
 634 /* =============== */
 635 .cuteform ol, .cuteform ul {
 636     padding: 0;
 637     margin: 0;
 638     list-style: none;
 639 }
 640
 641 .cuteform ol li, .cuteform ul li {
 642     margin-top: 0.7em;
 643 }
 644
 645 .cuteform label {
 646     display: block;
 647 }
 648
 649 .cuteform span.help-text {
 650     display: block;
 651     font-size: 0.8em;
 652     color: #999;
 653 }
 654
 655 .cuteform .error {
 656     color: #BF3024;
 657         display: block;
 658 }
 659
 660 /* ================ */
 661 /* = Modal Window = */
 662 /* ================ */
 663 .jqmOverlay { background-color: #000; }
 664
 665 #set-window {
 666     position: absolute;
 667     display: none;
 668     width: 32em;
 669     background-color: transparent;
 670     margin-top: -0.5em;
 671     margin-left: -1em;
 672 }
 673
 674 #set-window div.header {
 675     background-color: #FFF;
 676     border-right: 0.25em solid #DDD;
 677     width: 4em;
 678     padding: 0.5em 1em 0.5em 1em;
 679 }
 680
 681 #set-window div.target {
 682     background-color: #FFF;
 683     border-right: 0.3em solid #DDD;
 684     border-bottom: 0.3em solid #DDD;
 685     padding: 1em;
 686 }
 687
 688 #login-register-window {
 689     position: absolute;
 690     display: none;
 691     width: 24em;
 692     background-color: transparent;
 693     margin-top: -0.5em;
 694     margin-left: 1em;
 695 }
 696
 697 #login-register-window div.header {
 698     background-color: #FFF;
 699     border-right: 0.3em solid #DDD;
 700     width: 4em;
 701     right: 0;
 702     left: auto;
 703     padding: 0.5em 1em 0.5em 1em;
 704     float: right;
 705     text-align: center;
 706 }
 707
 708 #login-register-window div.target {
 709     clear: both;
 710     background-color: #FFF;
 711     border-right: 0.3em solid #DDD;
 712     border-bottom: 0.3em solid #DDD;
 713     padding: 1em;
 714 }
 715
 716 #user-shelves-window {
 717     position: absolute;
 718     display: none;
 719     width: 28em;
 720     background-color: transparent;
 721     margin-top: -0.5em;
 722     margin-left: 1em;
 723 }
 724
 725 #user-shelves-window div.header {
 726     background-color: #FFF;
 727     border-right: 0.3em solid #DDD;
 728     width: 4em;
 729     right: 0;
 730     left: auto;
 731     padding: 0.5em 1em 0.5em 1em;
 732     float: right;
 733     text-align: center;
 734 }
 735
 736 #user-shelves-window div.target {
 737     clear: both;
 738     background-color: #FFF;
 739     border-right: 0.3em solid #DDD;
 740     border-bottom: 0.3em solid #DDD;
 741     padding: 1em;
 742 }
 743
 744 .shelf-list {
 745     list-style: none;
 746     padding: 0;
 747 }
 748
 749 .shelf-list li {
 750     padding: 0.25em;
 751     margin: 0 -0.25em;
 752 }
 753
 754 .shelf-list a.delete-shelf {
 755     color: #900;
 756     float: right;
 757     padding: 0.25em 0.25em 0.25em 1em;
 758     margin: -0.25em;
 759 }
 760
 761 .shelf-list a.delete-shelf:active, .shelf-list a.delete-shelf:hover {
 762     color: #FFF;
 763     background-color: #900;
 764     text-decoration: none;
 765 }
 766
 767 #suggest-window {
 768     position: absolute;
 769     display: none;
 770     width: 35em;
 771     background-color: transparent;
 772     margin-top: -0.5em;
 773     margin-left: 1em;
 774 }
 775
 776 #suggest-window div.header {
 777     background-color: #FFF;
 778     border-right: 0.3em solid #DDD;
 779     width: 4em;
 780     right: 0;
 781     left: auto;
 782     padding: 0.5em 1em 0.5em 1em;
 783     float: right;
 784     text-align: center;
 785 }
 786
 787 #suggest-window div.target {
 788     clear: both;
 789     background-color: #FFF;
 790     border-right: 0.3em solid #DDD;
 791     border-bottom: 0.3em solid #DDD;
 792     padding: 1em;
 793 }
 794 #suggest-form textarea {
 795         width: 30em;
 796 }
 797
 798 /* ======================== */
 799 /* = Alphabetic book list = */
 800 /* ======================== */
 801 #book-list {
 802    padding-left: 50px;
 803 }
 804 #book-list-nav {
 805     position: absolute;
 806     right: 50px;
 807     width: 200px;
 808     border-left: 1px #cfcfcf solid;
 809     padding: 10px;
 810     font-size: 1.2em;
 811 }
 812
 813 #book-list-nav ul {
 814     list-style-type: none;
 815     margin: 5px;
 816     padding: 0;
 817 }
 818
 819 .book-list-show-index {
 820     display: none;
 821     margin: 0;
 822     padding: 0;
 823 }
 824
 825
 826 #book-a-list #book-list ol {
 827     padding-left: 1em;
 828     margin: 0.3em 0 1.2em 0;
 829     list-style: none;
 830 }
 831
 832 #book-a-list #book-list h2 a {
 833     color: black;
 834 }
 835
 836 #book-list-up {
 837     position: fixed;
 838     bottom: 50px;
 839     right: 50px;
 840     border-left: 1px #cfcfcf solid;
 841     padding: 10px;
 842     background-color: white;
 843 }
 844
 845 #top-message {
 846     background-color: #2F4110;
 847     color: #FFF;
 848     margin: 0 -2em;
 849     padding: 0 2.5em;
 850     line-height: 2em;
 851 }
 852
 853 #top-message a {
 854     color: #AAA;
 855 }
 856
 857
 858 /* =========== */
 859 /* = Columns = */
 860 /* =========== */
 861 .column-left {
 862     width: 37em;
 863     float: left;
 864     text-align: justify;
 865     margin-top: 1em;
 866 }
 867
 868 .column-right {
 869     margin-left: 40em;
 870     text-align: justify;
 871     margin-top: 1em;
 872 }
 873
 874 .see-more {
 875     text-align: right;
 876 }
 877
 878 .remove-from-shelf {
 879     float: right;
 880     padding: 0.2em;
 881     margin: 0.3em;
 882     color: #900;
 883 }
 884
 885 .remove-from-shelf:active, .remove-from-shelf:hover {
 886     color: #FFF;
 887     background-color: #900;
 888     text-decoration: none;
 889 }
 890
 891 /* =========== */
 892 /* = Lessons = */
 893 /* =========== */
 894 #lessons {
 895     margin-top: 2.5em;
 896 }
 897
 898 #document-list {
 899     width: 380px;
 900     float: left;
 901 }
 902
 903 #document-list ol {
 904     margin: 0;
 905     padding: 0;
 906     list-style: none;
 907 }
 908
 909 #document-list li a {
 910     padding: 0.5em;
 911     background-color: #FFF;
 912     -moz-border-radius: 3px;
 913     -webkit-border-radius: 3px;
 914     border-radius: 3px;
 915 /*    font-size: 1.2em;*/
 916     font-weight: bold;
 917     width: 370px;
 918     margin-bottom: 0.25em;
 919     display: block;
 920 }
 921
 922 #document-list ul {
 923   padding-left: 30px;
 924   list-style: disc;
 925 }
 926 #document-list li li a {
 927   width: 340px;
 928 }
 929
 930 #document-list li a:hover, #document-list li a.active {
 931     text-decoration: none;
 932     background-color: #EEE;
 933 }
 934
 935 #document-list-body #document-detail {
 936     margin-left: 390px;
 937 }
 938
 939 #document-detail {
 940     width: 480px;
 941 }
 942
 943 #document-detail h2 {
 944     margin: 0.75em 0 0.75em 0;
 945 }
 946
 947 #document-list-body #document-detail .download {
 948     float: right;
 949     margin: 0;
 950     padding: 0
 951 }
 952
 953 /* ====================== */
 954 /* = One percent banner = */
 955 /* ====================== */
 956 #onepercent-banner {
 957     color: #FFF;
 958     margin: 0 -1.1em;
 959     padding: 0 1.1em;
 960     vertical-align: middle;
 961     background-color: #FF6B3C;
 962     height: 60px;
 963     font-size: 1.8em;
 964     line-height: 1.5em;
 965     position: relative;
 966 }
 967
 968 #onepercent-text, #onepercent-line:visited, #onepercent-text:hover, #onepercent-text:active {
 969     display: block;
 970     line-height: 60px;
 971     color: #FFF;
 972     text-decoration: none;
 973 }
 974
 975 #onepercent-text strong {
 976     font-weight: normal;
 977     text-decoration: underline;
 978 }
 979
 980 #onepercent-see-more, #onepercent-see-more:visited, #onepercent-see-more:hover, #onepercent-see-more:active {
 981     position: absolute;
 982     right: 2em;
 983     width: 9em;
 984     text-align: right;
 985     bottom: 0;
 986     font-size: 12px;
 987     color: #FFF;
 988     text-decoration: none;
 989 }
 990 #createNewShelf {
 991 display: none;
 992 }
 993
 994 .widget-code {
 995     overflow: hidden;
 996 }