NEW FEATURE: display if someone is sick during the init phase
[e-DoKo.git] / css / standard002.css
1 .header {
2   background-color: white;
3   text-align:       center;
4   height:           4em;
5   border-bottom:    3px solid gray;
6 }
7
8 .lastlogin {
9   position:absolute;
10   font-size:smaller;
11   top:0;
12   left:0;
13 }
14
15 .main {
16   min-height: 40em;
17 }
18
19 .footer {
20   margin:0;
21   margin-top:0.3em;
22   padding:0;
23   border-top: 2px solid #444;
24   font-size:smaller;
25   clear:both;
26 }
27 .footer .right { float:right; }
28 .footer .left  { float:left; }
29
30 .status {
31   position:absolute;
32   right:1em;
33   top:0.1em;
34   font-size: smaller;
35 }
36
37 .joingame,.sickness,.poverty,.total,.message {
38  position: absolute;
39  background-color: #fff;
40  width: 20%;
41  top:19em;
42  left:40%;
43  right:40%;
44  text-align: center;
45  z-index:22
46 }
47
48
49 .total .re {
50  position: absolute;
51  left: -4em;
52  top:8em;
53  background-color: #fff;
54  z-index:15;
55 }
56 .total .contra {
57  position: absolute;
58  right: -4em;
59  top:8em;
60  background-color: #fff;
61  z-index:15;
62 }
63
64 .rules {
65 margin-top:20em;
66 }
67
68
69 .card {
70   position:absolute;
71   z-index:20;
72   top:18em;
73   left:28em;
74   text-align:center;
75   background-color:white;
76   border:2px solid gray;
77 }
78 .card img { width:8em; }
79
80 /* display the table and the names */
81 div.table {
82   position:absolute;
83   width:100%;
84   height:35em;
85   margin:0;
86   left:0;
87   padding:0;
88 /*  border: 3px solid blue; */
89   top: 8.2em;
90   text-align:center;
91 }
92
93 div.table img.table {
94   position:absolute;
95   width:25%;
96   top:20%;
97   height:22em;
98   left:37.5%;
99   z-indexk:9;
100   display: block;
101   margin:0;
102   padding:0;
103 }
104 div.table div {
105   /*background-color:green;*/
106   position:absolute;
107   width:12.5%;
108   text-align:center;
109   z-index:20;
110 }
111 div.table div img{
112   /*background-color:green;*/
113   width:20%;
114 }
115
116 div.table div.table0 {
117   top:45%;
118   right:62.5%;
119 }
120 div.table div.table1 {
121   top:5%;
122   left:43.75%;
123 }
124 div.table div.table2 {
125   top:45%;
126   left:62.5%;
127 }
128 div.table div.table3 {
129   bottom:5%;
130   left: 43.75%;
131 }
132
133 ul.tricks {
134   position:relative;
135   list-style:none;
136   margin:3px;
137   padding:0;
138   padding-bottom:3px;
139   text-align:center;
140   border-bottom:1px solid #444;
141 }
142 ul.tricks a { text-decoration:none; color:#000;}
143 ul.tricks li {
144   /*background-color:blue;*/
145   margin:0.1em;
146   padding:0.2em 0.5em;
147   display:inline;
148 }
149 ul.tricks li.old {  background-color:#fff; }
150 ul.tricks li:hover {  background-color: #bbb;}
151 ul.tricks li.nohighlight:hover {  background-color: #fff;}
152
153 ul.tricks li div.trick {
154   position:absolute;
155   width:100%;
156   height:35em;
157   top:1.2em;
158   left: 0;
159   margin:0;
160   padding:0;
161 /*  border: 2px solid red;*/
162   display:block;
163 }
164 ul.tricks li div.trick {
165   display:none;
166 }
167
168 ul.tricks li div.trick img.arrow {
169   position:absolute;
170   margin:0;
171   padding:0;
172 /*  border: 5px solid blue;*/
173   text-align:center;
174   width:16%;
175   height:16em;
176   left:42%;
177   right:42%;
178   top:9em;
179   z-index:8;
180 }
181
182 hr {clear:both;}
183
184 /*ul.tricks li:hover div.table{ display:block; }*/
185
186 ul.tricks li div div.card0 img,ul.tricks li div div.card0 .score, .vorbehalt0 {
187   position:absolute;
188   margin:0;
189   padding:0;
190   /*border: 1px solid red;*/
191   top: 40%;
192   left:37.5%;
193   right:56x.5%;
194   width:6%;
195   z-index:30;
196 }
197 ul.tricks li div div.card0 span.comment{
198   position:absolute;
199   margin:0;
200   padding:0;
201   /*border: 1px solid red;*/
202   top: 5%;
203   right:66.5%;
204   left:17.5%;
205   width:16%;
206 }
207 ul.tricks li div div.card1 img,ul.tricks li div div.card1 .score, .vorbehalt1 {
208   position:absolute;
209   margin:0;
210   padding:0;
211   /*border: 1px solid red;*/
212   top: 20%;
213   left:47%;
214   right:47%;
215   width:6%;
216   text-align:center;
217   z-index:30;
218 }
219 ul.tricks li div div.card1 span.comment{
220   position:absolute;
221   margin:0;
222   padding:0;
223   /*border: 1px solid red;*/
224   top: 5%;
225   left:66.5%;
226   right:17.5%;
227   width:16%;
228   text-align:center;
229 }
230 ul.tricks li div div.card2 img,ul.tricks li div div.card2 .score, .vorbehalt2{
231   position:absolute;
232   margin:0;
233   padding:0;
234   /*border: 1px solid red;*/
235   top: 40%;
236   right:37.5%;
237   left:56x.5%;
238   width:6%;
239   z-index:30;
240 }
241 ul.tricks li div div.card2 span.comment{
242   position:absolute;
243   margin:0;
244   padding:0;
245   /*border: 1px solid red;*/
246   top: 80%;
247   left:66.5%;
248   right:17.5%;
249   width:16%;
250   text-align:center;
251 }
252 ul.tricks li div div.card3 img,ul.tricks li div div.card3 .score, .vorbehalt3{
253   position:absolute;
254   margin:0;
255   padding:0;
256   /*border: 1px solid red;*/
257   bottom: 20%;
258   left:47%;
259   right:47%;
260   width:6%;
261   text-align:center;
262   z-index:30;
263 }
264 ul.tricks li div div.card3 span.comment{
265   position:absolute;
266   margin:0;
267   padding:0;
268   /*border: 1px solid red;*/
269   top: 80%;
270   right:66.5%;
271   left:17.5%;
272   width:16%;
273 }
274
275 span.comment{
276  border: 3px solid green;
277 }
278
279 ul.tricks li div div span.comment span{
280   display:block;
281   text-align:left;
282   border-top:1px solid green;
283 }
284
285 .mycards {
286   margin:0;
287   margin-top:34.5em;
288   padding:0;
289   border:1px solid red;
290   background-color:yellow;
291 }
292
293 .mycards img {
294   height:6em;
295 }
296
297 .exchange {
298   clear:both;
299   margin:0;
300   padding:0;
301   border:1px solid red;
302   background-color:yellow;
303 }
304
305 .exchange img {
306   height:6em;
307 }
308
309 .line{
310   clear:both;
311   border-top:2px solid gray;
312   margin:0;
313   padding:0;
314 }
315
316 .session {
317   border-bottom:1px solid black;
318   text-align:center;
319 }
320
321 .gameinfo, .useroptions {
322   position:absolute;
323   top:10em;
324   right:0em;
325   margin:1em;
326   margin-top:0em;
327   margin-right:0em;
328
329   width:12em;
330
331   border-top:    2px solid gray;
332   border-left:   2px solid gray;
333   border-bottom: 2px solid gray;
334
335   padding:0.3em;
336
337   background-color: #eee;
338 }
339
340 .usermenu {
341   position:absolute;
342   top:10em;
343   left:0;
344   margin:1em;
345   margin-top:0em;
346   margin-left:0em;
347
348   width: 12em;
349
350   border-top:    2px solid gray;
351   border-right:  2px solid gray;
352   border-bottom: 2px solid gray;
353
354   padding:0.3em;
355
356   background-color: #eee;
357 }
358
359 .notes {
360   position:absolute;
361   top:27em;
362   left:0;
363   margin:1em;
364   margin-top:0em;
365   margin-left:0em;
366
367   width: 12em;
368
369   border-top:    2px solid gray;
370   border-right:  2px solid gray;
371   border-bottom: 2px solid gray;
372
373   padding:0.3em;
374
375   background-color: #efefef;
376
377   height:10em;
378   overflow: auto;
379 }
380
381 .user { margin-left:25%;margin-right:25%; }
382
383 .over {
384   text-align:center;
385   margin-bottom:0.1em;
386 }
387
388 .submitbutton {
389   border:0;
390   background-color: #efe;
391 }
392
393 .submitbutton:hover {
394   background-color:#afa;
395 }
396
397
398 .cardinput {
399   display:inline;
400   position:relative;
401   border: 1px solid black;
402 }
403
404 .cardinput img {
405   width: 4em;
406 }
407
408 .cardinput:hover{
409   background-color:red;
410 }
411
412 div span img.button {
413   width: 2em;
414 }
415
416 .gamestatuspre {
417    padding: 0 0.3em;
418
419     background-color: #fd8901;
420 }
421 .gamestatusover {
422    padding:0 0.3em;
423   background-color: #f82c20 ;
424 }
425 .gamestatusplay {
426   padding:0 0.3em;
427   background-color: #15de26;
428 }
429
430 .scoretable{
431   height:10em;
432   overflow: auto;
433 }
434 table.score {
435   width:10em;
436   border-collapse:collapse;
437 }
438
439 .bigger {
440   font-size:larger;
441 }