CSS/HTML : Advanced & Administration
[citadel.git] / webcit / static / webcit.css
1
2 * html {
3         overflow: hidden;
4 }
5
6 body {
7         margin:0;
8         padding: 0 0 0 0;
9         height: 100%;
10         overflow: auto;
11         background-color: #D8D8D8;
12         color: #000000;
13         font-weight: normal;
14         font-size: 10pt;
15         font-family: sans-serif;
16         text-align: center;
17 }
18
19 #iconbar {
20         /* position:fixed; */
21         position:absolute;
22         display:block;
23         top:0px;
24         left:0px;
25         width: 15%;
26         /* height:100%; */
27         background: #ffffee;
28         text-align: left;
29 }
30
31 * html #iconbar {
32         position:absolute;
33         display:block;
34         top:0px;
35         left:0px;
36         width: 15%;
37         /* height:100%; */
38         background: #ffffee;
39 }
40
41 .logo, .logo_citadel {
42         display: block;
43         text-align: center;
44         border-bottom: 1px solid #aaaaaa;
45         margin: 0;
46         padding: 0;
47 }
48
49 .logo_citadel a, .logo_citadel img {
50         border: none;
51 }
52
53 #banner {
54         position:fixed;
55         display:block;
56         top:0px;
57         left: 15%;
58         width: 85%;
59         height: 15%;
60         background: #445;
61         text-align: left;
62 }
63
64 * html #banner {
65         position:absolute;
66         display:block;
67         top:0px;
68         left: 15%;
69         width: 85%;
70         height: 15%;
71         background: #445;
72 }
73
74 #banner .room_banner, #banner .service_banner {
75         float: left;
76         width: 48%;
77 }
78
79 .room_banner img,  .service_banner img {
80         float: left;
81         margin-top: 0;
82         margin-left: 0;
83         margin-bottom: 5px;
84         margin-right: 5px;
85 }
86
87 .room_banner h1 {
88         font-size: 14pt;
89         font-weight: bold;
90         color: #FFFFEE;
91         margin: 0;
92         padding: 2px;
93 }
94
95 .service_banner h1 {
96         font-size: 12pt;
97         font-weight: bold;
98         color: #FFFFEE;
99         margin: 0;
100         padding: 2px;
101 }
102
103 .service_banner h2 {
104         font-size: 11pt;
105         font-weight: bold;
106         color: #FFFFEE;
107 }
108
109 .room_banner .infos {
110         font-size: 8pt;
111         color: #FFFFEE;
112         text-align: center;
113         padding: 2px;
114         cursor: help;
115 }
116
117 #room_infos {
118         position: absolute;
119         top: 0px;
120         left: 50%;
121         width: 45%;
122         padding: 11px;
123         margin: 0px;
124         z-index: 100;
125         color: #666;
126         background: white;
127 }
128
129 #room_infos .close_infos {
130         cursor: pointer;
131         font-size: 8pt;
132         color: black;
133         text-align: right;
134         padding: 2px;
135         margin-top: 5px;
136 }
137
138 #banner ul {
139         float: right;
140         text-align: right;
141         width: 48%;
142         margin: 0;
143         padding: 0;
144 }
145
146 #banner ul li {
147         text-align: right;
148         clear: right;
149         list-style: none;
150         margin: 0;
151         padding: 2px;
152         white-space: nowrap;
153 }
154
155 li.search {
156         font-size: 10pt;
157         float: left;
158         color: #FFFFFF;
159 }
160
161 li.view {
162         font-size: 10pt;
163         float: right;
164         color: #FFFFFF;
165 }
166
167 li.search form, li.view form {
168         margin: 0;
169         padding: 0;
170 }
171
172 li.nummsgs {
173         font-size: 10pt;
174         color: #DDDDCC;
175 }
176
177 li.start_page {
178         font-size: 8pt;
179         color: #DDDDCC;
180 }
181
182
183 #navbar {
184         position: absolute; 
185         bottom: 0px; 
186         left: 0px;
187 }
188
189 #navbar ul {
190         float: left;
191         width: 95%;
192         margin: 0;
193         padding: 0;
194         white-space: nowrap;
195         text-align: left;
196 }
197
198 #navbar ul li {
199         display: inline;
200         list-style: none;
201         margin-top: 0;
202         margin-right: 5px;
203         margin-bottom:0 ;
204         margin-left: 20px;
205         white-space: nowrap;
206 }
207
208 #navbar ul li img {
209         margin-top: 0;
210         margin-right: 2px;
211         margin-bottom:0 ;
212         margin-left: 2px;
213 }
214
215 .navbar_link {
216         font-size: 7pt;
217         color: #FFFFEE;
218 }
219
220
221 #important_message {
222         position:absolute;
223         top:0px; right:0px;
224         background-color: #880000;
225         z-index: 2;
226 }
227
228 #content {
229         position:fixed;
230         display:block;
231         top: 16%;
232         left: 15%;
233         width: 85%;
234         height: 84%;
235         overflow: auto;
236         /* overflow-x: hidden; */
237         text-align: left;
238 }
239
240 * html #content {
241         position:absolute;
242         display:block;
243         top: 16%;
244         left: 15%;
245         width: 85%;
246         height: 84%;
247         overflow: auto;
248         /* overflow-x: hidden; */
249 }
250
251 #message_list_hdr {
252         position:fixed;
253         display:block;
254         top: 16%;
255         left: 15%;
256         width: 85%;
257         height: 5%;
258         overflow: hidden;
259         font-style: italic;
260         text-align: left;
261 }
262
263 * html #message_list_hdr {
264         position:absolute;
265         display:block;
266         top: 16%;
267         left: 15%;
268         width: 85%;
269         height: 5%;
270         overflow: hidden;
271         font-style: italic;
272         text-align: left;
273 }
274
275 #message_list {
276         position:fixed;
277         display:block;
278         top: 21%;
279         left: 15%;
280         width: 85%;
281         height: 20%;
282         overflow: auto;
283         cursor: pointer;
284         text-align: left;
285 }
286
287 * html #message_list {
288         position:absolute;
289         display:block;
290         top: 21%;
291         left: 15%;
292         width: 85%;
293         height: 20%;
294         overflow: auto;
295         cursor: pointer;
296 }
297
298 #resize_msglist {
299         position:fixed;
300         display:block;
301         top: 41%;
302         left: 15%;
303         width: 85%;
304         height: 1%;
305         overflow: hidden;
306         cursor: s-resize;
307         background-color: #cccccc;
308 }
309
310 * html #resize_msglist {
311         position:absolute;
312         display:block;
313         top: 41%;
314         left: 15%;
315         width: 85%;
316         height: 1%;
317         overflow: hidden;
318         cursor: s-resize;
319 }
320
321 #resize_msglist hr {
322         color: darkgrey;
323         background-color: darkgrey;
324         height: 3px;
325         border: 0;
326 }
327
328 #preview_pane {
329         position:fixed;
330         display:block;
331         top: 42%;
332         left: 15%;
333         width: 85%;
334         height: 58%;
335         overflow: auto;
336         text-align: left;
337 }
338
339 * html #preview_pane {
340         position:absolute;
341         display:block;
342         top: 42%;
343         left: 15%;
344         width: 85%;
345         height: 58%;
346         overflow: auto;
347 }
348
349
350 .fix_scrollbar_bug {
351         margin-right:1px;               /* Gecko and other non-broken browsers */
352         width: expression('97%');       /* Only IE6 understands 'expression' - fixes weird scrollbarbug */
353 }
354
355 #button {
356         width: 100%;
357         background-color: #ffffee;
358         color: #aaaaaa;
359         font-size: 8pt;
360         list-style: none;
361         margin: 0;
362         padding: 0;
363         border: none;
364 }
365
366 #button li, #button li.switch {
367         border-bottom: 1px solid #aaaaaa;
368         margin: 0;
369 }
370
371 #button li.switch {
372         text-align: center;
373 }
374
375 #button img {
376         vertical-align: middle;
377         padding-left: 2px;
378         padding-right: 5px;
379 }
380
381 #button li a {
382         display: block;
383         background-color: #ffffee;
384         color: #000000;
385         text-decoration: none;
386         width: 100%;
387 }
388
389 html>body #button li a {
390         width: auto;
391 }
392
393 #button li a:hover {
394         background-image:url(/static/body-background.gif);
395         color: #000000;
396 }
397
398 a:link {
399         color: #0000FF;
400         text-decoration: none;
401 }
402
403 a:visited {
404         color: #0000FF;
405         text-decoration: none;
406 }
407
408 a:active {
409         color: #0000FF;
410         text-decoration: none;
411 }
412
413 a:hover {
414         text-decoration: underline;
415 }
416
417 .menubar_link {
418         font-size: 9pt;
419 }
420
421 .titlebar {
422         font-size: 12pt;
423         color: #FFFFEE;
424 }
425
426
427 .message {
428         margin: 5px;
429         padding: 0;
430         border: 1px solid #999999;
431         background-color: #CCCCCC;
432         text-align: left;
433 }
434
435
436 .message_header, .message_subject {
437         font-size: 10pt;
438         color: black;
439         margin: 0;
440         padding: 3px;
441         background-color: #CCCCCC;
442         text-align: left;
443 }
444
445 .message_subject {
446         padding-top: 0;
447         font-style: italic;
448         float: left;
449 }
450
451
452 #delbutton, .msgbuttons a {
453         font-size: 7pt;
454         margin: 1px;
455         padding: 2px;
456         padding-left: 5px;
457         padding-right: 5px;
458         border-top: 1px solid #CFCFCF;
459         border-left: 1px solid #CFCFCF;
460         border-right: 1px solid #808080;
461         border-bottom: 1px solid #000000;
462         background-color: #999999;
463         color: #000000;
464         font-weight: bold;
465         text-align: center;
466 }
467
468 .msgbuttons {
469         float: right;
470         visibility: hidden;
471 }
472
473 .msgbuttons a span {
474         display: none;
475 }
476
477 .msgbuttons a:hover {
478         background-color: #AAAAAA;
479         text-decoration: none;
480 }
481
482 .message_content {
483         background-color: white;
484         margin: 0;
485         padding: 3px;
486         clear: both;
487 }
488
489 .message form label {
490         display: block;
491         float: left;
492         margin: 3px;
493         width: 9em;
494         text-align: right;
495 }
496
497 .message form input, .message form select {
498         margin: 3px;
499         clear: both;
500 }
501
502 .send_edit_msg {
503         margin-top: 10px;
504         margin-bottom: 10px;
505         margin-left: auto;
506         margin-right: auto;
507         width: 80%;
508         text-align: center;
509 }
510
511 .tablabel {
512         font-size: 10pt;
513         font-weight: bold;
514         color: #000000;
515 }
516
517 .boxlabel {
518         font-size: 8pt;
519         font-weight: bold;
520         color: #FFFFEE;
521 }
522
523 .boxlabel a {
524         color: #FFFFEE;
525 }
526
527 ul.adminitems {
528         list-style-type: none;
529 }
530
531 ul.adminitems li {
532         list-style: none;
533         font-size: 13px;
534 }
535
536 ul.adminitems a {
537         font-size: 13px;
538         margin: 5px;
539         color: #880000;
540         font-weight: bold;
541 }
542
543 ul.adminitems span {
544         display: block;
545         font-size: 8pt;
546         color: #000088;
547 }
548
549
550 .customize {
551         font-size: 8pt;
552         font-style: italic;
553         color: #000044;
554         background-color: #DDDDCC;
555 }
556
557 .room_banner_room_name {
558 }
559
560 .room_banner_room_info {
561 }
562
563 .room_banner_new_messages {
564 }
565
566 .room_banner_start_page {
567 }
568
569 .view_name, .search_name, .selectbox, .inputbox {
570         font-size: 7pt;
571         background: #444455; 
572         color: #ddddcc;
573 }
574
575 .menubar_bg {
576         background-color: #FF0000;
577 }
578
579
580 .roomlist_floor {
581         font-size: 12pt;
582         font-weight: bold;
583         color: #000000;
584 }
585
586 .roomlist_new {
587         font-size: 10pt;
588         color: #880000;
589         font-weight: bold;
590 }
591
592 .roomlist_old {
593         font-size: 10pt;
594         color: #000088;
595 }
596
597 .ib_roomlist_floor {
598         font-size: 8pt;
599         font-weight: bold;
600         color: #000000;
601         cursor: pointer;
602 }
603
604 .ib_roomlist_new {
605         font-size: 10px;
606         color: #880000;
607         font-weight: bold;
608         cursor: pointer;
609 }
610
611 .ib_roomlist_old {
612         font-size: 10px;
613         color: #000088;
614         cursor: pointer;
615 }
616
617 .mailbox_summary {
618         font-size: 10pt;
619         color: #000000;
620         background-color: #FFFFFF;
621 }
622
623 .mailbox_summary tr {
624         width: 100%;
625 }
626
627 .mailbox_summary td {
628         border-top: 1px solid darkgrey;
629 }
630
631 blockquote {
632         color: navy !important; background-color: RGB(245,245,245) !important; 
633 }
634 blockquote blockquote {
635         color: maroon !important; background-color: RGB(235,235,235) !important;
636 }
637 blockquote blockquote blockquote {
638         color: green !important; background-color: RGB(225,225,225) !important;
639 }
640 blockquote blockquote blockquote blockquote {
641         color: purple !important; background-color: RGB(215,215,215) !important;
642 }
643 blockquote blockquote blockquote blockquote blockquote {
644         color: teal !important; background-color: RGB(205,205,205) !important;
645 }
646
647 blockquote pre {
648         margin-left: 1%;
649         margin-right: 1%;
650 }
651
652
653 var sub {
654         font-style: normal;
655 }
656
657 .note {
658         font-size: 85%;
659         margin-left: 10%;
660 }
661
662 .toolbar {
663         text-align: center;
664 }
665
666 .toolbar IMG {
667         float: right;
668 }
669
670 .errormsg {
671         color: #AA0000;
672         background: none;
673         font-weight: bold;
674         font-style: italic;
675 }
676
677 .imsg {
678         color: #aaaaaa;
679         background: none;
680         font-weight: bold;
681         font-style: italic;
682         text-align: center;
683 }
684
685 .warning {
686         color: #FF4500;
687         background: none;
688         text-decoration: none;
689 }
690
691 .error strong {
692         color: #DC143C;
693         background: #FFD700;
694         text-decoration: none;
695 }
696
697 .warning strong {
698         color: #FF4500;
699         background: #FFD700;
700         text-decoration: none;
701 }
702
703 .warning a:link, .warning a:visited, .warning a:active {
704         color: #FF4500;
705         background: none;
706         text-decoration: underline;
707 }
708
709 .error a:link, .error a:visited, .error a:active {
710         color: #DC143C;
711         background: none;
712         text-decoration: underline;
713 }
714
715 .error strong a:link, .error strong a:visited, .error strong a:active {
716         color: #DC143C;
717         background: #FFD700;
718 }
719
720 .warning strong a:link, .warning strong a:visited, .warning strong a:active {
721         color: #FF4500;
722         background: #FFD700;
723 }
724
725 colgroup.entity {
726         text-align: center;
727 }
728
729 .default {
730         text-decoration: underline;
731         font-style: normal;
732 }
733
734 .required {
735         font-weight: bold;
736 }
737
738 td li.transitional, .elements li.transitional {
739         font-weight: lighter;
740         color: #696969;
741         background: none;
742 }
743
744 td li.frameset, .elements li.frameset {
745         font-weight: lighter;
746         color: #808080;
747         background: none;
748 }
749
750 @media print {
751         input#toggler, .toolbar { display: none }
752 }
753
754
755 .treetitle {
756         padding:2px;
757         cursor:default;
758         
759         font-size: 11px;
760         color: #000000;
761 }
762 .editednode {
763         padding:2px;
764         cursor:default;
765         background-color: #FFFFFF;;
766         color: #000000;
767         
768         font-size: 11px;
769 }
770 .editednodeinput {
771         background-color: #FFFFFF;;
772         color: #000000;
773         
774         width: 150px;
775         height: 17px;
776         
777         border-style: solid;
778         border-width: 1px;
779         border-color: #000000;
780         
781         font-size: 11px;
782 }
783 .treetitleselectedfocused {
784         padding:2px;
785         cursor:default;
786         background-color: highlight;
787         color: highlighttext;
788         
789         font-size: 11px;
790 }
791 .treetitleselectedblured {
792         padding:2px;
793         cursor:default;
794         background-color: menu;
795         color: windowtext;
796         font-size: 11px;
797 }
798
799
800
801 div.auto_complete {
802         width: 350px;
803         background: #fff;
804 }
805
806 div.auto_complete ul {
807         border:1px solid #888;
808         margin:0;
809         padding:0;
810         width:100%;
811         list-style-type: none;
812         background: #fff;
813 }
814
815 div.auto_complete ul li {
816         margin:0;
817         padding:3px;
818 }
819
820 div.auto_complete ul li.selected {
821         background-color: #ffc;
822
823
824 div.auto_complete ul strong.highlight {
825         color: #800;
826         margin:0;
827         padding:0;
828 }
829
830
831 .floors_config, .roomops_zap {
832         border: 0;
833         background-color: #770000;
834         width: 100%;
835 }
836
837 .roomops_cell_label {
838         background-color: #FFFFFF;
839 }
840
841 .roomops_cell, .roomops_cell_edit {
842         background-color: #CCCCCC;
843 }
844
845 .auth_validate, .event_background, .calendar_background, .calendar_view_background, .graphics_background, .iconbar_background, .messages_background, .paging_background, .preferences_background, .roomops_background, .sieve_background { 
846         border: 0;
847         width: 100%;
848         background-color: #ffffff;
849 }
850
851 .siteconfig_background { 
852         border: 0;
853         width: 100%;
854 }
855
856 .smtpqueue_background, .tabs_background, .useredit_background, .userlist_background, .downloads_background, .vcard_edit_background, .who_background   {
857         border: 0;
858         width: 100%;
859         background-color: #ffffff;
860 }
861
862 .auth_banner, .event_banner, .floors_banner, .calendar_banner, .graphics_banner, .iconbar_banner, .inetconf_banner, .listsub_banner {
863         border: 0;
864         width: 100%;
865         background-color: #444455;
866 }
867
868 .netconf_banner, .paging_banner, .preferences_banner, .roomops_banner, .setup_banner, .sieve_banner, .siteconfig_banner {
869         border: 0;
870         width: 100%;
871         background-color: #444455;
872 }
873
874 .smtpqueue_banner, .useredit_banner, .userlist_banner, .downloads_banner, .vcard_edit_banner, .who_banner, .room_banner   {
875         border: 0;
876         width: 100%;
877         background-color: #444455;
878 }
879
880
881 .vcard_edit_background_alt, .roomops_background_alt {
882         border: 0;
883         width: 100%;
884         background-color: #dddddd;
885 }
886
887
888 .box {
889         width: 100%;
890         padding: 0px;
891         background-color: #FFFFFF;
892 }
893
894 .boxlabel, .boxcontent {
895         padding: 5px;
896 }
897
898 .boxlabel {
899         background-color: #000088;
900         text-align: center;
901 }
902
903 #login_screen {
904         margin: 3%;
905 }
906
907 .login_content {
908         background-color: white;
909 }
910
911 .login_message, .login_hello {
912         position: relative;
913         margin-left: auto;
914         margin-right: auto;
915         width: 80%;
916         text-align: center;
917 }
918
919 .login_image {
920         display: block;
921         margin-left: auto;
922         margin-right: auto;
923         text-align: center;
924 }
925
926 .login_message {
927         color: red;
928         font-weight: bold;
929         font-size: 16px;
930 }
931
932 #login_form {
933         position: relative;
934         display: block;
935         margin-top: 20px;
936         margin-left: auto;
937         margin-right: auto;
938         margin-bottom: 20px;
939         padding: 6px;
940         width: 300px;
941         background-color: #DDDDDD;
942 }
943
944 #login_form input, #login_form label, #login_form select {
945         display: block;
946         float: left;
947         margin: 6px;
948 }
949
950 #login_form label {
951         width: 130px;
952         text-align: left;
953 }
954
955 #pname, #uname {
956         width: 130px;
957         text-align: left;
958 }
959
960 #login_form br {
961         clear: left;
962 }
963
964 #login_form .logbuttons {
965         margin-left: auto;
966         margin-right: auto;
967 }
968
969 #login_form .logbutton {
970         width: auto;
971         text-align: center;
972 }
973
974 .login_infos {
975         display: block;
976         margin-top: 30px;
977         margin-left: auto;
978         margin-right: auto;
979         width: 80% ;
980         text-align: left;
981 }
982
983 #address_book_popup {
984         position: absolute;
985         top: 100px;
986         right: 25px;
987         width: 320px;
988         height: auto;
989         z-index: 100;
990         background-color: #fff;
991         color: #000;
992         display: none;
993         border: 1px solid black;
994 }
995
996 #address_book_popup_container_div {
997         position: relative;
998         width: 100%;
999         height: 100%;
1000         background-color: #ffd;
1001 }
1002
1003 #address_book_popup_middle_div {
1004         position: relative;
1005         background-color: #ffd;
1006 }
1007
1008 #address_book_inner_div {
1009         margin: 5px;
1010 }
1011
1012 #address_book_inner_div select {
1013         width: 100%;
1014         background-color: #ffd;
1015 }
1016
1017 .address_book_popup_title {
1018         font-size: 12pt;
1019         background-color: #ffd;
1020         color: #000;
1021 }