Dotclear

source: admin/style/default.css @ 2462:038a4061e499

Revision 2462:038a4061e499, 55.6 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

MQ. Pour tablette.

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

Sites map