Dotclear

source: admin/style/default.css @ 2366:c97860ba09f7

Revision 2366:c97860ba09f7, 54.3 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

Passage en em pour les font-size.
Line 
1/*
2# -- BEGIN LICENSE BLOCK --------------------------------------------------
3# This file is part of Dotclear 2.
4# Copyright (c) 2003-2013 Olivier Meunier & Association Dotclear
5# Licensed under the GPL version 2.0 license.
6# See LICENSE file or http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
7# -- END LICENSE BLOCK ----------------------------------------------------
8               LAYOUTS
9               HTML TAGS
10               FORMULAIRES
11               BOUTONS
12               MESSAGES
13               ELEMENTS PRINCIPAUX
14               REGLES SPECIFIQUES
15               MEDIA QUERIES
16*/
17/* ---------------------------------------------------------------------------
18                                                                                          START
19---------------------------------------------------------------------------- */
20html {
21     font-size: 62.5%;
22     }
23body {
24     font-size: 12px; /* ie < 9 sucks */
25     font-size: 1.2rem;
26     line-height: 1.5;
27     font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
28     margin: 0;
29     padding: 0;
30     }
31/* ---------------------------------------------------------------------------
32                                                                                     LAYOUTS
33---------------------------------------------------------------------------- */
34*, *:before, *:after {
35    -webkit-box-sizing: border-box;
36    -moz-box-sizing: border-box;
37    box-sizing: border-box;
38     }
39#header {
40     background: #676e78;
41     color: #FFF;
42     border-bottom: 4px solid #A2CBE9;
43     width: 100%;
44     display: table;
45     }
46#wrapper {
47     position: relative;
48     padding-top: 1.5em;
49     float: left;
50     width: 100%;
51     z-index: 10;
52     background: #F7F7F7 url(bg_wrapper.png) repeat-y 15em;
53     }
54.with-js #wrapper {
55     padding-top: 0;
56     }
57#main {
58     width: 100%;
59     float: right;
60     margin-left: -14em;
61     margin-top: 0;
62     }
63#content {
64     margin: 0 0 0 14em;
65     padding: .5em 1.5em .75em 2.5em;
66     background: #fff;
67     }
68#main-menu {
69     width: 14em;
70     float: left;
71     margin: 0;
72     padding-top: .5em;
73     padding-bottom: 1em;
74     overflow: hidden;
75     background: #f7f7f7;
76     }
77#footer {
78     clear: both;
79     position: relative;
80     padding: .5em 1em .5em 0;
81     text-align: right;
82     border-top: 1px solid #ccc;
83     background-color: #fff;
84     }
85/* to hide main-menu */
86#collapser {
87     position: absolute;
88     top: 0;
89     left: 14em;
90     width: 15px;
91     height: 100%;
92     overflow: hidden;
93     display: block;
94     background: #f3f3f3 url(../images/collapser-hide.png) no-repeat center bottom;
95     border-right: double #dfdfdf;
96     z-index: 1;
97     }
98.expand-mm {
99     display: none;
100     }
101/* if main-menu is hidden */
102#wrapper.hide-mm {
103     background: #fff;
104     }
105.hide-mm #main {
106     margin-left: 0;
107     }
108.hide-mm #content {
109     margin-left: 1em;
110     }
111.hide-mm #main-menu {
112     display: none;
113     }
114.hide-mm #collapser {
115     left: 0;
116     background: #e3e3e3 url(../images/collapser-show.png) no-repeat center bottom;
117     }
118.hide-mm .collapse-mm {
119     display: none;
120     }
121.hide-mm .expand-mm {
122     display: block;
123     }
124/* -------------------------------------------------------------- layout: two-cols */
125.two-cols {
126     position: static;
127     }
128.two-cols .col {
129     width: 48%;
130     margin-left: 2%;
131     float: left;
132     }
133.two-cols .col70 {
134     width: 68%;
135     margin-left: 0;
136     float: left;
137     }
138.col30 {
139     width: 28%;
140     margin-left: 2%;
141     float: left;
142     }
143.two-cols .col:first-child,
144.two-cols .col30.first-col {
145     margin-left: 0;
146     margin-right: 2%;
147     }
148.two-cols .col:last-child,
149.two-cols .col70.last-col {
150     margin-left: 2%;
151     margin-right: 0;
152     }
153.two-cols table {
154     width: 90%;
155     }
156/* -------------------------------------------------------------- layout: three-cols */
157.three-cols {
158     position: static;
159     }
160.three-cols .col {
161     width: 32.3%;
162     float: left;
163     margin-left: 1%;
164     }
165.three-cols .col:first-child {
166     margin-left: 0;
167     }
168/* ------------------------------------------------- layout: optionnal one/two/three-boxes */
169.one-box {
170     text-align: justify;
171     }
172.two-boxes {
173     width: 48.5%;
174     }
175.three-boxes {
176     width: 30%;
177     }
178.two-boxes, .three-boxes {
179     display: inline-block;
180     vertical-align: top;
181     margin: 0 1.5% 1em;
182     text-align: left;
183     }
184.two-boxes:nth-of-type(odd), .three-boxes:nth-of-type(3n+1) {
185     margin-left: 0;
186     }
187.two-boxes:nth-of-type(even), .three-boxes:nth-of-type(3n) {
188     margin-right: 0;
189     }
190/* ---------------------------------------------------------------- layout: popups */
191.popup h1 {
192     display: block;
193     width: 100%;
194     margin: 0;
195     background: #676e78;
196     font-size: 1.5em;
197     text-indent: 1em;
198     line-height: 1.5em;
199     font-weight: normal;
200     color: #fff;
201     }
202.popup #wrapper {
203     display: block;
204     float: none;
205     width: 100%;
206     margin: 0;
207     padding: 0;
208     background-position: 0 0;
209     }
210.popup #main {
211     margin: 0;
212     padding: 0;
213     }
214.popup #content {
215     margin: 0;
216     padding: 1em;
217     }
218.popup #content h2 {
219     margin: 0 0 1em 0;
220     padding: 0;
221     }
222.popup #footer p {
223     border: none;
224     }
225/* -------------------------------------------------------- layout: classes de complément */
226.constrained {
227     margin: 0;
228     padding: 0;
229     border: none;
230     background: transparent;
231     }
232.table {
233     display: table;
234     }
235.cell {
236     display: table-cell;
237     vertical-align: top;
238     }
239.clear {
240     clear: both;
241     }
242.lclear {
243     clear: left;
244     }
245.clearer {
246     height: 1px;
247     font-size: 1px;
248     }
249/* Micro clearfix thx to Nicolas Gallagher */
250.clearfix:before, .clearfix:after {
251     content: " ";
252     display: table;
253     }
254.clearfix:after {
255     clear: both;
256     }
257.frame-shrink {
258     border: 1px solid #676e78;
259     padding: 0.5em;
260     margin-bottom: 1em;
261     height: 120px;
262     overflow: auto;
263     }
264.box {
265     display: inline-block;
266     vertical-align: top;
267     margin: 0 10px 10px;
268     text-align: left;
269     }
270.box.small {
271     width: 320px;
272     }
273.box.medium {
274     width: 660px;
275     }
276.box.large {
277     width: 100%;
278     }
279.odd {
280     margin-left: 0;
281     }
282.even {
283     margin-right: 0;
284     }
285/* ---------------------------------------------------------------------------
286                                                                                     HTML TAGS
287---------------------------------------------------------------------------- */
288body {
289     color: #333;
290     background: #fff;
291     }
292/* ------------------------------------------------------------------ titres */
293h1, h2, h3, .as_h3, h4, .as_h4, h5, h6 {
294     margin-top: 0;
295     margin-bottom: 1em;
296     }
297h2 {
298     color: #676e78;
299     font-size: 1.5em;
300     padding: 0 0 1.5em;
301     font-weight: normal;
302     }
303/* fil d'ariane */
304#content > h2 {
305     padding: 0 1em .5em 1em;
306     margin: 0 -1em .5em -1em;
307     background: #fff url(bg_h2.png) repeat-x center bottom;
308     }
309h2 a:link, h2 a:visited {
310     color: #676e78;
311     border-color: #000;
312     }
313/* page courante dans le fil d'ariane */
314.page-title {
315     color: #d30e60;
316     }
317.page-title img {
318     padding-left: .5em;
319     vertical-align: middle;
320     }
321/* autres titres */
322h3, .as_h3 {
323     margin-top: 1em;
324     color: #D33800;
325     font-weight: normal;
326     font-size: 1.34em;
327     }
328#main-menu h3 {
329     font-weight: bold;
330     }
331h4, .as_h4 {
332     font-size: 1.16em;
333     color: #676e78;
334     }
335.fieldset h3, .fieldset h4, .pretty-title {
336     color: #D33800;
337     font-size: 1em;
338     font-weight: bold;
339     }
340.fieldset h3 {
341     font-size: 1.17em;
342     }
343.fieldset h3.smart-title, .fieldset h4.smart-title, .smart-title {
344     font-size: 1em;
345     text-transform: uppercase;
346     font-weight: bold;
347     color: #333;
348     text-shadow: 0 1px 0 rgba(200, 200, 200, 0.6)
349     }
350h5 {
351     font-size: 1em;
352     font-weight: bold;
353     color: #676e78;
354     }
355#entry-sidebar h5 {
356     font-weight: normal;
357     color: #333;
358     }
359.entry-status img.img_select_option {
360     padding-left: 4px;
361     vertical-align: text-top;
362     }
363h4 label, h5 label {
364     color: #333;
365     }
366h2:first-child, h3:first-child, h4:first-child, h5:first-child, ul:first-child, p:first-child {
367     margin-top: 0;
368     }
369/* ---------------------------------------------------------------- tableaux */
370/*   Pour autoriser le scroll sur les petites largeurs
371     envelopper les tableaux dans une div.table-outer */
372.table-outer {
373     width: 100%;
374     overflow: auto;
375     }
376table {
377     font-size: 1em;
378     border-collapse: collapse;
379     margin: 0 0 1em 0;
380     width: 100%;
381     }
382caption {
383     color: #333;
384     font-weight: bold;
385     text-align: left;
386     margin-bottom: .5em;
387     }
388th {
389     border-width: 1px 0 1px 0;
390     border-style: solid;
391     border-color: #dfdfdf;
392     background: #eef1ec;
393     padding: .4em 1em .4em .5em;
394     vertical-align: top;
395     text-align: left;
396     }
397td {
398     border-width: 0 0 1px 0;
399     border-style: solid;
400     border-color: #e3e3e3;
401     padding: .4em 1em .4em .5em;
402     vertical-align: top;
403     }
404/* ---------------------------------------------------------- autres balises */
405p {
406     margin: 0 0 1em 0;
407     }
408hr {
409     height: 1px;
410     border-width: 1px 0 0;
411     border-color: #dfdfdf;
412     background: #dfdfdf;
413     border-style: solid;
414     }
415hr.clearer {
416     clear: both;
417     }
418pre, code, #debug {
419     font: 100% "Andale Mono","Courier New",monospace;
420     }
421code {
422     background: #fefacd;
423     }
424pre {
425     white-space: pre;
426     white-space: -moz-pre-wrap;
427     white-space: pre-wrap;
428     white-space: pre-line;
429     word-wrap: break-word;
430     }
431abbr {
432     cursor: help;
433     }
434input, textarea, select, option, optgroup, legend,label {
435     font-size: 1em;
436     }
437/* ------------------------------------------------------------------ liens */
438a, a:link, a:visited {
439     color: #2373A8;
440     text-decoration: none;
441     border-bottom: 1px dotted #999;
442     }
443a:hover, a:active, a:focus {
444     border-bottom-style: solid;
445     }
446a img, a:link img, a:visited img {
447     border: none;
448     }
449h1 a:link, h1 a:visited {
450     border: none;
451     }
452.discrete a {
453     color: #333;
454     }
455/* ----------------------------------------------------------------------------
456                                                                                     FORMULAIRES
457---------------------------------------------------------------------------- */
458input[type=text], input[type=password], input[type=submit], 
459input[type=button], input[type=reset], a.button, button, textarea, select, legend {
460     border-radius: 3px; 
461     }
462form {
463     display: block;
464     margin: 0;
465     padding: 0;
466     }
467fieldset {
468     display: block;
469     margin: 1em 0;
470     padding: 1em 0.5em;
471     border-width: 1px 0;
472     border-style: solid;
473     border-color: #ccc;
474     background: #f7f7f7;
475     }
476input[type=text], textarea {
477     font: 100% "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
478     }
479legend {
480     padding: 0.2em 0.6em;
481     border-width: 1px;
482     border-style: solid;
483     border-color: #676e78;
484     background: #fff;
485     margin-bottom: 0.5em;
486     }
487label .maximal, textarea.maximal, input.maximal {
488     width: 99%;
489     }
490input[type=text], input[type=password], textarea, select {
491     background: #fcfcfc;
492     color: #000;
493     border-width: 1px;
494     border-style: solid;
495     border-color: #dfdfdf;
496     box-shadow: 1px 1px 2px #f3f3f3 inset;
497     padding: 3px;
498     vertical-align: top;
499     }
500input:focus, textarea:focus, select:focus {
501     border-color: #9bca1c;
502     }
503textarea {
504     padding: 2px 0;
505     }
506textarea.maximal {
507     resize: vertical;
508     }
509.area textarea {
510     display: block;
511     width: 100%;
512     resize: vertical;
513     }
514select {
515     padding: 2px 0;
516     vertical-align: middle;
517     }
518select.l10n option {
519     padding-left: 16px;
520     }
521option.avail10n {
522     background: transparent url(../images/check-on.png) no-repeat 0 50%;
523     }
524option.sub-option1 {
525     margin-left: .5em;
526     }
527option.sub-option2 {
528     margin-left: 1.5em;
529     }
530option.sub-option3 {
531     margin-left: 2.5em;
532     }
533option.sub-option4 {
534     margin-left: 3.5em;
535     }
536option.sub-option5 {
537     margin-left: 4.5em;
538     }
539option.sub-option6 {
540     margin-left: 5.5em;
541     }
542option.sub-option7 {
543     margin-left: 6.5em;
544     }
545option.sub-option8 {
546     margin-left: 7.5em;
547     }
548option.sub-option1:before, option.sub-option2:before, option.sub-option3:before, option.sub-option4:before,
549option.sub-option5:before, option.sub-option6:before, option.sub-option7:before, option.sub-option8:before {
550     content: "\002022\0000a0";
551     }
552input.invalid, textarea.invalid, select.invalid {
553     border: 1px solid red;
554     background: #FFBABA;
555     color: #900;
556     box-shadow: 0 0 0 3px rgba(218, 62, 90, 0.3);
557     }
558input[type=text], input[type=password], textarea {
559     margin-right: .3em;
560     }
561input[type=checkbox], input[type=radio], input[type=file] {
562     border: none;
563     margin: 0 .33em 0 0;
564     padding: 0;
565     background: transparent;
566     }
567input[type=file] {
568     margin-top: .3em;
569     margin-bottom: .3em;
570     }
571optgroup {
572     font-weight: bold;
573     font-style: normal;
574     }
575option {
576     font-weight: normal;
577     }
578label, label span {
579     display: block;
580     }
581label.ib, input.ib {
582     display: inline-block;
583     }
584label.classic {
585     display: inline;
586     }
587label.classic input, label span input, label.classic select, label span select {
588     display: inline;
589     }
590label.required {
591     font-weight: bold;
592     }
593label.required abbr {
594     color: #900;
595     font-size: 1.3em;
596     }
597label.area, p.area {
598     width: inherit !important;
599     }
600p.field {
601     position: relative;
602     }
603p.field label {
604     display: inline-block;
605     width: 14em;
606     }
607p.field.wide label {
608     width: 21em;
609     }
610p.field input, p.field select {
611     display: inline-block;
612     }
613.form-note {
614     font-style: italic;
615     font-weight: normal;
616     color: #676e78;
617     }
618p.form-note {
619     margin-top: -.7em;
620     }
621span.form-note {
622     text-transform: none;
623     }
624/* ----------------------------------------------------------------------------
625                                                                                          BOUTONS
626---------------------------------------------------------------------------- */
627/* Removes inner padding and border in FF3+  - Knacss */
628button::-moz-focus-inner,
629input[type=button]::-moz-focus-inner,
630input[type=reset]::-moz-focus-inner,
631input[type=submit]::-moz-focus-inner {
632     border: 0;
633     padding: 0;
634     }
635/* tous les boutons */
636button,
637a.button,
638input[type=button],
639input[type=reset],
640input[type=submit] {
641     border: 1px solid #ccc;
642     font-family: "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
643     padding: 3px 10px;
644     line-height: normal !important;
645     display: inline-block;
646     font-size: 100%;
647     text-align: center;
648     text-decoration: none;
649     cursor: pointer;
650     position: relative;
651     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
652     border-style: solid;
653     border-width: 1px;
654     }
655button,
656input[type=button],
657input[type=reset],
658input[type=submit] {
659     -webkit-appearance: button;
660     }
661/* validation */
662input[type=submit], a.button.submit, input.button.start {
663     color: #fff;
664     background-color: #25A6E1;
665     background-image: -webkit-gradient(linear,left top,left bottom, from(#25A6E1), to(#188BC0));
666     background-image: linear-gradient(#25A6E1,#188BC0);
667     border-color: #25A6E1;
668     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
669     }
670input[type=submit]:hover, input[type=submit]:focus,
671     input.button.start:hover, input.button.start:focus,
672     a.button.submit:hover, a.button.submit:focus {
673     background-color: #188BC0;
674     background-image: -webkit-gradient(linear,left top,left bottom, from(#188BC0),to(#25A6E1));
675     background-image: linear-gradient(#188BC0,#25A6E1);
676     border-color: #188BC0;
677     }
678/* suppression, reset, "neutres" fond gris */
679button, input[type=button], input.button,
680input[type=reset], input[type=submit].reset, input.reset, 
681input[type=submit].delete, input.delete,
682 a.button, a.button.delete, a.button.reset {
683     color: #000;
684     background-color: #EAEAEA;
685     background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#EAEAEA));
686     background-image: linear-gradient(#f9f9f9,#EAEAEA);
687     background-repeat: repeat-x;
688     border-color: #dfdfdf #dfdfdf #C5C5C5;
689     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
690     }
691button:hover, input[type=button]:hover, input.button:hover,
692     button:focus, input[type=button]:focus, input.button:focus,
693     input[type=reset]:hover, input[type=submit].reset:hover, input.reset:hover, 
694     input[type=reset]:focus, input[type=submit].reset:focus, input.reset:focus, 
695     input[type=submit].delete:hover, input.delete:hover,
696     input[type=submit].delete:focus, input.delete:focus,
697     a.button.delete:hover, a.button.reset:hover, a.button:hover,
698     a.button.delete:focus, a.button.reset:focus, a.button:focus {
699     background-color: #DADADA;
700     background-image: -webkit-gradient( linear, left top, left bottom, from(#EAEAEA), to(#DADADA));
701     background-image: linear-gradient(#EAEAEA, #DADADA);
702     background-repeat: repeat-x;
703     border-color: #CCCCCC #CCCCCC #B5B5B5;
704     }
705/* suppression */
706input[type=submit].delete, input.delete, a.button.delete {
707     color: #900;
708     }
709input[type=submit].delete:hover, input.delete:hover, a.button.delete:hover,
710     input[type=submit].delete:focus, input.delete:focus, a.button.delete:focus {
711     color: #FFFFFF;
712     background-color: #B33630;
713     background-image: -webkit-gradient( linear, left top, left bottom, from(#DC5F59), to(#B33630));
714     background-image: linear-gradient(#DC5F59, #B33630);
715     background-repeat: repeat-x;
716     border-color: #CD504A;
717     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
718     }
719#info-box a.button {
720     padding: 0 .5em;
721     margin-left: 2em;
722     }
723.button.add {
724     color: #000;
725     background-color: #bee74b;
726     background-image: -webkit-gradient(linear, left top, left bottom, from(#bee74b), to(#9BCA1C));
727     background-image: linear-gradient(#bee74b, #9BCA1C);
728     border-color: #bee74b;
729     padding: .33em 1.33em .5em;
730     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
731     font-weight: normal;
732     font-size: 1.16em;
733     }
734.button.add:hover, .button.add:active, .button.add:focus {
735     background-color: #9BCA1C;
736     background-image: -webkit-gradient(linear, left top, left bottom, from(#9BCA1C), to(#bee74b));
737     background-image: linear-gradient(top, #9BCA1C, #bee74b);
738     border-color: #9BCA1C;
739     }
740.button-add:focus {
741     outline: dotted 1px;
742     }
743/* paragraphe pour bouton Nouveau bidule */
744p.top-add {
745     text-align: right;
746     margin: 0;
747     }
748/* disabled */
749input.disabled, input[type=submit].disabled {
750     text-shadow: none;
751     color: #676e78;
752     background: #F5F5F5;
753     border: 1px solid #CCC;
754     }
755input.disabled:hover, input[type=submit].disabled:hover {
756     color: #676e78;
757     background: #eee;
758     border: 1px solid #CCC;
759     }
760/* ----------------------------------------------------------------------------
761                                                                                     MESSAGES
762---------------------------------------------------------------------------- */
763.warn, .warning, .info {
764     font-style: normal;
765     padding: .2em .66em .2em;
766     text-indent: 24px;
767     color: #333;
768     display: inline-block;
769     line-height: 1.5em;
770     border-radius: 3px;
771     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6)
772     }
773div.warn, div.warning, div.info {
774     display: block;
775     padding: 1em 1em .33em 1em;
776     margin-bottom: 1em;
777     }
778.warn, .warning {
779     background: #FEFACD url(msg-warning.png) no-repeat .3em .3em;
780     border: 1px solid #ffd478;
781     }
782.info {
783     background: #D9EDF7 url(msg-info.png) no-repeat .3em .3em;
784     border: 1px solid #BCE8F1;
785     }
786span.warn, span.warning, span.info {
787     padding-top: 1px;
788     padding-bottom: 1px;
789     background-position: .3em .2em;
790     }
791.error, .message, .static-msg, .success, .warning-msg {
792     padding: 1em 0.5em 0.5em 48px;
793     margin-bottom: 1em;
794     border-radius: 8px;
795     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
796     }
797p.error, p.message, p.static-msg, p.success, p.warning-msg {
798     padding-top: 1em;
799     padding-bottom: 1em;
800     margin-top: .5em;
801     }
802.error {
803     background: #FFBABA url(msg-error.png) no-repeat .7em .7em;
804     color: #000;
805     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
806     }
807.message, .static-msg {
808     background: #676e78 url(msg-std.png) no-repeat .7em .7em;
809     color: #fff;
810     }
811.message a, .static-msg a, .message h3, .static-msg h3 {
812     color: #fff;
813     }
814.success, .warning-msg {
815     color: #000;
816     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6)
817     }
818.success {
819     background: #9bca1c url(msg-success.png) no-repeat .7em .7em;
820     }
821.warning-msg {
822     background: #ffd478 url(msg-warning.png) no-repeat .7em .7em;
823     border: 1px solid #ffd478;
824     }
825.success a, .warning-msg a, .info a {
826     color: #333;
827     }
828.dc-update {
829     padding: 1em 48px 0.5em 48px;
830     margin-bottom: 1em;
831     border-radius: 8px;
832     background: #A2CBE9 url(msg-success.png) no-repeat .7em .7em;
833     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
834     color: #000;
835     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1)
836     }
837.dc-update h3 {
838     margin-top: 0;
839     color: #000;
840     }
841.dc-update p {
842     display: inline-block;
843     vertical-align: middle;
844     }
845.dc-update a {
846     color: #000;
847     margin-right: 1em;
848     }
849.dc-update a.button {
850     padding: .5em 1em;
851     }
852.updt-info a {
853     margin-left: 2em;
854     border-color: #000;
855     font-weight: bold;
856     }
857/* ---------------------------------------------------------------------------------
858                                                                                ELEMENTS PRINCIPAUX
859--------------------------------------------------------------------------------- */
860/* -------------------------------------------------------------- HEADER ELEMENTS */
861/* prelude */
862#prelude {
863     line-height: 1.5;
864     margin: 0;
865     padding: 0;
866     overflow: hidden;
867     position: absolute;
868     top: 3em;
869     left: 0;
870     background: #A2CBE9;
871     width: 100%;
872     z-index: 100;
873     }
874#prelude li {
875     list-style-type: none;
876     margin: 0;
877     background: transparent;
878     display: inline;
879     }
880#prelude li a {
881     padding: 3px 16px 3px 8px;
882     background: #A2CBE9;
883     color: #000;
884     text-decoration: underline;
885     }
886#prelude li a:hover, #prelude li a:focus {
887     background: #FFF;
888     }
889/* si le prélude est affiché on repousse les trucs dessous */
890#wrapper.with-prelude {
891     padding-top: 1em;
892     }
893#help-button.with-prelude, #collapser.with-prelude {
894     top: 1em;
895     }
896/* header global h1, form#top-info-blog, ul#top-info-user */
897#header a {
898     color: #FFF;
899     }
900#header img {
901     vertical-align: middle;
902     padding-left: .5em;
903     }
904h1, #top-info-blog, #top-info-user {
905     display: table-cell;
906     padding: 8px 0;
907     margin: 0;
908     font-size: 1em;
909     vertical-align: top;
910     }
911/* h1 */
912h1 {
913     text-indent: -1000px;
914     width: 16.5em;
915     }
916h1 a {
917     position: absolute;
918     top: 0;
919     left: 0;
920     width: 15em;
921     height: 3em;
922     color: #fff;
923     background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 6px;
924     }
925h1 a:hover, h1 a:focus {
926     background-position: 0 -94px;
927     }
928/* top-info-blog */
929#top-info-blog select {
930     max-width: 20em;
931     }
932#top-info-blog a {
933     margin-left: 1.5em;
934     }
935#top-info-blog input[type=submit] {
936     background: #000;
937     border-color: #999;
938     margin-left: .33em;
939     }
940#top-info-blog input[type=submit]:hover {
941     background: #999;
942     }
943#top-info-blog p {
944     display: inline-block;
945     margin: 0;
946     }
947/* top-info-user */
948#top-info-user {
949     padding-right: 18px;
950     list-style-type: none;
951     text-align: right;
952     }
953#top-info-user li {
954     display: inline-block;
955     margin-left: .5em;
956     padding-left: .5em;
957     border-left: 1px solid #999;
958     }
959#top-info-user li:first-child {
960     border-left: none;
961     }
962#top-info-user a.active {
963     border-bottom-color: #fff;
964     margin: 0;
965     padding: 18px .5em;
966     background-color: #fff;
967     color: #333;
968     font-weight: bold;
969     }
970/* ---------------------------------------------------------- MAIN-MENU ELEMENTS */
971#favorites-menu, #blog-menu, #system-menu, #plugins-menu {
972     border-bottom: 1px dashed #A2CBE9;
973     }
974#main-menu h3 {
975     margin: 0;
976     padding: 10px 0 10px 8px;
977     color: #676e78;
978     font-size: 1.15em;
979     }
980#favorites-menu h3 {
981     color: #000;
982     font-variant: small-caps;
983     padding-top: .2em;
984     }
985#main-menu a {
986     color: #333;
987     border-bottom-color: #ccc;
988     }
989#main-menu ul {
990     margin: 0 0 1.5em 0;
991     padding: 0;
992     list-style: none;
993     }
994#main-menu li {
995     display: block;
996     margin: 0.5em 0 0;
997     padding: 4px 0 1px 32px;
998     background-repeat: no-repeat;
999     background-position: 8px .3em;
1000     }
1001#main-menu ul li:first-child {
1002     margin-top: 0;
1003     }
1004#main-menu li.active {
1005     background-color: #fff;
1006     font-weight: bold;
1007     }
1008#favorites-menu li.active {
1009     background-color: transparent;
1010     }
1011#main-menu .active a {
1012     border-bottom: none;
1013     color: #d30e60;
1014     }
1015#favorites-menu .active a {
1016     color: #000;
1017     }
1018#search-menu {
1019     padding: 4px 5px 0;
1020     font-size: 100%
1021     }
1022#search-menu * {
1023     height: 24px; /* ie < 9 sucks */
1024     height: 2em;
1025     display: inline-block;
1026     vertical-align: top;
1027     line-height: 24px;
1028     }
1029#search-menu p {
1030     border: 1px solid #999;
1031     border-radius: .3em;
1032     position: relative;
1033     overflow: hidden;
1034     }
1035#qx {
1036     width: 10em;
1037     border-bottom-left-radius: .3em;
1038     border-top-left-radius: .3em;
1039     background: transparent url(search.png) no-repeat 4px center;
1040     text-indent: 18px;
1041     padding: 0;
1042     border: none;
1043     height: 2em;
1044     }
1045#qx:focus {
1046     border: 1px solid #bee74b;
1047     }
1048#search-menu input[type="submit"] {
1049     padding: 0 .25em;
1050     margin-left: .33em;
1051     background: #dfdfdf;
1052     border-color: #999;
1053     color: #333;
1054     border-bottom-right-radius: .3em;
1055     border-top-right-radius: .3em;
1056     border-top-left-radius: 0;
1057     border-bottom-left-radius: 0;
1058     text-shadow: none;
1059     border: none;
1060     border-left: 1px solid #999;
1061     font-size: .91em;
1062     }
1063#search-menu input[type="submit"]:hover,
1064#search-menu input[type="submit"]:focus {
1065     background: #676e78;
1066     color: #fff;
1067     }
1068/* ----------------------------------------------------------------- CONTENT ELEMENTS */
1069.part-tabs ul {
1070     padding: .5em 0 0 1em;
1071     border-bottom: 1px solid #ccc;
1072     line-height: 1.8;
1073     }
1074.part-tabs li {
1075     list-style: none;
1076     margin: 0;
1077     display: inline;
1078     }
1079.part-tabs li:first-child a {
1080     border-top-left-radius: 3px;
1081     }
1082.part-tabs li:last-child a {
1083     border-top-right-radius: 3px;
1084     }
1085.part-tabs li a {
1086     padding: .33em 1.5em;
1087     margin-right: -1px;
1088     border: 1px solid #ccc;
1089     border-bottom: none;
1090     text-decoration: none;
1091     color: #333;
1092     background-color: #ecf0f1;
1093     display: inline-block;
1094     }
1095.part-tabs li a:hover, .part-tabs li a:focus {
1096     color: #000;
1097     background: #fff;
1098     border-bottom-color: #fff;
1099     }
1100.part-tabs li.part-tabs-active a {
1101     background: #fff;
1102     font-weight: bold;
1103     border-bottom-color: #fff;
1104     }
1105.multi-part {
1106     padding-left: 1em;
1107     }
1108.pseudo-tabs {
1109     margin: -.75em 0 2em 0;
1110     border-bottom: 1px solid #bbb;
1111     display: table;
1112     width: 100%;
1113     padding: 0;
1114     line-height: 24px;
1115     border-collapse: collapse;
1116     }
1117.pseudo-tabs li {
1118     display: table-cell;
1119     border-width: 0 1px;
1120     border-style: solid;
1121     border-color: #ccc;
1122     padding: 0;
1123     margin: 0;
1124     text-align: center;
1125     }
1126.pseudo-tabs a {
1127     display: block;
1128     font-weight: bold;
1129     padding: 0 24px;
1130     border-bottom: none;
1131     }
1132.pseudo-tabs a:hover, .pseudo-tabs a:focus {
1133     background-color: #ecf0f1;
1134     color: #333;
1135     }
1136.pseudo-tabs a.active {
1137     background-color: #ecf0f1;
1138     color: #d30e60;
1139     }
1140/* contextual help */
1141#help {
1142     margin-top: 4em;
1143     background: #f5f5f5;
1144     z-index: 100;
1145     clear: both;
1146     padding: 0 1em;
1147     }
1148#content.with-help #help {
1149     display: block;
1150     position: absolute;
1151     top: 0;
1152     right: 0;
1153     width: 24em;
1154     border-left: 2px solid #FFD478;
1155     border-top: 2px solid #FFD478;
1156     margin-top: 0;
1157     padding: .5em 0 0 0;
1158     overflow: auto;
1159     }
1160#help-button {
1161     background: transparent url(help-mini.png) no-repeat 6px center;
1162     position: absolute;
1163     top: 0;
1164     right: 0;
1165     padding: 0 1.5em 0 30px;
1166     cursor: pointer;
1167     color: #2373A8;
1168     line-height: 3;
1169     }
1170#help-button.floatable {
1171     border-top: 2px solid #ccc;
1172     border-left: 2px solid #ccc;
1173     border-bottom: 2px solid #ccc;
1174     border-bottom-left-radius: 1em;
1175     border-top-left-radius: 1em;
1176     background-color: #f5f5f5;
1177     position: fixed;
1178     top: 10px;
1179     -webkit-transform:translateZ(0);   /* Let GPU doing his job */
1180     }
1181.no-js #help-button {
1182     top: 1em;
1183     }
1184#help-button span {
1185     padding: .5em 0 .1em 0;
1186     }
1187#content.with-help #help-button {
1188     right: 24em;
1189     background-color: #f5f5f5;
1190     position: fixed;
1191     top: 50px;
1192     z-index: 100;
1193     border-top: 2px solid #FFD478;
1194     border-left: 2px solid #FFD478;
1195     border-bottom: 2px solid #FFD478;
1196     border-bottom-left-radius: 1em;
1197     border-top-left-radius: 1em;
1198     }
1199.help-box {
1200     display: none;
1201     }
1202.help-box ul {
1203     padding-left: 20px;
1204     margin-left: 0;
1205     }
1206#content.with-help .help-content {
1207     padding: 0 1em 1em;
1208     }
1209.help-content dt {
1210     font-weight: bold;
1211     color: #676e78;
1212     margin: 0;
1213     }
1214.help-content dd {
1215     margin: 0.3em 0 1.5em 0;
1216     }
1217/* lien d'aide générale dans le help content */
1218#helplink p {
1219     padding: 0 0 0 .5em;
1220     }
1221/* ------------------------------------------------------------------ FOOTER ELEMENTS */
1222#footer p {
1223     margin: 0;
1224     padding: 0 1em;
1225     font-size: 1em;
1226     }
1227span.credit {
1228     font-size: 1em;
1229     font-weight: normal;
1230     }
1231span.tooltip {
1232     position: absolute;
1233     padding: 0;
1234     border: 0;
1235     height: 1px;
1236     width: 1px;
1237     overflow: hidden;
1238     }
1239#footer a:hover span.tooltip {
1240     padding: 10px 10px 0 40px;
1241     color: #d30e60;
1242     height: auto;
1243     width: auto;
1244     right: 0;
1245     bottom: 0;
1246     background: #FFF;
1247     z-index: 99;
1248     font-family: monospace;
1249     border: none;
1250     text-align: left;
1251     }
1252/* ---------------------------------------------------------------------------------------
1253                                                                                     RÈGLES SPÉCIFIQUES
1254---------------------------------------------------------------------------------------- */
1255/* ---------------------------------------------------------------- LISTES TABLEAUX */
1256table .maximal, table.maximal {
1257     width: 100%;
1258     }
1259table .minimal {
1260     width: 1px;
1261     }
1262table .nowrap {
1263     white-space: nowrap;
1264     vertical-align: top;
1265     }
1266table .count {
1267     text-align: right;
1268     padding-right: 1.5em;
1269     }
1270th.first img {
1271     padding-right: 34px;
1272     }
1273.line img {
1274     vertical-align: middle;
1275     }
1276tr.line img.expand, th img.expand {
1277     margin-right: 6px;
1278     margin-bottom: -2px;
1279     }
1280tr.line p {
1281     margin: 0;
1282     }
1283tr.line input[type=text] {
1284     background: #FFF;
1285     }
1286tr.line input, tr.line select {
1287     vertical-align: middle;
1288     -webkit-box-shadow: none;
1289     box-shadow: none;
1290     }
1291tr.line select {
1292     width: 6em;
1293     }
1294tr.line:hover {
1295     background: #f3f3f3;
1296     }
1297td.status {
1298     vertical-align: middle;
1299     }
1300td.status img {
1301     margin-bottom: -2px;
1302     }
1303td.status a {
1304     border: none;
1305     }
1306.noborder td, td.noborder, .noborder th, th.noborder {
1307     border-width: 0 0 1px 0;
1308     border-color: #dfdfdf;
1309     line-height: 2em;
1310     padding-bottom: 0;
1311     }
1312.noborder p {
1313     margin-bottom: 0;
1314     }
1315table.posts-list {
1316     min-width: 50%;
1317     }
1318table.settings, table.prefs {
1319     margin-bottom: 3em;
1320     }
1321table.settings th:first-child, table.prefs th:first-child {
1322     width: 20%;
1323     }
1324table.settings th + th, table.prefs th + th {
1325     width: 30%;
1326     }
1327table.settings th + th + th, table.prefs th + th + th {
1328     width: 10%;
1329     }
1330table.settings th:last-child, table.prefs th:last-child {
1331     width: 40%;
1332     }
1333/* js */
1334td.expand {
1335     padding: 1em;
1336     }
1337tr.expand td {
1338     border-bottom: none;
1339     }
1340.handle {
1341     padding: 0;
1342     }
1343.handler {
1344     cursor: move;
1345     background: transparent url(drag.png) no-repeat 0 50%;
1346     padding-left: 15px;
1347     }
1348/* ----------------------------------------------------------- BOITES À FILTRES */
1349a.form-control {
1350     display: none;
1351     background: url(../images/expand.png) no-repeat 4px center;
1352     padding-left: 20px;
1353     color: #000;
1354     }
1355a.form-control.open {
1356     background: url(../images/hide.png) no-repeat 4px center;
1357     }
1358#filters-form {
1359     border: 1px dashed #999;
1360     border-radius: .3em;
1361     margin-bottom: 2em;
1362     padding: .5em 1em 0;
1363     }
1364#filters-form .table {
1365     width: 100%;
1366     padding: 0;
1367     margin-bottom: 1em;
1368     margin-top: .5em;
1369     }
1370#filters-form .cell {
1371     padding: 0 2em 0 0;
1372     }
1373#filters-form .filters-sibling-cell {
1374     padding-top: 3.8em;
1375     }
1376#filters-form .filters-options {
1377     padding-left: 2em;
1378     border-left: 1px solid #ccc;
1379     }
1380#filters-form label.ib, span.ib {
1381     width: 7em;
1382     }
1383#filters-form label.ibw, span.ibw {
1384     width: 9em;
1385     display: inline-block;
1386     }
1387#filters-form select {
1388     width: 14em;
1389     vertical-align: middle;
1390     }
1391#filters-form h4 {
1392     margin-top: 0;
1393     margin-bottom: 2em;
1394     }
1395/* ---------------------------------------------------------------------------- SPEC PAGES */
1396/* ---------------------------------------------------------------------------- auth.php */
1397#login-screen {
1398     display: block;
1399     width: 20em;
1400     margin: 1.5em auto 0;
1401     font-size: 1.16em;
1402     }
1403#login-screen h1 {
1404     text-indent: -2000px;
1405     background: transparent url(dc_logos/w-dotclear240.png) no-repeat top left;
1406     height: 66px;
1407     width: 20em;
1408     margin-bottom: .5em;
1409     margin-left: 0;
1410     }
1411#login-screen .fieldset {
1412     border: 1px solid #9bca1c;
1413     padding: 1em 1em 0 1em;
1414     background: #fff;
1415     margin-bottom: 0;
1416     }
1417#login-screen input[type=text], #login-screen input[type=password], #login-screen input[type=submit],
1418#login-screen input[type=text]:focus, #login-screen input[type=password]:focus, #login-screen input[type=submit]:focus {
1419     width: 100%;
1420     margin: 0;
1421     padding: 5px 3px;
1422     }
1423#login-screen input.login, #login-screen input.login:focus {
1424     padding-top: 6px;
1425     padding-bottom: 6px;
1426     font-size: 1em;
1427     }
1428#login-screen #issue {
1429     margin-left: 1.33em;
1430     font-size: .91em;
1431     }
1432#issue p:first-child {
1433     text-align: right;
1434     }
1435#login-screen #issue strong {
1436     font-weight: normal;
1437     }
1438/* ------------------------------------------------------------------------- index.php */
1439#dashboard-main {
1440     padding: 1em;
1441     }
1442/* raccourcis */
1443#icons {
1444     overflow: hidden;
1445     padding-bottom: 1em;
1446     text-align: center;
1447     }
1448#icons p {
1449     width: 180px;
1450     text-align: center;
1451     margin: 1em 0 2em;
1452     padding: 1em 0;
1453     display: inline-block;
1454     vertical-align: top;
1455     }
1456#icons a,
1457     #icons a:link,
1458     #icons a:visited,
1459     #icons a:hover,
1460     #icons a:focus {
1461     border-bottom-width: 0;
1462     text-decoration: none;
1463     }
1464#icons a span {
1465     border-bottom: 1px dotted #999;
1466     color: #333;
1467     }
1468#icons a img {
1469     padding: 1.5em;
1470     background-color: #f9f9f9;
1471     border-radius: 8px;
1472     border: 1px solid #dadada;
1473     display: inline-block;
1474     }
1475#icons a:focus img, #icons a:hover img {
1476     background: #bee74b;
1477     }
1478#icons a:focus span, #icons a:hover span {
1479     border-bottom-style: solid;
1480     }
1481/* billet rapide */
1482#quick {
1483     padding: 1em;
1484     max-width: 1000px;
1485     margin: 0 auto;
1486     background: #f5f5f5;
1487     box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
1488     }
1489#quick h3 {
1490     margin-bottom: 0.2em;
1491     font-size: 1.2em;
1492     }
1493#quick p.qinfo {
1494     margin: -.7em -1em 1em;
1495     background: #D9EDF7 url(info.png) no-repeat .2em .2em;
1496     border: 1px solid #BCE8F1;
1497     padding: .2em 1em .1em 24px;
1498     color: #000;
1499     }
1500#quick #new_cat, .q-cat, .q-cat label {
1501     display: inline-block;
1502     vertical-align: top;
1503     margin-right: 1em;
1504     margin-top: 0;
1505     }
1506.q-cat label {
1507     margin-right: .3em;
1508     }
1509#quick #new_cat {
1510     margin-bottom: 2em;
1511     }
1512/* modules additionnels */
1513#dashboard-boxes {
1514     margin: 1em auto 1em;
1515     padding-top: 2em;
1516     }
1517.db-items, .db-contents {
1518     display: inline-block;
1519     text-align: center;
1520     }
1521.no-js .outgoing img {
1522     display: none;
1523     }
1524#dashboard-boxes .box {
1525     padding: 10px;
1526     border: 1px solid #ccc;
1527     border-radius: 3px;
1528     min-height: 200px;
1529     margin: 10px;
1530     text-align: left;
1531     }
1532.dc-box {
1533     background: transparent url(dc_logos/sq-logo-32.png) no-repeat top right;
1534     }
1535.db-items img, .db-contents img {
1536     vertical-align: middle;
1537     }
1538.db-items ul, .db-contents ul {
1539     display: block;
1540     padding-left: 1.5em;
1541     list-style: square;
1542     }
1543.db-items li, .db-contents li {
1544     margin: 0.25em 0 0 0;
1545     }
1546#news dt {
1547     font-weight: bold;
1548     margin: 0 0 0.4em 0;
1549     }
1550#news dd {
1551     margin: 0 0 1em 0;
1552     }
1553#news dd p {
1554     margin: 0.2em 0 0 0;
1555     }
1556/* message de mise à jour */
1557#upg-notify ul {
1558     padding-left: 1.5em;
1559     }
1560#upg-notify li {
1561     color: #fff;
1562     }
1563/* ------------------------------------------------------------------- blog_pref.php */
1564#media_img_title_pattern {
1565     margin-right: 1em;
1566     }
1567.user-perm {
1568     margin: 2em 0px;
1569     background: transparent url(user.png) no-repeat left top;
1570     width: 320px;
1571     display: inline-block;
1572     vertical-align: top;
1573     }
1574.user-perm h4, .user-perm h5, .user-perm p, .user-perm ul, .user-perm li {
1575     margin: .5em 0 .33em;
1576     padding: 0;
1577     }
1578.user-perm h4 {
1579     padding-left: 28px;
1580     }
1581.user-perm h5 {
1582     margin: 1em 0 0 0;
1583     }
1584.user-perm ul {
1585     list-style-type: inside;
1586     }
1587.user-perm li {
1588     margin-left: 1em;
1589     padding-left: 0;
1590     }
1591li.user_super, li.user_admin {
1592     margin-left: 0;
1593     padding-left: 20px;
1594     list-style: none;
1595     background: transparent url(../images/superadmin.png) no-repeat 0 .3em;
1596     }
1597li.user_admin {
1598     background-image: url(../images/admin.png);
1599     }
1600/* ------------------------------------------------------------------- blog_theme.php */
1601/* pour les alignements verticaux */
1602#theme-new, #theme-activate, #theme-deactivate {
1603     margin-left: -10px;
1604     margin-right: -10px;
1605     }
1606.box.theme {
1607     margin: 5px;
1608     padding: 10px 10px 5px 10px;
1609     border: 1px solid #dfdfdf;
1610     position: relative;
1611     }
1612.box.theme:hover {
1613     background: #ecf0f1 url(texture.png);
1614     }
1615.module-name {
1616     margin-bottom: .5em;
1617     }
1618.module-sshot {
1619     text-align: center;
1620     }
1621.module-sshot img {
1622     padding: 5px;
1623     background: #f7f7f7;
1624     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
1625     border: 3px solid #fff;
1626     }
1627.module-actions {
1628     margin-top: 1em;
1629     }
1630.bloc-toggler {
1631     text-align: right;
1632     }
1633.bloc-toggler img {
1634     opacity: .4;
1635     }
1636.bloc-toggler img:hover {
1637     opacity: 1;
1638     }
1639.bloc-toggler a:focus img {
1640     opacity: 1;
1641     }
1642span.module-version:before {
1643     content: "- ";
1644     }
1645.toggle-bloc .mod-more {
1646     display: block;
1647     margin-left: 0;
1648     }
1649.box.theme input {
1650     margin-bottom: 1em;
1651     }
1652/**
1653Les screenshots des thèmes ont deux tailles possibles :
1654- dans Ajouter des thèmes : 240px (+ 10 padding image + 20 padding boîte + 6 bordure + 2 ombrage = 278)
1655- dans Thèmes installés : 280px (+ 10 padding-image + 20 padding-boîte + 2 ombrage = 318)
1656On adapte largeur et hauteur en fonction
1657*/
1658#theme-new .box.theme { /* Ajouter un thème */
1659     width: 278px;
1660     min-height: 275px;
1661     }
1662#theme-new .module-sshot img { /* Pour ceux qui n'ont pas de miniature on contraint l'image */
1663     max-width: 240px;
1664     max-height: 210px;
1665     overflow: hidden;
1666     }
1667#theme-deactivate .box.theme { /* Thèmes désactivés */
1668     width: 278px;
1669     }
1670#theme-activate .box.theme { /* Thèmes installés */
1671     width: 318px;
1672     min-height: 304px;
1673     }
1674#theme-deactivate .box.theme:hover {
1675     background: transparent url(dc_logos/sq-logo-32.png) no-repeat top right;
1676     }
1677/* si js est là, les infos viennent par dessus le screenshot */
1678.with-js #theme-new .module-infos.toggle-bloc,
1679.with-js #theme-new .module-actions.toggle-bloc {
1680     position: absolute;
1681     left: 10px;
1682     width: 239px;
1683     margin: 0;
1684     padding: 10px;
1685     background: rgba(250, 250, 250, .95);
1686     }
1687.with-js #theme-new .module-infos.toggle-bloc {
1688     top: 128px;
1689     height: 80px;
1690     border-top: 1px solid #e3e3e3;
1691     }
1692.with-js #theme-new .module-actions.toggle-bloc {
1693     top: 208px;
1694     height: 40px;
1695     border-bottom: 1px solid #e3e3e3;
1696     }
1697.with-js .module-sshot:hover {
1698     cursor: pointer;
1699     }
1700/* mise en forme pour la boîte du thème courant */
1701.box.current-theme { /* Thème courant */
1702     width: 646px;
1703     margin: 5px;
1704     padding: 20px 18px 6px;
1705     background: #fff url(texture.png);
1706     border: 1px solid #eee;
1707     border-radius: .5em;
1708     min-height: 326px;
1709     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
1710     position: relative;
1711     }
1712.current-theme .module-sshot:hover {
1713     cursor: auto;
1714     }
1715.current-theme .module-sshot img {
1716     float: left;
1717     margin-right: 2em;
1718     border: 9px solid #fff;
1719     padding: 5px;
1720     }
1721.current-theme .module-name {
1722     color: #D33800;
1723     font-size: 1.5em;
1724     margin-bottom: 1em;
1725     }
1726.current-actions {
1727     width: auto;
1728     overflow: hidden;
1729     padding-top: 2em;
1730     margin: 1.5em 0 2em;
1731     background: transparent url(../images/minus-theme.png) no-repeat left top;
1732     }
1733.current-theme .actions-buttons {
1734     position: absolute;
1735     bottom: 0;
1736     right: 18px;
1737     }
1738/* ------------------------------------------------------------------ categories.php */
1739#categories {
1740     margin: 1em 0;
1741     }
1742#categories ul {
1743     list-style: none;
1744     margin-top: 2em;
1745     padding: 0;
1746     }
1747.cat-line {
1748     position: relative;
1749     margin: .66em 0;
1750     padding: .66em 1em;
1751     border: 1px solid #ccc;
1752     border-radius: 3px;
1753     }
1754.cat-line label {
1755     margin-right: .25em;
1756     }
1757.cat-line label a {
1758     font-weight: bold;
1759     }
1760.cat-line p, .cat-line label {
1761     margin: 0;
1762     display: inline-block;
1763     }
1764p.cat-title {
1765     margin-right: 1em;
1766     }
1767.cat-nb-posts a {
1768     color: #333;
1769     }
1770.cat-url {
1771     padding-left: 1em;
1772     }
1773#categories .placeholder {
1774     outline: 1px dashed #4183C4;
1775     min-height: 2.5em;
1776     }
1777.cat-buttons {
1778     float: right;
1779     margin-top: -.2em;
1780     font-size: .91em;
1781     }
1782.cat-buttons select {
1783     padding: 1px 2px 3px 2px;
1784     margin-right: .25em;
1785     }
1786.cat-buttons .reset {
1787     padding-left: 4px;
1788     padding-right: 4px;
1789     }
1790#categories ul ul {
1791     margin-right: 2em;
1792     margin-left: 2em;
1793     }
1794.cat-line .cat-line {
1795     border: 1px solid #dfdfdf;
1796     }
1797.cat-actions {
1798     line-height: 2;
1799     }
1800#del_cat {
1801     width: 100%;
1802     }
1803/* ------------------------------------------------------------------ media.php */
1804.media-item {
1805     position: relative;
1806     border: 1px solid #dfdfdf;
1807     margin: 9px;
1808     padding: 10px 12px 6px;
1809     width: 320px;
1810     display: inline-block;
1811     vertical-align: top;
1812     min-height: 140px;
1813     word-wrap: break-word;
1814     }
1815.media-item p {
1816     margin: 0 0 .5em;
1817     }
1818.media-item object {
1819     margin-top: .5em;
1820     }
1821.media-item ul {
1822     display: block;
1823     list-style: none;
1824     margin: 0;
1825     padding: 0;
1826     }
1827a.media-icon {
1828     display: block;
1829     border-bottom: none;
1830     margin: 0 auto;
1831     }
1832.media-icon img {
1833     display: block;
1834     }
1835.media-link {
1836     font-size: 1.1em;
1837     }
1838.media-action-box {
1839     position: relative;
1840     margin: 3em 3em 1em 1em;
1841     display: inline-block;
1842     vertical-align: top;
1843     }
1844li.media-action {
1845     display: block;
1846     position: absolute;
1847     bottom: 4px;
1848     right: 8px;
1849     height: 16px;
1850     }
1851li.media-action a {
1852     border: none;
1853     }
1854li.media-action a.attach-media {
1855     margin-right: 5px;
1856     }
1857li.media-action form {
1858     display: inline;
1859     }
1860li.media-action input {
1861     border: none;
1862     }
1863#entry-sidebar .media-item {
1864     width: 100%;
1865     min-height: 0;
1866     padding: 4px;
1867     margin: .33em 0;
1868     }
1869#entry-sidebar li.media-action {
1870     top: 4px;
1871     }
1872.folders-group .media-item {
1873     min-height: 70px;
1874     }
1875.folders-group .media-item p {
1876     margin-bottom: 0;
1877     }
1878.media-folder {
1879     background: transparent url(bg_menu.png) repeat-y;
1880     border-color: #eee;
1881     }
1882.media-folder-up {
1883     border-color: #fff;
1884     padding-bottom: 6px;
1885     }
1886.media-folder .media-link {
1887     font-size: 1.25em;
1888     margin-left: 2em;
1889     color: #676e78;
1890     border-bottom: none;
1891     }
1892.medias-delete {
1893     text-align: right;
1894     }
1895/* upload multiple */
1896.enhanced_uploader .choose_files, .enhanced_uploader .cancel, 
1897.enhanced_uploader .clean, .enhanced_uploader .start {
1898     margin-right: .4em;
1899     }
1900.enhanced_uploader #upfile {
1901     visibility: hidden;
1902     width: 0;
1903     height: 0;
1904     margin: 0;
1905     opacity: 0;
1906     filter: alpha(opacity=0);
1907     cursor: pointer;
1908     }
1909.button.clean, .button.cancel, .button.choose_files {
1910     display: none;
1911     }
1912.enhanced_uploader .button.choose_files {
1913     display: inline-block;
1914     }
1915.enhanced_uploader .max-size {
1916     display: block;
1917     }
1918.enhanced_uploader .one-file {
1919     display: none;
1920     }
1921label span.one-file {
1922     display: inline;
1923     }
1924.enhanced_uploader p.clear {
1925     padding-top: 1em;
1926     margin-bottom: 1em;
1927     }
1928#add-file-f p.clear {
1929     margin-top: 1em;
1930     margin-bottom: 0;
1931     clear: both;
1932     }
1933.files {
1934     list-style-type: none;
1935     margin-left: 0;
1936     padding-left: 0;
1937     border-bottom: 1px solid #dfdfdf;
1938     }
1939.files li {
1940     margin-left: 0;
1941     padding-left: 0;
1942     }
1943.upload-msg {
1944     font-weight: bold;
1945     }
1946.upload-msg.upload-error {
1947     color: #900;
1948     }
1949.upload-files {
1950     padding: 0 0.5em;
1951     margin: 1em 0;
1952     }
1953.upload-file {
1954     margin: 0;
1955     padding: .3em 0;
1956     border-top: 1px solid #dfdfdf;
1957     position: relative;
1958     }
1959.upload-fileinfo {
1960     margin-left: 0;
1961     }
1962.upload-fileinfo input {
1963     position: absolute;
1964     top: .5em;
1965     right: .5em;
1966     }
1967.upload-fileinfo span {
1968     padding-right: 8px;
1969     }
1970.upload-fileinfo .upload-filecancel {
1971     display: block;
1972     padding-right: 0;
1973     margin-top: 3px;
1974     width: 20px;
1975     height: 20px;
1976     background: transparent url("cancel.png") no-repeat left top;
1977     text-indent: -1000px;
1978     cursor: pointer;
1979     float: left;
1980     }
1981.upload-filemsg {
1982     font-weight: bold;
1983     color: green;
1984     }
1985.upload-filemsg.upload-error {
1986     color: #900;
1987     }
1988.upload-progress {
1989     padding: .3em 0;
1990     }
1991.upload-progress div {
1992     width: 0;
1993     height: 1.2em;
1994     font-weight: bold;
1995     line-height: 1.2em;
1996     text-align: right;
1997     background: green url(loader.png) repeat-x left top;
1998     color: white;
1999     border-radius: 3px;
2000     }
2001div.template-upload {
2002     clear: both;
2003     }
2004.queue-message {
2005     font-weight: bold;
2006     }
2007/* --------------------------------------------------------------- media-item.php */
2008#media-icon {
2009     float: left;
2010     }
2011.near-icon {
2012     margin-left: 70px;
2013     margin-bottom: 3em;
2014     }
2015#media-details ul {
2016     display: block;
2017     margin-left: 0;
2018     padding: 0;
2019     }
2020#media-details li {
2021     list-style: square inside;
2022     margin: 0;
2023     padding: 0;
2024     }
2025#media-original-image {
2026     overflow: auto;
2027     }
2028#media-original-image.overheight {
2029     height: 500px;
2030     }
2031/* -------------------------------------------------------------------- plugins.php */
2032.modules td.module-actions, .modules td.module-icon {
2033     vertical-align: middle;
2034     }
2035.modules td.module-icon img:last-child {
2036     width: 16px;
2037     height: 16px;
2038     }
2039.modules td.module-icon img.expand {
2040     margin-bottom: 3px;
2041     }
2042.modules td.module-distrib img {
2043     display: block;
2044     float: right;
2045     }
2046.modules dt {
2047     font-weight: bold;
2048     }
2049.modules a.module-details {
2050     background: transparent url(search.png) no-repeat 2px center;
2051     padding: 4px 4px 0 20px;
2052     }
2053.modules a.module-support {
2054     background: transparent url(help12.png) no-repeat 2px center;
2055     padding: 4px 4px 0 20px;
2056     }
2057.modules a.module-config {
2058     /* todo: add icon here */
2059     padding: 4px 4px 0 20px;
2060     }
2061#m_search {
2062     background: transparent url(search.png) no-repeat 4px center;
2063     padding-left: 20px;
2064     }
2065.modules tr.expand, .modules td.expand {
2066     background: #f7f7f7;
2067     border-color: #bee74b;
2068     }
2069.modules tr.expand td:first-child {
2070     font-weight: bold;
2071     background: #DFE5E7;
2072     }
2073.modules td.expand {
2074     padding: 0 0 1em;
2075     border-top: 1px solid #eaeaea;
2076     }
2077.modules td.expand div {
2078     display: inline-block;
2079     vertical-align: top;
2080     margin-right: 3em;
2081     }
2082.mod-more, .mod-more li {
2083     margin: .25em 0 0 1em;
2084     padding: 0;
2085     list-style-type: none;
2086     }
2087.mod-more {
2088     padding-top: .5em;
2089     }
2090/* ---------------------------------------------------------- post.php, page.php */
2091#entry-wrapper {
2092     float: left;
2093     width: 100%;
2094     margin-right: -16em;
2095     }
2096#entry-content {
2097     margin-right: 18em;
2098     margin-left: 0;
2099     }
2100#entry-sidebar {
2101     width: 16em;
2102     float: right;
2103     }
2104#entry-content label {
2105     text-transform: uppercase;
2106     font-weight: bold;
2107     margin-top: 2em;
2108     display: inline-block;
2109     }
2110#entry-content label:first-child {
2111     margin-top: 0;
2112     }
2113#entry-sidebar h4 {
2114     font-size: 1.08em;
2115     margin-top: .3em;
2116     }
2117#entry-sidebar select {
2118     width: 100%;
2119     }
2120#entry-sidebar input#post_position {
2121     width: 4em;
2122     }
2123.sb-box {
2124     border-bottom: 1px solid #dfdfdf;
2125     margin-bottom: 1em;
2126     }
2127#tb_excerpt {
2128     width: 100%;
2129     }
2130/* ---------------------------------------------------------- preferences.php */
2131.fav-list {
2132     list-style-type: none;
2133     margin-left: 0;
2134     padding-left: 0;
2135     }
2136#my-favs .fav-list {
2137     border-top: 1px solid #eee;
2138     }
2139.fav-list li {
2140     margin-left: 0;
2141     padding-left: 0;
2142     padding-top: 3px;
2143     padding-bottom: 3px;
2144     position: relative;
2145     }
2146#my-favs .fav-list li {
2147     line-height: 2;
2148     border-bottom: 1px solid #eee;
2149     padding-top: 3px;
2150     padding-bottom: 3px;
2151     position: relative;
2152     }
2153.fav-list img {
2154     vertical-align: middle;
2155     margin-right: .2em;
2156     }
2157.fav-list li span.zoom {
2158     display: none;
2159     }
2160.fav-list li:hover span.zoom {
2161     display: block;
2162     position: absolute;
2163     bottom: 0;
2164     left: 10em;
2165     background-color: #f7f7f7;
2166     border: 1px solid #dfdfdf;
2167     padding: .2em;
2168     border-radius: .5em;
2169     }
2170#my-favs {
2171     border-color: #9bca1c;
2172     }
2173#my-favs input.position {
2174     margin: 0 0 .4em .2em;
2175     }
2176#available-favs input, #available-favs label, #available-favs label span {
2177     white-space: normal;
2178     display: inline;
2179     }
2180#available-favs label span.zoom {
2181     display: none;
2182     }
2183#available-favs li:hover label span.zoom {
2184     display: block;
2185     position: absolute;
2186     bottom: 0;
2187     left: 10em;
2188     background-color: #f7f7f7;
2189     border: 1px solid #dfdfdf;
2190     padding: .2em;
2191     border-radius: .5em;
2192     }
2193#user-options label.ib {
2194     display: inline-block;
2195     width: 14em;
2196     padding-right: 1em;
2197     }
2198/* --------------------------------------------------------------------- user.php */
2199.blog-perm {
2200     padding-top: 2em;
2201     }
2202.blog-perm {
2203     margin-top: 2em;
2204     font-weight: bold;
2205     }
2206.ul-perm {
2207     list-style-type: square;
2208     margin-left: 0;
2209     padding-left: 3.5em;
2210     margin-bottom: 0
2211     }
2212.add-perm {
2213     padding-top: .5em;
2214     padding-left: 2.5em;
2215     margin-left: 0;
2216     }
2217/* --------------------------------------------------------------------- _charte.php */
2218.guideline #content h2 {
2219     color: #D33800;
2220     padding: 2em 0 0 0;
2221     margin: 1em 0;
2222     font-size: 2em;
2223     }
2224.guideline #content h2:first-child {
2225     margin-top: 0;
2226     padding-top: .5em;
2227     }
2228.guideline h3 {
2229     margin-top: 2em;
2230     }
2231.guideline .dc-update h3 {
2232     margin-top: 0;
2233     }
2234.guideline .one-box .box {
2235     border: 1px solid #dfdfdf;
2236     padding: 2px .5em;
2237     }
2238.guideline #main-menu ul {
2239     margin: 0;
2240     padding: 0;
2241     font-weight: normal;
2242     }
2243.guideline #main-menu li {
2244     padding-left: 1em;
2245}
2246/* ------------------------------------------------------------------------------------
2247                                                                                                    CLASSES
2248------------------------------------------------------------------------------------ */
2249/* jQuery Autocomplete plugin */
2250.ac_results {
2251     padding: 0px;
2252     border: 1px dotted #f90;
2253     background-color: white;
2254     overflow: hidden;
2255     z-index: 99999;
2256     }
2257.ac_results ul {
2258     width: 100%;
2259     list-style-position: outside;
2260     list-style: none;
2261     padding: 0;
2262     margin: 0;
2263     }
2264.ac_results li {
2265     margin: 0px;
2266     padding: 2px 5px;
2267     cursor: default;
2268     display: block;
2269     font-size: 1em;
2270     line-height: 16px;
2271     overflow: hidden;
2272     }
2273.ac_loading {
2274     background: transparent url('loader.gif') right center no-repeat;
2275     }
2276.ac_over {
2277     background-color: #2373A8;
2278     color: white;
2279     }
2280/* password indicator */
2281.pw-table {
2282     display: table;
2283     margin-bottom: 1em;
2284     }
2285.pw-cell {
2286     display: table-cell;
2287     margin-bottom: 1em;
2288     }
2289#pwindicator {
2290     display: table-cell;
2291     vertical-align: bottom;
2292     padding-left: 1.5em;
2293     height: 3.8em;
2294     }
2295#pwindicator .bar {
2296     height: 6px;
2297     margin-bottom: 4px;
2298     }
2299.pw-very-weak .bar {
2300     background: #b33630;
2301     width: 30px;
2302     }
2303.pw-weak .bar {
2304     background: #b33630;
2305     width: 60px;
2306     }
2307.pw-mediocre .bar {
2308     background: #f90;
2309     width: 90px;
2310     }
2311.pw-strong .bar {
2312     background: #9bca1c;
2313     width: 120px;
2314     }
2315.pw-very-strong .bar {
2316     background: #9bca1c;
2317     width: 150px;
2318     }
2319/* ------------------------------------------------------------------ navigation */
2320/* selects accès rapide */
2321.anchor-nav {
2322     background: #ecf0f1;
2323     color: #000;
2324     padding: 4px 1em;
2325     }
2326.anchor-nav label {
2327     vertical-align: bottom;
2328     }
2329/* nav links */
2330.nav_prevnext {
2331     margin-bottom: 2em;
2332     color: #fff;
2333     }
2334.nav_prevnext a, a.back {
2335     border: 1px solid #dfdfdf;
2336     padding: 2px 1.5em;
2337     border-radius: .75em;
2338     background-color: #f3f3f3;
2339     }
2340a.back:before {
2341     content: "\ab\a0";
2342     }
2343a.onblog_link {
2344     color: #333;
2345     float: right;
2346     border: 1px solid #eee;
2347     padding: 2px 1.5em;
2348     border-radius: .75em;
2349     background-color: #ECF0F1;
2350     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
2351     }
2352/* Pagination */
2353.pager {
2354     margin: 2em 0 1em 0;
2355     clear: left;
2356     }
2357.pager ul {
2358     list-style-type: none;
2359     margin: 0;
2360     padding: 0;
2361     }
2362.pager li, .pager input {
2363     display: inline-block;
2364     vertical-align: middle;
2365     margin: 0 .33em 0 0;
2366     padding: 0;
2367     text-align: center;
2368     }
2369.pager .btn {
2370     border: 1px solid #dfdfdf;
2371     background-color: #fcfcfc;
2372     color: #676e78;
2373     border-radius: 3px;
2374     overflow: hidden;
2375     }
2376.btn.no-link {
2377     border-color: #dfdfdf;
2378     background-color: #f9f9f9;
2379     padding: 1px 3px 0;
2380     }
2381.pager .active {
2382     padding: 4px 12px;
2383     color: #676e78;
2384     }
2385.pager .direct-access {
2386     margin-left: 2em;
2387     }
2388.direct-access input[type=text] {
2389     border: 1px solid #dfdfdf;
2390     padding: 3px 8px;
2391     margin-left: .25em;
2392     background-color: #fff;
2393     }
2394.direct-access input[type=submit] {
2395     padding: 3px 6px;
2396     }
2397.pager a {
2398     display: block;
2399     padding: 1px 3px 0;
2400     border: none;
2401     }
2402.pager a:hover, .pager a:focus {
2403     background-color: #ecf0f1;
2404     }
2405.index .btn.no-link, .index a {
2406     padding: 2px 8px 3px;
2407     font-variant: small-caps;
2408     }
2409.index li {margin-bottom: 3px;}
2410.index a {
2411     font-weight: bold;
2412     }
2413.index .btn.no-link {
2414     color: #ccc;
2415     }
2416.index .active {
2417     padding: 4px 8px;
2418     color: #fff;
2419     background: #676e78;
2420     border-radius: 3px;
2421     font-variant: small-caps;
2422     }
2423/* Etapes */
2424.step {
2425     display: inline-block;
2426     float: left;
2427     margin: 3px 10px 2px 0;
2428     padding: 5px .5em;
2429     background: #ecf0f1;
2430     border-radius: 3px;
2431     font-weight: bold;
2432     border: 1px solid #c5c5c5;
2433     color: #676e78;
2434     }
2435/* ---------------------------------------------------------------- utilisables partout  */
2436.legible {
2437     font-size: 1.16em;
2438     max-width: 62em;
2439     }
2440.fieldset {
2441     background: #fff;
2442     border: 1px solid #c5c5c5;
2443     border-radius: 3px;
2444     padding: 1em .7em .5em;
2445     margin-bottom: 1em;
2446     }
2447.fieldset h3 {
2448     margin-top: 0;
2449     }
2450.right, .txt-right {
2451     text-align: right;
2452     }
2453.txt-center {
2454     text-align: center;
2455     }
2456.txt-left {
2457     text-align: left;
2458     }
2459.no-margin, label.no-margin {
2460     margin-top: 0;
2461     margin-bottom: 0;
2462     }
2463.vertical-separator {
2464     margin-top: 2em;
2465     }
2466p.clear.vertical-separator {
2467     padding-top: 2em;
2468     }
2469.border-top {
2470     border-top: 1px solid #999;
2471     padding-top: 1em;
2472     margin-top: 1em;
2473     }
2474.grid {
2475     background: transparent repeat url('grid.png') 0 0;
2476     }
2477ul.nice {
2478     margin: 1em 0;
2479     padding: 0 0 0 2em;
2480     list-style: square;
2481     }
2482ul.nice li {
2483     margin: 0;
2484     padding: 0;
2485     }
2486ul.from-left {
2487     list-style-type: none;
2488     padding-left: 0;
2489     margin: 1em 0;
2490     }
2491ul.from-left > li {
2492     margin-top: 1em;
2493     margin-bottom: 1em;
2494     }
2495ul.from-left ul {
2496     list-style-type: square;
2497     }
2498.offline {
2499     color: #676e78;
2500     }
2501/* caché pour tout le monde */
2502.hide, .button.hide {
2503     display: none !important;
2504     }
2505/* Caché sauf pour les revues d'écran */
2506.hidden, .with-js .out-of-screen-if-js {
2507     position: absolute !important;
2508     clip: rect(1px 1px 1px 1px);
2509     /* IE6, IE7 */
2510     clip: rect(1px, 1px, 1px, 1px);
2511     padding: 0 !important;
2512     border: 0 !important;
2513     height: 1px !important;
2514     width: 1px !important;
2515     overflow: hidden;
2516     }
2517/* caché si js est inactif */
2518.no-js .hidden-if-no-js {
2519     display: none;
2520     }
2521/* caché si js est actif */
2522.with-js .hidden-if-js {
2523     display: none;
2524     }
2525/* ------------------------------------------------------------------------------------
2526                                                                                                    UTILS
2527------------------------------------------------------------------------------------ */
2528/* debug */
2529#debug {
2530     position: absolute;
2531     top: 0;
2532     width: 100%;
2533     height: 4px;
2534     background: #ffd478;
2535     }
2536#debug div {
2537     display: none;
2538     padding: 3px 0.5em 2px;
2539     }
2540#debug p {
2541     margin: 0.5em 0;
2542     }
2543#debug:hover {
2544     height: auto;
2545     padding: 2px 1em;
2546     z-index: 100;
2547     }
2548#debug:hover div {
2549     display: block;
2550     }
2551.debug {
2552     background: #ffd478;
2553     padding: 3px 0.5em 2px;
2554     }
2555input[type=submit].delete.debug, a.delete.debug {
2556     border-color: #ffd478;
2557     }
2558input[type=submit].delete.debug:hover, a.delete.debug:hover {
2559     background: #ffd478;
2560     color: #900;
2561     border-color: #ffd478;
2562     }
2563/* ---------------------------------------------- Couleurs ajoutées via javascript   
2564/* color-picker.js */
2565.color-color-picker { 
2566     border: 1px solid #000;
2567     width: 195px; 
2568     background: #fff; 
2569     }
2570/* _media_item.js */
2571.color-div { 
2572     border: 1px solid #ccc;
2573     }
2574/* fadings ('color' est utilisé comme variable, pas comme text color) */
2575.colorBeginPassword, 
2576.colorBeginValidatorErr, 
2577.colorBeginUserMail           { color: #fff; }
2578.colorEndPassword, 
2579.colorEndError, 
2580.colorEndValidatorErr, 
2581.colorEndUserMail             { color: #ffbaba; }
2582.colorBeginMessage            { color: #ccc; }
2583.colorEndMessage, 
2584.colorBeginValidatorMsg  { color: #676e78; }
2585.colorBeginError              { color: #fefacd; }
2586.colorBeginSuccess            { color: #9BCA1C; }
2587.colorEndSuccess              { color: #bee74b; }
2588.colorEndValidatorMsg         { color: #ffcc00; }
2589/* ------------------------------------------------------------------------------------
2590                                                                           UN POIL DE MEDIA QUERIES
2591------------------------------------------------------------------------------------ */
2592@media screen and (max-width: 1000px) {
2593#top-info-blog #switchblog {
2594     max-width: 16em;
2595     }
2596#top-info-blog a {
2597     margin-left: 2em;
2598     }
2599}
2600@media screen and (max-width: 960px) {
2601#header {
2602     display: block;
2603     width: 100%;
2604     text-align: right;
2605     background: #333;
2606     }
2607#header h1, #header h1 a {
2608     width: 120px;
2609     padding: 0;
2610     margin: 0;
2611     }
2612h1, #top-info-blog {
2613     display: inline-block;
2614     vertical-align: top;
2615     margin-right: 1em;
2616     }
2617#top-info-user {
2618     display: block;
2619     width: 100%;
2620     background: #676e78;
2621     padding-right: 0;
2622     }
2623#top-info-user li:last-child {
2624     padding-right: 1em;
2625     }
2626#top-info-user a.active {
2627     padding: 2px 8px;
2628     background: #999;
2629     color: #FFF;
2630     border-width: 0;
2631     border-radius: 6px;
2632     }
2633.three-boxes, .three-boxes .box,
2634     .two-cols .col70, .two-cols .col30 {
2635     width: 100%;
2636     margin-left: 0;
2637     margin-right: 0;
2638     }
2639}
2640@media screen and (max-width: 700px) {
2641#help-button {
2642     height: 26px;
2643     width: 26px;
2644     background-color: #A2CBE9;
2645     padding: 0;
2646     margin: 0;
2647     font-size: .83em;
2648     line-height: 68px;
2649     overflow: hidden;
2650     }
2651#content.with-help #help-button {
2652     top: 77px;
2653     }
2654.one-box, .two-boxes, .two-boxes.odd, .two-boxes.even, .box,
2655     .two-cols .col {
2656     width: 100%;
2657     margin-left: 0;
2658     margin-right: 0;
2659     }
2660#entry-wrapper {
2661     float: none;
2662     width: 100%;
2663     margin-right: 0;
2664     }
2665#entry-content {
2666     margin-right: 0;
2667     margin-left: 0;
2668     }
2669#entry-sidebar {
2670     width: 100%;
2671     float: none;
2672     }
2673}
2674@media screen and (max-width: 600px) {
2675#header h1, #header h1 a {
2676     width: 42px !important;
2677     height: 42px;
2678     }
2679h1 a:link {
2680     background: transparent url(dc_logos/b-dotclear120.png) no-repeat -180px 6px;
2681     border-right: 1px solid #ccc;
2682     }
2683h1 a:hover, h1 a:focus {
2684     background: url(dc_logos/b-dotclear120.png) no-repeat -180px -94px;
2685     border-right: 1px solid #A2CBE9;
2686     }
2687#wrapper, #main, #main-menu {
2688     display: block;
2689     float: none;
2690     width: 100%;
2691     margin: 0;
2692     }
2693#main-menu a {
2694     display: block;
2695     width: 100%;
2696     }
2697#main-menu h3 a {
2698     display: inline;
2699     }
2700#content, .hide-mm #content {
2701     margin: 0;
2702     padding: 0 .5em !important;
2703     }
2704#collapser {
2705     display: none;
2706     }
2707#main #content > h2 {
2708     margin: 0;
2709     padding: 6px 30px 6px 0;
2710     }
2711#dashboard-boxes .box.medium,
2712     #dashboard-boxes .box.small,
2713     #dashboard-boxes .box.large {
2714     width: 100%;
2715     margin: 10px auto;
2716     }
2717}
2718@media screen and (max-width: 420px) {
2719h1, h1 a {
2720     padding: 0;
2721     border-right: #333 !important;
2722     }
2723#top-info-blog label, .nomobile {
2724     display: none;
2725     }
2726#top-info-blog {
2727     margin-bottom: .5em;
2728     max-width: 75%;
2729     }
2730#top-info-blog select {
2731     margin-bottom: .5em;
2732     }
2733#icons p {
2734     width: 150px;
2735     }
2736#content.with-help #help-button {
2737     top: 101px;
2738     }
2739}
Note: See TracBrowser for help on using the repository browser.

Sites map