Dotclear

source: themes/berlin/style.css @ 2695:0af47a71595a

Revision 2695:0af47a71595a, 27.3 KB checked in by Lomalarch <lomalarch@…>, 11 years ago (diff)

Some clear:both to avoid strange post bottoms
Line 
1@charset "UTF-8";
2/** --------------------------------------------------
3    Start
4--------------------------------------------------- */
5/* largeur des paddings et border compris dans "width" */
6*,
7*:after,
8*:before {
9  -webkit-box-sizing: border-box;
10  -moz-box-sizing: border-box;
11  -ms-box-sizing: border-box;
12  box-sizing: border-box; }
13
14html {
15  font-size: 100.01%;
16  -ms-text-size-adjust: 100%;
17  -webkit-text-size-adjust: 100%;
18  margin: 0;
19  padding: 0; }
20
21body {
22  margin: 0;
23  padding: 0; }
24
25a {
26  background: transparent; }
27
28a:focus {
29  outline: thin dotted; }
30
31a:active, a:hover {
32  outline: none; }
33
34a img {
35  border: none; }
36
37q, cite {
38  font-style: italic; }
39
40q:before, q:after {
41  content: ""; }
42
43sup, sub {
44  font-size: .75em;
45  line-height: 0;
46  position: relative;
47  vertical-align: baseline; }
48
49sup {
50  top: -0.5em; }
51
52sub {
53  bottom: -0.25em; }
54
55abbr[title] {
56  border-bottom: 1px dotted;
57  cursor: help; }
58
59b, strong {
60  font-weight: bold;
61  font-size: 0.9375em; }
62
63small {
64  font-size: 80%; }
65
66dfn {
67  font-style: italic; }
68
69hr {
70  -moz-box-sizing: content-box;
71  box-sizing: content-box;
72  height: 0; }
73
74mark {
75  background: #ff0;
76  color: #000; }
77
78code, kbd, pre, samp {
79  font-family: monospace, serif;
80  font-size: 1em; }
81
82pre {
83  white-space: pre-wrap; }
84
85fieldset {
86  margin: 0;
87  padding: 0;
88  border: none; }
89
90input, button, select {
91  vertical-align: middle; }
92
93button, input, select, textarea {
94  font-family: inherit;
95  font-size: 100%;
96  margin: 0; }
97
98button, input {
99  line-height: normal; }
100
101button,
102html input[type="button"],
103input[type="reset"],
104input[type="submit"] {
105  -webkit-appearance: button;
106  cursor: pointer; }
107
108button[disabled],
109html input[disabled] {
110  cursor: default; }
111
112input[type="checkbox"],
113input[type="radio"] {
114  padding: 0;
115  border: none; }
116
117input[type="search"] {
118  -webkit-appearance: textfield; }
119
120input[type="search"]::-webkit-search-cancel-button,
121input[type="search"]::-webkit-search-decoration {
122  -webkit-appearance: none; }
123
124button::-moz-focus-inner,
125input::-moz-focus-inner {
126  border: 0;
127  padding: 0; }
128
129textarea {
130  overflow: auto;
131  vertical-align: top; }
132
133table {
134  border-collapse: collapse;
135  margin-bottom: 1.5em; }
136
137td, th {
138  padding: 1px;
139  vertical-align: top;
140  text-align: left; }
141
142td:first-child, th:first-child {
143  empty-cells: hide; }
144
145/* scripts */
146body > script {
147  display: none !important; }
148
149/* HTML5 for old browsers */
150article, aside, details, figcaption, figure, footer,
151header, hgroup, main, nav, section, summary {
152  display: block; }
153
154audio, canvas, video {
155  display: inline-block; }
156
157audio:not([controls]) {
158  display: none;
159  height: 0; }
160
161figure {
162  margin: 0; }
163
164[hidden], template {
165  display: none; }
166
167svg:not(:root) {
168  overflow: hidden; }
169
170/* Headings reset */
171h1, h2, h3, h4, h5, h6 {
172  font-size: 1em;
173  font-weight: normal;
174  margin: 0; }
175
176/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
177.visually-hidden {
178  border: 0;
179  clip: rect(0 0 0 0);
180  height: 1px;
181  margin: -1px;
182  overflow: hidden;
183  padding: 0;
184  position: absolute;
185  width: 1px; }
186
187/*
188* Scut, a collection of Sass utilities to ease and improve our implementations of common style-code patterns.
189* v0.8.0
190* Docs at http://davidtheclark.github.io/scut
191*/
192/** --------------------------------------------------
193    Common rules
194--------------------------------------------------- */
195/* Typographie */
196body {
197  font-size: 1em;
198  line-height: 1.5;
199  font-family: Lato, "Open Sans", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; }
200
201h1 {
202  font-size: 3em;
203  line-height: 1.2; }
204
205h2 {
206  font-size: 4em;
207  line-height: 1.2;
208  margin-bottom: 0.5em; }
209
210h3 {
211  font-size: 1.75em;
212  line-height: 1.33;
213  margin-top: 0.5714286em;
214  margin-bottom: 0.4285714em; }
215
216h4 {
217  font-size: 1.3125em;
218  margin-top: 1.1428571em;
219  margin-bottom: 0.7619048em; }
220
221h5 {
222  font-size: 1.125em;
223  margin-top: 1.5555556em; }
224
225h6 {
226  font-size: 1em;
227  margin-bottom: 0; }
228
229h2, h3, h4, h5, h6 {
230  color: #267daf; }
231
232a {
233  color: #d52125;
234  text-decoration: none;
235  transition: .3s; }
236  a:link, a:visited {
237    border-bottom: 1px solid gainsboro; }
238  a:visited {
239    border-bottom-style: dotted; }
240  a:hover, a:active {
241    border-color: #d52125; }
242  a:focus {
243    background-color: #d52125;
244    color: #f9f9f9; }
245
246hr {
247  border: 0;
248  height: 1px;
249  background: #333;
250  background-image: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #dcdcdc), color-stop(50%, #626262), color-stop(100%, #dcdcdc));
251  background-image: -webkit-linear-gradient(left, #dcdcdc, #626262, #dcdcdc);
252  background-image: -moz-linear-gradient(left, #dcdcdc, #626262, #dcdcdc);
253  background-image: -o-linear-gradient(left, #dcdcdc, #626262, #dcdcdc);
254  background-image: linear-gradient(left, #dcdcdc, #626262, #dcdcdc); }
255
256blockquote, q {
257  font-family: "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
258  color: #626262;
259  font-style: italic; }
260
261blockquote {
262  font-size: 1.125em;
263  line-height: 1.33;
264  quotes: '\201C' '\201D';
265  margin-top: 1.7777778em; }
266
267blockquote:before,
268blockquote:after {
269  margin-top: 0;
270  font-size: 3em;
271  display: block;
272  line-height: .25;
273  color: gainsboro;
274  margin-bottom: 0; }
275
276blockquote:before {
277  content: open-quote;
278  float: left;
279  margin-right: .25em; }
280
281blockquote:after {
282  content: close-quote;
283  text-align: right; }
284
285blockquote p:first-child {
286  margin-top: 0; }
287
288kbd {
289  padding: 0.1em 0.5em; }
290
291code, pre, kbd {
292  background-color: #555;
293  color: #EFD540;
294  font-family: "Andale Mono", AndaleMono, monospace;
295  font-size: 0.875em;
296  padding: .1em .2em; }
297
298pre {
299  padding: .5em 1em; }
300
301img {
302  max-width: 97%; }
303
304p, ul, ol {
305  margin-top: 1em;
306  margin-bottom: .5em; }
307
308ul ul, ul ol, ol ol, ol ul {
309  margin-top: .5em; }
310
311.post-date,
312.post-cat,
313.post-tags-list,
314.post-permalink,
315.comment_count,
316.ping_count,
317.attach_count,
318.feed {
319  padding-left: 22px;
320  background-repeat: no-repeat;
321  background-position: 0 50%;
322  padding-right: .5em; }
323
324.post-author {
325  padding-right: .5em; }
326
327.post-date {
328  background-image: url(img/icon_date.png); }
329
330.post-cat {
331  background-image: url(img/icon_category.png); }
332
333.post-tags-list {
334  background-image: url(img/icon_tags.png);
335  padding-left: 22px !important; }
336
337.comment_count {
338  background-image: url(img/icon_comments.png); }
339
340.ping_count {
341  background-image: url(img/icon_trackbacks.png); }
342
343.attach_count {
344  background-image: url(img/icon_attach.png); }
345
346.post-permalink {
347  background-image: url(img/icon_permalink.png); }
348
349.feed {
350  background-image: url(img/icon_feed.png);
351  background-image: url(img/icon_feed.svg), none;
352  -webkit-background-size: .875em;
353  -o-background-size: .875em;
354  background-size: .875em;
355  padding-left: 1.25em; }
356
357/** --------------------------------------------------
358    layout elements
359--------------------------------------------------- */
360body {
361  background: #f2f2f2 url(img/bg_light.png);
362  color: #373737; }
363
364#main {
365  background-color: white;
366  padding: 1em .5em 2em; }
367
368#page {
369  *position: relative;
370  *zoom: 1;
371  max-width: 60em;
372  margin: 0 auto;
373  padding: 0; }
374  #page:before, #page:after {
375    content: "";
376    display: table; }
377  #page:after {
378    clear: both; }
379
380#wrapper {
381  *position: relative;
382  *zoom: 1; }
383  #wrapper:before, #wrapper:after {
384    content: "";
385    display: table; }
386  #wrapper:after {
387    clear: both; }
388
389.header {
390  position: relative;
391  padding: .25em 0; }
392
393@media all and (max-width: 30em) {
394  #main {
395    padding: .5em; } }
396@media screen and (min-width: 80.1em) and (max-width: 110em) {
397  #page {
398    max-width: 80em; }
399
400  #main {
401    float: left;
402    width: 75%;
403    margin-left: 0%;
404    margin-right: -100%;
405    *margin-right: -99.9%;
406    padding-left: 1em;
407    padding-right: 1em;
408    -moz-box-sizing: border-box;
409    -webkit-box-sizing: border-box;
410    -ms-box-sizing: border-box;
411    box-sizing: border-box;
412    word-wrap: break-word;
413    *behavior: url("scripts");
414    _display: inline;
415    _overflow: hidden;
416    _overflow-y: visible; }
417
418  #sidebar {
419    float: left;
420    width: 25%;
421    margin-left: 75%;
422    margin-right: -100%;
423    *margin-right: -99.9%;
424    padding-left: 1em;
425    padding-right: 1em;
426    -moz-box-sizing: border-box;
427    -webkit-box-sizing: border-box;
428    -ms-box-sizing: border-box;
429    box-sizing: border-box;
430    word-wrap: break-word;
431    *behavior: url("scripts");
432    _display: inline;
433    _overflow: hidden;
434    _overflow-y: visible; } }
435@media screen and (min-width: 110.1em) {
436  body {
437    font-size: 1.125em; }
438
439  #page {
440    max-width: 103em; }
441
442  .header {
443    max-width: 66.6666667%;
444    padding-bottom: 0; }
445
446  #main {
447    float: left;
448    width: 66.6666667%;
449    margin-left: 0%;
450    margin-right: -100%;
451    *margin-right: -99.9%;
452    padding-left: 1em;
453    padding-right: 1em;
454    -moz-box-sizing: border-box;
455    -webkit-box-sizing: border-box;
456    -ms-box-sizing: border-box;
457    box-sizing: border-box;
458    word-wrap: break-word;
459    *behavior: url("scripts");
460    _display: inline;
461    _overflow: hidden;
462    _overflow-y: visible; }
463
464  #sidebar {
465    float: left;
466    width: 33.3333333%;
467    margin-left: 66.6666667%;
468    margin-right: -100%;
469    *margin-right: -99.9%;
470    padding-left: 1em;
471    padding-right: 1em;
472    -moz-box-sizing: border-box;
473    -webkit-box-sizing: border-box;
474    -ms-box-sizing: border-box;
475    box-sizing: border-box;
476    word-wrap: break-word;
477    *behavior: url("scripts");
478    _display: inline;
479    _overflow: hidden;
480    _overflow-y: visible; }
481
482  #blognav, #blogextra {
483    width: 49%;
484    display: inline-block;
485    vertical-align: top; } }
486.header a:link,
487.header a:visited {
488  color: #373737;
489  border-bottom-color: #f9f9f9; }
490
491.header a:hover,
492.header a:focus {
493  color: #d52125;
494  border-bottom-color: transparent; }
495
496.skip-links {
497  margin: 0;
498  padding: 0;
499  border: 0;
500  overflow: hidden;
501  *zoom: 1;
502  text-align: right; }
503  .skip-links li {
504    list-style-image: none;
505    list-style-type: none;
506    margin-left: 0;
507    display: -moz-inline-stack;
508    display: inline-block;
509    vertical-align: middle;
510    *vertical-align: auto;
511    zoom: 1;
512    *display: inline;
513    white-space: nowrap;
514    padding-left: 0.5em;
515    padding-right: 0.5em;
516    font-size: 0.75em;
517    line-height: 1;
518    padding-bottom: .5em; }
519    .skip-links li a:link, .skip-links li a:visited {
520      color: #626262; }
521    .skip-links li a:hover, .skip-links li a:focus {
522      background-color: #f2f2f2;
523      color: #d52125; }
524
525.banner {
526  padding-bottom: .5em;
527  margin-right: 3em; }
528
529a.site-title__link,
530a.site-title__link:link,
531a.site-title__link:visited {
532  background-color: transparent;
533  border-color: transparent; }
534
535.site-title__text {
536  color: #626262;
537  color: rgba(120, 120, 120, 0.8);
538  font-weight: bold;
539  font-weight: 500;
540  letter-spacing: -1px;
541  text-shadow: 1px 4px 6px white, 0 0 0 black, 1px 4px 6px white; }
542
543.site-title__link:hover .site-title__text,
544.site-title__link:focus .site-title__text,
545.site-title__link:active .site-title__text {
546  color: rgba(223, 48, 52, 0.8); }
547
548.site-baseline {
549  font-family: "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
550  font-style: italic;
551  margin-top: 0;
552  margin-bottom: 0.5em;
553  color: #626262; }
554
555.header__nav {
556  margin: 0;
557  padding: 0;
558  border: 0;
559  overflow: hidden;
560  *zoom: 1;
561  clear: left;
562  text-align: right;
563  background: #373737;
564  background: #d52125; }
565  .header__nav li {
566    list-style-image: none;
567    list-style-type: none;
568    margin-left: 0;
569    display: -moz-inline-stack;
570    display: inline-block;
571    vertical-align: middle;
572    *vertical-align: auto;
573    zoom: 1;
574    *display: inline;
575    white-space: nowrap;
576    padding-left: 1em;
577    padding-right: 1em;
578    margin-right: .5em;
579    padding-top: .25em;
580    padding-bottom: .25em;
581    text-align: center; }
582    .header__nav li span {
583      font-size: 0.875em;
584      line-height: 1.7142857em;
585      font-family: "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
586      font-style: italic;
587      display: block; }
588  .header__nav li a:link,
589  .header__nav li a:visited {
590    color: white; }
591  .header__nav li a:hover,
592  .header__nav li a:focus {
593    background-color: #626262; }
594
595/* Si js est actif, un bouton pour afficher/masquer le menu est créé */
596#hamburger {
597  position: absolute;
598  top: 3em;
599  right: .5em;
600  padding: 0;
601  background-color: #d52125;
602  background-repeat: no-repeat;
603  background-position: 50% 50%;
604  background-image: url("img/icon_hamburger.png");
605  background-image: url("img/icon_hamburger.svg"), none;
606  height: 2.5em;
607  width: 2.5em;
608  border: 2px solid #d52125; }
609  #hamburger:visited {
610    background-color: #d52125; }
611  #hamburger:focus, #hamburger:hover {
612    background-color: #aa1a1d;
613    border-color: #d52125; }
614  #hamburger.open {
615    background-image: url(img/icon_close.png);
616    background-image: url(img/icon_close.svg), none; }
617
618@media screen and (max-width: 60em) {
619  .header {
620    padding-left: .5em;
621    padding-right: .5em;
622    padding-bottom: 0; }
623
624  .header__nav {
625    margin-left: -.5em;
626    margin-right: -.5em; }
627    .header__nav li {
628      display: block;
629      margin-right: 0;
630      border-bottom: 1px solid white; } }
631@media screen and (max-width: 30em) {
632  .skip-links {
633    text-align: center;
634    font-size: 0.625em;
635    line-height: 2.4em; }
636
637  .site-baseline {
638    display: none; }
639
640  #hamburger {
641    top: 1.5em;
642    right: .5em; } }
643@media screen and (max-width: 40em) {
644  .site-title {
645    font-size: 1.8em; } }
646#sidebar {
647  *zoom: 1;
648  padding-top: 2em;
649  background: #373737 url(img/bg_dark.png);
650  color: white;
651  text-shadow: #373737 0px -1px 0px; }
652  #sidebar:after {
653    content: "";
654    display: table;
655    clear: both; }
656  #sidebar a:link, #sidebar a:visited {
657    color: #f9f9f9;
658    border: none; }
659  #sidebar a:hover, #sidebar a:focus, #sidebar a:active,
660  #sidebar li:hover, #sidebar li:focus {
661    background-color: #d52125; }
662
663#sidebar h2, #sidebar h3 {
664  font-size: 1em;
665  color: white;
666  font-weight: bold; }
667
668#sidebar h2 {
669  text-transform: uppercase; }
670
671#sidebar h3 {
672  margin-top: 1.5em;
673  margin-bottom: 0; }
674
675#blognav > div, #blogextra > div {
676  padding: 1em;
677  font-size: .875em;
678  line-height: 1.71429; }
679
680#blognav div > ul, #blogextra div > ul {
681  list-style: none;
682  padding-left: 0;
683  line-height: 2.28571; }
684  #blognav div > ul li, #blogextra div > ul li {
685    list-style-image: none;
686    list-style-type: none;
687    margin-left: 0; }
688
689#blognav ul, #blogextra ul {
690  margin: 0; }
691#blognav li, #blogextra li {
692  display: block;
693  padding-left: .25em;
694  border-bottom: 1px solid gainsboro; }
695#blognav li ul, #blogextra li ul {
696  margin-left: -.25em; }
697#blognav li li, #blogextra li li {
698  border-top: 1px solid gainsboro; }
699#blognav li li:last-child, #blogextra li li:last-child {
700  border-bottom: none; }
701
702#q {
703  width: 75%; }
704
705.category-current {
706  margin-left: -2em;
707  background-color: black; }
708
709.category-current ul {
710  background-color: #373737; }
711
712#sidebar li:hover ul {
713  background-color: #373737; }
714
715@media screen and (min-width: 30.1em) and (max-width: 60em) {
716  #blognav div, #blogextra div {
717    width: 50%;
718    float: left; } }
719@media screen and (min-width: 60.1em) and (max-width: 80em) {
720  #blognav > div, #blogextra > div {
721    width: 33.33%;
722    float: left; } }
723/* *** navigation *** */
724.navlinks {
725  color: white;
726  margin: 0; }
727
728.prev {
729  text-indent: -119988px;
730  overflow: hidden;
731  text-align: left;
732  background-image: url('img/icon_prev.png?1387046145');
733  background-repeat: no-repeat;
734  background-position: 50% 50%; }
735
736.next {
737  text-indent: -119988px;
738  overflow: hidden;
739  text-align: left;
740  background-image: url('img/icon_next.png?1387046234');
741  background-repeat: no-repeat;
742  background-position: 50% 50%; }
743
744.prev, .next {
745  vertical-align: middle;
746  width: 2.5em;
747  height: 2.5em;
748  display: inline-block;
749  border-radius: 50%;
750  border: 1px solid gainsboro;
751  background-color: #f2f2f2; }
752  .prev:hover, .prev:focus, .next:hover, .next:focus {
753    border-width: 3px; }
754
755/* *** content info *** */
756#content-info {
757  margin-bottom: 4em;
758  border-bottom: 1px solid gainsboro;
759  padding: 0;
760  font-size: 0.875em; }
761  #content-info h2 {
762    display: inline-block;
763    vertical-align: top;
764    padding: .5em .75em;
765    border-radius: .5em;
766    background-color: #267daf;
767    color: white;
768    font-size: 1.1428571em;
769    text-align: center; }
770    #content-info h2 a {
771      color: white; }
772  #content-info h3 {
773    font-size: 1em; }
774  #content-info ul {
775    margin-top: 0.5714286em;
776    padding-left: 0; }
777
778.content-info__feed {
779  display: inline-block;
780  vertical-align: top;
781  list-style-type: none; }
782  .content-info__feed li {
783    display: inline;
784    margin-right: 1.5em; }
785
786.content-info__sub-cat {
787  margin-top: 2em; }
788  .content-info__sub-cat h3 {
789    font-weight: bold; }
790
791#gotop {
792  display: none;
793  z-index: 1000;
794  position: fixed;
795  bottom: 0;
796  right: .5em;
797  width: 10em;
798  padding: .25em;
799  border: 1px solid #626262;
800  border-radius: .25em;
801  background-color: white;
802  color: #333;
803  font-size: .875em;
804  text-align: center; }
805  #gotop a, #gotop a:link, #gotop a:hover, #gotop a:active {
806    background: transparent;
807    border: none;
808    font-weight: bold;
809    color: #626262; }
810
811/**
812    POST
813------------------------------- */
814.post {
815  max-width: 42em;
816  margin: 2em auto 6em; }
817
818.post-day-date {
819  font-size: 0.875em;
820  text-align: center;
821  text-transform: uppercase;
822  letter-spacing: 1px;
823  margin-bottom: 0.8571429em; }
824
825.post-meta {
826  font-size: 0.875em;
827  background-color: #f2f2f2;
828  border-radius: 0.5714286em;
829  padding: 0.5714286em 1.1428571em;
830  margin-bottom: 1.7142857em;
831  clear: both; }
832
833.post-info {
834  margin: .5em 0; }
835
836.full .post-info,
837.short .post-info,
838.post-cat,
839.post-tags-list {
840  margin: .5em 0;
841  display: inline;
842  vertical-align: top; }
843
844.post-tags-list {
845  margin: 0;
846  padding: 0;
847  border: 0;
848  overflow: hidden;
849  *zoom: 1; }
850
851.post-tags-item {
852  list-style-image: none;
853  list-style-type: none;
854  margin-left: 0;
855  display: -moz-inline-stack;
856  display: inline-block;
857  vertical-align: middle;
858  *vertical-align: auto;
859  zoom: 1;
860  *display: inline;
861  white-space: nowrap;
862  vertical-align: top; }
863  .post-tags-item a:after {
864    content: "."; }
865
866.post-info-co {
867  margin: .5em 0; }
868
869.post-title {
870  text-align: center;
871  font-weight: 200; }
872  .post-title a, .post-title a:link, .post-title a:visited {
873    border-bottom-color: white; }
874  .post-title a:hover, .post-title a:focus, .post-title a:active {
875    color: #267daf;
876    background-color: transparent; }
877  @media screen and (max-width: 40em) {
878    .post-title {
879      font-size: 2em; } }
880
881.post-content {
882  margin-bottom: 1em; }
883
884.post-read-it {
885  margin-bottom: 1.5em; }
886
887.footnotes {
888  font-size: 0.875em;
889  margin-top: 2em;
890  margin-bottom: 3em; }
891  .footnotes h4 {
892    display: inline-block;
893    border-top: 1px solid #267daf;
894    padding-right: 3em;
895    margin-bottom: 0; }
896
897.post-attachments {
898  position: relative;
899  padding: 0 2.5em .25em;
900  border: 1px solid gainsboro;
901  box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 0 1px rgba(0, 0, 0, 0.2); }
902
903.post-attachments:before {
904  content: url(img/icon_attachments.png);
905  content: url(img/icon_attachments.svg);
906  display: block;
907  position: absolute;
908  margin-top: -.33em;
909  margin-left: -2em; }
910
911.post-attachments-title {
912  padding-top: .75em;
913  font-size: 1em;
914  text-transform: uppercase;
915  font-weight: bold;
916  color: #626262; }
917
918.post-attachments-list {
919  padding-left: 1em;
920  margin-top: .5em; }
921
922.post-feedback {
923  max-width: 42em;
924  margin: 3em auto;
925  clear: both; }
926
927.post-feedback h3 {
928  text-align: center;
929  font-size: 1.25em;
930  font-weight: bold;
931  color: #626262; }
932
933.comments-list {
934  list-style: none;
935  padding-left: 0; }
936  .comments-list li {
937    list-style-image: none;
938    list-style-type: none;
939    margin-left: 0; }
940
941.comment, .ping {
942  overflow: hidden;
943  padding: .1em 1.5em .1em 4em;
944  margin-bottom: 2em;
945  border-radius: .25em;
946  box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 0 1px rgba(0, 0, 0, 0.2); }
947
948.comment {
949  background-color: #EDF3F2; }
950
951.ping {
952  background: #f3efed url(img/icon_trackbacks.png) no-repeat 1.5em 4em; }
953
954.comment-number {
955  display: block;
956  float: left;
957  width: 2.5em;
958  height: 2.5em;
959  margin-left: -3.5em;
960  margin-right: 1em;
961  margin-top: -.5em;
962  border-radius: 50%;
963  background-color: white;
964  z-index: 1000;
965  line-height: 2.5em;
966  text-align: center; }
967
968.comment-form, .send-trackback {
969  overflow: hidden;
970  padding: .75em 3em .1em;
971  margin-bottom: 2em;
972  border-radius: .25em;
973  box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 0 1px rgba(0, 0, 0, 0.2);
974  background-color: #EDF3F2; }
975
976.send-trackback {
977  background: #f3efed url(img/icon_trackbacks.png) no-repeat 1.5em 4em; }
978
979.field label {
980  display: inline-block;
981  width: 10em; }
982
983.field input {
984  max-width: 100%; }
985
986.field textarea {
987  display: block;
988  width: 100%; }
989
990.form-help, .remember {
991  font-size: 0.875em; }
992
993#pr {
994  background-color: #f2f2f2;
995  padding: .5em;
996  border: 2px solid #6c7c7c;
997  margin-bottom: 2em; }
998
999.error {
1000  background-color: #d52125;
1001  color: white;
1002  padding: .25em .5em; }
1003
1004/* Button Style */
1005.buttons {
1006  text-align: right; }
1007
1008button.submit, button.preview {
1009  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #778f96), color-stop(100%, #5d757d));
1010  background-image: -webkit-linear-gradient(top, #778f96, #5d757d);
1011  background-image: -moz-linear-gradient(top, #778f96, #5d757d);
1012  background-image: -o-linear-gradient(top, #778f96, #5d757d);
1013  background-image: linear-gradient(top, #778f96, #5d757d);
1014  box-shadow: inset 0 1px 3px 0 #778f96;
1015  background-color: #778f96;
1016  border-radius: .25em;
1017  border: 1px solid #5d757d;
1018  display: inline-block;
1019  cursor: pointer;
1020  color: white;
1021  padding: .25em .5em;
1022  text-decoration: none;
1023  text-shadow: 0 -1px 0 #626262; }
1024
1025button.submit:hover,
1026button.submit:focus,
1027button.preview:hover,
1028button.preview:focus {
1029  cursor: pointer;
1030  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5d757d), color-stop(100%, #5d757d));
1031  background-image: -webkit-linear-gradient(#5d757d, #5d757d);
1032  background-image: -moz-linear-gradient(#5d757d, #5d757d);
1033  background-image: -o-linear-gradient(#5d757d, #5d757d);
1034  background-image: linear-gradient(#5d757d, #5d757d);
1035  background-color: #5d757d; }
1036
1037button.submit:active, button.preview:active {
1038  position: relative;
1039  top: 1px; }
1040
1041@media all and (max-width: 30em) {
1042  .comment-number {
1043    margin-top: 0; }
1044
1045  .comment-content, .ping-content {
1046    margin-left: -3.5em;
1047    margin-right: -1em; }
1048
1049  .comment-form, .send-trackback {
1050    padding: .75em .5em .1em; } }
1051@media all and (min-width: 30.1em) {
1052  .post-day-date:after,
1053  .post-day-date:before {
1054    display: inline-block;
1055    height: 1px;
1056    content: " ";
1057    background-color: gainsboro;
1058    text-shadow: none;
1059    width: 20%;
1060    margin-bottom: .33em; }
1061
1062  .post-day-date:after {
1063    margin-left: 2em; }
1064
1065  .post-day-date:before {
1066    margin-right: 2em; }
1067
1068  .post-feedback h3:after,
1069  .post-feedback h3:before {
1070    display: inline-block;
1071    height: 1px;
1072    content: " ";
1073    background-color: gainsboro;
1074    text-shadow: none;
1075    width: 20%;
1076    margin-bottom: .33em; }
1077
1078  .post-feedback h3:after {
1079    margin-left: 2em; }
1080
1081  .post-feedback h3:before {
1082    margin-right: 2em; } }
1083@media all and (max-width: 40em) {
1084  .post {
1085    margin: 1em auto 3em; } }
1086/* ---------------------------------------------------------------- archives */
1087/* general */
1088@media all and (min-width: 30em) {
1089  .dc-archive .content-inner {
1090    margin-left: 3em;
1091    margin-right: 3em; } }
1092
1093.arch-block {
1094  display: inline-block;
1095  margin: 0 0 2em 0;
1096  vertical-align: top; }
1097  .arch-block a {
1098    color: #373737; }
1099  @media all and (min-width: 30em) {
1100    .arch-block {
1101      margin-left: 4em; } }
1102
1103.arch-block:first-child {
1104  margin-left: 0; }
1105
1106.arch-block h3 {
1107  margin-bottom: 1em;
1108  font-size: 1.2em;
1109  font-style: italic;
1110  font-weight: normal;
1111  text-transform: lowercase;
1112  color: #267daf; }
1113
1114.arch-block h4 {
1115  font-weight: bold;
1116  font-size: 1.1em;
1117  margin-bottom: 0;
1118  margin-top: 0;
1119  color: #373737; }
1120
1121.arch-list, .arch-sub-list {
1122  list-style-type: none;
1123  margin: 0;
1124  padding: 0; }
1125
1126.arch-sub-list {
1127  margin-left: 20px; }
1128
1129/* par date */
1130.arch-by-year {
1131  margin-right: 0;
1132  margin-bottom: 1em;
1133  margin-top: 2em; }
1134
1135.arch-by-year h3 {
1136  margin-bottom: 0; }
1137
1138.arch-by-year h3:first-child {
1139  margin-top: 0; }
1140
1141.fromto {
1142  margin-top: 0;
1143  margin-bottom: 1.5em;
1144  font-size: .875em;
1145  font-style: italic; }
1146
1147.arch-by-year__each-year {
1148  display: inline-block;
1149  vertical-align: top;
1150  margin: 0;
1151  width: 10em; }
1152
1153.arch-year-list {
1154  margin-bottom: 1.5em; }
1155
1156.arch-year-list span {
1157  font-size: .875em; }
1158
1159/* par categorie */
1160.arch-cat-list, .arch-sub-cat-list {
1161  background: transparent url(img/vline.png) repeat-y; }
1162
1163.arch-sub-cat-list {
1164  margin: .5em 0 0 .5em; }
1165
1166.arch-cat-list li {
1167  padding: .2em .2em .2em 20px;
1168  background: transparent url(img/hline.png) no-repeat left 0.82em; }
1169
1170.arch-cat-list li:last-child {
1171  background-image: url(img/last-hline.png); }
1172
1173/* par tag */
1174.arch-by-tag {
1175  width: 17em; }
1176
1177.arch-tag-list li {
1178  display: inline;
1179  padding-right: 1em; }
1180
1181.arch-tag-list .tag0 {
1182  color: #909090;
1183  font-size: 90%; }
1184
1185.arch-tag-list .tag10 {
1186  color: #828282;
1187  font-size: 92%; }
1188
1189.arch-tag-list .tag20 {
1190  color: #737373;
1191  font-size: 94%; }
1192
1193.arch-tag-list .tag30 {
1194  color: #656565;
1195  font-size: 96%; }
1196
1197.arch-tag-list .tag40 {
1198  color: #484848;
1199  font-size: 98%; }
1200
1201.arch-tag-list .tag50 {
1202  color: #3A3A3A;
1203  font-size: 100%; }
1204
1205.arch-tag-list .tag60 {
1206  color: #2B2B2B;
1207  font-size: 102%; }
1208
1209.arch-tag-list .tag70 {
1210  color: #1D1D1D;
1211  font-size: 104%; }
1212
1213.arch-tag-list .tag80 {
1214  color: #0E0E0E;
1215  font-size: 106%; }
1216
1217.arch-tag-list .tag90 {
1218  color: #030303;
1219  font-size: 108%; }
1220
1221.arch-tag-list .tag100 {
1222  color: #000;
1223  font-size: 110%; }
1224
1225/* archives par mois */
1226.dc-archive-month #content-info h2 {
1227  margin-left: 2em;
1228  margin-top: .5em; }
1229
1230/** --------------------------------------------------
1231    Modules
1232--------------------------------------------------- */
1233/* *** MODULE sidebar off-canvas *** */
1234#offcanvas-on {
1235  display: none; }
1236
1237#sidebar, #main {
1238  -webkit-transition: 0.3s all linear;
1239  -moz-transition: 0.3s all linear;
1240  -o-transition: 0.3s all linear;
1241  transition: 0.3s all linear; }
1242
1243.js #content-info h2,
1244.js .content-info__feed {
1245  margin-right: 3.5em; }
1246
1247@media screen and (max-width: 80em) {
1248  #offcanvas-on,
1249  #offcanvas-off {
1250    position: absolute;
1251    top: .5em;
1252    right: .5em;
1253    height: 2.5em;
1254    width: 2.5em;
1255    background-repeat: no-repeat;
1256    background-position: 50% 50%;
1257    border: none;
1258    padding: 0; }
1259
1260  #offcanvas-on:hover,
1261  #offcanvas-on:focus,
1262  #offcanvas-off:hover,
1263  #offcanvas-off:focus {
1264    background-color: #373737; }
1265
1266  #offcanvas-on {
1267    display: block;
1268    background-color: white;
1269    background-image: url(img/icon_open-sidebar.png);
1270    background-image: url(img/icon_open-sidebar.svg), none;
1271    border: 0.1em solid #626262;
1272    border-radius: .25em; }
1273
1274  #offcanvas-off {
1275    background-color: #373737;
1276    background-image: url(img/icon_close.png);
1277    background-image: url(img/icon_close.svg), none;
1278    border: 1px solid white; }
1279
1280  #wrapper {
1281    position: relative; }
1282
1283  .off-canvas #main {
1284    float: left;
1285    margin-left: -66.6666667%; }
1286
1287  .off-canvas #sidebar {
1288    position: relative;
1289    float: right;
1290    width: 91.6666667%;
1291    margin-right: 0%;
1292    margin-left: -100%;
1293    *margin-left: -99.9%;
1294    padding-left: 1em;
1295    padding-right: 1em;
1296    -moz-box-sizing: border-box;
1297    -webkit-box-sizing: border-box;
1298    -ms-box-sizing: border-box;
1299    box-sizing: border-box;
1300    word-wrap: break-word;
1301    *behavior: url("scripts");
1302    _display: inline;
1303    _overflow: hidden;
1304    _overflow-y: visible; } }
1305/*** dev only ***/
Note: See TracBrowser for help on using the repository browser.

Sites map