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