summaryrefslogtreecommitdiff
path: root/public/menu.css
diff options
context:
space:
mode:
authorpolo <ordipolo@gmx.fr>2022-02-17 18:13:00 +0100
committerpolo <ordipolo@gmx.fr>2022-02-17 18:13:00 +0100
commit787d03e48471ba62cd830379428f04d996f0b74b (patch)
treee9f98c7b9288c4530b50985688dd82622106ba2d /public/menu.css
parent29df6f1362745eabf4fbcaedf309eb63795152fa (diff)
downloadmelaine-787d03e48471ba62cd830379428f04d996f0b74b.zip
model update
Diffstat (limited to 'public/menu.css')
-rw-r--r--public/menu.css678
1 files changed, 339 insertions, 339 deletions
diff --git a/public/menu.css b/public/menu.css
index 5ae1b5c..0e17e34 100644
--- a/public/menu.css
+++ b/public/menu.css
@@ -1,339 +1,339 @@
1/* public/menu.css */ 1/* public/menu.css */
2 2
3.police_titre 3.police_titre
4{ 4{
5 color: #e8c5c0; 5 color: #e8c5c0;
6} 6}
7 7
8#contenu 8#contenu
9{ 9{
10 display: flex; 10 display: flex;
11 justify-content: space-between; 11 justify-content: space-between;
12} 12}
13 13
14#colonne1 14#colonne1
15{ 15{
16 display: flex; 16 display: flex;
17 flex-wrap: wrap; 17 flex-wrap: wrap;
18 flex-direction: column-reverse; 18 flex-direction: column-reverse;
19} 19}
20 20
21#colonne2 21#colonne2
22{ 22{
23 display: flex; 23 display: flex;
24 flex-wrap: wrap; 24 flex-wrap: wrap;
25 align-items: flex-end; 25 align-items: flex-end;
26 flex-direction: column; 26 flex-direction: column;
27} 27}
28 28
29#pommes 29#pommes
30{ 30{
31 position: relative; 31 position: relative;
32 left: 3px; 32 left: 3px;
33} 33}
34 34
35#mon_blog 35#mon_blog
36{ 36{
37 margin: 0px 35px; 37 margin: 0px 35px;
38} 38}
39 39
40 40
41@media screen and (min-width: 700px) 41@media screen and (min-width: 700px)
42{ 42{
43 #titre 43 #titre
44 { 44 {
45 width: 630px; 45 width: 630px;
46 height: 171px; 46 height: 171px;
47 background-image: url("mouette.png"); 47 background-image: url("mouette.png");
48 } 48 }
49 49
50 #contenu 50 #contenu
51 { 51 {
52 position: relative; 52 position: relative;
53 bottom: 15px; 53 bottom: 15px;
54 } 54 }
55 55
56 #colonne1, #colonne2 56 #colonne1, #colonne2
57 { 57 {
58 height: 588px; 58 height: 588px;
59 } 59 }
60 60
61 /* pour IE, 61 /* pour IE,
62 indique la bonne taille du bloc pour que la colonne 2 se place correctement */ 62 indique la bonne taille du bloc pour que la colonne 2 se place correctement */
63 #colonne1 63 #colonne1
64 { 64 {
65 min-width: 310px; 65 min-width: 310px;
66 } 66 }
67 67
68 #pochette 68 #pochette
69 { 69 {
70 background-image: url("menu/pochette.png"); 70 background-image: url("menu/pochette.png");
71 width: 308px; 71 width: 308px;
72 height: 271px; 72 height: 271px;
73 } 73 }
74 74
75 #fille_qui_tombe 75 #fille_qui_tombe
76 { 76 {
77 background-image: url("menu/fille_qui_tombe.jpg"); 77 background-image: url("menu/fille_qui_tombe.jpg");
78 width: 208px; 78 width: 208px;
79 height: 163px; 79 height: 163px;
80 margin: 5px 0px; 80 margin: 5px 0px;
81 } 81 }
82 82
83 #canoe 83 #canoe
84 { 84 {
85 background-image: url("menu/canoe.png"); 85 background-image: url("menu/canoe.png");
86 width: 207px; 86 width: 207px;
87 height: 144px; 87 height: 144px;
88 } 88 }
89 89
90 #cavalier 90 #cavalier
91 { 91 {
92 background-image: url("menu/cavalier.jpg"); 92 background-image: url("menu/cavalier.jpg");
93 width: 159px; 93 width: 159px;
94 height: 312px; 94 height: 312px;
95 position: relative; 95 position: relative;
96 right: 97px; 96 right: 97px;
97 } 97 }
98 98
99 #pommes 99 #pommes
100 { 100 {
101 background-image: url("menu/pommes.jpg"); 101 background-image: url("menu/pommes.jpg");
102 width: 59px; 102 width: 59px;
103 height: 97px; 103 height: 97px;
104 position: relative; 104 position: relative;
105 bottom: 3px; 105 bottom: 3px;
106 } 106 }
107 107
108 #sirene 108 #sirene
109 { 109 {
110 background-image: url("menu/sirene.jpg"); 110 background-image: url("menu/sirene.jpg");
111 width: 320px; 111 width: 320px;
112 height: 174px; 112 height: 174px;
113 } 113 }
114 114
115 #mouette_ocean 115 #mouette_ocean
116 { 116 {
117 background-image: url("menu/mouette_ocean.jpg"); 117 background-image: url("menu/mouette_ocean.jpg");
118 width: 257px; 118 width: 257px;
119 height: 171px; 119 height: 171px;
120 margin: 5px 0px; 120 margin: 5px 0px;
121 } 121 }
122 122
123 #blonde 123 #blonde
124 { 124 {
125 background-image: url("menu/blonde.jpg"); 125 background-image: url("menu/blonde.jpg");
126 width: 257px; 126 width: 257px;
127 height: 233px; 127 height: 233px;
128 } 128 }
129 129
130 #hey_ho 130 #hey_ho
131 { 131 {
132 width: 69px; 132 width: 69px;
133 height: 154px; 133 height: 154px;
134 position: relative; 134 position: relative;
135 right: 401px; 135 right: 401px;
136 top: 107px; 136 top: 107px;
137 } 137 }
138} 138}
139 139
140@media screen and (max-width: 699px) 140@media screen and (max-width: 699px)
141{ 141{
142 #titre 142 #titre
143 { 143 {
144 width: 480px; 144 width: 480px;
145 height: 131px; 145 height: 131px;
146 background-image: url("mouette_petit.png"); 146 background-image: url("mouette_petit.png");
147 margin: auto; 147 margin: auto;
148 } 148 }
149 149
150 #contenu 150 #contenu
151 { 151 {
152 position: relative; 152 position: relative;
153 bottom: 12px; 153 bottom: 12px;
154 } 154 }
155 155
156 #colonne1, #colonne2 156 #colonne1, #colonne2
157 { 157 {
158 height: 447px; 158 height: 447px;
159 } 159 }
160 160
161 /* pour IE, 161 /* pour IE,
162 indique la bonne taille du bloc pour que la colonne 2 se place correctement */ 162 indique la bonne taille du bloc pour que la colonne 2 se place correctement */
163 #colonne1 163 #colonne1
164 { 164 {
165 min-width: 237px; 165 min-width: 237px;
166 } 166 }
167 167
168 #pochette 168 #pochette
169 { 169 {
170 background-image: url("menu/pochette_petit.png"); 170 background-image: url("menu/pochette_petit.png");
171 width: 234px; 171 width: 234px;
172 height: 206px; 172 height: 206px;
173 } 173 }
174 174
175 #fille_qui_tombe 175 #fille_qui_tombe
176 { 176 {
177 background-image: url("menu/fille_qui_tombe_petit.jpg"); 177 background-image: url("menu/fille_qui_tombe_petit.jpg");
178 width: 158px; 178 width: 158px;
179 height: 124px; 179 height: 124px;
180 margin: 4px 0px; 180 margin: 4px 0px;
181 } 181 }
182 182
183 #canoe 183 #canoe
184 { 184 {
185 background-image: url("menu/canoe_petit.png"); 185 background-image: url("menu/canoe_petit.png");
186 width: 157px; 186 width: 157px;
187 height: 109px; 187 height: 109px;
188 } 188 }
189 189
190 #cavalier 190 #cavalier
191 { 191 {
192 background-image: url("menu/cavalier_petit.jpg"); 192 background-image: url("menu/cavalier_petit.jpg");
193 width: 121px; 193 width: 121px;
194 height: 237px; 194 height: 237px;
195 position: relative; 195 position: relative;
196 right: 73px; 196 right: 73px;
197 } 197 }
198 198
199 #pommes 199 #pommes
200 { 200 {
201 background-image: url("menu/pommes_petit.jpg"); 201 background-image: url("menu/pommes_petit.jpg");
202 width: 45px; 202 width: 45px;
203 height: 74px; 203 height: 74px;
204 position: relative; 204 position: relative;
205 bottom: 2px; 205 bottom: 2px;
206 } 206 }
207 207
208 #sirene 208 #sirene
209 { 209 {
210 background-image: url("menu/sirene_petit.jpg"); 210 background-image: url("menu/sirene_petit.jpg");
211 width: 243px; 211 width: 243px;
212 height: 132px; 212 height: 132px;
213 } 213 }
214 214
215 #mouette_ocean 215 #mouette_ocean
216 { 216 {
217 background-image: url("menu/mouette_ocean_petit.jpg"); 217 background-image: url("menu/mouette_ocean_petit.jpg");
218 width: 195px; 218 width: 195px;
219 height: 130px; 219 height: 130px;
220 margin: 4px 0px; 220 margin: 4px 0px;
221 } 221 }
222 222
223 #blonde 223 #blonde
224 { 224 {
225 background-image: url("menu/blonde_petit.jpg"); 225 background-image: url("menu/blonde_petit.jpg");
226 width: 195px; 226 width: 195px;
227 height: 177px; 227 height: 177px;
228 } 228 }
229 229
230 #hey_ho 230 #hey_ho
231 { 231 {
232 width: 53px; 232 width: 53px;
233 height: 117px; 233 height: 117px;
234 position: relative; 234 position: relative;
235 right: 306px; 235 right: 306px;
236 top: 82px; 236 top: 82px;
237 } 237 }
238} 238}
239 239
240@media screen and (max-width: 479px) 240@media screen and (max-width: 479px)
241{ 241{
242 #titre 242 #titre
243 { 243 {
244 width: 320px; 244 width: 320px;
245 height: 88px; 245 height: 88px;
246 background-image: url("mouette_mini.png"); 246 background-image: url("mouette_mini.png");
247 margin: auto; 247 margin: auto;
248 } 248 }
249 249
250 #contenu 250 #contenu
251 { 251 {
252 position: relative; 252 position: relative;
253 bottom: 8px; 253 bottom: 8px;
254 } 254 }
255 255
256 #colonne1, #colonne2 256 #colonne1, #colonne2
257 { 257 {
258 height: 298px; 258 height: 298px;
259 } 259 }
260 260
261 /* pour IE, 261 /* pour IE,
262 indique la bonne taille du bloc pour que la colonne 2 se place correctement */ 262 indique la bonne taille du bloc pour que la colonne 2 se place correctement */
263 #colonne1 263 #colonne1
264 { 264 {
265 min-width: 158px; 265 min-width: 158px;
266 } 266 }
267 267
268 #pochette 268 #pochette
269 { 269 {
270 background-image: url("menu/pochette_mini.png"); 270 background-image: url("menu/pochette_mini.png");
271 width: 156px; 271 width: 156px;
272 height: 137px; 272 height: 137px;
273 } 273 }
274 274
275 #fille_qui_tombe 275 #fille_qui_tombe
276 { 276 {
277 background-image: url("menu/fille_qui_tombe_mini.jpg"); 277 background-image: url("menu/fille_qui_tombe_mini.jpg");
278 width: 105px; 278 width: 105px;
279 height: 82px; 279 height: 82px;
280 margin: 3px 0px; 280 margin: 3px 0px;
281 } 281 }
282 282
283 #canoe 283 #canoe
284 { 284 {
285 background-image: url("menu/canoe_mini.png"); 285 background-image: url("menu/canoe_mini.png");
286 width: 105px; 286 width: 105px;
287 height: 73px; 287 height: 73px;
288 } 288 }
289 289
290 #cavalier 290 #cavalier
291 { 291 {
292 background-image: url("menu/cavalier_mini.jpg"); 292 background-image: url("menu/cavalier_mini.jpg");
293 width: 80px; 293 width: 80px;
294 height: 158px; 294 height: 158px;
295 position: relative; 295 position: relative;
296 right: 48px; 296 right: 48px;
297 } 297 }
298 298
299 #pommes 299 #pommes
300 { 300 {
301 background-image: url("menu/pommes_mini.jpg"); 301 background-image: url("menu/pommes_mini.jpg");
302 width: 30px; 302 width: 30px;
303 height: 49px; 303 height: 49px;
304 position: relative; 304 position: relative;
305 bottom: 2px; 305 bottom: 2px;
306 left: 2px; 306 left: 2px;
307 } 307 }
308 308
309 #sirene 309 #sirene
310 { 310 {
311 background-image: url("menu/sirene_mini.jpg"); 311 background-image: url("menu/sirene_mini.jpg");
312 width: 162px; 312 width: 162px;
313 height: 88px; 313 height: 88px;
314 } 314 }
315 315
316 #mouette_ocean 316 #mouette_ocean
317 { 317 {
318 background-image: url("menu/mouette_ocean_mini.jpg"); 318 background-image: url("menu/mouette_ocean_mini.jpg");
319 width: 130px; 319 width: 130px;
320 height: 86px; 320 height: 86px;
321 margin: 3px 0px; 321 margin: 3px 0px;
322 } 322 }
323 323
324 #blonde 324 #blonde
325 { 325 {
326 background-image: url("menu/blonde_mini.jpg"); 326 background-image: url("menu/blonde_mini.jpg");
327 width: 130px; 327 width: 130px;
328 height: 118px; 328 height: 118px;
329 } 329 }
330 330
331 #hey_ho 331 #hey_ho
332 { 332 {
333 width: 36px; 333 width: 36px;
334 height: 77px; 334 height: 77px;
335 position: relative; 335 position: relative;
336 right: 204px; 336 right: 204px;
337 top: 56px; 337 top: 56px;
338 } 338 }
339} 339}
generated by cgit v1.2.3 (git 2.25.1) at 2025-08-19 07:45:25 +0000