css/habillage.css

   1 * {
   2   -moz-box-sizing: border-box;
   3   -webkit-box-sizing: border-box;
   4   box-sizing: border-box; }
   5
   6 body {
   7   margin: 0;
   8   padding: 0;
   9   font-family: sans-serif; }
  10
  11 header {
  12   margin: 0 auto;
  13   width: 100%; }
  14
  15 header img {
  16   margin-left: 120px; }
  17
  18 #wrap {
  19   padding-top: 20px;
  20   width: 1100px;
  21   margin: 0 auto; }
  22
  23 a {
  24   text-decoration: none; }
  25
  26 h1 {
  27   margin: 15px -15px 5px 15px;
  28   padding: 0;
  29   font-size: 2.0em;
  30   color: #1d0b78;
  31   display: inline-block; }
  32
  33 h2 {
  34   margin: 15px 15px;
  35   font-size: 1.3em;
  36   color: #1d0b78;
  37   display: inline-block; }
  38
  39 h3 {
  40   margin: 15px;
  41   display: inline-block;
  42   color: #1d0b78; }
  43
  44 p {
  45   margin: 0 15px;
  46   color: #1d0b78;
  47   text-decoration: none; }
  48
  49 /*1ERE COLONNE*/
  50 #ateliers {
  51   margin: 0 10px;
  52   overflow: hidden; }
  53
  54 #ateliers:after {
  55   content: "";
  56   /* Important, sinon l'élément n'est pas généré. */
  57   display: table;
  58   clear: both; }
  59
  60 #ateliers ul {
  61   padding: 0;
  62   margin: 0;
  63   list-style-type: none; }
  64
  65 #ateliers ul li {
  66   height: 300px;
  67   margin-bottom: 15px;
  68   background-color: #2bc7cd; }
  69
  70 /*2EME COLONNE*/
  71 #news {
  72   background-color: #a51616;
  73   margin: 0 10px 10px 10px;
  74   overflow: hidden; }
  75
  76 #news img {
  77   height: 350px; }
  78
  79 .article1,
  80 .article2,
  81 .article3,
  82 .article4 {
  83   background-color: #ffaa7f; }
  84
  85 .suite {
  86   text-align: right; }
  87
  88 /*3EME COLONNE*/
  89 .map {
  90   background-color: #6059d2;
  91   height: 300px;
  92   margin: 0 0 15px 10px; }
  93
  94 .agenda {
  95   background-color: #ca52ae;
  96   height: 300px;
  97   margin: 0 0 0px 10px; }
  98
  99 /*RESPONSIVE*/
 100 .col-2,
 101 .col-4,
 102 .col-6,
 103 .col-8,
 104 .col-10,
 105 .col-12 {
 106   float: left;
 107   position: relative; }
 108
 109 .row:before, .row:after {
 110   content: "";
 111   display: table; }
 112
 113 .row:after {
 114   clear: both; }
 115
 116 .row {
 117   margin: 0 -10px;
 118   zoom: 1; }
 119
 120 .col-1 {
 121   width: 8.33333%; }
 122
 123 .col-2 {
 124   width: 16.66667%; }
 125
 126 .col-3 {
 127   width: 25%; }
 128
 129 .col-4 {
 130   width: 33.33333%; }
 131
 132 .col-5 {
 133   width: 41.66667%; }
 134
 135 .col-6 {
 136   width: 50%; }
 137
 138 .col-7 {
 139   width: 58.33333%; }
 140
 141 .col-8 {
 142   width: 66.66666%; }
 143
 144 .col-9 {
 145   width: 75%; }
 146
 147 .col-10 {
 148   width: 83.33333%; }
 149
 150 .col-11 {
 151   width: 91.66667%; }
 152
 153 .col-12 {
 154   width: 100%; }
 155
 156 @media only screen and (min-width: 640px) {
 157   .col-m-1 {
 158     width: 8.33333%; }
 159
 160   .col-m-2 {
 161     width: 16.66667%; }
 162
 163   .col-m-3 {
 164     width: 25%; }
 165
 166   .col-m-4 {
 167     width: 33.33333%; }
 168
 169   .col-m-5 {
 170     width: 41.66667%; }
 171
 172   .col-m-6 {
 173     width: 50%; }
 174
 175   .col-m-7 {
 176     width: 58.33333%; }
 177
 178   .col-m-8 {
 179     width: 66.66666%; }
 180
 181   .col-m-9 {
 182     width: 75%; }
 183
 184   .col-m-10 {
 185     width: 83.33333%; }
 186
 187   .col-m-11 {
 188     width: 91.66667%; }
 189
 190   .col-m-12 {
 191     width: 100%; } }
 192
 193
 194 @media only screen and (min-width: 1024px) {
 195   .col-l-1 {
 196     width: 8.33333%; }
 197
 198   .col-l-2 {
 199     width: 16.66667%; }
 200
 201   .col-l-3 {
 202     width: 25%; }
 203
 204   .col-l-4 {
 205     width: 33.33333%; }
 206
 207   .col-l-5 {
 208     width: 41.66667%; }
 209
 210   .col-l-6 {
 211     width: 50%; }
 212
 213   .col-l-7 {
 214     width: 58.33333%; }
 215
 216   .col-l-8 {
 217     width: 66.66666%; }
 218
 219   .col-l-9 {
 220     width: 75%; }
 221
 222   .col-l-10 {
 223     width: 83.33333%; }
 224
 225   .col-l-11 {
 226     width: 91.66667%; }
 227
 228   .col-l-12 {
 229     width: 100%; } }
 230
 231 /*# sourceMappingURL=habillage.css.map */