Dotclear

source: admin/style/default.css @ 2342:5d4e11f52439

Revision 2342:5d4e11f52439, 53.0 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

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

Sites map