web: Move some menu items to the bottom.
[gnupg-doc.git] / web / share / site.css
1 /* site.css
2  *
3  * This code is Copyright 1998--2013 The GnuPG Project and licensed
4  * under a Creative Commons Attribution-ShareAlike 3.0 Unported
5  * License.  See the file copying.org for details.
6  */
7
8 /*  Color names as used by lolo's old site design:
9  *   gray              #5c6064
10  *   lightblue         #d0dce8
11  *   darkpurple        #784c6c
12  *   lightpurple       #f0f0fc
13  *   grayedlightpurple #ebebf4
14  */
15
16 body {
17   background-color: #f0f0fc;
18 }
19
20 h1,
21 h2,
22 h3 {
23   color: #5c6064;
24   font-weight: bold;
25   font-variant: small-caps;
26   letter-spacing: 0.1em;
27 }
28
29 h1,
30 h2 {
31   font-size: large;
32 }
33
34 h1:first-letter,
35 h2:first-letter,
36 h3:first-letter {
37   color: #784c6c;
38 }
39
40
41 h1:first-letter,
42 h2:first-letter {
43   font-size: x-large;
44 }
45
46 h3:first-letter {
47   font-size: large;
48 }
49
50 /*
51    Links
52  */
53
54
55 a:link {
56   color: #784c6c;
57   font-weight: bold;
58   text-decoration: none;
59 }
60
61 a:hover {
62   background-color: #d0dce8;
63   font-weight: bold;
64   text-decoration: none;
65 }
66
67 a:visited {
68   color: #5c6064;
69   font-weight: bold;
70   text-decoration: none;
71 }
72
73 a.img:hover {
74   background-color: #f0f0fc;
75 }
76
77
78 /*
79    Raise attention
80  */
81
82 li.important {
83   color: red;
84 }
85
86 span.important {
87   color: red;
88 }
89
90
91 div.urgent {
92   width: 85%;
93   text-align: center;
94   border: solid red;
95   font-weight: bold;
96 }
97
98
99 .ii {
100   display: none !important;
101 }
102
103
104 /*
105    Other elements as commonly used by org-mode
106  */
107 p {
108   margin-top: 1%;
109 }
110
111
112 img {
113     border-width: 0;
114 }
115
116 img.lfloat {
117     float: left;
118     margin-right: 1em;
119 }
120
121 img.rfloat {
122     float: right;
123     margin-left: 1em;
124 }
125
126 .correction
127 {
128     color: #ff0000;
129 }
130
131 div.entry-qotd P
132 {
133   padding-left: 20%;
134   margin-bottom: 0;
135 }
136
137 div.entry-qotd
138 {
139   margin-bottom: 3%;
140 }
141
142
143 .example {
144     overflow: auto;
145 }
146
147
148 #kicker {
149     padding-top: 5%;
150     font-size: 125%;
151     border-bottom: 3px #FFb580 solid;
152     font-family: verdana,helvetica;
153     margin-bottom: 2%;
154 }
155
156
157
158 #header {
159     background: url(/share/logo-gnupg-light-purple-bg.png) center no-repeat;
160     height: 120px;
161     padding: 0px;
162 }
163
164 #cornerImage {
165     width: 128px;
166     height: 130px;
167     margin-top: -7.5em;
168     margin-left: 82%;
169     padding: 0;
170     padding-right: 2%;
171 }
172
173 #leftColumn {
174     float: left;
175     text-align: right;
176     width: 18%;
177 }
178
179
180 /*
181    Navigation
182  */
183 nav ul {
184     list-style: none;
185     font-size: 100%;
186     font-family: verdana,helvetica;
187     margin-bottom: 1em;
188 }
189
190 nav ul ul {
191     font-size: 80%;
192 }
193
194 nav * li a {
195     color: #784c6c;
196 }
197
198
199 nav * li a:after {
200     content: " \21d0";
201     /* FIXME: Hide the arrow using the background color.  We should use
202        width or something similar to get it aligned.  */
203     color: #f0f0fc;
204 }
205
206 nav * li a.selected:after {
207     content: " \21d0";
208     color: #784c6c;
209 }
210
211 nav img {
212     border-width: 0;
213 }
214
215
216 #nav_bottom ul {
217     list-style: none;
218     padding-left: 0;
219     margin-left: 0;
220     float: left;
221 }
222
223 #nav_bottom li {
224     float: left;
225     padding-right: 3em;
226 }
227
228 #nav_bottom p {
229     clear: left;
230     padding-top: 1em;
231 }
232
233 #nav_bottom a {
234     clear: left;
235     font-variant: normal;
236 }
237
238
239 /*
240    Other stuff
241  */
242
243 main {
244     float: left;
245     margin-left: 5%;
246     margin-right: 5%;
247     width: 72%;
248 }
249
250 main ul {
251     list-style: square;
252     padding-left: 0;
253     margin-left: 1em;
254 }
255
256
257 div.outline-text-2 {
258   padding-top: 5px;
259   padding-right: 3px;
260   border-top: 2px solid #5c6064;
261   border-right: 2px solid #784c6c;
262 }
263
264 div.outline-text-3 {
265   padding-top: 3px;
266   padding-right: 3px;
267   border-top: 1px solid #5c6064;
268   border-right: 1px solid #784c6c;
269 }
270
271
272 #rightColumn {
273     float: right;
274     width: 18%;
275     margin-left: 5%;
276     margin-right: 2%;
277     margin-top: 2%;
278 }
279
280 #rightColumn ul {
281     list-style: square;
282     padding-left: 0;
283     margin-left: 1em;
284 }
285
286 #cpyright {
287     padding-top: 4em;
288 }
289
290 #smallnote {
291     font-size: 0.8em;
292 }
293
294 #footer {
295     border-top: 2px solid #5c6064;
296     margin-top: 5em;
297     margin-left: 5%;
298     margin-right: 5%;
299     clear: both;
300     font-size: 0.8em;
301 }
302
303
304 #checkoutSummary {
305     background-color: #f0f0f0;
306 }
307
308
309 .articleRight {
310     float: right;
311     padding: 2%;
312 }
313
314 pre {
315     border: thin black solid;
316     background-color: #C4C4C4;
317     padding: 0.5em;
318     overflow: auto;
319 }
320
321 /* Classes used by makeinfo (manuals).  */
322
323 pre.display {
324     font-family:inherit;
325 }
326 pre.format {
327     font-family:inherit;
328 }
329 pre.smalldisplay {
330     font-family:inherit;
331     font-size:smaller;
332 }
333 pre.smallformat {
334     font-family:inherit;
335     font-size:smaller;
336 }
337 pre.smallexample {
338     font-size:smaller;
339 }
340 pre.smalllisp {
341     font-size:smaller;
342 }
343
344 span.sc {
345     font-variant:small-caps;
346 }
347 span.roman {
348     font-family:serif;
349     font-weight:normal;
350 }
351 span.sansserif {
352     font-family:sans-serif;
353     font-weight:normal;
354 }
355
356
357 /* Table stuff */
358
359 th.left {
360     text-align:center;
361 }
362
363 th.center {
364     text-align:center;
365 }
366
367 th.right {
368     text-align:center;
369 }
370
371 td.left   {
372     text-align:left;
373 }
374
375 td.center {
376     text-align:center;
377 }
378
379 td.right  {
380     text-align:right;
381 }
382
383
384 /* Tag cloudlist.  */
385
386 #tagcloudlist ul {
387     list-style: none;
388     float: left;
389 }
390
391 #tagcloudlist li {
392     float: left;
393     line-height: 130%;
394     font-variant: small-caps;
395     padding-right: 1em;
396 }
397
398 #tagcloudlist li:before  {
399     content: "\00bb\00a0";
400 }
401
402 #tagcloudlist p {
403    clear: left;
404    padding-top: 1em;
405    font-size: 0.8em;
406 }
407
408 #tagcloudlist a {
409    font-variant: normal;
410    font-size: 0.8em;
411 }
412
413
414 /* A box of logos.  */
415
416 .logobox p {
417   margin-top: 20px;
418 }
419
420 .logobox img {
421     margin-right: 20px;
422 }
423
424
425
426
427 /* EOF */