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 * @author Anika Henke <anika@selfthinker.org>
9 */
10
11html {
12    overflow-x: auto;
13    overflow-y: scroll;
14}
15html,
16body {
17    color: @ini_text;
18
19    margin: 0;
20    padding: 0;
21}
22body {
23    font-family:  "Open Sans",Helvetica,Arial,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",STHeiti,"WenQuanYi Micro Hei",SimSun,sans-serif;
24    font-weight: lighter;
25    color: #707070;
26    -webkit-font-smoothing:antialiased;
27}
28
29
30/*____________ headers ____________*/
31
32caption,
33figcaption,
34summary,
35legend {
36    padding: 0;
37    margin: 0 0 .35em;
38    line-height: 1.2;
39}
40h1,
41h2,
42h3,
43h4,
44h5,
45h6 {
46    font-weight: bold;
47    padding: 0;
48    line-height: 1.2;
49    color: #454545;
50    clear: left; /* ideally 'both', but problems with toc */
51}
52[dir=rtl] h1,
53[dir=rtl] h2,
54[dir=rtl] h3,
55[dir=rtl] h4,
56[dir=rtl] h5,
57[dir=rtl] h6 {
58    clear: right;
59}
60
61h1 {
62    font-size: 2em;
63    margin: 0 0 0.444em;
64}
65h2 {
66    font-size: 1.5em;
67    margin: 0 0 0.666em;
68}
69h3 {
70    font-size: 1.125em;
71    margin: 0 0 0.888em;
72}
73h4 {
74    font-size: 1em;
75    margin: 0 0 1.0em;
76    border-top: 1px solid #CCC;
77    border-bottom: 1px solid #CCC;
78    text-align: center;
79    padding: 1em 0;
80}
81h5 {
82    font-size: .875em;
83    margin: 0 0 1.1428em;
84}
85h6 {
86    font-size: .75em;
87    margin: 0 0 1.333em;
88}
89/* bottom margin = 1 / font-size */
90
91
92/*____________ basic margins and paddings ____________*/
93
94p,
95ul,
96ol,
97dl,
98pre,
99table,
100hr,
101blockquote,
102figure,
103details,
104fieldset,
105address {
106    margin: 0 0 1.4em 0; /* bottom margin = line-height */
107    padding: 0;
108}
109
110div,
111video,
112audio {
113    margin: 0;
114    padding: 0;
115}
116
117
118/*____________ lists ____________*/
119
120ul,
121ol {
122    padding: 0 0 0 1.5em;
123}
124[dir=rtl] ul,
125[dir=rtl] ol {
126    padding: 0 1.5em 0 0;
127}
128
129li,
130dd {
131    padding: 0;
132    margin: 0 0 0 1.5em;
133}
134[dir=rtl] li,
135[dir=rtl] dd {
136    margin: 0 1.5em 0 0;
137}
138dt {
139    font-weight: bold;
140    margin: 0;
141    padding: 0;
142}
143
144li ul,
145li ol,
146li dl,
147dl ul,
148dl ol,
149dl dl {
150    margin-bottom: 0;
151    padding: 0;
152}
153li li {
154    font-size: 100%;
155}
156
157ul             { list-style: square outside; }
158ol             { list-style: decimal outside; }
159ol ol          { list-style-type: lower-alpha; }
160ol ol ol       { list-style-type: upper-roman; }
161ol ol ol ol    { list-style-type: upper-alpha; }
162ol ol ol ol ol { list-style-type: lower-roman; }
163
164
165/*____________ tables ____________*/
166
167table {
168    .pure-table;
169}
170
171caption {
172    caption-side: top;
173    text-align: left;
174}
175[dir=rtl] caption {
176    text-align: right;
177}
178
179th,
180td {
181    border-left: 1px solid #cbcbcb;/*  inner column border */
182    border-width: 0 0 0 1px;
183    font-size: inherit;
184    margin: 0;
185    overflow: visible; /*to make ths where the title is really long work*/
186    padding: 0.5em 1em; /* cell padding */
187    border-bottom: 1px solid #cbcbcb;
188}
189th {
190    background-color: #e0e0e0;
191    color: #000;
192    text-align: left;
193    vertical-align: bottom;
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}
210
211/*____________ misc ____________*/
212
213img {
214    border-width: 0;
215    vertical-align: middle;
216    color: #666;
217    background-color: transparent;
218    font-style: italic;
219    height: auto;
220}
221img,
222object,
223embed,
224iframe,
225video,
226audio {
227    max-width: 100%;
228}
229#IE7 img,
230#IE8 img,
231button img {
232    max-width: none;
233}
234
235hr {
236    border-top: solid @ini_border;
237    border-bottom: solid @ini_background;
238    border-width: 1px 0;
239    height: 0;
240    text-align: center;
241    clear: both;
242}
243
244acronym,
245abbr {
246    cursor: help;
247    border-bottom: 1px dotted;
248    font-style: normal;
249}
250em acronym,
251em abbr {
252    font-style: italic;
253}
254
255mark {
256    background-color: @ini_highlight;
257    color: inherit;
258}
259
260blockquote {
261    padding: 0 .5em;
262    border: solid @ini_border;
263    border-width: 0 0 0 .25em;
264}
265[dir=rtl] blockquote {
266    border-width: 0 .25em 0 0;
267}
268q:before,
269q:after {
270    content: '';
271}
272
273sub,
274sup {
275    font-size: .8em;
276    line-height: 1;
277}
278sub {
279    vertical-align: sub;
280}
281sup {
282    vertical-align: super;
283}
284
285small {
286    font-size: .8em;
287}
288
289/*____________ forms ____________*/
290
291/* for all of the form styles, style.ini colours are not used on purpose (except for fieldset border) */
292
293form {
294    display: inline;
295    margin: 0;
296    padding: 0;
297}
298fieldset {
299    padding: .7em 1em 0;
300    padding: .7rem 1rem; /* for those browsers understanding :last-child */
301    border: 1px solid @ini_text_alt;
302}
303fieldset > :last-child {
304    margin-bottom: 0;
305}
306legend {
307    margin: 0;
308    padding: 0 .1em;
309}
310label {
311    vertical-align: middle;
312    cursor: pointer;
313}
314
315input,
316textarea,
317button,
318select,
319optgroup,
320option,
321keygen,
322output,
323meter,
324progress {
325    font: inherit;
326    font-weight: normal;
327    color: #333;
328    background-color: #fff;
329    line-height: normal;
330    margin: 0;
331    vertical-align: middle;
332    -moz-box-sizing: border-box;
333    -webkit-box-sizing: border-box;
334    box-sizing: border-box;
335}
336
337select {
338    max-width: 100%;
339}
340optgroup {
341    font-style: italic;
342    font-weight: bold;
343}
344option {
345    font-style: normal;
346    font-weight: normal;
347}
348
349input,
350textarea,
351select,
352keygen {
353    border: 1px solid #ccc;
354    box-shadow: inset 0 0 1px #eee;
355    border-radius: 2px;
356}
357input:active,
358input:focus,
359textarea:active,
360textarea:focus,
361select:active,
362select:focus,
363keygen:active,
364keygen:focus {
365    border-color: #999;
366}
367input[type=radio],
368input[type=checkbox],
369input[type=image] {
370    padding: 0;
371    border-style: none;
372    box-shadow: none;
373}
374
375/* all types of buttons */
376input[type=submit],
377input[type=button],
378input[type=reset],
379input.button,
380a.button,
381button,
382.qq-upload-button {
383    .pure-buttion;
384    border-radius: 4px;
385    padding: 0.5em 1.5em;
386    margin: 0.5em 1em;
387    border-radius: 12px;
388    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
389}
390#IE7 input.button,
391#IE7 button {
392    line-height: 1.4;
393    overflow: visible;
394}
395
396input[type=submit]:hover,
397input[type=submit]:active,
398input[type=submit]:focus,
399input[type=button]:hover,
400input[type=button]:active,
401input[type=button]:hover,
402input[type=reset]:hover,
403input[type=reset]:active,
404input[type=reset]:hover,
405input.button:hover,
406input.button:active,
407input.button:focus,
408a.button:hover,
409a.button:active,
410a.button:focus,
411button:hover,
412button:active,
413button:focus,
414.qq-upload-button:hover {
415    .buttion;
416    background-color: #AAD2F0;
417    background-image: -moz-linear-gradient(center top , #AAD2F0 5%, #8BC1ED 100%);
418    background-repeat: repeat;
419    background-attachment: scroll;
420    background-position: 0% 0%;
421    background-clip: border-box;
422    background-origin: padding-box;
423    background-size: auto auto;
424}
425
426input::-moz-focus-inner,
427button::-moz-focus-inner {
428    border: 0;
429    padding: 0;
430}
431
432input[disabled],
433button[disabled],
434select[disabled],
435textarea[disabled],
436option[disabled],
437input[readonly],
438button[readonly],
439select[readonly],
440textarea[readonly] {
441    cursor: auto;
442    opacity: .5;
443    background-color: #eee;
444}
445