Merge branch 'master' of git@github.com:fnp/wolnelektury
[wolnelektury.git] / 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 }