1/**
2 * This file provides the most basic styles.
3 *
4 * If you integrate DokuWiki into another project, you might either
5 * want to integrate this file into the other project as well, or use
6 * the other project's basic CSS for DokuWiki instead of this one.
7 *
8 * codologic Template
9 *
10 * @link     http://codologic.com
11 *
12 * Author: Avinash D'Silva <avinash.roshan.dsilva@gmail.com|codologic.com>
13 *
14 * Previous Authors:
15 * @author   Anika Henke <anika@selfthinker.org>
16 * @author   Clarence Lee <clarencedglee@gmail.com>
17 * @license  GPL 2 (http://www.gnu.org/licenses/gpl.html)
18 */
19
20html {
21    overflow-x: auto;
22    overflow-y: scroll;
23}
24html,
25body {
26    color: @ini_text;
27    background: @ini_background_site url(images/page-gradient.png) top left repeat-x;
28    margin: 0;
29    padding: 0;
30}
31body {
32    font: normal 87.5%/1.4 Arial, sans-serif;
33    /* default font size: 100% => 16px; 93.75% => 15px; 87.5% => 14px; 81.25% => 13px; 75% => 12px */
34    -webkit-text-size-adjust: 100%;
35}
36
37
38/*____________ headers ____________*/
39
40caption,
41figcaption,
42summary,
43legend {
44    padding: 0;
45    margin: 0 0 .35em;
46    line-height: 1.2;
47}
48h1,
49h2,
50h3,
51h4,
52h5,
53h6 {
54    font-weight: bold;
55    padding: 0;
56    line-height: 1.2;
57    clear: left; /* ideally 'both', but problems with toc */
58}
59[dir=rtl] h1,
60[dir=rtl] h2,
61[dir=rtl] h3,
62[dir=rtl] h4,
63[dir=rtl] h5,
64[dir=rtl] h6 {
65    clear: right;
66}
67
68h1 {
69    font-size: 2em;
70    margin: 0 0 0.444em;
71}
72h2 {
73    font-size: 1.5em;
74    margin: 0 0 0.666em;
75}
76h3 {
77    font-size: 1.125em;
78    margin: 0 0 0.888em;
79}
80h4 {
81    font-size: 1em;
82    margin: 0 0 1.0em;
83}
84h5 {
85    font-size: .875em;
86    margin: 0 0 1.1428em;
87}
88h6 {
89    font-size: .75em;
90    margin: 0 0 1.333em;
91}
92/* bottom margin = 1 / font-size */
93
94
95/*____________ basic margins and paddings ____________*/
96
97p,
98ul,
99ol,
100dl,
101pre,
102table,
103hr,
104blockquote,
105figure,
106details,
107fieldset,
108address {
109    margin: 0 0 1.4em 0; /* bottom margin = line-height */
110    padding: 0;
111}
112
113div {
114    margin: 0;
115    padding: 0;
116}
117
118
119/*____________ lists ____________*/
120
121ul,
122ol {
123    padding: 0 0 0 1.5em;
124}
125[dir=rtl] ul,
126[dir=rtl] ol {
127    padding: 0 1.5em 0 0;
128}
129
130li,
131dd {
132    padding: 0;
133    margin: 0 0 0 1.5em;
134}
135[dir=rtl] li,
136[dir=rtl] dd {
137    margin: 0 1.5em 0 0;
138}
139dt {
140    font-weight: bold;
141    margin: 0;
142    padding: 0;
143}
144
145li ul,
146li ol,
147li dl,
148dl ul,
149dl ol,
150dl dl {
151    margin-bottom: 0;
152    padding: 0;
153}
154li li {
155    font-size: 100%;
156}
157
158ul             { list-style: square outside; }
159ol             { list-style: decimal outside; }
160ol ol          { list-style-type: lower-alpha; }
161ol ol ol       { list-style-type: upper-roman; }
162ol ol ol ol    { list-style-type: upper-alpha; }
163ol ol ol ol ol { list-style-type: lower-roman; }
164
165
166/*____________ tables ____________*/
167
168table {
169    border-collapse: collapse;
170    empty-cells: show;
171    border-spacing: 0;
172    border: 1px solid @ini_border;
173}
174
175caption {
176    caption-side: top;
177    text-align: left;
178}
179[dir=rtl] caption {
180    text-align: right;
181}
182
183th,
184td {
185    padding: .3em .5em;
186    margin: 0;
187    vertical-align: top;
188    border: 1px solid @ini_border;
189}
190th {
191    font-weight: bold;
192    background-color: @ini_background_alt;
193    text-align: left;
194}
195[dir=rtl] th {
196    text-align: right;
197}
198
199
200/*____________ links ____________*/
201
202a {
203    outline: none;
204}
205a:link,
206a:visited {
207    text-decoration: none;
208    color: @ini_link;
209}
210a:link:hover,
211a:visited:hover,
212a:link:focus,
213a:visited:focus,
214a:link:active,
215a:visited:active {
216    text-decoration: underline;
217}
218
219
220/*____________ misc ____________*/
221
222img {
223    border-width: 0;
224    vertical-align: middle;
225    color: #666;
226    background-color: transparent;
227    font-style: italic;
228    height: auto;
229}
230img,
231object,
232embed,
233iframe,
234video,
235audio {
236    max-width: 100%;
237}
238#IE7 img,
239#IE8 img,
240button img {
241    max-width: none;
242}
243
244hr {
245    border-top: solid @ini_border;
246    border-bottom: solid @ini_background;
247    border-width: 1px 0;
248    height: 0;
249    text-align: center;
250    clear: both;
251}
252
253acronym,
254abbr {
255    cursor: help;
256    border-bottom: 1px dotted;
257    font-style: normal;
258}
259em acronym,
260em abbr {
261    font-style: italic;
262}
263
264mark {
265    background-color: @ini_highlight;
266    color: inherit;
267}
268
269pre,
270code,
271samp,
272kbd {
273    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
274    /* same font stack should be used for ".dokuwiki table.diff td" in _diff.css */
275    font-size: 1em;
276    direction: ltr;
277    text-align: left;
278    background-color: @ini_background_site;
279    color: @ini_text;
280    box-shadow: inset 0 0 .3em @ini_border;
281    border-radius: 2px;
282}
283pre {
284    overflow: auto;
285    word-wrap: normal;
286    border: 1px solid @ini_border;
287    border-radius: 2px;
288    box-shadow: inset 0 0 .5em @ini_border;
289    padding: .7em 1em;
290}
291
292blockquote {
293    padding: 0 .5em;
294    border: solid @ini_border;
295    border-width: 0 0 0 .25em;
296}
297[dir=rtl] blockquote {
298    border-width: 0 .25em 0 0;
299}
300q:before,
301q:after {
302    content: '';
303}
304
305sub,
306sup {
307    font-size: .8em;
308    line-height: 1;
309}
310sub {
311    vertical-align: sub;
312}
313sup {
314    vertical-align: super;
315}
316
317small {
318    font-size: .8em;
319}
320
321/*____________ forms ____________*/
322
323/* for all of the form styles, style.ini colours are not used on purpose (except for fieldset border) */
324
325form {
326    display: inline;
327    margin: 0;
328    padding: 0;
329}
330fieldset {
331    padding: .7em 1em 0;
332    padding: .7rem 1rem; /* for those browsers understanding :last-child */
333    border: 1px solid @ini_text_alt;
334}
335fieldset > :last-child {
336    margin-bottom: 0;
337}
338legend {
339    margin: 0;
340    padding: 0 .1em;
341}
342label {
343    vertical-align: middle;
344    cursor: pointer;
345}
346
347input,
348textarea,
349button,
350select,
351optgroup,
352option,
353keygen,
354output,
355meter,
356progress {
357    font: inherit;
358    font-weight: normal;
359    color: #333;
360    background-color: #fff;
361    line-height: normal;
362    margin: 0;
363    vertical-align: middle;
364    -moz-box-sizing: border-box;
365    -webkit-box-sizing: border-box;
366    box-sizing: border-box;
367}
368
369select {
370    max-width: 100%;
371}
372optgroup {
373    font-style: italic;
374    font-weight: bold;
375}
376option {
377    font-style: normal;
378    font-weight: normal;
379}
380
381input,
382textarea,
383select,
384keygen {
385    border: 1px solid #ccc;
386    box-shadow: inset 0 0 1px #eee;
387    border-radius: 2px;
388}
389input:active,
390input:focus,
391textarea:active,
392textarea:focus,
393select:active,
394select:focus,
395keygen:active,
396keygen:focus {
397    border-color: #999;
398}
399input[type=radio],
400input[type=checkbox],
401input[type=image] {
402    padding: 0;
403    border-style: none;
404    box-shadow: none;
405}
406
407/* all types of buttons */
408input[type=submit],
409input[type=button],
410input[type=reset],
411input.button,
412a.button,
413button,
414.qq-upload-button {
415    color: #333;
416    background-color: #eee;
417    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
418    .linear-gradient("top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%");
419    border: 1px solid #ccc;
420    border-radius: 2px;
421    padding: .1em .5em;
422    cursor: pointer;
423}
424#IE7 input.button,
425#IE7 button {
426    line-height: 1.4;
427    overflow: visible;
428}
429
430input[type=submit]:hover,
431input[type=submit]:active,
432input[type=submit]:focus,
433input[type=button]:hover,
434input[type=button]:active,
435input[type=button]:hover,
436input[type=reset]:hover,
437input[type=reset]:active,
438input[type=reset]:hover,
439input.button:hover,
440input.button:active,
441input.button:focus,
442a.button:hover,
443a.button:active,
444a.button:focus,
445button:hover,
446button:active,
447button:focus,
448.qq-upload-button:hover {
449    border-color: #999;
450    background-color: #ddd;
451    background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
452    .linear-gradient("top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%");
453}
454
455input::-moz-focus-inner,
456button::-moz-focus-inner {
457    border: 0;
458    padding: 0;
459}
460
461input[disabled],
462button[disabled],
463select[disabled],
464textarea[disabled],
465input[readonly],
466button[readonly],
467select[readonly],
468textarea[readonly] {
469    cursor: auto;
470    opacity: .5;
471    background-color: #eee;
472}
473