faq: Typo fix and link to the wiki.
[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 a:link {
55 /*  color: #784c6c;*/
56   font-weight: bold;
57   text-decoration: none;
58 }
59
60 a:hover {
61   background-color: #d0dce8;
62   font-weight: bold;
63   text-decoration: none;
64 }
65
66 a:visited {
67 /*  color: #5c6064; */
68   font-weight: bold;
69   text-decoration: none;
70 }
71
72 a.img:hover {
73   background-color: #f0f0fc;
74 }
75
76
77 /*
78    Raise attention
79  */
80
81 li.important {
82   color: red;
83 }
84
85 span.important {
86   color: red;
87 }
88
89
90 div.urgent {
91   width: 85%;
92   text-align: center;
93   border: solid red;
94   font-weight: bold;
95 }
96
97
98 .ii {
99   display: none !important;
100 }
101
102
103 /*
104    Other elements as commonly used by org-mode
105  */
106 p {
107   margin-top: 1%;
108 }
109
110
111 img {
112     border-width: 0;
113 }
114
115 img.lfloat {
116     float: left;
117     margin-right: 1em;
118 }
119
120 img.rfloat {
121     float: right;
122     margin-left: 1em;
123 }
124
125 .correction
126 {
127     color: #ff0000;
128 }
129
130 div.entry-qotd P
131 {
132   padding-left: 20%;
133   margin-bottom: 0;
134 }
135
136 div.entry-qotd
137 {
138   margin-bottom: 3%;
139 }
140
141
142 .example {
143     overflow: auto;
144 }
145
146
147 #kicker {
148     padding-top: 5%;
149     font-size: 125%;
150     border-bottom: 3px #FFb580 solid;
151     font-family: verdana,helvetica;
152     margin-bottom: 2%;
153 }
154
155
156
157 #header {
158     background: url(/share/logo-gnupg-light-purple-bg.png) center no-repeat;
159     height: 120px;
160     padding: 0px;
161 }
162
163 #cornerImage {
164     width: 128px;
165     height: 130px;
166     margin-top: -7.5em;
167     margin-left: 82%;
168     padding: 0;
169     padding-right: 2%;
170 }
171
172
173 /*
174    Navigation
175  */
176
177 /* Reset the link attributes for nav except for hover  */
178 nav * a:visited, a:link {
179     color: #757575;
180     font-weight: bold;
181     text-decoration: none;
182 }
183
184
185 /* The menu bar is centered.  */
186 nav {
187     text-align: left;
188     line-height: 0.4em;
189     margin-left: 5%;
190     margin-right: 5%;
191 }
192
193 /* Main menu list.  */
194 nav ul {
195     display: inline-table;
196     list-style: none;
197     position: relative;
198     box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
199     padding: 0 20px;
200     border-radius: 10px;
201     background: #efefef;
202 }
203
204 nav ul:after {
205     display: block;
206     clear: both;
207     content: "";
208 }
209
210 /* Main menu items.  */
211 nav ul li {
212     float: left;
213 }
214
215 nav ul li:hover {
216     background: #4b545f;
217 }
218
219 nav ul li:hover a {
220     color: #fff;
221 }
222
223 nav ul li a {
224     display: block;
225     color: #757575;
226     font-weight: bold;
227     text-decoration: none;
228     padding: 20px 30px;
229 }
230
231 /* Sub-menu lists.
232    Hide unless we over hover them.  */
233 nav ul ul {
234     display: none;
235     background: #5f6975;
236     border-radius: 0px;
237     padding: 0;
238     position: absolute;
239     z-index: 5;
240     top: 100%;
241 }
242
243 nav ul li:hover > ul {
244     display: block;
245 }
246
247
248 /* Sub-menu items.  */
249 nav ul ul li {
250     float: none;
251     border-top: 1px solid #6b727c;
252     border-bottom: 1px solid #575f6a;
253     position: relative;
254 }
255
256 nav ul ul li a {
257     font-weight: bold;
258     color: #fff;
259     padding: 20px 30px;
260 }
261
262 nav ul ul li a:hover {
263     background: #4b545f;
264 }
265
266
267
268 /* Sub-sub-menu lists.
269    Put right to the sub-menus.  */
270 nav ul ul ul {
271     position: absolute;
272     z-index: 10;
273     left: 100%;
274     top: 0;
275 }
276
277
278
279 /* The second menu line for stop menu with sub-menus.
280    This is a non-nested list.  */
281 nav.subnav {
282     margin-top: -1.5em;
283 }
284
285 nav.subnav ul {
286     display: inline-table;
287     list-style: none;
288     color: #757575;
289     position: relative;
290     box-shadow: 0px 0px 5px rgba(0,0,0,0.15);
291     border-radius: 6px;
292     background-color: #efefef;
293 }
294
295 nav.subnav ul li a {
296     display: block;
297     font-weight: normal;
298     text-decoration: none;
299     padding: 10px 20px;
300 }
301
302
303 /* Put selection markers arount a selected items.
304    \2009 is a    \21d2 and \21d0 are arrows.  */
305 nav * li a.selected:before {
306     content: "\21d2\2009";
307 }
308
309 nav * li a.selected:after {
310     content: "\2009\21d0";
311 }
312
313
314
315 /*
316     The bottom menu
317  */
318
319 #nav_bottom ul {
320     list-style: none;
321     padding-left: 0;
322     margin-left: 0;
323     float: left;
324 }
325
326 #nav_bottom li {
327     float: left;
328     padding-right: 3em;
329 }
330
331 #nav_bottom p {
332     clear: left;
333     padding-top: 1em;
334 }
335
336 #nav_bottom a {
337     clear: left;
338     font-variant: normal;
339 }
340
341
342 /*
343    Other stuff
344  */
345
346 main {
347     float: left;
348     margin-left: 5%;
349     margin-right: 5%;
350 }
351
352 main ul {
353     list-style: square;
354     padding-left: 0;
355     margin-left: 1em;
356 }
357
358
359 div.outline-text-2 {
360   padding-top: 5px;
361   padding-right: 3px;
362   border-top: 2px solid #5c6064;
363   border-right: 2px solid #784c6c;
364 }
365
366 div.outline-text-3 {
367   padding-top: 3px;
368   padding-right: 3px;
369   border-top: 1px solid #5c6064;
370   border-right: 1px solid #784c6c;
371 }
372
373
374 /* Not anymore used:
375 #rightColumn {
376     float: right;
377     width: 18%;
378     margin-left: 5%;
379     margin-right: 2%;
380     margin-top: 2%;
381 }
382
383 #rightColumn ul {
384     list-style: square;
385     padding-left: 0;
386     margin-left: 1em;
387 }
388 */
389
390 .morelink {
391     font-size: smaller;
392     font-variant: normal;
393     font-weight: normal;
394     text-decoration: none;
395 }
396
397 .morelink:after {
398     content: "{more}";
399 }
400
401
402 #cpyright {
403     padding-top: 4em;
404 }
405
406 #smallnote {
407     font-size: 0.8em;
408 }
409
410 #footer {
411     border-top: 2px solid #5c6064;
412     margin-top: 5em;
413     margin-left: 5%;
414     margin-right: 5%;
415     clear: both;
416     font-size: 0.8em;
417 }
418
419
420 #checkoutSummary {
421     background-color: #f0f0f0;
422 }
423
424
425 .articleRight {
426     float: right;
427     padding: 2%;
428 }
429
430 pre {
431     border: thin black solid;
432     background-color: #efefef;
433     padding: 0.5em;
434     overflow: auto;
435 }
436
437 /* Classes used by makeinfo (manuals).  */
438
439 pre.display {
440     font-family:inherit;
441 }
442 pre.format {
443     font-family:inherit;
444 }
445 pre.smalldisplay {
446     font-family:inherit;
447     font-size:smaller;
448 }
449 pre.smallformat {
450     font-family:inherit;
451     font-size:smaller;
452 }
453 pre.smallexample {
454     font-size:smaller;
455 }
456 pre.smalllisp {
457     font-size:smaller;
458 }
459
460 span.sc {
461     font-variant:small-caps;
462 }
463 span.roman {
464     font-family:serif;
465     font-weight:normal;
466 }
467 span.sansserif {
468     font-family:sans-serif;
469     font-weight:normal;
470 }
471
472
473 /* Table stuff */
474
475 th.left {
476     text-align:center;
477 }
478
479 th.center {
480     text-align:center;
481 }
482
483 th.right {
484     text-align:center;
485 }
486
487 td.left   {
488     text-align:left;
489 }
490
491 td.center {
492     text-align:center;
493 }
494
495 td.right  {
496     text-align:right;
497 }
498
499
500 /* Tag cloudlist.  */
501
502 #tagcloudlist ul {
503     list-style: none;
504     float: left;
505 }
506
507 #tagcloudlist li {
508     float: left;
509     line-height: 130%;
510     font-variant: small-caps;
511     padding-right: 1em;
512 }
513
514 #tagcloudlist li:before  {
515     content: "\00bb\00a0";
516 }
517
518 #tagcloudlist p {
519    clear: left;
520    padding-top: 1em;
521    font-size: 0.8em;
522 }
523
524 #tagcloudlist a {
525    font-variant: normal;
526    font-size: 0.8em;
527 }
528
529
530 /* A box of logos.  */
531
532 .logobox p {
533   margin-top: 20px;
534 }
535
536 .logobox img {
537     margin-right: 20px;
538 }
539
540
541 /* Donation stuff. */
542
543 .buttonbox {
544     margin-top: 20px;
545     margin-bottom: 20px;
546     float: none;
547 }
548
549 .donate-button {
550     overflow: hidden;
551     display: inline-block;
552     background-image: linear-gradient(#28A0E5, #015E94);
553     border: 0px none;
554     padding: 1px;
555     text-decoration: none;
556     border-radius: 5px;
557     box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
558     cursor: pointer;
559     line-height: 30px;
560     font-size: 14px;
561     font-weight: bold;
562     color: #fff;
563     float: left;
564     margin-right: 20px;
565     margin-bottom: 20px;
566 }
567
568
569 .donate-button-low {
570     overflow: hidden;
571     display: inline-block;
572     background-image: linear-gradient(#28A0E5, #015E94);
573     border: 0px none;
574     text-decoration: none;
575     border-radius: 4px;
576     box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
577     cursor: pointer;
578     line-height: 20px;
579     font-size: 14px;
580     font-weight: bold;
581     color: #fff;
582     float: left;
583     margin-right: 20px;
584     margin-bottom: 20px;
585     margin-top: 5px;
586 }
587
588
589
590 /* EOF */