diff options
Diffstat (limited to 'public/accueil.css')
-rw-r--r-- | public/accueil.css | 991 |
1 files changed, 506 insertions, 485 deletions
diff --git a/public/accueil.css b/public/accueil.css index dc79083..f951334 100644 --- a/public/accueil.css +++ b/public/accueil.css | |||
@@ -1,485 +1,506 @@ | |||
1 | /* public/accueil.css */ | 1 | /* public/accueil.css */ |
2 | 2 | ||
3 | @font-face /* pour .police_titre */ | 3 | @font-face /* pour .police_titre */ |
4 | { | 4 | { |
5 | font-family: "you_are_loved"; | 5 | font-family: "you_are_loved"; |
6 | src: url('fonts/you_are_loved.ttf') format('truetype'), | 6 | src: url('fonts/you_are_loved.ttf') format('truetype'), |
7 | url('fonts/you_are_loved.eot'), | 7 | url('fonts/you_are_loved.eot'), |
8 | url('fonts/you_are_loved.eot?#iefix') format('embedded-opentype'), | 8 | url('fonts/you_are_loved.eot?#iefix') format('embedded-opentype'), |
9 | url('fonts/you_are_loved.woff2') format('woff2'), | 9 | url('fonts/you_are_loved.woff2') format('woff2'), |
10 | url('fonts/you_are_loved.woff') format('woff'); | 10 | url('fonts/you_are_loved.woff') format('woff'); |
11 | } | 11 | } |
12 | 12 | ||
13 | .no_underline | 13 | .no_underline |
14 | { | 14 | { |
15 | text-decoration: none; | 15 | text-decoration: none; |
16 | } | 16 | } |
17 | 17 | ||
18 | body | 18 | body |
19 | { | 19 | { |
20 | margin: 0px; | 20 | margin: 0px; |
21 | background-color: #326892; | 21 | background-color: #326892; |
22 | } | 22 | } |
23 | 23 | ||
24 | #bloc_page | 24 | #bloc_page |
25 | { | 25 | { |
26 | max-width: 700px; | 26 | max-width: 700px; |
27 | margin: auto; | 27 | margin: auto; |
28 | background-color: #FFFFFF; | 28 | background-color: #FFFFFF; |
29 | font-family: Sans-serif; | 29 | font-family: Sans-serif; |
30 | font-size: 100%; | 30 | font-size: 100%; |
31 | } | 31 | } |
32 | 32 | ||
33 | nav | 33 | nav |
34 | { | 34 | { |
35 | position: fixed; | 35 | position: fixed; |
36 | z-index: 2; | 36 | z-index: 2; |
37 | background-color: white; | 37 | background-color: white; |
38 | } | 38 | } |
39 | 39 | ||
40 | /* agir sur ul et li directement affecte le ckeditor */ | 40 | /* agir sur ul et li directement affecte le ckeditor */ |
41 | #ul_menu | 41 | #ul_menu |
42 | { | 42 | { |
43 | margin: 0px; | 43 | margin: 0px; |
44 | padding: 5px; | 44 | padding: 5px; |
45 | display: flex; | 45 | display: flex; |
46 | flex-wrap: wrap; | 46 | flex-wrap: wrap; |
47 | justify-content: center; | 47 | justify-content: center; |
48 | } | 48 | } |
49 | 49 | ||
50 | #ul_menu li | 50 | #ul_menu li |
51 | { | 51 | { |
52 | list-style-type: none; | 52 | list-style-type: none; |
53 | white-space: nowrap; | 53 | white-space: nowrap; |
54 | } | 54 | } |
55 | 55 | ||
56 | li a | 56 | li a |
57 | { | 57 | { |
58 | text-decoration: none; | 58 | text-decoration: none; |
59 | color: #666; | 59 | color: #666; |
60 | } | 60 | } |
61 | 61 | ||
62 | a:hover:not(.police_titre) /* :not() = sauf */ | 62 | a:hover:not(.police_titre) /* :not() = sauf */ |
63 | { | 63 | { |
64 | color: #000000; | 64 | color: #000000; |
65 | } | 65 | } |
66 | 66 | ||
67 | #actuelle | 67 | #actuelle |
68 | { | 68 | { |
69 | color: #463c3c; | 69 | color: #463c3c; |
70 | font-weight: bold; | 70 | font-weight: bold; |
71 | } | 71 | } |
72 | 72 | ||
73 | img | 73 | img |
74 | { | 74 | { |
75 | vertical-align: bottom; | 75 | vertical-align: bottom; |
76 | } | 76 | } |
77 | 77 | ||
78 | .boutonSubmitEditeur | 78 | .boutonSubmitEditeur |
79 | { | 79 | { |
80 | margin-top: 5px; | 80 | margin-top: 5px; |
81 | } | 81 | } |
82 | 82 | ||
83 | form | 83 | .boutonAnnuler:hover |
84 | { | 84 | { |
85 | padding-bottom: 14px; | 85 | /*text-decoration: none;*/ |
86 | border-bottom: 1px black solid; | 86 | border: none; |
87 | } | 87 | } |
88 | 88 | ||
89 | #courriel | 89 | h3 |
90 | { | 90 | { |
91 | padding-top: 30px; | 91 | margin: 5px; |
92 | font-size: 85%; | 92 | } |
93 | } | 93 | .conteneur_article |
94 | 94 | { | |
95 | #courriel * | 95 | margin: 3px; |
96 | { | 96 | } |
97 | max-width: 220px; | 97 | |
98 | color: black; | 98 | .articleAvecEditeur |
99 | text-decoration: none; | 99 | { |
100 | } | 100 | background-color: #a8b3d9; |
101 | 101 | padding: 2px 0px; | |
102 | #courriel a:hover | 102 | } |
103 | { | 103 | |
104 | /*border: 1px blue solid;*/ | 104 | form |
105 | padding: 5px; | 105 | { |
106 | } | 106 | padding-bottom: 14px; |
107 | 107 | border-bottom: 1px black solid; | |
108 | #courrielJS | 108 | } |
109 | { | 109 | |
110 | display: inline; | 110 | #courriel |
111 | margin: 2px; | 111 | { |
112 | } | 112 | padding-top: 30px; |
113 | 113 | font-size: 85%; | |
114 | .zoneVideAdmin | 114 | } |
115 | { | 115 | |
116 | padding-top: 20px; | 116 | #courriel * |
117 | } | 117 | { |
118 | 118 | max-width: 220px; | |
119 | #modeAdmin | 119 | color: black; |
120 | { | 120 | text-decoration: none; |
121 | background-color: orange; | 121 | } |
122 | position: fixed; | 122 | |
123 | bottom: 0px; | 123 | #courriel a:hover |
124 | width: 700px; | 124 | { |
125 | z-index: 2; | 125 | /*border: 1px blue solid;*/ |
126 | padding-top: 5px; | 126 | padding: 5px; |
127 | text-align: center; | 127 | } |
128 | } | 128 | |
129 | 129 | #courrielJS | |
130 | #modeAdmin p | 130 | { |
131 | { | 131 | display: inline; |
132 | text-align: center; | 132 | margin: 2px; |
133 | margin: 0px; | 133 | } |
134 | padding: 2px; | 134 | |
135 | } | 135 | .zoneVideAdmin |
136 | #modeAdmin>div p | 136 | { |
137 | { | 137 | padding-top: 20px; |
138 | /*border: 1px black solid;*/ | 138 | } |
139 | margin: 5px; | 139 | |
140 | padding: 0px; | 140 | #modeAdmin |
141 | } | 141 | { |
142 | #modeAdmin>p a | 142 | background-color: orange; |
143 | { | 143 | position: fixed; |
144 | padding: 2px; | 144 | bottom: 0px; |
145 | } | 145 | width: 700px; |
146 | 146 | z-index: 2; | |
147 | #modeAdmin div | 147 | padding-top: 5px; |
148 | { | 148 | text-align: center; |
149 | display: flex; | 149 | } |
150 | justify-content: space-around; | 150 | |
151 | 151 | #modeAdmin p | |
152 | margin: 0px; | 152 | { |
153 | font-size: 85%; | 153 | text-align: center; |
154 | } | 154 | margin: 0px; |
155 | 155 | padding: 2px; | |
156 | #lienModeAdmin | 156 | } |
157 | { | 157 | #modeAdmin>div p |
158 | margin: 0px 20px; | 158 | { |
159 | padding-bottom: 20px; | 159 | /*border: 1px black solid;*/ |
160 | } | 160 | margin: 5px; |
161 | 161 | padding: 0px; | |
162 | #lienModeAdmin p | 162 | } |
163 | { | 163 | #modeAdmin>p a |
164 | text-align: right; | 164 | { |
165 | } | 165 | padding: 2px; |
166 | 166 | } | |
167 | #lienModeAdmin p a | 167 | |
168 | { | 168 | #modeAdmin div |
169 | color: #666; | 169 | { |
170 | font-weight: bold; | 170 | display: flex; |
171 | padding: 2px; | 171 | justify-content: space-around; |
172 | } | 172 | |
173 | 173 | margin: 0px; | |
174 | #lienModeAdmin p a:hover | 174 | font-size: 85%; |
175 | { | 175 | } |
176 | color: black; | 176 | |
177 | } | 177 | #lienModeAdmin |
178 | 178 | { | |
179 | .connexionTitre | 179 | margin: 0px 20px; |
180 | { | 180 | padding-bottom: 20px; |
181 | margin-top: 0px; | 181 | } |
182 | text-align: center; | 182 | |
183 | } | 183 | #lienModeAdmin p |
184 | .avertissement | 184 | { |
185 | { | 185 | text-align: right; |
186 | color: red; | 186 | } |
187 | font-size: 90%; | 187 | |
188 | text-align: center; | 188 | #lienModeAdmin p a |
189 | } | 189 | { |
190 | 190 | color: #666; | |
191 | .connexionFormulaire | 191 | font-weight: bold; |
192 | { | 192 | padding: 2px; |
193 | margin: 30px; | 193 | } |
194 | } | 194 | |
195 | 195 | #lienModeAdmin p a:hover | |
196 | .connexionFooter | 196 | { |
197 | { | 197 | color: black; |
198 | text-align: right; | 198 | } |
199 | padding: 5px; | 199 | |
200 | } | 200 | .connexionTitre |
201 | 201 | { | |
202 | .connexionFooter a | 202 | margin-top: 0px; |
203 | { | 203 | text-align: center; |
204 | color: #666; | 204 | } |
205 | } | 205 | .avertissement |
206 | 206 | { | |
207 | 207 | color: red; | |
208 | /* PC, y compris vieux écrans 800x600 */ | 208 | font-size: 90%; |
209 | @media screen and (min-width: 700px) | 209 | text-align: center; |
210 | { | 210 | } |
211 | .police_titre | 211 | |
212 | { | 212 | .connexionFormulaire |
213 | 213 | { | |
214 | font-family: you_are_loved, Arial, sans; | 214 | margin: 30px; |
215 | font-size: 250%; | 215 | } |
216 | color: #ddc97a; | 216 | |
217 | position: relative; | 217 | .connexionFooter |
218 | top: 30px; | 218 | { |
219 | left: 40px; | 219 | text-align: right; |
220 | } | 220 | padding: 5px; |
221 | 221 | } | |
222 | /* compensation des cibles de liens # superposées au "nav" hors flux */ | 222 | |
223 | :target | 223 | .connexionFooter a |
224 | { | 224 | { |
225 | padding-top: 70px; | 225 | color: #666; |
226 | margin-top: -70px; | 226 | } |
227 | } | 227 | |
228 | 228 | ||
229 | nav | 229 | /* PC, y compris vieux écrans 800x600 */ |
230 | { | 230 | @media screen and (min-width: 700px) |
231 | border-bottom: 1px black solid; | 231 | { |
232 | margin: 0px 35px; | 232 | .police_titre |
233 | max-width: 630px; | 233 | { |
234 | } | 234 | |
235 | 235 | font-family: you_are_loved, Arial, sans; | |
236 | li | 236 | font-size: 250%; |
237 | { | 237 | color: #ddc97a; |
238 | margin: 6px 15px; | 238 | position: relative; |
239 | } | 239 | top: 30px; |
240 | 240 | left: 40px; | |
241 | header | 241 | } |
242 | { | 242 | |
243 | margin: 0px 35px; | 243 | /* compensation des cibles de liens # superposées au "nav" hors flux */ |
244 | padding-top: 92px; | 244 | :target |
245 | } | 245 | { |
246 | 246 | padding-top: 70px; | |
247 | #bienvenue | 247 | margin-top: -70px; |
248 | { | 248 | } |
249 | background-image: url("accueil/bienvenue.png"); | 249 | |
250 | width: 630px; | 250 | nav |
251 | height: 596px; | 251 | { |
252 | } | 252 | border-bottom: 1px black solid; |
253 | 253 | margin: 0px 35px; | |
254 | #contenu, footer | 254 | max-width: 630px; |
255 | { | 255 | } |
256 | width: 630px; | 256 | |
257 | margin: auto; | 257 | li |
258 | } | 258 | { |
259 | 259 | margin: 6px 15px; | |
260 | #courriel | 260 | } |
261 | { | 261 | |
262 | margin: 0px 35px; | 262 | header |
263 | } | 263 | { |
264 | 264 | margin: 0px 35px; | |
265 | .zoneVideAdmin, #modeAdmin | 265 | padding-top: 92px; |
266 | { | 266 | } |
267 | height: 70px; | 267 | |
268 | } | 268 | #bienvenue |
269 | } | 269 | { |
270 | 270 | background-image: url("accueil/bienvenue.png"); | |
271 | /* "tablettes" et vieux écrans 640x480 */ | 271 | width: 630px; |
272 | @media screen and (max-width: 699px) | 272 | height: 596px; |
273 | { | 273 | } |
274 | #bloc_page | 274 | |
275 | { | 275 | #contenu, footer |
276 | max-width: 540px; | 276 | { |
277 | font-size: 90%; | 277 | width: 630px; |
278 | } | 278 | margin: auto; |
279 | 279 | } | |
280 | .police_titre | 280 | |
281 | { | 281 | #courriel |
282 | 282 | { | |
283 | font-family: you_are_loved, Arial, sans; | 283 | margin: 0px 35px; |
284 | font-size: 200%; | 284 | } |
285 | color: #ddc97a; | 285 | |
286 | 286 | .zoneVideAdmin, #modeAdmin | |
287 | position: relative; | 287 | { |
288 | top: 20px; | 288 | height: 70px; |
289 | left: 30px; | 289 | } |
290 | } | 290 | } |
291 | 291 | ||
292 | #bienvenue .police_titre | 292 | /* "tablettes" et vieux écrans 640x480 */ |
293 | { | 293 | @media screen and (max-width: 699px) |
294 | font-size: 250%; | 294 | { |
295 | top: 0px; | 295 | #bloc_page |
296 | left: 65px; | 296 | { |
297 | } | 297 | max-width: 540px; |
298 | 298 | font-size: 90%; | |
299 | :target | 299 | } |
300 | { | 300 | |
301 | padding-top: 59px; | 301 | .police_titre |
302 | margin-top: -59px; | 302 | { |
303 | } | 303 | |
304 | 304 | font-family: you_are_loved, Arial, sans; | |
305 | nav | 305 | font-size: 200%; |
306 | { | 306 | color: #ddc97a; |
307 | margin: 0px 30px; | 307 | |
308 | max-width: 480px; | 308 | position: relative; |
309 | } | 309 | top: 20px; |
310 | 310 | left: 30px; | |
311 | li | 311 | } |
312 | { | 312 | |
313 | margin: 4px 10px; | 313 | #bienvenue .police_titre |
314 | } | 314 | { |
315 | 315 | font-size: 250%; | |
316 | header | 316 | top: 0px; |
317 | { | 317 | left: 65px; |
318 | padding-top: 61px; | 318 | } |
319 | } | 319 | |
320 | 320 | :target | |
321 | #bienvenue | 321 | { |
322 | { | 322 | padding-top: 59px; |
323 | background-image: url("accueil/bienvenue_petit.png"); | 323 | margin-top: -59px; |
324 | width: 480px; | 324 | } |
325 | height: 463px; | 325 | |
326 | margin: auto; | 326 | nav |
327 | } | 327 | { |
328 | 328 | margin: 0px 30px; | |
329 | #contenu, footer | 329 | max-width: 480px; |
330 | { | 330 | } |
331 | width: 480px; | 331 | |
332 | margin: auto; | 332 | li |
333 | } | 333 | { |
334 | 334 | margin: 4px 10px; | |
335 | #courriel | 335 | } |
336 | { | 336 | |
337 | margin: 0px 30px; | 337 | header |
338 | } | 338 | { |
339 | 339 | padding-top: 61px; | |
340 | .zoneVideAdmin, #modeAdmin | 340 | } |
341 | { | 341 | |
342 | height: 75px; | 342 | #bienvenue |
343 | } | 343 | { |
344 | 344 | background-image: url("accueil/bienvenue_petit.png"); | |
345 | #modeAdmin | 345 | width: 480px; |
346 | { | 346 | height: 463px; |
347 | max-width: 540px; | 347 | margin: auto; |
348 | } | 348 | } |
349 | } | 349 | |
350 | 350 | #contenu, footer | |
351 | /* on grignote les colonnes autour du texte */ | 351 | { |
352 | @media screen and (max-width: 539px) | 352 | width: 480px; |
353 | { | 353 | margin: auto; |
354 | #modeAdmin div | 354 | } |
355 | { | 355 | |
356 | max-width: 480px; | 356 | #courriel |
357 | margin: 0px; | 357 | { |
358 | border: none; | 358 | margin: 0px 30px; |
359 | } | 359 | } |
360 | #modeAdmin | 360 | |
361 | { | 361 | .zoneVideAdmin, #modeAdmin |
362 | font-size: 90%; | 362 | { |
363 | } | 363 | height: 75px; |
364 | .zoneVideAdmin, #modeAdmin | 364 | } |
365 | { | 365 | |
366 | height: 70px; | 366 | #modeAdmin |
367 | } | 367 | { |
368 | } | 368 | max-width: 540px; |
369 | 369 | } | |
370 | @media screen and (max-width: 479px) | 370 | } |
371 | { | 371 | |
372 | #bloc_page | 372 | /* on grignote les colonnes autour du texte */ |
373 | { | 373 | @media screen and (max-width: 539px) |
374 | max-width: 380px; | 374 | { |
375 | font-size: 85%; | 375 | #modeAdmin div |
376 | } | 376 | { |
377 | 377 | max-width: 480px; | |
378 | .police_titre | 378 | margin: 0px; |
379 | { | 379 | border: none; |
380 | 380 | } | |
381 | font-family: you_are_loved, Arial, sans; | 381 | #modeAdmin |
382 | font-size: 150%; | 382 | { |
383 | color: #ddc97a; | 383 | font-size: 90%; |
384 | 384 | } | |
385 | position: relative; | 385 | .zoneVideAdmin, #modeAdmin |
386 | top: 13px; | 386 | { |
387 | left: 18px; | 387 | height: 70px; |
388 | } | 388 | } |
389 | 389 | } | |
390 | #bienvenue .police_titre | 390 | |
391 | { | 391 | @media screen and (max-width: 479px) |
392 | font-size: 200%; | 392 | { |
393 | top: 0px; | 393 | #bloc_page |
394 | left: 25px; | 394 | { |
395 | } | 395 | max-width: 380px; |
396 | 396 | font-size: 85%; | |
397 | :target | 397 | } |
398 | { | 398 | |
399 | padding-top: 56px; | 399 | .police_titre |
400 | margin-top: -56px; | 400 | { |
401 | } | 401 | |
402 | 402 | font-family: you_are_loved, Arial, sans; | |
403 | nav | 403 | font-size: 150%; |
404 | { | 404 | color: #ddc97a; |
405 | margin: 0px 30px; | 405 | |
406 | max-width: 320px; | 406 | position: relative; |
407 | } | 407 | top: 13px; |
408 | 408 | left: 18px; | |
409 | li | 409 | } |
410 | { | 410 | |
411 | margin: 0px 10px; | 411 | #bienvenue .police_titre |
412 | } | 412 | { |
413 | 413 | font-size: 200%; | |
414 | header | 414 | top: 0px; |
415 | { | 415 | left: 25px; |
416 | padding-top: 60px; | 416 | } |
417 | } | 417 | |
418 | 418 | :target | |
419 | #bienvenue | 419 | { |
420 | { | 420 | padding-top: 56px; |
421 | background-image: url("accueil/bienvenue_mini.png"); | 421 | margin-top: -56px; |
422 | width: 320px; | 422 | } |
423 | height: 316px; | 423 | |
424 | } | 424 | nav |
425 | 425 | { | |
426 | #contenu, footer | 426 | margin: 0px 30px; |
427 | { | 427 | max-width: 320px; |
428 | width: 320px; | 428 | } |
429 | margin: auto; | 429 | |
430 | } | 430 | li |
431 | 431 | { | |
432 | #courriel | 432 | margin: 0px 10px; |
433 | { | 433 | } |
434 | margin: 0px 20px; | 434 | |
435 | } | 435 | header |
436 | 436 | { | |
437 | #courriel * | 437 | padding-top: 60px; |
438 | { | 438 | } |
439 | max-width: 180px; | 439 | |
440 | } | 440 | #bienvenue |
441 | 441 | { | |
442 | .zoneVideAdmin, #modeAdmin | 442 | background-image: url("accueil/bienvenue_mini.png"); |
443 | { | 443 | width: 320px; |
444 | height: 65px; | 444 | height: 316px; |
445 | } | 445 | } |
446 | 446 | ||
447 | #modeAdmin | 447 | #contenu, footer |
448 | { | 448 | { |
449 | max-width: 380px; | 449 | width: 320px; |
450 | } | 450 | margin: auto; |
451 | 451 | } | |
452 | #modeAdmin div | 452 | |
453 | { | 453 | #courriel |
454 | /*margin: 5px;*/ | 454 | { |
455 | } | 455 | margin: 0px 20px; |
456 | } | 456 | } |
457 | 457 | ||
458 | /* spécialement pour les petits smartphones*/ | 458 | #courriel * |
459 | @media screen and (max-width: 379px) | 459 | { |
460 | { | 460 | max-width: 180px; |
461 | .zoneVideAdmin, #modeAdmin | 461 | } |
462 | { | 462 | |
463 | height: 80px; | 463 | .zoneVideAdmin, #modeAdmin |
464 | } | 464 | { |
465 | 465 | height: 65px; | |
466 | #modeAdmin | 466 | } |
467 | { | 467 | |
468 | font-size: 95%; | 468 | #modeAdmin |
469 | padding: 0px; | 469 | { |
470 | } | 470 | max-width: 380px; |
471 | #modeAdmin>p | 471 | } |
472 | { | 472 | |
473 | font-size: 90%; | 473 | #modeAdmin div |
474 | margin: 3px; | 474 | { |
475 | } | 475 | /*margin: 5px;*/ |
476 | 476 | } | |
477 | #modeAdmin div | 477 | } |
478 | { | 478 | |
479 | max-width: 320px; | 479 | /* spécialement pour les petits smartphones*/ |
480 | } | 480 | @media screen and (max-width: 379px) |
481 | #modeAdmin>div p | 481 | { |
482 | { | 482 | .zoneVideAdmin, #modeAdmin |
483 | margin: 0px 5px; | 483 | { |
484 | } | 484 | height: 80px; |
485 | } | 485 | } |
486 | |||
487 | #modeAdmin | ||
488 | { | ||
489 | font-size: 95%; | ||
490 | padding: 0px; | ||
491 | } | ||
492 | #modeAdmin>p | ||
493 | { | ||
494 | font-size: 90%; | ||
495 | margin: 3px; | ||
496 | } | ||
497 | |||
498 | #modeAdmin div | ||
499 | { | ||
500 | max-width: 320px; | ||
501 | } | ||
502 | #modeAdmin>div p | ||
503 | { | ||
504 | margin: 0px 5px; | ||
505 | } | ||
506 | } | ||