css/habillage.css

   1 @charset "UTF-8";
   2 html, body, div, span, applet, object, iframe,
   3 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
   4 a, abbr, acronym, address, big, cite, code,
   5 del, dfn, em, img, ins, kbd, q, s, samp,
   6 small, strike, strong, sub, sup, tt, var,
   7 b, u, i, center,
   8 dl, dt, dd, ol, ul, li,
   9 fieldset, form, label, legend,
  10 table, caption, tbody, tfoot, thead, tr, th, td,
  11 article, aside, canvas, details, embed,
  12 figure, figcaption, footer, header, hgroup,
  13 menu, nav, output, ruby, section, summary,
  14 time, mark, audio, video {
  15   margin: 0;
  16   padding: 0;
  17   border: 0;
  18   font: inherit;
  19   font-size: 100%;
  20   vertical-align: baseline;
  21   font-family: sans-serif;
  22   color: #1a0583;
  23   text-align: left; }
  24
  25 html, body, span, applet, object, iframe,
  26 blockquote, pre, section,
  27 abbr, acronym, address, big, cite, code,
  28 del, dfn, em, ins, kbd, q, s, samp,
  29 small, strike, strong, sub, sup, tt, var,
  30 dl, dt, dd, ol, ul, li,
  31 fieldset, form, label, legend,
  32 table, caption, tbody, tfoot, thead, tr, th, td,
  33 article, aside, canvas, details, embed,
  34 figure, figcaption, hgroup,
  35 menu, nav, output, ruby, summary, mark, audio, video {
  36   background-color: #ffffff; }
  37
  38 html {
  39   line-height: 1; }
  40
  41 ol, ul {
  42   list-style: none; }
  43
  44 table {
  45   border-collapse: collapse;
  46   border-spacing: 0; }
  47
  48 caption, th, td {
  49   text-align: left;
  50   font-weight: normal;
  51   vertical-align: middle; }
  52
  53 q, blockquote {
  54   quotes: none; }
  55
  56 q:before, q:after, blockquote:before, blockquote:after {
  57   content: "";
  58   content: none; }
  59
  60 a img {
  61   border: none; }
  62
  63 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  64   display: block; }
  65
  66 * {
  67   -moz-box-sizing: border-box;
  68   -webkit-box-sizing: border-box;
  69   box-sizing: border-box; }
  70
  71 body {
  72   margin: 0;
  73   padding: 0; }
  74
  75 header {
  76   margin: 0 auto;
  77   width: 1200px; }
  78
  79 header .spip_logos {
  80   margin-left: 10px;
  81   position: absolute; }
  82
  83 #wrap {
  84   padding-top: 130px;
  85   width: 1200px;
  86   margin: 0 auto; }
  87
  88 a {
  89   text-decoration: none; }
  90
  91 a:focus, a:hover, a:active {
  92   background: none;
  93   color: #1a0583; }
  94
  95 h1 {
  96   margin: 0;
  97   padding: 0;
  98   padding-top: 15px;
  99   padding-left: 15px;
 100   font-size: 1.9em;
 101   display: inline-block; }
 102
 103 h2 {
 104   margin: 15px 15px;
 105   font-size: 1.3em;
 106   display: inline-block; }
 107
 108 h3 {
 109   margin: 15px;
 110   display: inline-block; }
 111
 112 p {
 113   margin: 0 15px;
 114   text-decoration: none;
 115   text-align: justify; }
 116
 117 /*1ERE COLONNE*/
 118 #ateliers {
 119   margin: 0 10px; }
 120
 121 #ateliers:after {
 122   content: "";
 123   /* Important, sinon l'élément n'est pas généré. */
 124   display: table;
 125   clear: both; }
 126
 127 #ateliers ul {
 128   padding: 0;
 129   margin: 0;
 130   list-style-type: none; }
 131
 132 #ateliers ul li {
 133   height: 300px;
 134   margin-bottom: 15px;
 135   background-color: #2bc7cd; }
 136
 137 #ateliers p {
 138   margin: 15px 15px 0 15px;
 139   font-size: 1.3em;
 140   font-weight: bold;
 141   text-align: left; }
 142
 143 #ateliers p:nth-child(2) {
 144   margin: 0px 15px 15px 15px; }
 145
 146 /*2EME COLONNE*/
 147 #news {
 148   margin: 0 10px 10px 10px;
 149   overflow: hidden; }
 150
 151 #news img {
 152   height: 350px; }
 153
 154 .article {
 155   background-color: #ffaa7f; }
 156
 157 /*3EME COLONNE*/
 158 .map {
 159   background-color: #6059d2;
 160   height: 300px;
 161   margin: 0 0 15px 10px; }
 162
 163 .agenda {
 164   background-color: #3ee88d;
 165   height: 500px;
 166   margin: 0 0 0px 10px;
 167   padding-right: 10px; }
 168
 169 .agenda p {
 170   line-height: 120%; }
 171
 172 .agenda ul {
 173   list-style-type: none;
 174   padding: 0;
 175   margin: 0;
 176   padding-top: 15px; }
 177
 178 .date {
 179   float: left;
 180   font-size: 1.7em; }
 181
 182 /*RESPONSIVE*/
 183 .col-2,
 184 .col-4,
 185 .col-6,
 186 .col-8,
 187 .col-10,
 188 .col-12 {
 189   float: left;
 190   position: relative; }
 191
 192 .row:before, .row:after {
 193   content: "";
 194   display: table; }
 195
 196 .row:after {
 197   clear: both; }
 198
 199 .row {
 200   margin: 0 -10px;
 201   zoom: 1; }
 202
 203 .col-1 {
 204   width: 8.33333%; }
 205
 206 .col-2 {
 207   width: 16.66667%; }
 208
 209 .col-3 {
 210   width: 25%; }
 211
 212 .col-4 {
 213   width: 33.33333%; }
 214
 215 .col-5 {
 216   width: 41.66667%; }
 217
 218 .col-6 {
 219   width: 50%; }
 220
 221 .col-7 {
 222   width: 58.33333%; }
 223
 224 .col-8 {
 225   width: 66.66666%; }
 226
 227 .col-9 {
 228   width: 75%; }
 229
 230 .col-10 {
 231   width: 83.33333%; }
 232
 233 .col-11 {
 234   width: 91.66667%; }
 235
 236 .col-12 {
 237   width: 100%; }
 238
 239 @media only screen and (min-width: 640px) {
 240   .col-m-1 {
 241     width: 8.33333%; }
 242
 243   .col-m-2 {
 244     width: 16.66667%; }
 245
 246   .col-m-3 {
 247     width: 25%; }
 248
 249   .col-m-4 {
 250     width: 33.33333%; }
 251
 252   .col-m-5 {
 253     width: 41.66667%; }
 254
 255   .col-m-6 {
 256     width: 50%; }
 257
 258   .col-m-7 {
 259     width: 58.33333%; }
 260
 261   .col-m-8 {
 262     width: 66.66666%; }
 263
 264   .col-m-9 {
 265     width: 75%; }
 266
 267   .col-m-10 {
 268     width: 83.33333%; }
 269
 270   .col-m-11 {
 271     width: 91.66667%; }
 272
 273   .col-m-12 {
 274     width: 100%; } }
 275 @media only screen and (min-width: 1024px) {
 276   .col-l-1 {
 277     width: 8.33333%; }
 278
 279   .col-l-2 {
 280     width: 16.66667%; }
 281
 282   .col-l-3 {
 283     width: 25%; }
 284
 285   .col-l-4 {
 286     width: 33.33333%; }
 287
 288   .col-l-5 {
 289     width: 41.66667%; }
 290
 291   .col-l-6 {
 292     width: 50%; }
 293
 294   .col-l-7 {
 295     width: 58.33333%; }
 296
 297   .col-l-8 {
 298     width: 66.66666%; }
 299
 300   .col-l-9 {
 301     width: 75%; }
 302
 303   .col-l-10 {
 304     width: 83.33333%; }
 305
 306   .col-l-11 {
 307     width: 91.66667%; }
 308
 309   .col-l-12 {
 310     width: 100%; } }
 311 /*FOOTER*/
 312 footer {
 313   clear: both;
 314   height: 200px;
 315   width: 100%;
 316   background-color: #ffaa7f; }
 317
 318 footer ul {
 319   padding: 0;
 320   margin: 0;
 321   list-style-type: none;
 322   padding-top: 70px;
 323   margin-left: 100px; }
 324
 325 footer li {
 326   margin-left: 2px;
 327   float: left;
 328   /*pour IE*/ }
 329
 330 footer ul li a {
 331   display: block;
 332   float: left;
 333   text-decoration: none; }
 334
 335 footer ul li a:hover {
 336   border-bottom: solid #1d0b78; }
 337
 338 /*# sourceMappingURL=habillage.css.map */