← Back to branch summary

~yacinechaouche/+junk/BZR

« back to all changes in this revision

Viewing changes to CODE/TEST/HTML/SO/template/css/knacss.css

  • Committer: yacinechaouche at yahoo
  • Date: 2015-01-14 22:23:03 UTC
  • Revision ID: yacinechaouche@yahoo.com-20150114222303-6gbtqqxii717vyka
Ajout de CODE et PROD. Il faudra ensuite ajouter ce qu'il y avait dan TMP

Show diffs side-by-side

added added

removed removed

Lines of Context:
CODE/TEST/HTML/SO/template/css/knacss.css
 
1
/*!
 
2
* www.KNACSS.com V2.9.3 (2014-02) @author: Raphael Goetter, Alsacreations
 
3
* Licence WTFPL http://www.wtfpl.net/
 
4
*/
 
5
 
 
6
/* ----------------------------- */
 
7
 
 
8
/* == soft reset                 */
 
9
 
 
10
/* ----------------------------- */
 
11
 
 
12
/* switching box model for all elements */
 
13
 
 
14
* {
 
15
  -webkit-box-sizing: border-box;
 
16
  -moz-box-sizing: border-box;
 
17
  box-sizing: border-box;
 
18
}
 
19
 
 
20
/* soft reset */
 
21
 
 
22
html,
 
23
body {
 
24
  margin: 0;
 
25
  padding: 0;
 
26
}
 
27
 
 
28
ul,
 
29
ol {
 
30
  padding-left: 2em;
 
31
}
 
32
 
 
33
ul.unstyled {
 
34
  list-style: none;
 
35
}
 
36
 
 
37
img {
 
38
  vertical-align: middle;
 
39
  border: 0;
 
40
}
 
41
 
 
42
audio,
 
43
canvas,
 
44
video {
 
45
  display: inline-block;
 
46
}
 
47
 
 
48
svg:not(:root) {
 
49
  overflow: hidden;
 
50
}
 
51
 
 
52
figure {
 
53
  margin: 0;
 
54
}
 
55
 
 
56
/* ----------------------------- */
 
57
 
 
58
/* == typography                 */
 
59
 
 
60
/* ----------------------------- */
 
61
 
 
62
/* base font-size corresponds to 10px and is adapted to rem unit */
 
63
 
 
64
html {
 
65
  font-size: 62.5%;
 
66
  -webkit-text-size-adjust: 100%;
 
67
  -ms-text-size-adjust: 100%;
 
68
}
 
69
 
 
70
body {
 
71
  background-color: #ffffff;
 
72
  color: #000000;
 
73
  font-family: Helvetica, Arial, sans-serif;
 
74
  font-size: 1.4em;
 
75
  line-height: 1.5;
 
76
}
 
77
 
 
78
/* font-sizing for content */
 
79
 
 
80
/* preserve vertical-rythm, thanks to http://soqr.fr/vertical-rhythm/ */
 
81
 
 
82
p,
 
83
ul,
 
84
ol,
 
85
dl,
 
86
blockquote,
 
87
pre,
 
88
td,
 
89
th,
 
90
label,
 
91
textarea,
 
92
caption,
 
93
details,
 
94
figure,
 
95
hgroup {
 
96
  margin-top: .75em;
 
97
  margin-bottom: 0;
 
98
  line-height: 1.5;
 
99
}
 
100
 
 
101
h1,
 
102
.h1-like {
 
103
  margin-top: 0.65625em;
 
104
  margin-bottom: 0;
 
105
  font-size: 3.2rem;
 
106
  line-height: 1.3125;
 
107
}
 
108
 
 
109
h2,
 
110
.h2-like {
 
111
  margin-top: 0.75em;
 
112
  margin-bottom: 0;
 
113
  font-size: 2.8rem;
 
114
  line-height: 1.5;
 
115
}
 
116
 
 
117
h3,
 
118
.h3-like {
 
119
  margin-top: 0.875em;
 
120
  margin-bottom: 0;
 
121
  font-size: 2.4rem;
 
122
  line-height: 1.75;
 
123
}
 
124
 
 
125
h4,
 
126
.h4-like {
 
127
  margin-top: 1.05em;
 
128
  margin-bottom: 0;
 
129
  font-size: 2rem;
 
130
  line-height: 1.05;
 
131
}
 
132
 
 
133
h5,
 
134
.h5-like {
 
135
  margin-top: 1.1666666666666667em;
 
136
  margin-bottom: 0;
 
137
  font-size: 1.8rem;
 
138
  line-height: 1.1666666666666667;
 
139
}
 
140
 
 
141
h6,
 
142
.h6-like {
 
143
  margin-top: 1.3125em;
 
144
  margin-bottom: 0;
 
145
  font-size: 1.6rem;
 
146
  line-height: 1.3125;
 
147
}
 
148
 
 
149
/* alternate font-sizing */
 
150
 
 
151
.smaller {
 
152
  font-size: 0.7142857142857143em;
 
153
}
 
154
 
 
155
.small {
 
156
  font-size: 0.8571428571428571em;
 
157
}
 
158
 
 
159
.big {
 
160
  font-size: 1.1428571428571428em;
 
161
}
 
162
 
 
163
.bigger {
 
164
  font-size: 1.2857142857142858em;
 
165
}
 
166
 
 
167
.biggest {
 
168
  font-size: 1.4285714285714286em;
 
169
}
 
170
 
 
171
code,
 
172
pre,
 
173
samp,
 
174
kbd {
 
175
  white-space: pre-line;
 
176
  /* IE fix */
 
177
  white-space: pre-wrap;
 
178
  font-family: Consolas, 'DejaVu Sans Mono', Courier, monospace;
 
179
  line-height: 1;
 
180
}
 
181
 
 
182
code,
 
183
kbd,
 
184
mark {
 
185
  border-radius: 2px;
 
186
}
 
187
 
 
188
em {
 
189
  font-style: italic;
 
190
}
 
191
 
 
192
strong {
 
193
  font-weight: bold;
 
194
}
 
195
 
 
196
kbd {
 
197
  padding: 0 2px;
 
198
  border: 1px solid #999;
 
199
}
 
200
 
 
201
code {
 
202
  padding: 2px 4px;
 
203
  background: rgba(0, 0, 0, 0.04);
 
204
  color: #b11;
 
205
}
 
206
 
 
207
mark {
 
208
  padding: 2px 4px;
 
209
  background: #ff0;
 
210
}
 
211
 
 
212
sup,
 
213
sub {
 
214
  vertical-align: 0;
 
215
  position: relative;
 
216
}
 
217
 
 
218
sup {
 
219
  bottom: 1ex;
 
220
}
 
221
 
 
222
sub {
 
223
  top: .5ex;
 
224
}
 
225
 
 
226
/* ----------------------------- */
 
227
 
 
228
/* == hiding content             */
 
229
 
 
230
/* ----------------------------- */
 
231
 
 
232
/* hiding content */
 
233
 
 
234
.visually-hidden {
 
235
  position: absolute;
 
236
  left: -7000px;
 
237
  overflow: hidden;
 
238
}
 
239
 
 
240
[dir=rtl] .visually-hidden {
 
241
  left: auto;
 
242
  right: -7000px;
 
243
}
 
244
 
 
245
.desktop-hidden {
 
246
  display: none;
 
247
}
 
248
 
 
249
/* hidden on desktop */
 
250
 
 
251
/* ----------------------------- */
 
252
 
 
253
/* == skip links styling         */
 
254
 
 
255
/* ----------------------------- */
 
256
 
 
257
.skip-links {
 
258
  position: absolute;
 
259
}
 
260
 
 
261
.skip-links a {
 
262
  position: absolute;
 
263
  left: -7000px;
 
264
  padding: 0.5em;
 
265
  background: black;
 
266
  color: white;
 
267
  text-decoration: none;
 
268
}
 
269
 
 
270
.skip-links a:focus {
 
271
  position: static;
 
272
}
 
273
 
 
274
/* ----------------------------- */
 
275
 
 
276
/* == browsers consistency       */
 
277
 
 
278
/* ----------------------------- */
 
279
 
 
280
/* avoid top margins on first content element */
 
281
 
 
282
p:first-child,
 
283
ul:first-child,
 
284
ol:first-child,
 
285
dl:first-child,
 
286
blockquote:first-child,
 
287
pre:first-child,
 
288
h1:first-child,
 
289
h2:first-child,
 
290
h3:first-child,
 
291
h4:first-child,
 
292
h5:first-child,
 
293
h6:first-child {
 
294
  margin-top: 0;
 
295
}
 
296
 
 
297
/* avoid margins on nested elements */
 
298
 
 
299
li p,
 
300
li ul,
 
301
li ol {
 
302
  margin-top: 0;
 
303
  margin-bottom: 0;
 
304
}
 
305
 
 
306
/* max values */
 
307
 
 
308
img,
 
309
table,
 
310
td,
 
311
blockquote,
 
312
code,
 
313
pre,
 
314
textarea,
 
315
input,
 
316
video {
 
317
  max-width: 100%;
 
318
}
 
319
 
 
320
/* margin-bottom on tables */
 
321
 
 
322
table {
 
323
  margin-bottom: 1.5em;
 
324
}
 
325
 
 
326
/* Google Gmap3 bug fix on images */
 
327
 
 
328
:not(.gm-style) img {
 
329
  height: auto !important;
 
330
}
 
331
 
 
332
.ie678 .gm-style img {
 
333
  height: 100%;
 
334
  /* IE678 hack */
 
335
}
 
336
 
 
337
.gm-style img,
 
338
.gmnoscreen img,
 
339
.gmnoprint img {
 
340
  max-width: none !important;
 
341
}
 
342
 
 
343
/* scripts */
 
344
 
 
345
body > script {
 
346
  display: none !important;
 
347
}
 
348
 
 
349
/* ----------------------------- */
 
350
 
 
351
/* ==layout and modules          */
 
352
 
 
353
/* ----------------------------- */
 
354
 
 
355
/* float layout */
 
356
 
 
357
/* module, gains superpower "BFC" Block Formating Context */
 
358
 
 
359
.mod {
 
360
  overflow: hidden;
 
361
}
 
362
 
 
363
/* blocks that needs to be placed under floats */
 
364
 
 
365
.clear,
 
366
.line,
 
367
.row {
 
368
  clear: both;
 
369
}
 
370
 
 
371
/* blocks that must contain floats */
 
372
 
 
373
.clearfix:after,
 
374
.line:after,
 
375
.mod:after {
 
376
  content: "";
 
377
  display: table;
 
378
  clear: both;
 
379
}
 
380
 
 
381
/* table layout */
 
382
 
 
383
.row {
 
384
  display: table;
 
385
  table-layout: fixed;
 
386
  width: 100%;
 
387
}
 
388
 
 
389
.row > *,
 
390
.col {
 
391
  display: table-cell;
 
392
  vertical-align: top;
 
393
}
 
394
 
 
395
/* inline-block */
 
396
 
 
397
.inbl {
 
398
  display: inline-block;
 
399
  vertical-align: top;
 
400
}
 
401
 
 
402
/* alignments (blocks and inline) */
 
403
 
 
404
/* ------------------------------ */
 
405
 
 
406
/* left elements */
 
407
 
 
408
.left {
 
409
  float: left;
 
410
}
 
411
 
 
412
img.left {
 
413
  margin-right: 1em;
 
414
}
 
415
 
 
416
/* right elements */
 
417
 
 
418
.right {
 
419
  float: right;
 
420
}
 
421
 
 
422
img.right {
 
423
  margin-left: 1em;
 
424
}
 
425
 
 
426
img.left,
 
427
img.right {
 
428
  margin-bottom: 5px;
 
429
}
 
430
 
 
431
.center {
 
432
  margin-left: auto;
 
433
  margin-right: auto;
 
434
}
 
435
 
 
436
.txtleft {
 
437
  text-align: left;
 
438
}
 
439
 
 
440
.txtright {
 
441
  text-align: right;
 
442
}
 
443
 
 
444
.txtcenter {
 
445
  text-align: center;
 
446
}
 
447
 
 
448
/* ----------------------------- */
 
449
 
 
450
/* == width helpers              */
 
451
 
 
452
/* .. use only when needed       */
 
453
 
 
454
/* ----------------------------- */
 
455
 
 
456
/* blocks widths (percentage and pixels) */
 
457
 
 
458
.w10 {
 
459
  width: 10%;
 
460
}
 
461
 
 
462
.w20 {
 
463
  width: 20%;
 
464
}
 
465
 
 
466
.w25 {
 
467
  width: 25%;
 
468
}
 
469
 
 
470
.w30 {
 
471
  width: 30%;
 
472
}
 
473
 
 
474
.w33 {
 
475
  width: 33.3333%;
 
476
}
 
477
 
 
478
.w40 {
 
479
  width: 40%;
 
480
}
 
481
 
 
482
.w50 {
 
483
  width: 50%;
 
484
}
 
485
 
 
486
.w60 {
 
487
  width: 60%;
 
488
}
 
489
 
 
490
.w66 {
 
491
  width: 66.6666%;
 
492
}
 
493
 
 
494
.w70 {
 
495
  width: 70%;
 
496
}
 
497
 
 
498
.w75 {
 
499
  width: 75%;
 
500
}
 
501
 
 
502
.w80 {
 
503
  width: 80%;
 
504
}
 
505
 
 
506
.w90 {
 
507
  width: 90%;
 
508
}
 
509
 
 
510
.w100 {
 
511
  width: 100%;
 
512
}
 
513
 
 
514
.w50p {
 
515
  width: 50px;
 
516
}
 
517
 
 
518
.w100p {
 
519
  width: 100px;
 
520
}
 
521
 
 
522
.w150p {
 
523
  width: 150px;
 
524
}
 
525
 
 
526
.w200p {
 
527
  width: 200px;
 
528
}
 
529
 
 
530
.w300p {
 
531
  width: 300px;
 
532
}
 
533
 
 
534
.w400p {
 
535
  width: 400px;
 
536
}
 
537
 
 
538
.w500p {
 
539
  width: 500px;
 
540
}
 
541
 
 
542
.w600p {
 
543
  width: 600px;
 
544
}
 
545
 
 
546
.w700p {
 
547
  width: 700px;
 
548
}
 
549
 
 
550
.w800p {
 
551
  width: 800px;
 
552
}
 
553
 
 
554
.w960p {
 
555
  width: 960px;
 
556
}
 
557
 
 
558
.mw960p {
 
559
  max-width: 960px;
 
560
}
 
561
 
 
562
.w1140p {
 
563
  width: 1140px;
 
564
}
 
565
 
 
566
.mw1140p {
 
567
  max-width: 1140px;
 
568
}
 
569
 
 
570
.wauto {
 
571
  width: auto;
 
572
}
 
573
 
 
574
/* ----------------------------- */
 
575
 
 
576
/* == spacing helpers            */
 
577
 
 
578
/* .. use only when needed       */
 
579
 
 
580
/* ----------------------------- */
 
581
 
 
582
/* spacing helpers
 
583
p,m = padding,margin
 
584
a,t,r,b,l = all,top,right,bottom,left
 
585
s,m,l,n = small(10px),medium(20px),large(30px),none(0)
 
586
source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
 
587
*/
 
588
 
 
589
.m-reset,
 
590
.ma0 {
 
591
  margin: 0;
 
592
}
 
593
 
 
594
.p-reset,
 
595
.pa0 {
 
596
  padding: 0;
 
597
}
 
598
 
 
599
.ma1,
 
600
.mas {
 
601
  margin: 10px;
 
602
}
 
603
 
 
604
.ma2,
 
605
.mam {
 
606
  margin: 20px;
 
607
}
 
608
 
 
609
.ma3,
 
610
.mal {
 
611
  margin: 30px;
 
612
}
 
613
 
 
614
.pa1,
 
615
.pas {
 
616
  padding: 10px;
 
617
}
 
618
 
 
619
.pa2,
 
620
.pam {
 
621
  padding: 20px;
 
622
}
 
623
 
 
624
.pa3,
 
625
.pal {
 
626
  padding: 30px;
 
627
}
 
628
 
 
629
.mt0,
 
630
.mtn {
 
631
  margin-top: 0;
 
632
}
 
633
 
 
634
.mt1,
 
635
.mts {
 
636
  margin-top: 10px;
 
637
}
 
638
 
 
639
.mt2,
 
640
.mtm {
 
641
  margin-top: 20px;
 
642
}
 
643
 
 
644
.mt3,
 
645
.mtl {
 
646
  margin-top: 30px;
 
647
}
 
648
 
 
649
.mr0,
 
650
.mrn {
 
651
  margin-right: 0;
 
652
}
 
653
 
 
654
.mr1,
 
655
.mrs {
 
656
  margin-right: 10px;
 
657
}
 
658
 
 
659
.mr2,
 
660
.mrm {
 
661
  margin-right: 20px;
 
662
}
 
663
 
 
664
.mr3,
 
665
.mrl {
 
666
  margin-right: 30px;
 
667
}
 
668
 
 
669
.mb0,
 
670
.mbn {
 
671
  margin-bottom: 0;
 
672
}
 
673
 
 
674
.mb1,
 
675
.mbs {
 
676
  margin-bottom: 10px;
 
677
}
 
678
 
 
679
.mb2,
 
680
.mbm {
 
681
  margin-bottom: 20px;
 
682
}
 
683
 
 
684
.mb3,
 
685
.mbl {
 
686
  margin-bottom: 30px;
 
687
}
 
688
 
 
689
.ml0,
 
690
.mln {
 
691
  margin-left: 0;
 
692
}
 
693
 
 
694
.ml1,
 
695
.mls {
 
696
  margin-left: 10px;
 
697
}
 
698
 
 
699
.ml2,
 
700
.mlm {
 
701
  margin-left: 20px;
 
702
}
 
703
 
 
704
.ml3,
 
705
.mll {
 
706
  margin-left: 30px;
 
707
}
 
708
 
 
709
.pt0,
 
710
.ptn {
 
711
  padding-top: 0;
 
712
}
 
713
 
 
714
.pt1,
 
715
.pts {
 
716
  padding-top: 10px;
 
717
}
 
718
 
 
719
.pt2,
 
720
.ptm {
 
721
  padding-top: 20px;
 
722
}
 
723
 
 
724
.pt3,
 
725
.ptl {
 
726
  padding-top: 30px;
 
727
}
 
728
 
 
729
.pr0,
 
730
.prn {
 
731
  padding-right: 0;
 
732
}
 
733
 
 
734
.pr1,
 
735
.prs {
 
736
  padding-right: 10px;
 
737
}
 
738
 
 
739
.pr2,
 
740
.prm {
 
741
  padding-right: 20px;
 
742
}
 
743
 
 
744
.pr3,
 
745
.prl {
 
746
  padding-right: 30px;
 
747
}
 
748
 
 
749
.pb0,
 
750
.pbn {
 
751
  padding-bottom: 0;
 
752
}
 
753
 
 
754
.pb1,
 
755
.pbs {
 
756
  padding-bottom: 10px;
 
757
}
 
758
 
 
759
.pb2,
 
760
.pbm {
 
761
  padding-bottom: 20px;
 
762
}
 
763
 
 
764
.pb3,
 
765
.pbl {
 
766
  padding-bottom: 30px;
 
767
}
 
768
 
 
769
.pl0,
 
770
.pln {
 
771
  padding-left: 0;
 
772
}
 
773
 
 
774
.pl1,
 
775
.pls {
 
776
  padding-left: 10px;
 
777
}
 
778
 
 
779
.pl2,
 
780
.plm {
 
781
  padding-left: 20px;
 
782
}
 
783
 
 
784
.pl3,
 
785
.pll {
 
786
  padding-left: 30px;
 
787
}
 
788
 
 
789
/* ----------------------------- */
 
790
 
 
791
/* == iefix                      */
 
792
 
 
793
/* ----------------------------- */
 
794
 
 
795
/* Make sure you are using Conditional Classes in your HTML */
 
796
 
 
797
/* see : http://www.alsacreations.com/astuce/lire/988-classes-conditionnelles-HTML.html */
 
798
 
 
799
.ie678 h1,
 
800
.ie678 .h1-like {
 
801
  font-size: 2.2857142857142856em;
 
802
}
 
803
 
 
804
.ie678 h2,
 
805
.ie678 .h2-like {
 
806
  font-size: 2em;
 
807
}
 
808
 
 
809
.ie678 h3,
 
810
.ie678 .h3-like {
 
811
  font-size: 1.7142857142857142em;
 
812
}
 
813
 
 
814
.ie678 h4,
 
815
.ie678 .h4-like {
 
816
  font-size: 1.4285714285714286em;
 
817
}
 
818
 
 
819
.ie678 h5,
 
820
.ie678 .h5-like {
 
821
  font-size: 1.2857142857142858em;
 
822
}
 
823
 
 
824
.ie678 h6,
 
825
.ie678 .h6-like {
 
826
  font-size: 1.1428571428571428em;
 
827
}
 
828
 
 
829
/* hasLayout for IE6/IE7 */
 
830
 
 
831
.ie67 .clearfix,
 
832
.ie67 .line,
 
833
.ie67 .mod,
 
834
.ie67 .row,
 
835
.ie67 .col {
 
836
  zoom: 1;
 
837
}
 
838
 
 
839
/* inline-block and table-cell for IE6/IE7 */
 
840
 
 
841
/* warning: .col needs width on IE6/IE7 */
 
842
 
 
843
.ie67 .btn,
 
844
.ie67 .col,
 
845
.ie67 .inbl {
 
846
  display: inline;
 
847
  zoom: 1;
 
848
}
 
849
 
 
850
.ie8 img {
 
851
  width: auto;
 
852
  /* @bugfix for IE8 */
 
853
}
 
854
 
 
855
/* Active box-sizing for IE6/IE7 */
 
856
 
 
857
/* @source https://github.com/Schepp/box-sizing-polyfill */
 
858
 
 
859
/*
 
860
.ie67 * {
 
861
        behavior: url(/lib/box-sizing-polyfill/boxsizing.htc);
 
862
}
 
863
*/
 
864
 
 
865
/* ----------------------------- */
 
866
 
 
867
/* == quick print reset          */
 
868
 
 
869
/* ----------------------------- */
 
870
 
 
871
@media print {
 
872
  p,
 
873
  blockquote {
 
874
    orphans: 2;
 
875
    widows: 2;
 
876
  }
 
877
 
 
878
  blockquote,
 
879
  ul,
 
880
  ol {
 
881
    page-break-inside: avoid;
 
882
  }
 
883
 
 
884
  h1,
 
885
  h2,
 
886
  h3,
 
887
  caption {
 
888
    page-break-after: avoid;
 
889
  }
 
890
}
 
891
 
 
892
/* debug helper */
 
893
 
 
894
.knacss-debug {
 
895
  background: pink;
 
896
  outline: 3px solid maroon;
 
897
}
 
898
 
 
899
/* ---------------------------------- */
 
900
 
 
901
/* ==classic grids                    */
 
902
 
 
903
/* .. use it when gutter size matters */
 
904
 
 
905
/* ---------------------------------- */
 
906
 
 
907
/* grids inspired from SUIT https://github.com/suitcss/suit */
 
908
 
 
909
/* font-family hack explained here : https://github.com/raphaelgoetter/KNACSS/issues/37 */
 
910
 
 
911
.grid {
 
912
  overflow: hidden;
 
913
  font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;
 
914
}
 
915
 
 
916
.grid > * {
 
917
  display: block;
 
918
  padding: 0;
 
919
  margin-left: -20px;
 
920
  /* gutter value */
 
921
  text-align: left;
 
922
  letter-spacing: -0.31em;
 
923
  text-rendering: optimizespeed;
 
924
}
 
925
 
 
926
/* Opera hack */
 
927
 
 
928
.opera:-o-prefocus,
 
929
.grid > * {
 
930
  word-spacing: -0.43em;
 
931
}
 
932
 
 
933
.grid > * > * {
 
934
  display: inline-block;
 
935
  *display: inline;
 
936
  *zoom: 1;
 
937
  /* IE67 hack */
 
938
  width: 100%;
 
939
  padding-left: 20px;
 
940
  /* gutter value */
 
941
  margin-left: 0;
 
942
  vertical-align: top;
 
943
  text-align: left;
 
944
  letter-spacing: normal;
 
945
  word-spacing: normal;
 
946
  text-rendering: auto;
 
947
  font-family: Helvetica, Arial, sans-serif;
 
948
}
 
949
 
 
950
.grid2 > * {
 
951
  width: 50%;
 
952
}
 
953
 
 
954
.grid3 > * {
 
955
  width: 33.333%;
 
956
}
 
957
 
 
958
.grid4 > * {
 
959
  width: 25%;
 
960
}
 
961
 
 
962
.grid5 > * {
 
963
  width: 20%;
 
964
}
 
965
 
 
966
.grid6 > * {
 
967
  width: 16.667%;
 
968
}
 
969
 
 
970
.grid8 > * {
 
971
  width: 12.5%;
 
972
}
 
973
 
 
974
.grid10 > * {
 
975
  width: 10%;
 
976
}
 
977
 
 
978
.grid12 > * {
 
979
  width: 8.333%;
 
980
}
 
981
 
 
982
/* unequal grids (1-2, 2-1, 1-3 and 3-1) for 2 blocks */
 
983
 
 
984
.grid2-1 > *:first-child,
 
985
.grid1-2 > * + * {
 
986
  width: 66.666%;
 
987
}
 
988
 
 
989
.grid1-2 > *:first-child,
 
990
.grid2-1 > * + * {
 
991
  width: 33.333%;
 
992
}
 
993
 
 
994
.grid1-3 > *:first-child,
 
995
.grid3-1 > * + * {
 
996
  width: 25%;
 
997
}
 
998
 
 
999
.grid3-1 > *:first-child,
 
1000
.grid1-3 > * + * {
 
1001
  width: 75%;
 
1002
}
 
1003
 
 
1004
/* Responsiv-o-matic */
 
1005
 
 
1006
@media (max-width: 1280px) {
 
1007
  .grid5 > *,
 
1008
  .grid6 > *,
 
1009
  .grid8 > *,
 
1010
  .grid10 > *,
 
1011
  .grid12 > * {
 
1012
    width: 33.333%;
 
1013
  }
 
1014
}
 
1015
 
 
1016
@media (max-width: 768px) {
 
1017
  .grid3 > *,
 
1018
  .grid4 > *,
 
1019
  .grid5 > *,
 
1020
  .grid6 > *,
 
1021
  .grid8 > *,
 
1022
  .grid10 > *,
 
1023
  .grid12 > * {
 
1024
    width: 50%;
 
1025
  }
 
1026
}
 
1027
 
 
1028
@media (max-width: 480px) {
 
1029
  .grid > * > * {
 
1030
    width: 100% !important;
 
1031
  }
 
1032
}
 
1033
 
 
1034
/* ---------------------------------- */
 
1035
 
 
1036
/* ==autogrids                        */
 
1037
 
 
1038
/* .. to automatically justify blocs  */
 
1039
 
 
1040
/* ---------------------------------- */
 
1041
 
 
1042
/* Demo : http://codepen.io/raphaelgoetter/pen/Kqehf */
 
1043
 
 
1044
[class*="autogrid"] {
 
1045
  text-align: justify;
 
1046
  font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;
 
1047
  letter-spacing: -0.31em;
 
1048
  text-rendering: optimizespeed;
 
1049
}
 
1050
 
 
1051
/* Opera hack */
 
1052
 
 
1053
[class*="autogrid"]:-o-prefocus {
 
1054
  word-spacing: -0.43em;
 
1055
}
 
1056
 
 
1057
[class*="autogrid"]:after {
 
1058
  content: "";
 
1059
  display: inline-block;
 
1060
  width: 100%;
 
1061
}
 
1062
 
 
1063
[class*="autogrid"] > * {
 
1064
  display: inline-block;
 
1065
  *display: inline;
 
1066
  zoom: 1;
 
1067
  /* ie6 ie7 hack */
 
1068
  font-family: Helvetica, Arial, sans-serif;
 
1069
  letter-spacing: normal;
 
1070
  word-spacing: normal;
 
1071
  vertical-align: top;
 
1072
  text-rendering: auto;
 
1073
}
 
1074
 
 
1075
.autogrid2 > * {
 
1076
  width: 49%;
 
1077
}
 
1078
 
 
1079
.autogrid3 > * {
 
1080
  width: 32%;
 
1081
}
 
1082
 
 
1083
.autogrid4 > * {
 
1084
  width: 23.6%;
 
1085
}
 
1086
 
 
1087
.autogrid5 > * {
 
1088
  width: 19%;
 
1089
}
 
1090
 
 
1091
.autogrid6 > * {
 
1092
  width: 15%;
 
1093
}
 
1094
 
 
1095
.autogrid8 > * {
 
1096
  width: 10.8%;
 
1097
}
 
1098
 
 
1099
.autogrid10 > * {
 
1100
  width: 9%;
 
1101
}
 
1102
 
 
1103
.autogrid12 > * {
 
1104
  width: 6.4%;
 
1105
}
 
1106
 
 
1107
@media (max-width: 1280px) {
 
1108
  .autogrid5 > *,
 
1109
  .autogrid6 > *,
 
1110
  .autogrid8 > *,
 
1111
  .autogrid10 > *,
 
1112
  .autogrid12 > * {
 
1113
    width: 32%;
 
1114
  }
 
1115
}
 
1116
 
 
1117
@media (max-width: 768px) {
 
1118
  .autogrid5 > *,
 
1119
  .autogrid6 > *,
 
1120
  .autogrid8 > *,
 
1121
  .autogrid10 > *,
 
1122
  .autogrid12 > * {
 
1123
    width: 49%;
 
1124
  }
 
1125
}
 
1126
 
 
1127
@media (max-width: 480px) {
 
1128
  [class*="autogrid"] > * {
 
1129
    width: 100%;
 
1130
  }
 
1131
}
 
1132
 
 
1133
/* ----------------------------- */
 
1134
 
 
1135
/* ==tables                      */
 
1136
 
 
1137
/* ----------------------------- */
 
1138
 
 
1139
table,
 
1140
.table {
 
1141
  max-width: 100%;
 
1142
  table-layout: fixed;
 
1143
  border-collapse: collapse;
 
1144
  vertical-align: top;
 
1145
}
 
1146
 
 
1147
table {
 
1148
  width: 100%;
 
1149
}
 
1150
 
 
1151
.table {
 
1152
  display: table;
 
1153
}
 
1154
 
 
1155
table#recaptcha_table,
 
1156
table.table-auto {
 
1157
  table-layout: auto;
 
1158
}
 
1159
 
 
1160
caption {
 
1161
  padding: 10px;
 
1162
  color: #555;
 
1163
  font-style: italic;
 
1164
}
 
1165
 
 
1166
table {
 
1167
  border: 1px solid #ccc;
 
1168
}
 
1169
 
 
1170
tr > * + * {
 
1171
  border-left: 1px solid #ccc;
 
1172
}
 
1173
 
 
1174
th,
 
1175
td {
 
1176
  padding: .3em .8em;
 
1177
  text-align: left;
 
1178
  border-bottom: 1px solid #ccc;
 
1179
}
 
1180
 
 
1181
td {
 
1182
  color: #333;
 
1183
}
 
1184
 
 
1185
/* alternate tables */
 
1186
 
 
1187
.alternate {
 
1188
  border: 0;
 
1189
}
 
1190
 
 
1191
.alternate tbody {
 
1192
  border: 1px solid #ccc;
 
1193
}
 
1194
 
 
1195
.alternate thead tr > * + * {
 
1196
  border-left: 0;
 
1197
}
 
1198
 
 
1199
.alternate tbody tr > * + * {
 
1200
  border-left: 1px solid #ccc;
 
1201
}
 
1202
 
 
1203
/* alternate-vert tables */
 
1204
 
 
1205
.alternate-vert {
 
1206
  border: 0;
 
1207
  border-right: 1px solid #ccc;
 
1208
}
 
1209
 
 
1210
.alternate-vert tr > :first-child {
 
1211
  border-bottom: 0;
 
1212
}
 
1213
 
 
1214
.alternate-vert tr > * + * {
 
1215
  border-top: 1px solid #ccc;
 
1216
}
 
1217
 
 
1218
/* striped tables */
 
1219
 
 
1220
.striped tbody tr:nth-child(odd) {
 
1221
  background: #eee;
 
1222
  background: rgba(0, 0, 0, 0.05);
 
1223
}
 
1224
 
 
1225
/* striped-vert tables */
 
1226
 
 
1227
.striped-vert tr > :first-child {
 
1228
  background: #eee;
 
1229
  background: rgba(0, 0, 0, 0.05);
 
1230
}
 
1231
 
 
1232
/* ----------------------------- */
 
1233
 
 
1234
/* ==forms                       */
 
1235
 
 
1236
/* ----------------------------- */
 
1237
 
 
1238
/* thanks to HTML5boilerplate,
 
1239
* github.com/nathansmith/formalize 
 
1240
* and www.sitepen.com
 
1241
*/
 
1242
 
 
1243
/* buttons */
 
1244
 
 
1245
.btn {
 
1246
  display: inline-block;
 
1247
}
 
1248
 
 
1249
/* forms items */
 
1250
 
 
1251
form,
 
1252
fieldset {
 
1253
  border: none;
 
1254
}
 
1255
 
 
1256
input,
 
1257
button,
 
1258
select,
 
1259
label,
 
1260
.btn {
 
1261
  vertical-align: middle;
 
1262
  font-family: inherit;
 
1263
  font-size: inherit;
 
1264
}
 
1265
 
 
1266
label {
 
1267
  display: inline-block;
 
1268
  vertical-align: middle;
 
1269
  cursor: pointer;
 
1270
}
 
1271
 
 
1272
legend {
 
1273
  border: 0;
 
1274
  white-space: normal;
 
1275
}
 
1276
 
 
1277
textarea {
 
1278
  overflow: auto;
 
1279
  /* Removes default vertical scrollbar on empty textarea in IE6/7/8/9 */
 
1280
  min-height: 5em;
 
1281
  vertical-align: top;
 
1282
  font-family: inherit;
 
1283
  font-size: inherit;
 
1284
  resize: vertical;
 
1285
}
 
1286
 
 
1287
button,
 
1288
input[type="button"],
 
1289
input[type="reset"],
 
1290
input[type="submit"] {
 
1291
  cursor: pointer;
 
1292
  -webkit-appearance: button;
 
1293
  /* clickable input types in iOS */
 
1294
}
 
1295
 
 
1296
input[type="checkbox"],
 
1297
input[type="radio"] {
 
1298
  padding: 0;
 
1299
  /* Corrects excess space around these inputs in IE8/9 */
 
1300
}
 
1301
 
 
1302
input[type="search"] {
 
1303
  -webkit-appearance: textfield;
 
1304
}
 
1305
 
 
1306
/* if select styling bugs on WebKit */
 
1307
 
 
1308
/* 'x' appears on right of search input when text is entered. This removes it */
 
1309
 
 
1310
input[type="search"]::-webkit-search-decoration,
 
1311
input[type="search"]::-webkit-search-cancel-button,
 
1312
input[type="search"]::-webkit-search-results-button,
 
1313
input[type="search"]::-webkit-search-results-decoration {
 
1314
  display: none;
 
1315
}
 
1316
 
 
1317
::-webkit-input-placeholder {
 
1318
  color: #777;
 
1319
}
 
1320
 
 
1321
input:-moz-placeholder,
 
1322
textarea:-moz-placeholder {
 
1323
  color: #777;
 
1324
}
 
1325
 
 
1326
/* Removes inner padding and border in FF3+ */
 
1327
 
 
1328
button::-moz-focus-inner,
 
1329
input[type='button']::-moz-focus-inner,
 
1330
input[type='reset']::-moz-focus-inner,
 
1331
input[type='submit']::-moz-focus-inner {
 
1332
  border: 0;
 
1333
  padding: 0;
 
1334
}
 
1335
 
 
1336
/* ----------------------------- */
 
1337
 
 
1338
/* ==icons and bullets           */
 
1339
 
 
1340
/* ----------------------------- */
 
1341
 
 
1342
.icon {
 
1343
  display: inline-block;
 
1344
}
 
1345
 
 
1346
.icon:before,
 
1347
.icon.after:after {
 
1348
  content: "";
 
1349
  display: inline-block;
 
1350
  vertical-align: middle;
 
1351
  position: relative;
 
1352
  top: -0.1em;
 
1353
  margin: 0 0.3em 0 0;
 
1354
  font: 1.4em/1 sans-serif;
 
1355
  color: #000;
 
1356
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);
 
1357
  speak: none;
 
1358
}
 
1359
 
 
1360
@media (min-device-width: 768px) {
 
1361
  .icon:before,
 
1362
  .icon.after:after {
 
1363
    font: 1em/0.6 sans-serif;
 
1364
    -webkit-transform: rotateZ(0.05deg);
 
1365
  }
 
1366
}
 
1367
 
 
1368
.icon.after:after {
 
1369
  margin: 0 0 0 8px;
 
1370
}
 
1371
 
 
1372
.icon.after:before {
 
1373
  content: "" !important;
 
1374
}
 
1375
 
 
1376
.icon-rate:before,
 
1377
.icon-rate.after:after {
 
1378
  content: "\2605";
 
1379
}
 
1380
 
 
1381
.icon-unrate:before,
 
1382
.icon-unrate.after:after {
 
1383
  content: "\2606";
 
1384
}
 
1385
 
 
1386
.icon-check:before,
 
1387
.icon-check.after:after {
 
1388
  content: "\2713";
 
1389
}
 
1390
 
 
1391
.icon-uncheck:before,
 
1392
.icon-uncheck.after:after {
 
1393
  content: "\2717";
 
1394
}
 
1395
 
 
1396
.icon-cloud:before,
 
1397
.icon-cloud.after:after {
 
1398
  content: "\2601";
 
1399
}
 
1400
 
 
1401
.icon-dl:before,
 
1402
.icon-dl.after:after {
 
1403
  content: "\21E3";
 
1404
  font-weight: bold;
 
1405
}
 
1406
 
 
1407
.icon-cross:before,
 
1408
.icon-cross.after:after {
 
1409
  content: "\2716";
 
1410
  font-weight: bold;
 
1411
}
 
1412
 
 
1413
.icon-arrow1:before,
 
1414
.icon-arrow1.after:after {
 
1415
  content: "\2192";
 
1416
  position: relative;
 
1417
  top: -0.15em;
 
1418
}
 
1419
 
 
1420
.icon-arrow2:before,
 
1421
.icon-arrow2.after:after {
 
1422
  content: "\279E";
 
1423
}
 
1424
 
 
1425
.icon-arrow3:before,
 
1426
.icon-arrow3.after:after {
 
1427
  content: "\279A";
 
1428
}
 
1429
 
 
1430
.icon-bracket1:before,
 
1431
.icon-bracket1.after:after {
 
1432
  content: "\2039";
 
1433
  font-weight: bold;
 
1434
  font-size: 1.6em;
 
1435
  position: relative;
 
1436
  top: -0.15em;
 
1437
}
 
1438
 
 
1439
.icon-bracket2:before,
 
1440
.icon-bracket2.after:after {
 
1441
  content: "\203A";
 
1442
  font-weight: bold;
 
1443
  font-size: 1.6em;
 
1444
  position: relative;
 
1445
  top: -0.15em;
 
1446
}
 
1447
 
 
1448
.icon-up:before,
 
1449
.icon-up.after:after {
 
1450
  content: "\25B2";
 
1451
}
 
1452
 
 
1453
.icon-down:before,
 
1454
.icon-down.after:after {
 
1455
  content: "\25BC";
 
1456
}
 
1457
 
 
1458
.icon-bull:before,
 
1459
.icon-bull.after:after {
 
1460
  content: "\2022";
 
1461
  font-size: 1.2em;
 
1462
  top: -0.05em;
 
1463
}
 
1464
 
 
1465
.icon-bull2:before,
 
1466
.icon-bull2.after:after {
 
1467
  content: "\25E6";
 
1468
  top: -0.05em;
 
1469
}
 
1470
 
 
1471
.icon-bull3:before,
 
1472
.icon-bull3.after:after {
 
1473
  content: "\2023";
 
1474
  font-size: 1.6em;
 
1475
  top: -0.05em;
 
1476
}
 
1477
 
 
1478
.icon-nav:before,
 
1479
.icon-nav.after:after {
 
1480
  content: "\2261";
 
1481
  font-weight: bold;
 
1482
}
 
1483
 
 
1484
.icon-losange:before,
 
1485
.icon-losange.after:after {
 
1486
  content: "\25C6";
 
1487
}
 
1488
 
 
1489
.icon-asteri:before,
 
1490
.icon-asteri.after:after {
 
1491
  content: "\2731";
 
1492
  font-weight: bold;
 
1493
}
 
1494
 
 
1495
.icon-mail:before,
 
1496
.icon-mail.after:after {
 
1497
  content: "\2709";
 
1498
  font-size: 1.6em;
 
1499
  top: -0.05em;
 
1500
}
 
1501
 
 
1502
/* ----------------------------- */
 
1503
 
 
1504
/* ==desktop and retina medias   */
 
1505
 
 
1506
/* ----------------------------- */
 
1507
 
 
1508
@media (min-width: 768px) {
 
1509
  /* here go rules for big resources and big screens like: background-images, font-faces, etc. */
 
1510
}
 
1511
 
 
1512
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
 
1513
  /* Style adjustments for retina devices */
 
1514
}
 
1515
 
 
1516
/* ---------------------------------- */
 
1517
 
 
1518
/* ==Responsive large / medium / tiny */
 
1519
 
 
1520
/* ---------------------------------- */
 
1521
 
 
1522
@media (min-width: 1280px) {
 
1523
  /* layouts for large screens */
 
1524
 
 
1525
  .large-hidden {
 
1526
    display: none !important;
 
1527
  }
 
1528
 
 
1529
  .large-visible {
 
1530
    display: block !important;
 
1531
  }
 
1532
 
 
1533
  .large-no-float {
 
1534
    float: none;
 
1535
  }
 
1536
 
 
1537
  .large-inbl {
 
1538
    display: inline-block;
 
1539
    float: none;
 
1540
    vertical-align: top;
 
1541
  }
 
1542
 
 
1543
  .large-row {
 
1544
    display: table;
 
1545
    table-layout: fixed;
 
1546
    width: 100% !important;
 
1547
  }
 
1548
 
 
1549
  .large-col {
 
1550
    display: table-cell;
 
1551
    vertical-align: top;
 
1552
  }
 
1553
 
 
1554
  /* widths for large screens */
 
1555
 
 
1556
  .large-w25 {
 
1557
    width: 25% !important;
 
1558
  }
 
1559
 
 
1560
  .large-w33 {
 
1561
    width: 33.3333% !important;
 
1562
  }
 
1563
 
 
1564
  .large-w50 {
 
1565
    width: 50% !important;
 
1566
  }
 
1567
 
 
1568
  .large-w66 {
 
1569
    width: 66.6666% !important;
 
1570
  }
 
1571
 
 
1572
  .large-w75 {
 
1573
    width: 75% !important;
 
1574
  }
 
1575
 
 
1576
  .large-w100,
 
1577
  .large-wauto {
 
1578
    display: block !important;
 
1579
    float: none !important;
 
1580
    clear: none !important;
 
1581
    width: auto !important;
 
1582
    margin-left: 0 !important;
 
1583
    margin-right: 0 !important;
 
1584
    border: 0;
 
1585
  }
 
1586
 
 
1587
  /* margins for large screens */
 
1588
 
 
1589
  .large-ma0 {
 
1590
    margin: 0 !important;
 
1591
  }
 
1592
}
 
1593
 
 
1594
@media (max-width: 768px) {
 
1595
  /* quick reset in small resolution and less */
 
1596
 
 
1597
  .w600p,
 
1598
  .w700p,
 
1599
  .w800p,
 
1600
  .w960p,
 
1601
  .mw960p {
 
1602
    width: auto;
 
1603
    float: none;
 
1604
  }
 
1605
 
 
1606
  /* layouts for small screens */
 
1607
 
 
1608
  .small-hidden {
 
1609
    display: none !important;
 
1610
  }
 
1611
 
 
1612
  .small-visible {
 
1613
    display: block !important;
 
1614
  }
 
1615
 
 
1616
  .small-no-float {
 
1617
    float: none;
 
1618
  }
 
1619
 
 
1620
  .small-inbl {
 
1621
    display: inline-block;
 
1622
    float: none;
 
1623
    vertical-align: top;
 
1624
  }
 
1625
 
 
1626
  .small-row {
 
1627
    display: table !important;
 
1628
    table-layout: fixed !important;
 
1629
    width: 100% !important;
 
1630
  }
 
1631
 
 
1632
  .small-col {
 
1633
    display: table-cell !important;
 
1634
    vertical-align: top !important;
 
1635
  }
 
1636
 
 
1637
  /* you shall not pass */
 
1638
 
 
1639
  div,
 
1640
  textarea,
 
1641
  table,
 
1642
  td,
 
1643
  th,
 
1644
  code,
 
1645
  pre,
 
1646
  samp {
 
1647
    word-wrap: break-word;
 
1648
    -webkit-hyphens: auto;
 
1649
    -moz-hyphens: auto;
 
1650
    -ms-hyphens: auto;
 
1651
    hyphens: auto;
 
1652
  }
 
1653
 
 
1654
  /* widths for small screens */
 
1655
 
 
1656
  .small-w25 {
 
1657
    width: 25% !important;
 
1658
  }
 
1659
 
 
1660
  .small-w33 {
 
1661
    width: 33.3333% !important;
 
1662
  }
 
1663
 
 
1664
  .small-w50 {
 
1665
    width: 50% !important;
 
1666
  }
 
1667
 
 
1668
  .small-w66 {
 
1669
    width: 66.6666% !important;
 
1670
  }
 
1671
 
 
1672
  .small-w75 {
 
1673
    width: 75% !important;
 
1674
  }
 
1675
 
 
1676
  .small-w100,
 
1677
  .small-wauto {
 
1678
    display: block !important;
 
1679
    float: none !important;
 
1680
    clear: none !important;
 
1681
    width: auto !important;
 
1682
    margin-left: 0 !important;
 
1683
    margin-right: 0 !important;
 
1684
    border: 0;
 
1685
  }
 
1686
 
 
1687
  /* margins for small screens */
 
1688
 
 
1689
  .small-ma0 {
 
1690
    margin: 0 !important;
 
1691
  }
 
1692
}
 
1693
 
 
1694
@media (max-width: 480px) {
 
1695
  /* quick tiny resolution reset */
 
1696
 
 
1697
  .mod,
 
1698
  .col,
 
1699
  fieldset {
 
1700
    display: block !important;
 
1701
    float: none !important;
 
1702
    clear: none !important;
 
1703
    width: auto !important;
 
1704
    margin-left: 0 !important;
 
1705
    margin-right: 0 !important;
 
1706
    border: 0;
 
1707
  }
 
1708
 
 
1709
  .w300p,
 
1710
  .w400p,
 
1711
  .w500p {
 
1712
    width: auto;
 
1713
    float: none;
 
1714
  }
 
1715
 
 
1716
  .row {
 
1717
    display: block !important;
 
1718
    width: 100% !important;
 
1719
  }
 
1720
 
 
1721
  /* layouts for tiny screens */
 
1722
 
 
1723
  .tiny-hidden {
 
1724
    display: none !important;
 
1725
  }
 
1726
 
 
1727
  .tiny-visible {
 
1728
    display: block !important;
 
1729
  }
 
1730
 
 
1731
  .tiny-no-float {
 
1732
    float: none;
 
1733
  }
 
1734
 
 
1735
  .tiny-inbl {
 
1736
    display: inline-block;
 
1737
    float: none;
 
1738
    vertical-align: top;
 
1739
  }
 
1740
 
 
1741
  .tiny-row {
 
1742
    display: table !important;
 
1743
    table-layout: fixed !important;
 
1744
    width: 100% !important;
 
1745
  }
 
1746
 
 
1747
  .tiny-col {
 
1748
    display: table-cell !important;
 
1749
    vertical-align: top !important;
 
1750
  }
 
1751
 
 
1752
  th,
 
1753
  td {
 
1754
    display: block !important;
 
1755
    width: auto !important;
 
1756
    text-align: left !important;
 
1757
  }
 
1758
 
 
1759
  thead {
 
1760
    display: none;
 
1761
  }
 
1762
 
 
1763
  /* widths for tiny screens */
 
1764
 
 
1765
  .tiny-w25 {
 
1766
    width: 25% !important;
 
1767
  }
 
1768
 
 
1769
  .tiny-w33 {
 
1770
    width: 33.3333% !important;
 
1771
  }
 
1772
 
 
1773
  .tiny-w50 {
 
1774
    width: 50% !important;
 
1775
  }
 
1776
 
 
1777
  .tiny-w66 {
 
1778
    width: 66.6666% !important;
 
1779
  }
 
1780
 
 
1781
  .tiny-w75 {
 
1782
    width: 75% !important;
 
1783
  }
 
1784
 
 
1785
  .tiny-w100,
 
1786
  .tiny-wauto {
 
1787
    display: block !important;
 
1788
    float: none !important;
 
1789
    clear: none !important;
 
1790
    width: auto !important;
 
1791
    margin-left: 0 !important;
 
1792
    margin-right: 0 !important;
 
1793
    border: 0;
 
1794
  }
 
1795
 
 
1796
  /* margins for tiny screens */
 
1797
 
 
1798
  .tiny-ma0 {
 
1799
    margin: 0 !important;
 
1800
  }
 
1801
}
 
1802
 
 
1803
/* flexbox layout 
 
1804
Tutorial: http://knacss.com/demos/tutoriel.html#flex */
 
1805
 
 
1806
.flex {
 
1807
  display: -webkit-box;
 
1808
  display: -webkit-flex;
 
1809
  display: -moz-box;
 
1810
  display: -ms-flexbox;
 
1811
  display: flex;
 
1812
}
 
1813
 
 
1814
.flex-h {
 
1815
  -webkit-box-orient: horizontal;
 
1816
  -webkit-box-direction: normal;
 
1817
  -webkit-flex-direction: row;
 
1818
  -moz-box-orient: horizontal;
 
1819
  -moz-box-direction: normal;
 
1820
  -ms-flex-direction: row;
 
1821
  flex-direction: row;
 
1822
}
 
1823
 
 
1824
.flex-v {
 
1825
  -webkit-box-orient: vertical;
 
1826
  -webkit-box-direction: normal;
 
1827
  -webkit-flex-direction: column;
 
1828
  -moz-box-orient: vertical;
 
1829
  -moz-box-direction: normal;
 
1830
  -ms-flex-direction: column;
 
1831
  flex-direction: column;
 
1832
}
 
1833
 
 
1834
.flex-fluid {
 
1835
  -webkit-box-flex: 1;
 
1836
  -webkit-flex: 1;
 
1837
  -moz-box-flex: 1;
 
1838
  -ms-flex: 1;
 
1839
  flex: 1;
 
1840
}
 
1841
 
 
1842
.flex-start {
 
1843
  -webkit-box-ordinal-group: 0;
 
1844
  -webkit-order: -1;
 
1845
  -moz-box-ordinal-group: 0;
 
1846
  -ms-flex-order: -1;
 
1847
  order: -1;
 
1848
}
 
1849
 
 
1850
.flex-mid {
 
1851
  -webkit-box-ordinal-group: 2;
 
1852
  -webkit-order: 1;
 
1853
  -moz-box-ordinal-group: 2;
 
1854
  -ms-flex-order: 1;
 
1855
  order: 1;
 
1856
}
 
1857
 
 
1858
.flex-end {
 
1859
  -webkit-box-ordinal-group: 43;
 
1860
  -webkit-order: 42;
 
1861
  -moz-box-ordinal-group: 43;
 
1862
  -ms-flex-order: 42;
 
1863
  order: 42;
 
1864
}
 
1865
 
 
1866
/* quick print reset */
 
1867
 
 
1868
@media print {
 
1869
  * {
 
1870
    background: transparent !important;
 
1871
    -webkit-box-shadow: none !important;
 
1872
    box-shadow: none !important;
 
1873
    text-shadow: none !important;
 
1874
  }
 
1875
 
 
1876
  body {
 
1877
    width: auto !important;
 
1878
    margin: auto !important;
 
1879
    font-family: serif;
 
1880
    font-size: 12pt;
 
1881
    background-color: #fff !important;
 
1882
    color: #333 !important;
 
1883
  }
 
1884
 
 
1885
  p,
 
1886
  h1,
 
1887
  h2,
 
1888
  h3,
 
1889
  h4,
 
1890
  h5,
 
1891
  h6,
 
1892
  blockquote,
 
1893
  ul,
 
1894
  ol {
 
1895
    color: #000 !important;
 
1896
    margin: auto !important;
 
1897
  }
 
1898
 
 
1899
  .print {
 
1900
    display: block;
 
1901
    /* displaying .print elements */
 
1902
  }
 
1903
 
 
1904
  img {
 
1905
    -webkit-filter: grayscale(100%);
 
1906
    -moz-filter: grayscale(100%);
 
1907
    -ms-filter: grayscale(100%);
 
1908
    -o-filter: grayscale(100%);
 
1909
    filter: grayscale(100%);
 
1910
  }
 
1911
 
 
1912
  p,
 
1913
  blockquote {
 
1914
    orphans: 3;
 
1915
    /* no orphans */
 
1916
    widows: 3;
 
1917
    /* no widows */
 
1918
  }
 
1919
 
 
1920
  blockquote,
 
1921
  ul,
 
1922
  ol {
 
1923
    page-break-inside: avoid;
 
1924
    /* no breaks inside these elements */
 
1925
  }
 
1926
 
 
1927
  h1 {
 
1928
    page-break-before: always;
 
1929
    /* page break before main headers */
 
1930
  }
 
1931
 
 
1932
  h1,
 
1933
  h2,
 
1934
  h3,
 
1935
  caption {
 
1936
    page-break-after: avoid;
 
1937
    /* no breaks after these elements */
 
1938
  }
 
1939
 
 
1940
  a {
 
1941
    color: #000 !important;
 
1942
    text-decoration: underline !important;
 
1943
  }
 
1944
 
 
1945
  a[href]:after {
 
1946
    content: " (" attr(href) ")";
 
1947
    /* displaying URLs */
 
1948
  }
 
1949
 
 
1950
  a[href^="javascript:"]:after,
 
1951
  a[href^="#"]:after {
 
1952
    content: "";
 
1953
  }
 
1954
}
 
1955
 
 
1956
/* ----------------------------- */
 
1957
 
 
1958
/* ==own stylesheet              */
 
1959
 
 
1960
/* ----------------------------- */
 
1961
 
 
1962
/* Here should go your own CSS styles */
 
1963
 
 
1964
/* You can also link them with a LESS @import */
 
1965
 
 
1966
/* @import "my-styles.less"; */
 
 
b'\\ No newline at end of file'