IE6 not understand grey color, change all to gray
[brisk.git] / web / briskin5 / briskin5.css
1 /*
2  *  brisk - briskin5.css
3  *
4  *  Copyright (C) 2006-2011 Matteo Nastasi
5  *                          mailto: nastasi@alternativeoutput.it 
6  *                                  matteo.nastasi@milug.org
7  *                          web: http://www.alternativeoutput.it
8  *
9  * This program is free software; you can redistribute it and/or modify
10  * it under the terms of the GNU General Public License as published by
11  * the Free Software Foundation; either version 2 of the License, or
12  * (at your option) any later version.
13  *
14  * This program is distributed in the hope that it will be useful, but
15  * WITHOUT ANY WARRANTY; without even the implied warranty of
16  * MERCHANTABLILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
17  * General Public License for more details. You should have received a
18  * copy of the GNU General Public License along with this program; if
19  * not, write to the Free Software Foundation, Inc, 59 Temple Place -
20  * Suite 330, Boston, MA 02111-1307, USA.
21  *
22  */
23
24 body {
25     background-image: none;
26     background-color: #fafafa;
27     text-align: center;
28 /* inherit from brisk.css
29     background-repeat: no-repeat;
30     background-position: top center;
31     margin:0px;
32
33     font-size: 12px;
34     padding: 0px;
35
36     align: center;
37 */
38 }
39
40 .chattshort {
41     height: 70px;
42     overflow: auto;
43     border: 1px solid gray;
44     vertical-align: text-bottom;
45     text-align: left;
46     /*  font-size: 10pt;*/
47 }
48
49 table.chattshort_table {
50     width: 98%; 
51     margin: auto;
52 }
53
54 .txtt {
55     /*  font-size: 10pt;*/
56 }
57
58 img.tableinfo {
59     position:     absolute; 
60     left:         619;
61     top:          550;
62     border-width: 0px;
63     visibility:   visible;
64 }
65
66 img.tablereload {
67     position:     absolute; 
68     left:         667;
69     top:          550;
70     border-width: 0px;
71     visibility:   visible;
72 }
73
74 img.tableout {
75     position:     absolute; 
76     left:         730;
77     top:          550;
78     border-width: 0px;
79     visibility:   visible;
80 }
81
82 img.card {
83     position:     absolute; 
84     border-style: solid;
85     border-width: 1px;
86     border-color: gray;
87     visibility:   hidden;
88 }
89
90
91 img.astacard {
92     position:     absolute; 
93     /*  visibility:   visible; */
94     border-width: 0px;
95 }
96
97 img.cover {
98     position:     absolute; 
99     border-style: solid;
100     border-width: 1px;
101     border-color: lightgray;
102     visibility:   hidden;
103 }
104
105 .chooseed {
106     /* background-color: yellow; */
107     visibility:   hidden;
108     position:absolute; 
109     width:  200px;
110     height: 200px;
111     top:  250px;
112     left: 300px;
113     z-index: 10;
114 }
115
116 .asta {
117     /* background-color: yellow; */
118     visibility:   hidden;
119     position:     absolute; 
120     width:  200px;
121     height: 200px;
122     top:  250px;
123     left: 300px;
124     z-index: 10;
125 }
126
127 img.seed0 {
128     position:     absolute; 
129     left: 0px;
130     top: 55px;
131     cursor: pointer;
132 }
133
134 img.seed1 {
135     position:     absolute; 
136     left: 43px;
137     top: 55px;
138     cursor: pointer;
139 }
140
141 img.seed2 {
142     position:     absolute; 
143     left: 93px;
144     top: 55px;
145     cursor: pointer;
146 }
147
148 img.seed3 {
149     position:     absolute; 
150     left: 143px;
151     top: 55px;
152     cursor: pointer;
153 }
154
155 .area {
156     display: block;     
157     margin-left: auto;
158     margin-right: auto;
159     position: relative;  
160     text-align: center;
161     width:  800px;
162     height: 600px;
163 }
164
165 .subarea {
166     top: 0px;   
167     text-align: center;
168 }
169
170 .points {
171     /*    position:     relative;  */
172     
173     margin-top: 8px; 
174     padding: 8px;
175     margin-left:auto; 
176     margin-right:auto;
177     margin-bottom: 4px;
178     border-style: solid;
179     border-width: 0px;
180     border-color: black;
181     border-collapse: collapse;
182 }
183
184 .td_points {
185     border-style: solid;
186     border-width: 1px;
187     border-color: black;
188     border-collapse: collapse;
189     display: table-cell;
190     text-align: right;
191     padding: 2px;
192 }
193
194 div.table_commands {
195     display: inline;
196     position: absolute;
197     right: 2px;
198     bottom: 15px;
199 }
200
201 .remark0 { 
202     position:     absolute; 
203     width:  199px;
204     height: 200px;
205     left: 299;
206     top:  249;
207     border-style: solid;
208     border-width: 0px;
209     border-color: green;
210     z-index: 1;
211 }
212
213 .remark1 { 
214     position:     absolute; 
215     width:  199px !important;
216     width:  207px;
217     height: 200px !important;
218     height: 208px;
219     left: 296;
220     top:  246;
221     border-style: solid;
222     border-width: 4px;
223     border-color: green;
224     z-index: 1;
225 }
226
227 .remark2 { 
228     position:     absolute; 
229     width:  199px !important;
230     width:  203px;
231     height: 200px !important;
232     height: 204px;
233     left: 298;
234     top:  248;
235     border-style: solid;
236     border-width: 2px;
237     border-color: green;
238     z-index: 1;
239 }
240
241 .punti {
242     position:     absolute; 
243     width: 68;
244     height: 50;
245     margin-top: 4px;
246     /*
247       border-style: solid;
248       border-width: 1px;
249       border-color: blu;
250     */
251     align: center;
252     text-align: center;
253 }
254
255 .puntifield {
256     /*  position:     absolute;  */
257     align: center;
258     text-align: center;
259 }
260
261 .pubinfo {
262     /*  background-color: red;  */
263     color: gray;
264     visibility: visible;
265     position: absolute;
266     top: 475px;
267     left: 200px;
268     width:  400px;
269     height: 125px;
270 }
271
272 .pubinfo_iscalling {
273     /*  background-color: red;  */
274     color: gray;
275     visibility: visible;
276     position: absolute;
277     top: 475px;
278     left: 200px;
279     width:  396px !important;
280     width:  400px;
281     height: 121px !important;
282     height: 125px;
283     border: 2px solid #66bbff;
284 }
285
286 .public {
287     /* background-color: red;  */
288     visibility: hidden;
289     position: absolute;
290     display: table;
291     top: 450px;
292     left: 300px;
293     width:  200px;
294     height: 100px;
295     overflow: hidden;
296     z-index: 8;
297 }
298
299 .pubacard {
300     border-width: 0px;
301     position: relative;
302     display: block;
303     margin-left: auto;
304     margin-right: auto;
305 }  
306
307 .pubinfo_we {
308     color: gray;
309     visibility: visible;
310     position: absolute;
311     top: 250px;
312     left: 175px;
313     width:  125px;
314     height: 200px;
315 }
316
317 .pubinfo_we_iscalling {
318     color: gray;
319     visibility: visible;
320     position: absolute;
321     top: 250px;
322     left: 175px;
323     width:  121px !important;
324     width:  125px;
325     height: 196px !important;
326     height: 200px;
327     border: 2px solid #66bbff;
328 }
329
330 .public_we {
331     /*  background-color: red;  */
332     visibility: hidden;
333     position: absolute;
334     top: 250px;
335     left: 175px;
336     display: table;
337     width:  125px;
338     height: 200px;
339     overflow: hidden;
340 }
341
342 .pubinfo_nw {
343     /*  background-color: red;  */
344     color: gray;
345     visibility: visible;
346     position: absolute;
347     top: 125px;
348     left: 200px;
349     width:  200px;
350     height: 125px;
351 }
352
353 .pubinfo_nw_iscalling {
354     /*  background-color: red;  */
355     color: gray;
356     visibility: visible;
357     position: absolute;
358     top: 125px;
359     left: 200px;
360     width:  196px !important;
361     width:  200px;
362     height: 121px !important;
363     height: 125px;
364     border: 2px solid #66bbff;
365 }
366
367 .public_nw {
368     /*  background-color: red;   */
369     visibility: hidden;
370     position: absolute;
371     top: 125px;
372     left: 200px;
373     display: table;
374     width:  200px;
375     height: 125px;
376     overflow: hidden;
377 }
378
379 .pubinfo_ne {
380     /*  background-color: red;  */
381     color: gray;
382     visibility: visible;
383     position: absolute;
384     top: 125px;
385     left: 400px;
386     width:  200px;
387     height: 125px;
388 }
389
390 .pubinfo_ne_iscalling {
391     /*  background-color: red;  */
392     color: gray;
393     visibility: visible;
394     position: absolute;
395     top: 125px;
396     left: 400px;
397     width:  196px !important;
398     width:  200px;
399     height: 121px !important;
400     height: 125px;
401     border: 2px solid #66bbff;
402 }
403
404 .public_ne {
405     /*  background-color: red;  */
406     visibility: hidden;
407     position: absolute;
408     top: 125px;
409     left: 400px;
410     display: table;
411     width:  200px;
412     height: 125px;
413     overflow: hidden;
414 }
415
416 .pubinfo_ea {
417     /*  background-color: red; */
418     color: gray;
419     visibility: visible;
420     position: absolute;
421     top: 250px;
422     left: 500px;
423     width:  125px;
424     height: 200px;
425 }
426
427 .pubinfo_ea_iscalling {
428     /*  background-color: red; */
429     color: gray;
430     visibility: visible;
431     position: absolute;
432     top: 250px;
433     left: 500px;
434     width:  121px !important;
435     width:  125px;
436     height: 196px !important;
437     height: 200px;
438     border: 2px solid #66bbff;
439 }
440
441 .public_ea {
442     /*  background-color: red; */
443     visibility: hidden;
444     position: absolute;
445     top: 250px;
446     left: 500px;
447     display: table;
448     width:  125px;
449     height: 200px;
450     overflow: hidden;
451 }
452
453 .vert_midfloat {
454     position: relative;
455 #position: absolute;
456     _top: 50%;
457     left: 0px;
458     width: 100%;
459     display: table-cell;
460     vertical-align: middle;
461 }
462
463 .vert_innfloat {
464 #position: relative;
465 #top: -50%;
466     text-align: center;
467 }
468
469 .vert_innfloat_so {
470     /*  border-style: solid;
471         border-width: 1px;
472         border-color: black;
473
474         background-color: white; */
475 #position: relative;
476 #top: -50%;
477     text-align: center;
478 }
479
480 .pubacard_ea {
481     border-width: 0px;
482     position: relative;
483     display: block;
484     margin-left: auto;
485     margin-right: auto;
486 }  
487
488 .pubacard_ne {
489     border-width: 0px;
490     position: relative;
491     display: block;
492     margin-left: auto;
493     margin-right: auto;
494 }  
495
496 .pubacard_nw {
497     border-width: 0px;
498     position: relative;
499     display: block;
500     margin-left: auto;
501     margin-right: auto;
502 }  
503
504 .pubacard_we {
505     border-width: 0px;
506     position: relative;
507     display: block;
508     margin-left: auto;
509     margin-right: auto;
510 }  
511
512
513 /* CALLER */
514 .caller {
515     background-repeat: no-repeat; 
516     visibility: hidden; 
517     position: absolute;
518     left: 0px;
519     top: 475px;
520     width: 200px;
521     height: 125px;
522 }
523
524 .callerinfo {
525     /*  background-color: red; */
526     /*  visibility: visible; */
527     position: absolute;
528     /*  font-size: 10pt;*/
529     left: 5px;
530     top: 55px;
531     width: 115px;
532     height: 65px;
533 }
534
535 img.callerimg {
536     position:     absolute; 
537     left: 133px;
538     top: 10px;
539 }
540
541