701de9b1d08480c4966d99bb15977bbf685c200b
[pompage.git] / css / yopyop.css
1 * {
2 margin: 0;
3 padding: 0;
4 border-width: 0;
5 }
6
7 html {
8 background-color: #8DDD83;
9 height: auto;
10 font: normal 12pt Arial, Verdana, Helvetica, sans-serif;
11 }
12
13 a {
14 text-decoration: none;
15 cursor: pointer;
16 }
17 a:link {
18 color: #51874A;
19 }
20 a:visited {
21 color: #51874A;
22 }
23 a:hover {
24 color: #5DDF4C;
25 }
26 a:active {
27 color: #5DDF4C;
28 }
29
30 body {
31 width: 90%;
32 height: auto;
33 margin-left: auto;
34 margin-right: auto;
35 margin-top: 0px;
36 text-align: left;
37 }
38
39 h1 {
40 font-size: 20pt;
41 font-style: italic;
42 font-weight: bold;
43 margin-left: 40px;
44 }
45
46 td {
47 vertical-align:top;
48 }
49
50 div.entete {
51 width: 90%;
52 position: fixed;
53 z-index: 5;
54 background-color: #65A35D;
55 height: 50px;
56 color: #8DDD83;
57 -moz-border-radius: 0px 0px 20px 20px;
58 min-width: 630px;
59 }
60
61 div.entete img {
62 position: absolute;
63 left: 180px;
64 top: -3px;
65 }
66
67 div.entete h1 {
68 float: left;
69 margin-top: 8px;
70 }
71
72 div.entete div#nbFilms {
73 position: absolute;
74 left: 280px;
75 top: 33px;
76 font-size: 9pt;
77 color: black;
78 }
79
80 div.entete form {
81 float: right;
82 padding-right: 10px;
83 padding-top: 5px;
84 margin-right: 30px;
85 }
86
87 div.entete form input {
88 font-size: 16pt;
89 background-color: #B1F1A9;
90 margin: 0px;
91 padding: 0px;
92 }
93
94 div.entete form button {
95 position: relative;
96 height: 25px;
97 width: 25px;
98 border: 0px;
99 background-color: #B1F1A9;
100 background-image: url(../img/clear.png);
101 background-position: center;
102 background-repeat: no-repeat;
103 vertical-align: top;
104 }
105
106 div.entete form p {
107 color: black;
108 font-size: 7pt;
109 margin-top: 1px;
110 }
111
112 div.entete form p label {
113 margin-right: 4px;
114 }
115
116 div.entete form input[type='checkbox'] {
117 border:2px solid red;
118 }
119
120 div.contenu {
121 padding-top: 50px;
122 min-width: 630px;
123 }
124
125 table#liste {
126 width: 100%;
127 border-spacing: 0px 0px;
128 margin-bottom:70px;
129 margin-top: 10px;
130 }
131
132 table#liste .listeFichiers img {
133 position: absolute;
134 left: -9px;
135 top: -18px;
136 }
137
138 table#liste td {
139 background-color: #7BC671;
140 color: #20531A;
141 padding: 3px;
142 }
143
144 table#liste td.titre {
145 font-weight: bold;
146 cursor: pointer;
147 }
148
149 table#liste td.annee {
150 text-align: right;
151 width: 50px;
152 }
153
154 table#liste td.duree {
155 text-align: right;
156 width: 80px;
157 }
158
159 table#liste td.lien {
160 text-align: center;
161 width: 15px;
162 }
163
164 table#liste td.lien div {
165 position: absolute;
166 }
167
168 table#liste td.lien a {
169 position: absolute;
170 width: 15px;
171 height: 19px;
172 display: block;
173 z-index: 1;
174 background-image: url(../img/pomme1.png)
175 }
176
177 table#liste td.lien a:hover {
178 width: 30px;
179 height: 38px;
180 left: -7px;
181 top: -9px;
182 z-index: 10;
183 background-image: url(../img/pomme2.png)
184 }
185
186 table#liste td.fichier {
187 text-align: center;
188 width: 12px;
189 }
190
191 table#liste td.fichier div {
192 position: absolute;
193 }
194
195 table#liste td.fichier div ul {
196 display: block;
197 position: absolute;
198 left: 5px;
199 top: 3px;
200 padding: 2px;
201 }
202
203 table#liste td.fichier div ul:hover {
204 z-index: 4;
205 background-color: #4F8749;
206 }
207
208 table#liste td.fichier div ul > a {
209 position: absolute;
210 left: -3px;
211 top: -4px;
212 width: 12px;
213 height: 20px;
214 display: block;
215 z-index: 3;
216 background-image: url(../img/poire1.png);
217 }
218
219 table#liste td.fichier div ul:hover > a {
220 width: 24px;
221 height: 40px;
222 left: -8px;
223 top: -14px;
224 z-index: 10;
225 background-image: url(../img/poire2.png);
226 }
227
228 table#liste td.fichier div ul li {
229 display: none;
230 }
231
232 table#liste td.fichier div ul li a {
233 color: #8DDD83;
234 }
235
236 table#liste td.fichier div ul li a:hover {
237 color: #BFF6B8;
238 }
239
240 table#liste td.fichier div ul:hover li {
241 display: block;
242 z-index: 4;
243 padding: 3px 8px 3px 17px;
244 text-align: left;
245 white-space: nowrap;
246 color: #8DDD83;
247 background-color: #2D5728;
248 font-size: 10pt;
249 }
250
251 table#liste td.fichier div ul:hover li:hover {
252 background-color: #43773D;
253 }
254
255 /* Pourquoi ca ne marche pas ? */
256 /*
257 table#liste td.fichier div ul:hover li:first-child {
258 margin-top: 10px;
259 }*/
260
261 table#liste td.titre:hover {
262 background-color: #B1F1A9;
263 padding: 3px;
264 }
265
266 table#liste td.detail {
267 background-color: #8DDD83;
268 padding: 0px 0px 0px 0px;
269 }
270
271 table#liste table.detail {
272 display:none;
273 width:100%;
274 padding-bottom: 10px;
275 border-spacing: 0px 0px;
276 }
277
278 table#liste table.detail td {
279 padding: 3px;
280 background-color: #B1F1A9;
281 }
282
283 table#liste table.detail td.titreDetail {
284 font-weight: bold;
285 }
286
287 div.pied {
288 position: fixed;
289 bottom: 0px;
290 height: 14px;
291 width: 90%;
292 background-image: url(../img/collines.png);
293 background-repeat: repeat-x;
294 z-index: 5;
295 min-width: 630px;
296 padding-top: 50px;
297 }
298 div.pied p {
299 background-color: #64A25C;
300 font-size: 8pt;
301 padding-left: 10px;
302 }
303 div.pied a {
304 margin-left: 10px;
305 }
306