Dotclear

source: admin/style/default.css @ 2390:3b3d86f3529a

Revision 2390:3b3d86f3529a, 54.1 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

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

Sites map