Dotclear

source: admin/style/default.css @ 3153:942a906c0986

Revision 3153:942a906c0986, 56.9 KB checked in by franck <carnet.franck.paul@…>, 10 years ago (diff)

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

Sites map