Dotclear

source: admin/style/default.css @ 2132:014b3b5a019f

Revision 2132:014b3b5a019f, 49.8 KB checked in by Lepeltier kévin <kevin@…>, 12 years ago (diff)

Fusion avec default

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

Sites map