b03b2c9f43664e78ac7260c6f2f1ec47a784c5d6
[lhc/web/clavettes.git] / 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: #120260;
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 background: none; }
38
39 html {
40 line-height: 1.1; }
41
42 ol, ul {
43 list-style: none; }
44
45 table {
46 border-collapse: collapse;
47 border-spacing: 0; }
48
49 caption, th, td {
50 text-align: left;
51 font-weight: normal;
52 vertical-align: middle; }
53
54 q, blockquote {
55 quotes: none; }
56
57 q:before, q:after, blockquote:before, blockquote:after {
58 content: "";
59 content: none; }
60
61 a img {
62 border: none; }
63
64 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
65 display: block; }
66
67 * {
68 -moz-box-sizing: border-box;
69 -webkit-box-sizing: border-box;
70 box-sizing: border-box; }
71
72 body {
73 margin: 0;
74 padding: 0; }
75
76 header {
77 margin: 0 auto;
78 width: 1200px; }
79
80 header .spip_logos {
81 margin-left: 10px;
82 position: absolute; }
83
84 #wrap {
85 padding-top: 130px;
86 width: 100%;
87 margin: 0 auto; }
88
89 a {
90 text-decoration: none;
91 -webkit-transition: all 0.3s ease 0s;
92 -moz-transition: all 0.3s ease 0s;
93 -ms-transition: all 0.3s ease 0s;
94 -o-transition: all 0.3s ease 0s;
95 transition: all 0.3s ease 0s; }
96
97 a:focus, a:hover, a:active {
98 background: none;
99 color: #e1702e;
100 -webkit-transition: all 0.3s ease 0s;
101 -moz-transition: all 0.3s ease 0s;
102 -ms-transition: all 0.3s ease 0s;
103 -o-transition: all 0.3s ease 0s;
104 transition: all 0.3s ease 0s; }
105
106 h1 {
107 margin: 0;
108 padding: 0;
109 margin-top: 15px;
110 margin-left: 15px;
111 font-size: 1.9em;
112 display: inline-block;
113 font-weight: bold; }
114
115 h1:hover {
116 text-decoration: underline;
117 -webkit-transition: all 0.3s ease 0s;
118 -moz-transition: all 0.3s ease 0s;
119 -ms-transition: all 0.3s ease 0s;
120 -o-transition: all 0.3s ease 0s;
121 transition: all 0.3s ease 0s; }
122
123 h2 {
124 margin: 15px 15px;
125 font-size: 1.3em;
126 display: inline-block; }
127
128 h3 {
129 margin: 15px;
130 display: inline-block; }
131
132 p {
133 margin: 0 15px;
134 padding-bottom: 15px;
135 text-decoration: none;
136 text-align: justify; }
137
138 /*1ERE COLONNE*/
139 #ateliers {
140 margin: 0 10px; }
141
142 #ateliers:after {
143 content: "";
144 /* Important, sinon l'élément n'est pas généré. */
145 display: table;
146 clear: both; }
147
148 #ateliers ul {
149 padding: 0;
150 margin: 0;
151 list-style-type: none; }
152
153 #ateliers ul li {
154 margin-bottom: 15px; }
155
156 .descriptif {
157 margin-left: 15px; }
158
159 #ateliers p {
160 margin: 15px 15px 0 0;
161 font-size: 1.0em;
162 text-align: left; }
163
164 #ateliers address {
165 margin: 0 0 0 15px;
166 line-height: 0.6; }
167
168 .horairesouvertures {
169 margin: 0 0 0 15px; }
170
171 /*2EME COLONNE*/
172 #news {
173 overflow: hidden; }
174
175 .article {
176 background-color: #e8e3e1;
177 margin: 0 10px 15px 10px;
178 line-height: 1.3; }
179
180 .spip_logo {
181 display: none; }
182
183 .article .spip_logos {
184 display: none; }
185
186 .historique {
187 background-color: #ffd2a1;
188 margin: 0 15px 15px 15px; }
189
190 .historique h1 {
191 width: 100%; }
192
193 #atelierdescription img {
194 width: 100%; }
195
196 /*3EME COLONNE*/
197 .map {
198 height: 300px;
199 margin: 0 10px 15px 10px;
200 overflow: hidden; }
201
202 .agenda {
203 background-color: #a1ffff;
204 height: 500px;
205 margin: 0 10px 0px 10px;
206 padding-right: 10px;
207 overflow-y: scroll; }
208
209 .agenda p {
210 padding: 0; }
211
212 .agenda ul {
213 list-style-type: none;
214 padding: 0;
215 margin: 0;
216 padding-top: 15px; }
217
218 .date {
219 float: left;
220 font-size: 1.7em;
221 clear: both; }
222
223 .event {
224 display: block;
225 margin-bottom: 10px;
226 padding-top: 5px; }
227
228 .horaire {
229 font-size: 0.8em;
230 margin-bottom: 20px;
231 display: block; }
232
233 .nature {
234 overflow-y: scroll;
235 height: 70px; }
236
237 /*RESPONSIVE*/
238 .col-1, .col-m-1, .col-l-1, .col-2, .col-m-2, .col-l-2, .col-3, .col-m-3, .col-l-3, .col-4, .col-m-4, .col-l-4, .col-5, .col-m-5, .col-l-5, .col-6, .col-m-6, .col-l-6, .col-7, .col-m-7, .col-l-7, .col-8, .col-m-8, .col-l-8, .col-9, .col-m-9, .col-l-9, .col-10, .col-m-10, .col-l-10, .col-11, .col-m-11, .col-l-11, .col-12, .col-m-12, .col-l-12 {
239 float: left;
240 position: relative; }
241
242 .col-1 {
243 width: 8.33333%; }
244
245 .col-2 {
246 width: 16.66667%; }
247
248 .col-3 {
249 width: 25%; }
250
251 .col-4 {
252 width: 33.33333%; }
253
254 .col-5 {
255 width: 41.66667%; }
256
257 .col-6 {
258 width: 50%; }
259
260 .col-7 {
261 width: 58.33333%; }
262
263 .col-8 {
264 width: 66.66667%; }
265
266 .col-9 {
267 width: 75%; }
268
269 .col-10 {
270 width: 83.33333%; }
271
272 .col-11 {
273 width: 91.66667%; }
274
275 .col-12 {
276 width: 100%; }
277
278 @media only screen and (min-width: 650px) {
279 .col-m-1 {
280 width: 8.33333%; }
281
282 .col-m-2 {
283 width: 16.66667%; }
284
285 .col-m-3 {
286 width: 25%; }
287
288 .col-m-4 {
289 width: 33.33333%; }
290
291 .col-m-5 {
292 width: 41.66667%; }
293
294 .col-m-6 {
295 width: 50%; }
296
297 .col-m-7 {
298 width: 58.33333%; }
299
300 .col-m-8 {
301 width: 66.66667%; }
302
303 .col-m-9 {
304 width: 75%; }
305
306 .col-m-10 {
307 width: 83.33333%; }
308
309 .col-m-11 {
310 width: 91.66667%; }
311
312 .col-m-12 {
313 width: 100%; } }
314 @media only screen and (min-width: 1200px) {
315 .col-l-1 {
316 width: 8.33333%; }
317
318 .col-l-2 {
319 width: 16.66667%; }
320
321 .col-l-3 {
322 width: 25%; }
323
324 .col-l-4 {
325 width: 33.33333%; }
326
327 .col-l-5 {
328 width: 41.66667%; }
329
330 .col-l-6 {
331 width: 50%; }
332
333 .col-l-7 {
334 width: 58.33333%; }
335
336 .col-l-8 {
337 width: 66.66667%; }
338
339 .col-l-9 {
340 width: 75%; }
341
342 .col-l-10 {
343 width: 83.33333%; }
344
345 .col-l-11 {
346 width: 91.66667%; }
347
348 .col-l-12 {
349 width: 100%; }
350
351 #wrap {
352 width: 1200px; }
353
354 .wrap {
355 width: auto; } }
356 .row:before, .row:after {
357 content: "";
358 display: table; }
359
360 .row:after {
361 clear: both; }
362
363 .row {
364 margin: 0 -10px;
365 zoom: 1; }
366
367 /*FOOTER*/
368 footer {
369 clear: both;
370 height: 100px;
371 background-color: #e1702e; }
372
373 footer ul {
374 padding: 0;
375 margin: 0 auto;
376 list-style-type: none;
377 padding-top: 30px; }
378
379 .textfooter {
380 width: 500px;
381 margin: 0 auto; }
382
383 footer li {
384 float: left;
385 /*pour IE*/
386 text-align: center; }
387
388 footer ul li a {
389 display: block;
390 float: left;
391 text-decoration: none; }
392
393 footer ul li a:hover {
394 border-bottom: solid #1d0b78; }
395
396 /*# sourceMappingURL=habillage.css.map */