Dotclear

source: admin/style/default.css @ 2300:268401c6d78d

Revision 2300:268401c6d78d, 54.6 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

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

Sites map