d98f1a3e91ec07b9ba0b89264fbac440aba96a32
[edumed.git] / edumed / static / catalogue / css / lesson.scss
1 $px: .0625em;
2
3 /* =================================================== */
4 /* = Common elements: headings, paragraphs and lines = */
5 /* =================================================== */
6
7 /*h1 {
8     font-size: 3em;
9     margin: 1.5em 0;
10     text-align: center;
11     line-height: 1.5em;
12     font-weight: bold;
13 }
14
15 h2 {
16     font-size: 2em;
17     margin: 1.5em 0 0;
18     font-weight: bold;
19     line-height: 1.5em;
20 }
21
22 h3 {
23     font-size: 1.5em;
24     margin: 1.5em 0 0;
25     font-weight: normal;
26     line-height: 1.5em;
27 }
28
29 h4 {
30     font-size: 1em;
31     margin: 1.5em 0 0;
32     line-height: 1.5em;
33 }
34
35 p {
36     margin: 0;
37 }
38 */
39
40 /* ======================== */
41 /* = Footnotes and themes = */
42 /* ======================== */
43
44 .annotation {
45     font-style: normal;
46     font-weight: normal;
47     font-size: 12px;
48     padding-left: 2px;
49     position: relative;
50     top: -4px;
51 }
52
53 #footnotes {
54     margin-top: 3em;
55 }
56
57 #footnotes .annotation {
58     display: block;
59     float: left;
60     width: 2.5em;
61     clear: both;
62 }
63
64 #footnotes div {
65     margin: 1.5em 0 0 0;
66 }
67
68 #footnotes p, #footnotes ul {
69     margin-left: 2.5em;
70     font-size: 0.875em;
71 }
72
73 #footnotes .permalink {
74     font-size: .75em;
75 }
76
77 blockquote {
78     font-size: 0.875em;
79 }
80
81 /* ============= */
82 /* = Numbering = */
83 /* ============= */
84 .verse, .paragraph {
85     position:relative;
86 }
87 .anchor {
88     position: absolute;
89     margin: -0.25em -0.5em;
90     left: -3em;
91     color: #777;
92     font-size: 12px;
93     width: 2em;
94     text-align: center;
95     padding: 0.25em 0.5em;
96     line-height: 1.5em;
97 }
98
99 .anchor:hover, #book-text .anchor:active {
100     color: #FFF;
101     background-color: #CCC;
102 }
103
104 /* =================== */
105 /* = Custom elements = */
106 /* =================== */
107 span.author {
108     font-size: 0.5em;
109     display: block;
110     line-height: 1.5em;
111     margin-bottom: 0.25em;
112 }
113
114 span.collection {
115     font-size: 0.375em;
116     display: block;
117     line-height: 1.5em;
118     margin-bottom: -0.25em;
119 }
120
121 span.subtitle {
122     font-size: 0.5em;
123     display: block;
124     line-height: 1.5em;
125     margin-top: -0.25em;
126 }
127
128 span.translator {
129     font-size: 0.375em;
130     display: block;
131     line-height: 1.5em;
132     margin-top: 0.25em;
133 }
134
135 div.didaskalia {
136     font-style: italic;
137     margin: 0.5em 0 0 1.5em;
138 }
139
140 div.kwestia {
141     margin: 0.5em 0 0;
142 }
143
144 div.stanza {
145     margin: 1.5em 0 0;
146 }
147
148 div.kwestia div.stanza {
149     margin: 0;
150 }
151
152 p.paragraph {
153     text-align: justify;
154     margin: 1.5em 0 0;
155 }
156
157 p.motto {
158     text-align: justify;
159     font-style: italic;
160     margin: 1.5em 0 0;
161 }
162
163 p.motto_podpis {
164     font-size: 0.875em;
165     text-align: right;
166 }
167
168 div.fragment {
169     border-bottom: 0.1em solid #999;
170     padding-bottom: 1.5em;
171 }
172
173 div.note p, div.dedication p, div.note p.paragraph, div.dedication p.paragraph {
174     text-align: right;
175     font-style: italic;
176 }
177
178 hr.spacer {
179     height: 3em;
180     visibility: hidden;
181 }
182
183 hr.spacer-line {
184     margin: 1.5em 0;
185     border: none;
186     border-bottom: 0.1em solid #000;
187 }
188
189 p.spacer-asterisk {
190     padding: 0;
191     margin: 1.5em 0;
192     text-align: center;
193 }
194
195 div.person-list ol {
196     list-style: none;
197     padding: 0 0 0 1.5em;
198 }
199
200 p.place-and-time {
201     font-style: italic;
202 }
203
204 em.math, em.foreign-word, em.book-title, em.didaskalia {
205     font-style: italic;
206 }
207
208 em.author-emphasis {
209     letter-spacing: 0.1em;
210 }
211
212 em.person {
213     font-style: normal;
214     font-variant: small-caps;
215 }
216
217 .verse:after {
218     content: "\feff";
219 }
220
221
222 /* =================================== */
223 /* = Hide some elements for printing = */
224 /* =================================== */
225
226 @media print {
227     #menu {display: none;}
228 }
229
230
231
232 .activity {
233  clear:both;
234 }
235
236 .activity .text {
237     width: 440*$px;
238     margin-right: 20px;
239     float: left;
240 }
241
242 .activity .description p:first-child {
243   margin-top: 0;
244 }
245
246
247
248 .activity {
249     margin-top: 2em;
250
251     .act_counter {
252         float: left;
253         margin-right: .5em;
254         font-size: 2em;
255     }
256
257     .info {
258         float: right;
259         width: 135*$px;
260
261         .infobox {
262             padding: 1em 0;
263             border-top: 1px solid #c9ccce;
264             h1 {
265                 text-transform: uppercase;
266                 font-weight: bold;
267                 margin: 0 0 .5em -35*$px;
268                 padding-left: 35*$px;
269                 line-height: 24px;
270                 font-size: 1em;
271             }
272             p {
273                 margin: 0;
274             }
275
276         }
277         .time h1 {
278             background: url(/static/img/icons/activity-time.png) 0 0 no-repeat;
279         }
280         .kind h1 {
281             background: url(/static/img/icons/activity-kind.png) 0 0 no-repeat;
282         }
283         .materials h1 {
284             background: url(/static/img/icons/activity-tools.png) 0 0 no-repeat;
285         }
286     }
287 }
288
289 .lista {
290     .paragraph {
291         margin: .3em 0;
292     }
293     li {
294         margin: .75em 0;
295     }
296 }
297
298
299 .clearboth {
300  clear: both;
301 }
302
303 #book-text {
304     .caption {
305         margin: 1.5em;
306         p {
307             margin: 0;
308         }
309     }
310 }
311
312 /* utils */
313
314 .clr {
315     clear: both;
316 }
317
318 #book-text .top-link {
319     margin-top: 1em;
320 }
321
322 .help {
323     font-size: .7em;
324     padding: 0 .5em;
325     color: #888;
326     vertical-align: super;
327 }