* more style fixes....
[enigma2-plugins.git] / webinterface / src / web-data / style.css
1 body {  
2         text-align:left;
3         vertical-align: top;
4         margin:0px; 
5         font-family:Arial,sans-serif;
6         font-size: 12px;
7         background-color:#EEE;
8         color:#444;
9 }
10
11 a:link { color:#444; }
12 a:visited { color:#444; }
13 a:active { color:#444; }
14
15 hr{ border: 1px solid #BBB; 
16         margin-left: 3px;
17         margin-right: 3px;
18 }
19
20 form{
21         margin: 0px;
22         padding: 0px;
23 }
24
25 /**************************************************************
26 Make the ServiceList Table scrollable**************************
27 ***************************************************************/
28
29 /* define height and width of scrollable area. Add 16px to width for scrollbar          */
30 div.BodyContent {
31         border: 1px solid #000;
32         height: 455px;
33         overflow: auto;
34         margin: 0px 9px 0px;
35         font-size: 12px;
36 }
37
38 div.BodyContentChannellist {
39         clear: both;
40         max-height: 455px;
41         overflow: auto;
42 /*      width: 780px; */
43 }
44
45 .BodyContentChannellist{
46         font-size: 12px;
47 }
48
49 /* Reset overflow value to hidden for all non-IE browsers. */
50 html>body div.BodyContentChannellist {
51         overflow: hidden;
52         width: 780px;
53 }
54
55 /* define width of table. IE browsers only                 */
56 div.BodyContentChannellist table {
57         float: left;
58         width: 760px;
59         max-height: 455px;
60 }
61
62 /* define width of table. Add 16px to width for scrollbar.           */
63 /* All other non-IE browsers.                                        */
64 html>body div.BodyContentChannellist table {
65         width: 780px;
66 }
67
68 /* set table header to a fixed position. WinIE 6.x only                                       */
69 /* In WinIE 6.x, any element with a position property set to relative and is a child of       */
70 /* an element that has an overflow property set, the relative value translates into fixed.    */
71 /* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
72 thead.fixedHeader tr {
73         position: relative
74 }
75
76 /* set THEAD element to have block level attributes. All other non-IE browsers            */
77 /* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
78 html>body thead.fixedHeader tr {
79         display: block
80 }
81
82 /* make the TH elements pretty */
83 thead.fixedHeader th {
84         background: #0066CC;
85         border: 0px;
86         font-weight: normal;
87         padding: 4px 3px;
88         text-align: left
89 }
90
91 /* make the A elements pretty. makes for nice clickable headers                */
92 thead.fixedHeader a, thead.fixedHeader a:link, thead.fixedHeader a:visited {
93         color: #FFF;
94         display: block;
95         text-decoration: none;
96         width: 100%
97 }
98
99 /* make the A elements pretty. makes for nice clickable headers                */
100 /* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
101 thead.fixedHeader a:hover {
102         color: #FFF;
103         display: block;
104         text-decoration: underline;
105         width: 100%
106 }
107
108 /* define the table content to be scrollable                                              */
109 /* set TBODY element to have block level attributes. All other non-IE browsers            */
110 /* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
111 /* induced side effect is that child TDs no longer accept width: auto                     */
112 html>body tbody.scrollContent {
113         display: block;
114         height: 422px;
115         /* This is realy bad for resolution below 1280x1024 */
116         overflow: auto;
117         width: 100%;
118 }
119
120 /* make TD elements pretty. Provide alternating classes for striping the table */
121 /* http://www.alistapart.com/articles/zebratables/                             */
122
123
124 tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
125         background: #FFF;
126         border-bottom: none;
127         border-left: none;
128         border-right: 1px solid #CCC;
129         border-top: 1px solid #DDD;
130         padding: 2px 3px 3px 4px;
131 }
132
133 /* define width of TH elements: 1st, 2nd, and 3rd respectively.          */
134 /* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
135 /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
136 html>body thead.fixedHeader th {
137         width: 780px; 
138 }
139
140 /* define width of TD elements: 1st, 2nd, and 3rd respectively.          */
141 /* All other non-IE browsers.                                            */
142 /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
143 html>body tbody.scrollContent td {
144 width: 764px; 
145 }
146
147 /****************************************
148 normal stylesheet-stuff******************
149 *****************************************/
150
151 #Main{
152         width:960px;
153         background-color: #AAA;
154         text-align: left;
155         margin: 0; 
156         padding: 0;
157         overflow: auto;
158         vertical-align: top;
159         cursor: default;
160         border: 1px solid #000; 
161 }
162
163 #Content{
164         vertical-align: middle;  
165         float: left;
166         background-color: #FFF;
167         width: 800px;
168         padding-bottom: 10px;
169         border-right: 1px solid #000;
170         border-left: 1px solid #000;
171 }
172
173 #CurrentService { 
174         font-family: Arial,sans-serif;
175         font-size: 14px;
176         font-weight: bold;
177         float: left;
178         background-color: #0066CC;
179         color: #FFFFFF;
180         
181         width: 55%;
182         height: 20px;
183 }
184
185 #CurrentEvent { 
186         font-family: Arial,sans-serif;
187         font-size: 14px;
188         font-weight: bold;
189         float: left;
190         background-color: #0066CC;
191         color: #FFFFFF;
192         text-align: right;
193         width: 45%;
194         height: 20px;
195 }
196
197 #VolumePanel { 
198         font-family:Arial,sans-serif;
199         font-size:14px;
200         font-weight:bold;
201         
202         float:left;
203         background-color: #0066CC;
204         color: #FFFFFF;
205         
206         width:25%;
207         height:20px;
208 }
209
210 #CurrentTime { 
211         font-family:Arial,sans-serif;
212         font-size:14px;
213         font-weight:bold;
214         
215         float:left;
216         text-align:right;
217         background-color: #0066CC;
218         color: #FFFFFF;
219         
220         width: 11%;
221         height: 20px;
222 }
223
224 #SignalPanel { 
225         font-family:Arial,sans-serif;
226         font-size:14px;
227         font-weight:bold;
228         
229         float:left;
230
231         background-color: #0066CC;
232         color: #FFFFFF;
233         text-align:right;
234
235         width:20px;
236         height:20px;
237 }
238 #StreaminterfaceButton { 
239         font-family:Arial,sans-serif;
240         font-size:14px;
241         font-weight:bold;
242         
243         float:left;
244
245         background-color: #0066CC;
246         color: #FFFFFF;
247         text-align:right;
248
249         width:20px;
250         height:20px;
251 }
252
253
254 #RecordButton { 
255         float:left;
256         background-color: #0066CC;
257         width:20px;
258         height:20px;
259 }
260
261 #ServiceInfo{
262         width:800px;
263         height: 20px;
264         border-bottom: 1px solid #000;
265         float:none;
266         clear:both;
267         padding: 0 0 0;
268         margin: 0 0 0;
269         background-color: #0066CC;
270         color: #FFFFFF;
271 }
272
273 #nav{
274         float: left;
275         width: 117px;
276         background-color: #AAA;
277 }
278
279 #navTable{
280         background-color: #EEE;
281         vertical-align: middle;
282         font-size: 14px;
283         font-weight: bold;
284         width: 100%;
285         margin:0 0 0 0;
286         padding:0 0 0 0;
287 }
288
289 #NavHd{
290         background-color: #0066CC;
291         color: #FFFFFF;
292         font-size:10px;
293         font-weight: bold;
294         height: 20px;
295         vertical-align: middle;
296 }
297 #RequestIndicator{
298         display: inline;
299         vertical-align: middle;
300         font-size:14px;
301         font-weight: bold;
302         height:20px;
303 }
304
305 #EventNowNext{
306 }
307
308 #updates{
309         visibility: hidden;
310 }
311
312 .navMenuPanel{
313         background-color: #BBB;
314 }
315 .navMenuHeader{
316         font-size: 14px;
317         border-top: 1px solid #000;
318         height: 20px;
319 }
320
321 .navMenuContent{
322         font-size: 12px;
323         font-weight: normal;
324         background-color: #EEE;
325         border: 0px;
326 }
327 .navMenuItem{
328         font-size: 12px;
329 }
330
331 .divblock{
332         width:100%;
333         float:none;
334         clear:both;
335 }
336
337 .event{
338         font-size:12px;
339         width:100%;
340         font-weight:bold;
341         background-color: #DDEEFF;
342         margin-bottom: 1px;
343         cursor:help;
344 }
345 .eventRA{
346         font-size:12px;
347         width:100%;
348         font-weight:bold;
349         text-align:right;
350         background-color: #DDEEFF;
351         margin-bottom: 1px;
352         cursor:help;
353 }
354
355 .eventExtDesc{
356         color: #777;
357         background-color: #FFF;
358         font-size:12px;
359         margin-bottom: 1px;
360         width:100%;
361 }
362
363 .bgMain{
364         background-color: #FFF;
365         width: 100%;
366 }
367 .sListHeader{
368         font-size: 14px;
369         font-weight: bold;
370         color: #FFF;
371         float:left;
372         width:50%;
373 }
374 .sListSearch{
375         font-size: 14px;
376         float:left;
377         width:50%;
378         text-align: right;
379 }
380 form.sListSearch{
381         text-align: right;
382 }
383 .sListSName{
384         font-size: 14px;
385         font-weight: bold;
386         float:left;
387         width:661px;
388 }
389
390 a.sListSLink{
391         display: block;
392         width: 656px;
393         height: 100%;
394         text-decoration: none;
395 }
396
397 a.sListSLink:hover{
398         background-color: #DDD;
399 }
400
401 .sListExt{
402         border-left: 1px solid #CCC;
403         float:left;
404         width:90px;
405         text-align: right;
406 }
407 .sListEPGTime{
408         float:left;
409         width:60px;
410         text-align: left;
411 }
412 .sListEPGTitle{
413         border-left: 1px solid #CCC;
414         border-right: 1px solid #CCC;
415         float: left;
416         width:600px; 
417         text-align: left;
418 }
419 .sListEPGDuration{
420         float:left;
421         width:75px;
422         text-align: right;
423 }
424 .tListSName{
425 /*      float:left;*/
426         width: 180px;
427         text-align: left;
428 }
429 .tListTitle{
430 /*      float:left;*/
431         width: 150px;
432         text-align: left;
433 }
434 .tListDescr{
435 /*      float:left;*/
436         width: 150px;
437         text-align: left;
438 }
439 .tListRepeat{
440 /*      float:left;*/
441         width: 70px;
442         text-align: left;
443 }
444 .tListDuration{
445 /*      float:left;*/
446         width: 70px;
447         text-align: left;
448 }
449 .tListBegin{
450 /*      float:left;*/
451         width: 100px;
452         text-align: left;
453 }
454 .tListEnd{
455 /*      float:left;*/
456         width: 100px;
457         text-align: left;
458 }
459 .tListAfter{
460 /*      float:left;*/
461         width: 85px;
462         text-align: left;
463 }
464 .tListOption{
465 /*      float:left;*/
466         width: 80px;
467         text-align: center;
468 }
469 #TimerColor0 {
470         color: #000000;
471 }
472 #TimerColor1 {
473         color: #00BCBC;
474         background-color: #DDD;
475 }
476 #TimerColor2 {
477         color: #9F1919;
478         background-color: #DDD;
479 }
480 #TimerColor3 {
481         color: #00BCBC;
482         background-color: #DDD;
483 }
484
485 .pageHeader {
486         width:100%;
487         background-color: #0066CC;
488         color: #FFF;
489         font-weight:bold;
490 }
491
492 .aboutHeader {
493         width:100%;
494         color:#444444;
495         font-weight:bold;
496         background-color:#DDEEFF;
497 }
498
499 .about {
500         border: 1px solid #AAA;
501         width: 100%;
502         font-size: 12px;
503 }
504
505 .fullwidth {
506         width: 100%;
507 }
508
509 .aboutSection{
510         width:100%;
511         margin: 0 0 0 0;
512 }
513
514 .aboutSectionLeft{
515         width:50%;
516         vertical-align: top;
517 }
518
519 .aboutSectionRight{
520         width:50%;
521         vertical-align: top;
522 }
523
524 .aboutElement{
525         float: none;
526 }
527
528 .aboutElementLeft{
529         font-weight:bold;
530         width: 50%;
531         text-align: left;
532 }
533
534 .aboutElementRight{
535         width: 50%;
536 }