restructure a bit, remove uneeded templates.js
[enigma2-plugins.git] / webinterface / src / web-data / tpl / default / style.css
1         body{
2                 font-family: Tahoma, Sans-Serif;
3                 font-size: 14px;
4                 font-weight: bold;
5                 color: #fff;
6                 text-align: center;
7                 background-color: #555
8         }
9         
10         a, a:visited, a:active{
11                 color: #FFF;
12                 text-decoration: none;
13         }
14         
15         img{
16                 border: 0px;
17         }
18         
19         form{
20                 margin: 2px;            
21         }
22
23 /***********************
24  GENERAL
25  ***********************/
26
27         .odd{
28                 background-color: #FFF;
29         }
30         
31         .even{
32                 background-color: #DDD;
33         }
34         
35         .fullwidth {
36                 width: 100%;
37         }
38         
39         .center {
40                 text-align: center;
41         }
42
43
44 /***********************
45  BANNER with MainMenu
46  ***********************/
47
48         #banner{
49                 width: 1000px;
50                 height: 70px;
51                 background: #000;
52                 padding-left: 5px;
53                 margin-bottom: 8px;
54         }
55
56         #banner, #banner .sb-inner { background:#000 }
57         #banner .sb-border { background: #FFF }
58         #bannerText{
59                 margin-bottom: 10px;
60                 padding-left: 2px;
61                 padding-top: 6px;
62         }
63
64         #bannerLeft{
65                 width: 800px;
66                 float: left;
67         }
68         
69         #bannerRight{
70                 width: 190px;
71                 text-align: right;
72                 height: 60px;
73                 float: left;
74         }
75         
76         #bannerRight img{
77                 padding-top: 5px;
78         }
79         
80         
81         #current{
82                 width: 999px;
83                 background: #000;
84                 padding-left: 3px;
85                 padding-right: 3px;
86                 padding-bottom: 1px;
87                 margin-bottom: 8px;
88         }
89
90         #current, #current .sb-inner { background:#000 }
91         #current .sb-border { background: #FFF }
92         #currentTable{
93                 margin-bottom: 10px;
94                 padding-left: 2px;
95                 padding-top: 3px;
96                 width: 100%;
97         }
98         
99         #currentDuration{
100                 text-align: right;
101         }
102         
103         
104         
105         #mainMenu{
106                 background-color: #485052;
107                 text-align: center;
108                 overflow:hidden; 
109                 background: #000; 
110                 margin: 0; 
111                 padding: 0; 
112                 width: 850px;
113         }
114
115         #mainMenu li{
116                 list-style: none;
117                 float: left;
118                 width: 130px;
119                 height: 21px;
120                 margin-left: 2px;
121         }
122         #mainMenu li .sb-border { background:#485052; }
123         #mainMenu li, #mainMenu li .sb-inner { background-color: #485052; }
124
125         #mainMenu a{ display:block; padding: 1px; }
126
127         #mainMenu li:hover, #mainMenu li:hover .sb-inner { background: #AAA; }
128         #mainMenu li.hover, #mainMenu li.hover .sb-inner { background: #AAA; }
129
130 /***************
131  Upper Left Nav
132  ***************/
133
134         #navContainer{
135                 float:left;
136                 width: 160px;
137         }
138          
139         #nav{
140                 width: 100%;
141                 height: 250px;
142                 background: #000;
143                 padding-left: 5px;
144         }
145
146         #nav, #nav .sb-inner { 
147                 background:#FFF; 
148                 padding-left: 2px;
149                 padding-right: 2px;
150         }
151         #nav .sb-border { background:#000; }
152
153         #navHd, #navHd .sb-inner{
154                 background: #000;
155                 text-align: center;
156         }
157         
158         #navContent{
159                 color: #485052;
160                 padding-left: 5px;
161         }
162
163         #navSearch{
164                 width: 100%;
165                 height: 61px;
166                 background: #000;
167                 padding-left: 5px;
168         }
169
170         #navSearch, #navSearch .sb-inner { 
171                 background:#FFF; 
172                 padding-left: 2px;
173                 padding-right: 2px;
174         }
175         #navSearch .sb-border { background:#000; }
176
177         #searchHd, #searchHd .sb-inner{
178                 background: #000;
179                 text-align: center;
180         }
181         
182         
183         #navVolume{
184                 width: 100%;
185                 height: 75px;
186                 background: #000;
187                 padding-left: 0px;
188         }
189
190         #navVolume, #navVolume .sb-inner { 
191                 background:#FFF; 
192                 padding-left: 2px;
193                 padding-right: 2px;
194         }
195         #navVolume .sb-border { background:#000; }
196
197         #volHd, #volHd .sb-inner{
198                 background: #000;
199                 text-align: center;
200         }
201         
202         
203
204 /**************
205  Content
206  **************/
207         #content{
208                 float: left;
209                 color: #485052;
210                 background: #000;
211                 width: 833px;
212                 min-height: 308px;
213                 margin-left: 8px;
214         }
215
216         #content, #content .sb-inner { background:#FFF; padding: 2px}
217         #content .sb-border { background:#000; }
218
219         #contentHd, #contentHd .sb-inner{
220                 background: #000;
221                 color: #fff;
222         }
223
224         #epgSearch{ width: 120px; }
225         
226         .boxContent{
227                 padding: 3px;   
228         }
229         
230 /*****************
231 * Subnavigation
232 ******************/     
233         .navTable{
234                 width: 100%;
235         }
236         
237         .navTable a, .navTable a:visited, .navTable a:active{
238                 color: #485052;
239                 text-decoration: none;
240                 display: block;
241         }
242         
243         .navTable a:hover{
244                 background-color:#CCC;
245                 color: #485052;
246                 display: block;
247         }
248         
249 /*****************
250 * ServiceList
251 ******************/             
252         .sListSName a{
253                 display: block;
254                 margin-right: 5px;
255                 color: #485052;
256         }
257         
258         .sListSName a:hover{
259                 background-color:#CCC;
260                 color: #485052;
261                 display: block;
262         }
263         
264         .sListEPGItem{
265                 font-size:12px;
266                 margin: 0px;
267                 padding: 0px;
268         }
269         
270         .header{
271                 padding-top: 2px;
272                 padding-left: 4px;
273                 padding-right: 4px;
274                 display:block;
275                 height: 22px;
276         }
277
278         #container {
279                 margin: 0 auto;   /* align for good browsers */
280                 text-align: left; /* counter the body center */
281                 width: 1005px;
282         }
283
284         #contentTable{
285                 scrollbar: auto;
286                 width: 785px;
287         }
288         
289         #contentTable div{
290                 width: auto;
291                 overflow: auto;
292         }
293
294         #contentMain{
295                 padding: 8px;
296                 margin-bottom: 5px;
297         }
298
299         #contentMain {
300                 clear: both;
301                 /*overflow-x: hidden;*/
302                 overflow-y: auto;
303                 width: 815px;
304         }
305
306         /*
307         html>body #contentMain div{
308                 overflow: hidden;
309                 width: 785px;
310         }
311 */
312         #contentMain div table {
313                 float: left;
314                 width: 799px;
315         }
316         
317         .sListItem{
318                 /*border-bottom: 2px solid #CCC;*/
319                 width: 780px;
320         }
321
322 /*****************
323 * ServiceList EPG
324 ******************/             
325         .epgStart{
326                 width: 50px;            
327         }
328         
329         .epgTitle{
330                 width: 680px;
331         }
332         
333         .epgLength{
334                 width: 50px;
335                 text-align: right;
336         }
337         
338         
339 /*****************
340 * MovieList EPG
341 ******************/     
342         .mListDetail{
343                 font-size: 12px;
344         }
345         
346         .mStart{
347                 width: 160px;           
348         }
349         
350         .mTitle{
351                 width: 650px;
352         }
353         
354         .mLength{
355                 width: 90px;
356                 text-align: right;
357         }
358         
359 /*****************
360 * About
361 ******************/     
362         
363         .aboutHeader {
364                 width:100%;
365                 color:#FFF;
366                 font-weight:bold;
367                 background-color:#000;
368         }
369
370         .about {
371                 border: 1px solid #CCC;
372                 width: 100%;
373                 margin: 0px;
374                 padding: 0px;
375         }
376         
377         .about td{
378                 font-size:12px;
379         }
380
381         .aboutSection{
382                 width:100%;
383                 margin: 0 0 0 0;
384         }
385
386         .aboutSectionLeft{
387                 width:50%;
388                 vertical-align: top;
389         }
390
391         .aboutSectionRight{
392                 width:50%;
393                 vertical-align: top;
394         }
395
396         .aboutElement{
397                 float: none;
398         }
399
400         .aboutElementLeft{
401                 font-weight:bold;
402                 width: 50%;
403                 text-align: left;
404         }
405
406         .aboutElementRight{
407                 width: 50%;
408         }
409         
410         .w200h50{
411                 width: 200px;
412                 height: 50px;
413         }
414         
415         
416 /*****************
417 * Timer
418 ******************/             
419         .tListItemTable{
420                 width: 100%;
421         }
422
423         .tListHead{
424                 /*background-color: #DDD; */
425         }
426
427         .tListSName{
428                 text-align: left;
429         }
430
431         .tListItem{
432 /*              background-color: #EEE; */
433                 font-weight: bold;
434                 font-size: 12px;
435         }
436         
437         .tListTitle{
438                 width: 150px;
439                 text-align: left;
440         }
441         
442         .tListDescr{
443                 width: 150px;
444                 text-align: left;
445         }
446         
447         .tListRepeat{
448                 width: 70px;
449                 text-align: left;
450         }
451         
452         .tListDuration{
453                 width: 70px;
454                 text-align: left;
455         }
456         
457         .tListBegin{
458                 width: 100px;
459                 text-align: left;
460         }
461         
462         .tListEnd{
463                 width: 100px;
464                 text-align: left;
465         }
466         
467         .tListAfter{
468                 width: 85px;
469                 text-align: left;
470         }
471         
472         .tListOption{
473                 width: 80px;
474                 text-align: center;
475         }
476         
477         .timerState0 {
478                 color: #485052;
479         }
480         
481         .timerState1 {
482                 color: #990000;
483         }
484         
485         .timerState2 {
486                 color: #009900;
487         }
488         
489         .timerState3 {
490                 color: #000099;         
491         }
492         
493 /*****************
494 * EPG List
495 ******************/                     
496         .epgListItem{
497                 font-size:12px;
498                 font-weight: bold;
499         }