Added "change-sets" button to book_detail.html template.
[wolnelektury.git] / wolnelektury / media / 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(/media/img/bg.png) repeat-x;
6     color: #2F4110;
7 }
8
9 img {
10     border: none;
11 }
12
13 a {
14     color: #295158;
15     text-decoration: none;
16 }
17
18 a:hover, a:active {
19     text-decoration: underline;
20 }
21
22 input {
23     font: 1em Verdana, Arial, Helvetica, sans-serif; 
24 }
25
26 h1 {
27     font: normal normal bold 1.75em Arial, sans-serif;
28     color: #2F4110;
29     margin: 0.55em 0 0 0;
30 }
31
32 h2 {
33     font-size: 1.2em;
34     font-weight: bold;
35     color: #2F4110;
36     margin: 0;
37 }
38
39 h3 {
40     font-size: 1em;
41     font-weight: bold;
42     margin: 0.2em 0 -1em 0;
43     color: #333;
44 }
45
46 em {
47     font-style: normal;
48     background-color: #F5DC7D;
49 }
50
51 .clearboth {
52     clear: both;
53 }
54
55 .blur {
56     color: #777;
57 }
58
59 /* ================================== */
60 /* = Header with logo and user-info = */
61 /* ================================== */
62 #header {
63     position: relative;
64     margin-top: 1.5em;
65 }
66
67 #header #logo {
68     float: left;
69 }
70
71 #header #user-info {
72     margin: 0 0 0 auto;
73     width: 40em;
74     text-align: right;
75 }
76
77 #site-description {
78     margin-top: -1.5em;
79     height:4.5em;
80     overflow: hidden;
81     float: right;
82     width: 42em;
83     text-align: right;
84     color: #777;
85 }
86
87 /* ======================== */
88 /* = Footer with sponsors = */
89 /* ======================== */
90 #footer {
91     border-top: 0.1em solid #999;
92     color: #777;
93     font-size: 0.8em;
94     padding-top: 0.5em;
95     margin: 2em 0 0 0;
96 }
97
98 #footer p {
99     margin: 0;
100 }
101
102 #footer a {
103     color: #999;
104     text-decoration: underline;
105 }
106
107
108 /* =============== */
109 /* = Search form = */
110 /* =============== */
111 #search-form {
112     margin: 0.5em 0;
113     padding: 0.5em;
114     background-color: rgb(132, 191, 42);
115     -moz-border-radius: 4px;
116     -webkit-border-radius: 4px;
117     border-radius: 4px;
118     border-bottom: 0.15em solid #7B9C2D;
119     border-right: 0.15em solid #7B9C2D;
120 }
121
122 #search-form p {
123     margin: 0em 0 0 0;
124 }
125
126 #search-form ol {
127     margin: 0;
128     padding: 0;
129 }
130
131 #search-form li {
132     margin: 0;
133     padding: 0;
134     list-style: none;
135     display: block;
136     float: left;
137 }
138
139 #search-form li.category, #search-form li.book-title {
140     padding: 0.2em 0.5em 0.2em 0.5em;
141     background-color: rgb(242, 163, 15);
142     border: 1px solid #BA8722;
143     border-right: 1px solid #555;
144     border-bottom: 1px solid #555;
145     -moz-border-radius: 3px;
146     -webkit-border-radius: 3px;
147     border-radius: 3px;
148     margin-right: 0.25em;
149 }
150
151 #search-form li.book-title {
152     background-color: #DDD;
153     border: 1px solid #999;
154     border-right: 1px solid #555;
155     border-bottom: 1px solid #555;
156 }
157
158 #search-form input[type=submit] {
159     color: #444;
160 }
161
162 .ac_input {
163     width: 18em;
164 }
165
166 p .ac_input {
167     width: 28em;
168 }
169
170
171 /* ============= */
172 /* = Tags list = */
173 /* ============= */
174 #intro {
175     margin: 0 0 2.5em 0;
176 }
177
178 #tags-description {
179     color: #777;
180     margin: 0 0.5em -0.75em 0.5em;
181 }
182
183 #main-page #tags-list {
184     margin-right: 33%;
185 }
186
187 #categories-list ul, #themes-list ul {
188     -moz-column-width: 12em;
189     -webkit-column-width: 12em;
190     column-width: 12em;
191 }
192
193 #tags-list {
194     margin-top: 1em;
195     padding: 1em;
196     background-color: #FBF9E7;
197     -moz-border-radius: 4px;
198     -webkit-border-radius: 4px;
199     border-radius: 4px;
200     border-bottom: 0.15em solid #E3D888;
201     border-right: 0.15em solid #E3D888;
202 }
203
204 #tagged-object-list #tags-list, #book-detail #tags-list {
205     margin-left: 39em;
206 }
207
208 #book-info, #categories-list {
209     float: left;
210     width: 47.5%;
211 }
212
213 #themes-list {
214     margin-left: 52.5%;
215 }
216
217 #tagged-object-list #categories-list, #book-detail #book-info {
218     width: 12em;
219 }
220
221 #book-detail #formats .change-sets {
222     margin-right: 0.5em;
223 }
224
225 #formats .wrap a {
226     display: block;
227     width: 100%;
228     height: 1.5em;
229     background-color: #EEE;
230     margin-top: 0.5em;
231     padding: 0.5em 0;
232     -moz-border-radius: 4px;
233     -webkit-border-radius: 4px;
234     border-radius: 4px;
235     text-align: center;    
236 }
237
238 #tagged-object-list #themes-list, #book-detail #themes-list {
239     margin-left: 14em;
240 }
241
242 #tags-list ol, #tags-list ul {
243     padding: 0;
244     margin: 0.3em 0 1.2em 0;
245 }
246
247 #tags-list li {
248     list-style: none;
249     padding: 0;
250     margin: 0;
251 }
252
253 #books-list {
254     width: 38em;
255     float: left;
256 }
257
258 .all-tags {
259     display: none;
260 }
261
262 div.shown-tags p, div.all-tags p {
263     margin: -1em 0 1em 0;
264     text-align: right;
265 }
266
267 .show-all-tags, .hide-all-tags {
268     text-decoration: underline;
269     padding-right: 1em;
270 }
271
272 .subcategories {
273     display: block;
274     padding-left: 2em;
275     padding-bottom: 0.5em;
276 }
277
278
279 /* ============== */
280 /* = Propaganda = */
281 /* ============== */
282 #propaganda {
283     float: right;
284     width: 30%;
285     margin: 0;
286     padding: 2em 0.5em 0.5em;
287 }
288
289
290 /* ===================== */
291 /* = Other info        = */
292 /* ===================== */
293 #latest-blog-posts {
294     padding: 0.5em;
295     float: left;
296     width: 30%;
297 }
298
299 #latest-blog-posts ol {
300     padding: 0 0 0 1.5em;
301     margin: 1em 0 0 0;
302     list-style-type: square;
303     color: #D13628;
304 }
305
306 #you-can-help {
307     float: right;
308     padding: 0.5em;
309     width: 30%;
310 }
311
312 #about-us {
313     padding: 0.5em;
314     margin-left: 35%;
315     margin-right: 35%;
316 }
317
318 /* =============== */
319 /* = Description = */
320 /* =============== */
321 #description {
322     margin-top: 0.5em;
323     text-align: justify;
324 }
325
326 #description .meta {
327     margin: 0.5em;
328     width: 18em;
329     list-style: none;
330     float: right;
331 }
332
333 #description dt {
334     font-weight: bold;
335     display: inline;
336 }
337
338 #description dd {
339     margin: 0;
340     display: inline;
341 }
342
343 #toggle-description, #tagged-object-list .pagination, #book-detail .pagination {
344     width: 100%;
345     height: 1.5em;
346     background-color: #EEE;
347     margin-top: 0.5em;
348     -moz-border-radius: 4px;
349     -webkit-border-radius: 4px;
350     border-radius: 4px;
351     text-align: center;
352 }
353
354 #toggle-description p {
355     margin: 0;
356     padding: 0;
357     color: #999;
358 }
359
360 #download-shelf {
361     display: block;
362     width: 100%;
363     height: 1.5em;
364     background-color: #EEE;
365     margin-top: 0.5em;
366     padding: 0.5em 0;
367     -moz-border-radius: 4px;
368     -webkit-border-radius: 4px;
369     border-radius: 4px;
370     text-align: center;    
371 }
372
373 /* ============================ */
374 /* = Books and fragments list = */
375 /* ============================ */
376 #books-list {
377     margin: 0;
378 }
379
380 #books-list ol {
381     list-style: none;
382     padding: 0;
383     margin: 1.5em 0;
384 }
385
386 .book {
387     padding: 0.5em;
388     background-color: #FFF;
389     -moz-border-radius: 3px;
390     -webkit-border-radius: 3px;
391     border-radius: 3px;
392 }
393
394 .fragment {
395     border-bottom: 0.1em solid #EEE;
396     margin-top: 0.5em;
397 }
398
399 .fragment-text, .fragment-short-text {
400     padding: 0.5em;
401     background-color: #FFF;
402     -moz-border-radius: 3px;
403     -webkit-border-radius: 3px;
404     border-radius: 3px;
405 }
406
407 .fragment-metadata {
408     padding: 0.5em 0.5em 1.5em 0.5em;
409     float: right;
410 }
411
412 .change-sets {
413     float: right;
414 }
415
416 .change-sets a {
417     padding: 0.2em;
418     margin: 0.3em;
419     border: 0.1em solid #EEE;
420     background-color: #F9F9F9;
421 }
422
423 .book-description {
424     margin-left: 3.5em;
425 }
426
427 .book-thumbnail, .book-parent-thumbnail {
428     background: transparent url(/media/img/book.png) no-repeat 0 0;
429     width: 3em;
430     height: 3em;
431     float: left;
432 }
433
434 .book-parent-thumbnail {
435     background: transparent url(/media/img/book-parent.png) no-repeat 0 0;
436 }
437
438
439 /* =============== */
440 /* = Simple form = */
441 /* =============== */
442 .cuteform ol, .cuteform ul {
443     padding: 0;
444     margin: 0;
445     list-style: none;
446 }
447
448 .cuteform ol li, .cuteform ul li {
449     margin-top: 0.7em;
450 }
451
452 .cuteform label {
453     display: block;
454 }
455
456 .cuteform span.help-text {
457     display: block;
458     font-size: 0.8em;
459     color: #999;
460 }
461
462 .cuteform .error {
463     color: #BF3024;
464 }
465
466 /* ================ */
467 /* = Modal Window = */
468 /* ================ */
469 .jqmOverlay { background-color: #000; }
470
471 #set-window {
472     position: absolute;
473     display: none;
474     width: 32em;
475     background-color: transparent;
476     margin-top: -0.5em;
477     margin-left: -1em;
478 }
479
480 #set-window div.header {
481     background-color: #FFF;
482     border-right: 0.25em solid #DDD;
483     width: 4em;
484     padding: 0.5em 1em 0.5em 1em;
485 }
486
487 #set-window div.target {
488     background-color: #FFF;
489     border-right: 0.3em solid #DDD;
490     border-bottom: 0.3em solid #DDD;
491     padding: 1em;
492 }
493
494 #login-register-window {
495     position: absolute;
496     display: none;
497     width: 24em;
498     background-color: transparent;
499     margin-top: -0.5em;
500     margin-left: 1em;
501 }
502
503 #login-register-window div.header {
504     background-color: #FFF;
505     border-right: 0.3em solid #DDD;
506     width: 4em;
507     right: 0;
508     left: auto;
509     padding: 0.5em 1em 0.5em 1em;
510     float: right;
511     text-align: center;
512 }
513
514 #login-register-window div.target {
515     clear: both;
516     background-color: #FFF;
517     border-right: 0.3em solid #DDD;
518     border-bottom: 0.3em solid #DDD;
519     padding: 1em;
520 }
521
522 #user-shelves-window {
523     position: absolute;
524     display: none;
525     width: 28em;
526     background-color: transparent;
527     margin-top: -0.5em;
528     margin-left: 1em;
529 }
530
531 #user-shelves-window div.header {
532     background-color: #FFF;
533     border-right: 0.3em solid #DDD;
534     width: 4em;
535     right: 0;
536     left: auto;
537     padding: 0.5em 1em 0.5em 1em;
538     float: right;
539     text-align: center;
540 }
541
542 #user-shelves-window div.target {
543     clear: both;
544     background-color: #FFF;
545     border-right: 0.3em solid #DDD;
546     border-bottom: 0.3em solid #DDD;
547     padding: 1em;
548 }
549
550 .shelf-list {
551     list-style: none;
552     padding: 0;
553 }
554
555 .shelf-list li {
556     padding: 0.25em;
557     margin: 0 -0.25em;
558 }
559
560 .shelf-list a.delete-shelf {
561     color: #900;
562     float: right;
563     padding: 0.25em 0.25em 0.25em 1em;
564     margin: -0.25em;
565 }
566
567 .shelf-list a.delete-shelf:active, .shelf-list a.delete-shelf:hover {
568     color: #FFF;
569     background-color: #900;
570     text-decoration: none;
571 }
572
573 /* ======================== */
574 /* = Alphabetic book list = */
575 /* ======================== */
576 #book-a-list #book-list {
577     -moz-column-width: 24em;
578     -webkit-column-width: 24em;
579     column-width: 24em;
580 }
581
582 #book-a-list #book-list ol {
583     padding: 0;
584     margin: 0.3em 0 1.2em 0;
585     list-style: none;
586 }
587
588 #top-message {
589     background-color: #2F4110;
590     color: #FFF;
591     margin: 0 -2em;
592     padding: 0 2.5em;
593     line-height: 2em;
594 }
595
596 #top-message a {
597     color: #AAA;
598 }
599
600
601 /* =========== */
602 /* = Columns = */
603 /* =========== */
604 .column-left {
605     width: 37em;
606     float: left;
607     text-align: justify;
608     margin-top: 1em;
609 }
610
611 .column-right {
612     margin-left: 40em;
613     text-align: justify;
614     margin-top: 1em;
615 }
616
617 .see-more {
618     text-align: right;
619 }
620
621 .remove-from-shelf {
622     float: right;
623     padding: 0.2em;
624     margin: 0.3em;
625     color: #900;
626 }
627
628 .remove-from-shelf:active, .remove-from-shelf:hover {
629     color: #FFF;
630     background-color: #900;
631     text-decoration: none;
632 }