1778aa34edbc22a4f272d5f37ecc03cb15102f85
[citadel.git] / webcit / static / webcit.css
1 /*
2  * Copyright 2005 - 2009 The Citadel Team
3  * Licensed under the GPL V3
4  */
5 @import url("datepicker.css");
6 @media print {
7         input#toggler, .toolbar { display: none }
8 }
9
10 /* Typography & colors */
11
12 html {  font-size: 100%;}
13
14 body { font-size: 100%;}
15
16 #banner h1 { font-size: 160%; }
17
18 #banner h2,#banner .titlebar, .address_book_popup_title {
19         font-size: 130%;
20 }
21
22 #button, #content .msgbuttons a, .button_link a, input#delbutton,.attachfile,.logbuttons input,.buttons input, .buttons a, .customize, .menubar_link, .roomlist_floor, .ib_roomlist_floor, .roomlist_new, .ib_roomlist_new, .roomlist_old, .ib_roomlist_old, #banner ul.room_actions li, .selector_top, .selector_bottom, .room_banner .infos,.room_banner .nummsgs,li.search,li.view, .room_actions form select option, .selectbox, .message_header, ul.adminitems li span, #message_list tr > td {
23         font-size: 100%;
24 }
25
26 #message_list_hdr table {
27         font-size: 80%;
28 }
29
30 #navbar {
31         font-size: 75%;
32 }
33
34 .mailbox_summary {
35         font-size: 80%;
36 }
37
38 #online_users li a {
39         font-size: 80% !important;
40 }
41 .marked_row {
42     color: white;
43 }
44
45 /* Color */
46
47 body {
48         background-color: #6C91A6;
49         font-family: sans-serif;
50         font-weight: 400;
51 }
52
53 #iconbar_container, .boxcontent,.service form div,table.altern .odd, #message_list, .message_content, #roomlist_div,.editednode,.mailbox_summary, .auth_validate, .event_background, .calendar_background, .calendar_view_background, .graphics_background, .messages_background, .paging_background, .preferences_background, .roomops_background, .sieve_background, .siteconfig_background, .smtpqueue_background, .tabs_background, .useredit_background, .userlist_background, .wiki_history_background, .wiki_pagelist_background, .downloads_background, .vcard_edit_background, div.auto_complete, div.auto_complete ul, #summary_view {
54         background-color: #FFF;
55         color: #000;
56 }
57
58 #login_form, #message_list_hdr table, #resize_msglist, .message, .message_header, .vcard_edit_background_alt,.roomops_background_alt 
59  {
60         background-color: #CCC;
61 }
62
63 .box, #online_users li.inactiveuser a {
64         background-color: transparent;
65 }
66
67 .room_banner .infos {
68         cursor: help;
69 }
70
71 .login_message {
72         color: #AD1C00;
73         font-weight: 700;
74         text-transform: uppercase;
75 }
76
77 .ib_button, #room_infos, #address_book_popup,.roomops_cell, .roomops_cell_edit, .mimepart, .iconbar_text{
78         background-color: #F0FFFF;
79         color: #333;
80
81 #online_users:hover { /* separate in order for override */
82     background-color: #F0FFFF !important;
83         color: #333 !important;
84 }
85 #iconbar #button {
86         border: none;
87         list-style: none;
88 }
89
90 .ib_button {
91         font-size: 90%;
92 }
93
94 #room_infos, #address_book_popup, .mimepart, .room_actions form select {
95         border: 1px solid #333;
96         overflow: hidden;
97 }
98
99
100 .buttons a,.roomlist_floor,.tablabel,.treetitle {
101         color: #000;
102         font-weight: 700;
103 }
104
105 .ib_button {
106         border: none;
107         border-bottom: 2px groove #CCC;
108         border-right: 2px groove #CCC;
109 }
110
111 .logo_citadel a,.logo_citadel img {
112         border: none;
113 }
114
115 .logo,.logo_citadel, .iconbar_text {
116         border: none;
117         border-bottom: 1px solid #AAA;
118 }
119
120 .ib_button_link, .ib_button_link:visited, .ib_button_link:link, #online_users a {
121         color: #000;
122         text-decoration: none;
123 }
124
125 #online_users li {
126         border: none;
127         border-top: 1px solid #AAA;
128 }
129
130 #banner h1,#banner h2,.room_banner .nummsgs,.mimepart div,.required {
131         font-weight: 700;
132 }
133
134 #banner ul.room_actions li.start_page a, #navbar, .selector_top,.selector_bottom {
135         background-color: #022750;
136         border-top: 1px solid black;
137         border-bottom: 1px solid black;
138         color: #FFF;
139 }
140
141 #banner {
142         background-color: #004E79;
143         color: #FFF;
144         margin: 0;
145         padding: 0;
146 }
147
148 #banner a {
149         color: #FFF
150 }
151
152 .room_actions form select {
153         cursor: pointer;
154 }
155
156 #content {
157         background-color: #6C91A6;
158         color: #000;
159 }
160
161 #message_list_hdr form input {
162         border: 0;
163 }
164
165 #message_list_hdr select {
166         background-color: #AD1C00;
167         border: 1px solid #6C91A6;
168 }
169
170 #message_list_hdr table {
171         font-style: italic;
172 }
173
174 #resize_msglist {
175         background-image: url(/static/resizegrippy.gif);
176         background-position: center;
177         background-repeat: no-repeat; 
178 }
179
180 #resize_msglist hr {
181         background-color: #999;
182         border: 0;
183         color: #999;
184         height: 3px;
185 }
186
187 .message {
188         border: 1px outset #999;
189         clear: both;
190 }
191
192 .message_header .message_subject {
193         font-style: italic;
194         float: left;    
195 }
196
197 .adminlist {
198         list-style: none;
199 }
200
201 .customize {
202         background-color: #DDC;
203         color: #004;
204         font-style: italic;
205 }
206
207 .default {
208         font-style: normal;
209         text-decoration: underline;
210 }
211
212 .editednodeinput {
213         background-color: #FFF;
214         border: 1px solid #000;
215         color: #000;
216         height: 17px;
217         width: 150px;
218 }
219
220 .error a:link, .error a:visited, .error a:active {
221         background: none;
222         color: #DC143C;
223         text-decoration: underline;
224 }
225
226 .error strong {
227         background: #FFD700;
228         color: #DC143C;
229         text-decoration: none;
230 }
231
232 .error strong a:link,.error strong a:visited,.error strong a:active {
233         background: #FFD700;
234         color: #DC143C;
235 }
236
237 .errormsg {
238         background: none;
239         color: #A00;
240         font-style: italic;
241         font-weight: 700;
242 }
243
244 .floors_config, .roomops_zap {
245         background-color: #700;
246         border: 0;
247 }
248
249 .ib_roomlist_floor, .ib_roomlist_new, .ib_roomlist_old {
250         cursor: pointer;
251 }
252
253 .ib_roomlist_floor, .roomlist_new, .ib_roomlist_new {
254         font-weight: 700;
255 }
256
257 .ib_roomlist_floor {
258         color: #000;
259 }
260
261 .roomlist_new, .ib_roomlist_new {
262         color: #800;
263 }
264
265 .roomlist_old, .ib_roomlist_old {
266         color: #008;
267 }
268
269 .imsg {
270         background: none;
271         color: #AAA;
272         font-style: italic;
273         font-weight: 700;
274 }
275
276 .menubar_bg {
277         background-color: red;
278 }
279
280 .mimepart div span {
281         display: block;
282         font-style: italic;
283 }
284
285 .mimepart dl dd, .mimepart dl dt {
286         border-top: 1px solid #AAA;
287 }
288
289 .mailbox_summary td {
290         /* border-top: 1px solid #AAA; */
291         white-space: nowrap;
292         overflow: hidden;
293 }
294
295 .mimepart dl dt {
296         font-weight: 700;
297 }
298
299 .roomops_cell_label,.boxlabel,.tab_cell_label {
300         background-color: #FF7814;
301         color: #FFF;
302         font-weight: 700;
303 }
304
305 .selectbox {
306         background-color: #FF8000;
307 }
308
309 .tab_cell, .tab_cell_edit {
310         background-color: #CCC;
311         font-weight: 700;
312 }
313
314 .tabcontent {
315         background-color: #FFF;
316         border-top: 3px solid #FF7814;
317 }
318
319 .treetitleselectedblured {
320         background-color: menu;
321         color: windowtext;
322 }
323
324 .treetitleselectedfocused {
325         background-color: highlight;
326         color: highlighttext;
327 }
328
329 .warning a:link, .warning a:visited, .warning a:active, .warning {
330         background: none;
331         color: #FF4500;
332 }
333
334 .warning, .warning strong {
335         text-decoration: none;
336 }
337
338 .warning a:link,.warning a:visited,.warning a:active {
339         text-decoration: underline;
340 }
341
342 .warning strong {
343         background: #FFD700;
344         color: #FF4500;
345 }
346
347 .warning strong a:link,.warning strong a:visited,.warning strong a:active {
348         background: #FFD700;
349         color: #FF4500;
350 }
351
352 blockquote {
353         background-color: #f5f5f5 !important;
354         color: navy !important;
355 }
356
357 blockquote blockquote {
358         background-color: #ebebeb !important;
359         color: maroon !important;
360 }
361
362 blockquote blockquote blockquote {
363         background-color: #e1e1e1 !important;
364         color: green !important;
365 }
366
367 blockquote blockquote blockquote blockquote {
368         background-color: #d7d7d7 !important;
369         color: purple !important;
370 }
371
372 blockquote blockquote blockquote blockquote blockquote {
373         background-color: #cdcdcd !important;
374         color: teal !important;
375 }
376
377 blockquote pre {
378         margin-left: 1%;
379         margin-right: 1%;
380 }
381
382 div.auto_complete ul {
383         background: #fff;
384         border: 1px solid #888;
385         list-style-type: none;
386 }
387
388 div.auto_complete ul li.selected {
389         background-color: #ffc;
390 }
391
392 div.auto_complete ul strong.highlight {
393         color: #800;
394 }
395
396 table.altern {
397         border-bottom: solid 2px #AAA;
398         border-top: solid 2px #AAA;
399 }
400
401 table.altern .even {
402         background-color: #DDD;
403 }
404
405 td li.frameset,.elements li.frameset {
406         background: none;
407         color: gray;
408         font-weight: lighter;
409 }
410
411 td li.transitional,.elements li.transitional {
412         background: none;
413         color: #696969;
414         font-weight: lighter;
415 }
416
417 ul.adminitems {
418         list-style-type: disc;
419         padding: 0;
420 }
421
422 ul.adminitems li {
423         font-weight: 700;
424 }
425
426 ul.adminitems li span {
427         color: #666;
428 }
429
430 var sub {
431         font-style: normal;
432 }
433
434 .calendar {
435         background-color: #204B78;
436 }
437
438 .week_of_year {
439         background-color: #e1e1e1;
440         font-size: 70%; 
441 }
442
443 .day {
444         font-weight: 700;
445 }
446
447 .calout {
448         background-color: #DDDDDD;
449 }
450
451 .calday {
452         background-color: #FFFFFF;
453 }
454
455 .calweekend {
456         background-color: #EEEECC;
457 }
458
459 .caltoday {
460         background-color: #EEEEFF;
461 }
462
463 .current_sort_mode {
464     background-color: white;
465 }
466 .marked_row {
467     background-color: #69aaff !important;
468 }
469 #loading {
470     background-color: white;
471 }
472 /* Message list in mailbox/summaryview */
473 .table-row {
474     background-color: white;
475 }
476 .table-alt-row {
477       background-color: #DDDDDD;
478 }
479 /* Links */
480
481 a {     text-decoration: none; }
482
483 a:active { color: #AD1C00; }
484
485 a:link { color: blue; }
486
487 a:visited { color: purple; }
488
489 #customize a:active, #customize a:link, #customize a:visited { color: black; }
490
491 #important_message, .buttons a:hover, .msgbuttons a:hover, #button li:hover, #online_users li a:hover, #navbar ul li a:hover, #ib_logoff:hover {
492         background-color: #AD1C00;
493         color: #FFF;
494 } /* input:hover as well?? */
495
496
497
498 .button_link a, input, select, #login_form #uname, #login_form #pname, li.activeuser, .room_actions form select, .room_actions li.search input, .address_book_popup_title, .msgbuttons a, input#delbutton,.attachfile, .logbuttons input,.buttons input, .send_edit_msg input {
499         background-color: #fbf4ca !important; /* needed for li.activeuser */
500 }
501
502 .button_link a, input, select, #login_form #uname, #login_form #pname, .room_actions form select, .room_actions li.search input, .address_book_popup_title, .msgbuttons a, input#delbutton,.attachfile, .logbuttons input,.buttons input, .send_edit_msg input {
503         border: 1px solid #999;
504         color: #333;
505 }
506
507
508 .button_link a, .msgbuttons a, input#delbutton,.attachfile, .logbuttons input,.buttons input, .send_edit_msg input {
509         cursor: pointer;
510         -moz-border-radius: 8px;    /* CSS3 draft and Mozilla  */
511         text-align: center;
512 }
513
514 .button_link a, .attachfile, .logbuttons input,.buttons input, .send_edit_msg input {
515         font-weight: bold;
516 }
517
518 .msgbuttons a, input#delbutton {
519         font-weight: normal;
520 }
521
522
523 /* Layout */
524
525 * html {
526         overflow: hidden;
527 }
528 html {
529     overflow: auto;
530 }
531 body {
532         height: 100%;
533         overflow: hidden;
534         text-align: center;
535 }
536
537 body, #global {
538         margin-left: 0;
539         padding: 0;
540 }
541
542 #global {
543     position: absolute;
544     bottom: 0;
545     top: 0;
546     right: 0;
547     left: 0;
548     overflow-y: auto;
549 }
550 #global.scrollable {
551     position: fixed;
552 }
553 #important_message {
554         position: absolute;
555         top: 0; 
556         right: 0;
557         z-index: 2;
558         padding: 3px;
559 }
560 #hellomsg, .fmout, .nomsgs {
561     text-align: center;
562 }
563
564 .moreprompt {
565         text-align: center;
566         font-size: 100%;
567         background-color: #004E79;
568         color: #dddddd;
569 }
570
571 .moreprompt_link {
572         color: #dddddd;
573         font-weight: bold;
574 }
575
576 .moreprompt_link:hover {
577         background-color: #AD1C00;
578         color: #FFF;
579 }
580
581 #login_screen, #logout_screen {
582         margin: 0;
583         padding: 3% 6% 3% 6%;
584 }
585 #convlogin, #validate {
586     text-align: center;
587 }
588 #iconbar, #banner, #content, #message_list_hdr, #message_list, #preview_pane  {
589         text-align: left;
590 }
591 .message_content > div > div {
592     text-align: justify !important;
593 }
594 #iconbar {
595         position: absolute;
596         top: 0;
597         left: 0;
598     bottom: 0;
599         width: 16%;
600     z-index: 0;
601     overflow: auto;
602     overflow-x: hidden !important;
603     
604 }
605
606 #content {
607 /*      position: absolute;
608         top: 18%;
609         left: 16%;
610         width: 84%;
611         height: 82%;
612         overflow: auto; */
613     position: relative;
614     bottom: 0;
615 }
616 /* Please avoid setting heights for any of the mailbox view elements (except summary_view and resize). In particular, do NOT set any for message_list_hdr as its not good feng shui */
617 #message_list_hdr {
618         display: block;
619         top: 0;
620         left: 0;
621         width: 100%;
622     padding-bottom: 0;
623     margin-bottom: 0;
624     background-color: #CCCCCC;
625 }
626
627 #summary_view {
628         height: 100px;
629         overflow-y: scroll;
630     overflow-x: hidden;
631         cursor: pointer;
632 }
633 #message_list_body {
634     background-color: white !important;
635 }
636 #message_list_body tr td {
637     overflow-y: hidden;
638     overflow-x: hidden; /* stop long subjects overflowing */
639 }
640 .col1 {
641     width: 50%;
642 }
643 .col2 { 
644     width: 30%;
645 }
646 .col3 {
647     width: 20%;
648 }
649 .col1, .col2, .col3 {
650     cursor: pointer;
651     text-overflow: ellipsis;
652     -o-text-overflow: ellipsis;
653 }
654 .new_message {
655     font-weight: bold; !important;
656 }
657 #loading {
658     text-align: center;
659 }
660 #resize_msglist {
661         width: 100%;
662         overflow: hidden;
663         cursor: s-resize;
664     height: 6px;
665 }
666
667 #preview_pane {
668         overflow: auto; 
669 }
670
671 .fix_scrollbar_bug {
672         margin-right: 1px;              /* Gecko and other non-broken browsers */
673         width: expression('96%');       /* Only IE6 understands 'expression' - fixes weird scrollbarbug */
674 }
675
676
677
678
679 /* Boxes */
680
681 .box {
682         width: 100%;
683         padding: 0;
684         margin: 0;
685 }
686
687 #content .boxlabel, #global .boxlabel {
688         margin: 0;
689         padding: 0;
690         width: 100%;
691         text-align: center;
692 }
693
694 #content .box {
695         margin: 0;
696         padding: 0;
697         width: 100%;
698         text-align: center;
699 }
700
701 .boxlabel, .boxcontent {
702         margin: 0;
703 }
704
705 .boxlabel {
706         text-align: center;
707         padding: 0;
708 }
709
710 .boxcontent {
711         text-align: left;
712         padding: 5px;
713 }
714
715 .ctdlTemplate {
716     display: none;
717 }
718 #ctdlContextMenu {
719     position: fixed;
720     background-color: white;
721     border: 1px solid black;
722 }
723 .draganddrop {
724     position: fixed;
725     display: block;
726     border: 1px solid black;
727     z-index: 65535;
728     background-color: white;
729     text-align: left;
730     opacity: 0.9;
731 }
732 .draganddrop > ul {
733     list-style: none;
734     padding-left: 0;
735     margin-left: 0;
736 }
737 .hidden {
738     display: none;
739 }
740 /* Login */
741
742 #login_screen .login_message, #login_screen .login_image, .login_hello, #login_screen #login_form {
743         display: block;
744         margin: 5px auto 5px auto;
745 }
746
747 #login_screen .login_message, .login_hello, #global center {
748         width: 80%;
749 }
750
751 #login_screen .login_image {
752         width: 135px;
753 }
754
755 #login_screen .login_image img {
756         text-align: center;
757 }
758
759
760 #login_screen #login_form {
761         padding: 10px;
762         width: 330px;
763 }
764
765 #login_form input, #login_form label, #login_form select {
766         display: block;
767         float: left;
768         margin: 6pt;
769 }
770
771 #login_form label, #pname, #uname {
772         width: 130px;
773         text-align: left;
774 }
775
776 #login_form br {
777         clear: left;
778 }
779
780 .login_infos {
781         display: block;
782         margin: 20px auto 0 auto;
783         width: 80% ;
784         text-align: left;
785 }
786
787
788 /* Iconbar */
789
790 .logo, .logo_citadel, #iconbar #button, .iconbar_text, .ib_button {
791         margin: 0;
792         padding: 0;
793 }
794
795 .logo, #citlogo, .iconbar_text, #online_users li {
796         text-align: center;
797 }
798
799 .iconbar_text > span {
800     cursor: pointer;
801 }
802 #iconbar #button {
803         width: 100%;
804 }
805
806 .ib_button {
807         margin: 4px 8px 4px 8px;
808         padding: 0;
809     display: block;
810 }
811 .ib_button_link {
812     /* width: 100%; */
813     display: block;
814 }
815
816 #online_users {
817     display: none; /* Hide by default */
818         border: 0;
819         max-height: 200px;
820         overflow: auto;
821     padding-left: 0;
822
823 #online_users li {
824         list-style: none;
825         margin: 0;
826         padding: 2px;
827         white-space: nowrap;
828 }
829
830
831 .ib_roomlist_floor, .ib_roomlist_new, .ib_roomlist_old, .roomlist_floor, .roomlist_new, .roomlist_old {
832         margin: 4px;
833         padding: 0;
834 }
835
836 /* Banner */
837 #banner .room_banner {
838     display: table-cell;
839     width: 90%;
840 }
841
842 #banner .room_banner img {
843         float: left;
844         margin: 0 5px 15px 0;
845 }
846
847 #banner h1, #banner h2, #banner .room_banner .infos, #banner .room_banner p {
848         margin: 2px;
849         padding: 0;
850 }
851
852 #room_infos {
853         position: absolute;
854         top: 0;
855         left: 50%;
856         width: 45%;
857         z-index: 10;
858         cursor: pointer;
859         text-align: left;
860         padding: 10px 2px 2px 2px;
861 }
862
863 #room_infos img.close_infos {
864         float: right;
865 }
866 #actiondiv {
867         display: table-cell;
868 }
869 #banner ul.room_actions {
870         list-style: none;
871         text-align: left;
872 }
873 #banner ul.room_actions li {
874         white-space: nowrap;
875         display: inline;
876 }
877 #banner ul.room_actions li form {
878         margin: 0;
879         padding: 0;
880 }
881 #banner ul.room_actions li select, #banner ul.room_actions li input {
882         margin-top: 8px;
883         margin-right: 4px;
884 }
885 #selectpage.hidden {
886     display: none !important;
887 }
888
889 /* Navbar */
890
891 #navbar ul, .selector_top, .selector_bottom {
892         width: 100%;
893         margin: 0 auto 0 auto;
894         padding: 0;
895         white-space: nowrap;
896         text-align: center;
897         vertical-align: middle;
898 }
899
900 #navbar ul li {
901         display: inline;
902         list-style: none;
903         vertical-align: middle;
904 }
905
906 #navbar ul li a {
907         padding: 2px 8px 8px 8px;
908         white-space: nowrap;
909  }
910
911 #navbar ul li img {
912         float: none;
913         margin: 0 2px 0 2px;
914 }
915 .floor {
916     margin-left: 0px;
917 }
918 .floor > ul {
919     display: none;
920 }
921 .floor-expanded > ul{
922     display: block !important;
923 }
924 #roomlist > ul {
925     margin: 0;
926     padding: 0;
927 }
928 #roomlist > div > ul > li {
929     margin: 0;
930     padding: 0;
931 }
932 /** Override to disable list-style-image" */
933 .room a, .room a, .room a:visited, .room a:link {
934     color: #333333;
935 }
936 .room-private {
937     list-style-image: url("/static/privatemess_16x.gif");
938 }
939 .room-addr {
940     list-style-image: url("/static/viewcontacts_16x.gif");
941 }
942 .room-cal {
943     list-style-image: url("/static/calarea_16x.gif");
944 }
945 .room-tasks {
946     list-style-image: url("/static/taskmanag_16x.gif");
947 }
948 .room-notes {
949     list-style-image: url("/static/storenotes_16x.gif");
950 }
951 .room-chat {
952     list-style-image: url("/static/chatrooms_16x.gif");
953 }
954 .room-newmsgs {
955     font-weight: bold;
956 }
957 .room-emphasized {
958     text-decoration: underline;
959 }
960 /* Content */
961
962 .boxcontent table {
963         margin: 0;
964         padding: 0;
965 }
966
967 #content table .box {
968         margin: 0;
969         width: 100%;
970         text-align: left;
971 }
972
973 .service, .who_is_online {
974         text-align: center;
975         width: 100%;
976 }
977
978 .service table {
979         margin: 0 auto 0 auto;
980         width: 100%;
981         text-align: left;
982 }
983
984 .instructions {
985         text-align: center;
986 }
987
988 #message_list_hdr table {
989 /*      position: absolute;
990         bottom: 0; 
991         left: 0;
992     top: 0; */
993         width: 100%;    
994 }
995 .selector_top, .selector_bottom {
996         text-align: center;
997 }
998
999 .selector_top p,.selector_bottom p {
1000         margin: 0;
1001         padding: 2px;
1002 }
1003
1004 .message {
1005         margin: 1%;
1006         padding: 0;
1007 }
1008
1009 .message_header p {
1010         margin: 2px 0 2px 0;
1011         padding: 0 0 2px 0;
1012 }
1013
1014 .button_link a, .attachfile, .logbuttons input,.buttons input, .send_edit_msg input, .logbutton {
1015         margin: 3px;
1016         padding: 2px 4px 2px 4px;
1017 }
1018
1019 .msgbuttons a, input#delbutton {
1020         margin: 0 3px 0 3px;
1021         padding: 2px 4px 2px 4px;
1022 }
1023
1024
1025 .mimepart {
1026         margin-top: 15px;
1027         margin-bottom: 15px;
1028         margin-left: 15%;
1029         width: 70%;
1030         padding: 0;
1031 }
1032
1033 .mimepart img {
1034         vertical-align: middle;
1035         float: left;
1036 }
1037
1038 .mimepart div {
1039         vertical-align: middle;
1040         margin: 0 0 15px 0 ;
1041         padding: 5px;
1042 }
1043
1044 .mimepart div span {
1045         vertical-align: top;
1046 }
1047
1048 .mimepart dl {
1049         width: 100%;
1050         margin-left: 5px;
1051         padding: 5px;
1052 }
1053
1054 .mimepart dl dt {
1055         width: 30%;
1056         float: left;
1057         margin: 0 0 0 0;
1058         padding: .5em;
1059 }
1060
1061 /* hack ie5 mac \*/
1062 dt { clear: both; }
1063 /* end hack */
1064
1065 .mimepart dl dd {
1066         float: left;
1067         width: 62%;
1068         margin: 0;
1069         padding: .5em;
1070 }
1071
1072 .mimepart p {
1073         margin-top: 1em;
1074         margin-bottom: 0;
1075         clear: both;
1076 }
1077
1078 .msgbuttons {
1079         float: right;
1080         visibility: hidden;
1081         padding: 2px;
1082 }
1083
1084 .buttons a {
1085         text-align: center;
1086 }
1087
1088 .msgbuttons a span {
1089         display: none;
1090 }
1091
1092 .message_content {
1093         margin: 0;
1094         padding: 0.3em;
1095         clear: both;
1096 }
1097
1098 .message form div label {
1099         display: block;
1100         float: left;
1101         margin: 0.3em;
1102         width: 9em;
1103         text-align: right;
1104 }
1105
1106 .message form div input, .message form div select {
1107         margin: 0.3em;
1108
1109 }
1110
1111 .imgedit {
1112         vertical-align: middle;
1113 }
1114
1115 .send_edit_msg {
1116         float: right;
1117         margin-top: 0 ;
1118         margin-right: 0;
1119         padding: 2px 50px 2px 50px;
1120 }
1121
1122 .edit_msg_table th {
1123         text-align: right;
1124         padding-right: 5px;
1125         color: #333;
1126         width: 20%;
1127 }
1128
1129 .edit_msg_table td { 
1130         width: 40%;
1131 }
1132
1133 .edit_msg_table #recp_id, .edit_msg_table #cc_id, .edit_msg_table #bcc_id, .edit_msg_table #subject_id  {
1134         width: 98%
1135 }
1136
1137 .note {
1138         font-size: 85%;
1139         margin-left: 10%;
1140 }
1141
1142 .toolbar {
1143         text-align: center;
1144 }
1145
1146 .toolbar img {
1147         float: right;
1148 }
1149
1150 .imsg {
1151         text-align: center;
1152 }
1153 #summary_view > table { /* hide from IE6 */
1154     width: 100%;
1155     table-layout: fixed;
1156 }
1157 colgroup.entity {
1158         text-align: center;
1159 }
1160
1161 div.auto_complete ul {
1162         margin: 0;
1163         padding: 0;
1164         width: 100%;
1165 }
1166
1167 div.auto_complete ul li {
1168         margin: 0;
1169         padding: 3px;
1170 }
1171
1172 div.auto_complete ul strong.highlight {
1173         margin: 0;
1174         padding: 0;
1175 }
1176
1177 .auth_validate, .event_background, .calendar_background, .calendar_view_background, .graphics_background, .messages_background, .paging_background, .preferences_background, .roomops_background, .sieve_background, .siteconfig_background, .smtpqueue_background, .tabs_background, .useredit_background, .userlist_background, .downloads_background, .vcard_edit_background, .vcard_edit_background_alt, .roomops_background_alt, .floors_config, .roomops_zap  {
1178  width: 100%;
1179 }
1180
1181 #address_book_popup {
1182         position: absolute;
1183         top: 100px;
1184         right: 25px;
1185         width: 320px;
1186         height: auto;
1187         z-index: 100;
1188         display: none;
1189 }
1190
1191 #address_book_popup_container_div {
1192         position: relative;
1193         width: 100%;
1194         height: 100%;
1195 }
1196
1197 #address_book_popup_middle_div {
1198         position: relative;
1199 }
1200
1201 #address_book_inner_div {
1202         margin: 5px;
1203 }
1204
1205 #address_book_inner_div select {
1206         width: 100%;
1207 }
1208
1209 #address_book_inner_div input {
1210         margin: 4px 5px 0 5px;
1211 }
1212
1213 .service .edit_col, .service .host_col {
1214         display: none;
1215 }
1216
1217 .who_is_online .edit_col, .who_is_online .host_col {
1218         display: block;
1219 }
1220
1221 #citlogo {
1222     display: none; /* Overriden later */
1223 }
1224 .sort_ascending, .sort_descending {
1225     background-repeat: no-repeat;
1226     background-position: center right;
1227 }
1228 .sort_ascending {
1229     background-image: url("/static/down_pointer.gif");
1230 }
1231 .sort_descending {
1232     background-image: url("/static/up_pointer.gif");
1233 }
1234 #message_list_hdr > table {
1235     border-collapse: collapse;
1236 }
1237 #message_list_hdr > table > tbody > tr > th {
1238     border-left: 2px solid white;
1239     border-right: 2px solid white;
1240 }
1241 #summary_view > table { 
1242     border-collapse: collapse;
1243 }
1244 th.col1 {
1245     border-left: none !important;
1246 }
1247 th.col3 {
1248     border-right: none !important;
1249 }
1250 /* System Administration Menu */
1251
1252 ul.adminitems {
1253         margin: 15px;
1254         padding: 0;
1255 }
1256
1257 ul.adminitems li {
1258         margin: 0.5em;
1259         padding: 0;
1260 }
1261
1262 ul.adminitems li span {
1263         display: block;
1264 }
1265
1266
1267 /* Room list - Tree Node */
1268
1269 .treetitle, .editednode, .treetitleselectedfocused, .treetitleselectedblured {
1270         padding: 2px;
1271         cursor: default;
1272 }
1273
1274
1275 table.altern {
1276         margin: 0 auto 0 auto;
1277         width: 98%
1278
1279
1280 table.altern tr td {
1281         height: 2em;    
1282
1283
1284 /* Advanced menu */
1285
1286 table.advanced {
1287         margin: 0 auto 0 auto;
1288         width: 96%;
1289         border-collapse: separate;
1290         border-spacing: 15px;
1291
1292
1293 .advanced .boxcontent ul {
1294         margin-left: 4em;
1295 }
1296
1297 .advanced .boxcontent .col1, .advanced .boxcontent .col2 { 
1298         float: left;
1299         width: 33%;
1300 }
1301
1302 .advanced .boxcontent .col2, .advanced .boxcontent .lastcol {
1303         margin-left: 0;
1304         margin-bottom: 4em;
1305 }
1306
1307 /* Site configuration */
1308
1309 #TheTabs {
1310 }
1311
1312 .tabs_background {
1313         margin-top: 0;
1314 }
1315
1316 /* Links and buttons */
1317
1318 .logbuttons, .buttons {
1319         margin: 2px auto 2px auto;
1320         width: 96%;
1321         text-align: center;
1322 }
1323
1324 /* Tabs */
1325
1326 #TheTabs {
1327         margin: 3% auto 0 auto;
1328         width: 94%;
1329 }
1330
1331 ul.tabbed_dialog {
1332         list-style: none;
1333         margin: 3% auto 0 auto;
1334         width: 96%;
1335         padding: 0;
1336         white-space: nowrap;
1337         text-align: center;
1338         vertical-align: middle;
1339 }
1340
1341 ul.tabbed_dialog li {
1342         margin: 0 3% 0 3%;
1343         padding: 4px;
1344         float: left;
1345 }
1346
1347 .tabcontent {
1348         margin: 0 auto 0 auto;
1349         width: 96%;
1350         padding: 10px;
1351         clear: both;
1352 }
1353
1354 .tabcontent_submit {
1355         margin: 0 auto 0 auto;
1356         width: 96%;
1357         padding: 10px;
1358         text-align: center;
1359 }
1360
1361
1362 /* Calendar view */
1363
1364 .calendar {
1365         background-color: #204B78;
1366         margin: 0;
1367         width: 100%;
1368         height: 302px;
1369 }
1370
1371 td.events_of_the_day {
1372         width: 500px;
1373 }
1374
1375 .events_of_the_day dl {
1376         margin: 0;
1377         padding: 0;
1378         position: absolute;
1379         top: 0;
1380         left:0;
1381         width: 500px;
1382 }
1383
1384 .events_of_the_day dl dt {
1385         background-color: #FFFFFF;
1386         margin: 0;
1387         width: 500px;
1388         border: 1px solid #CCC;
1389 }
1390
1391 .events_of_the_day dl dt.hour {
1392         /* font-size: 160%; commenting out because we need to line it up with the actual size */
1393 }
1394
1395 .events_of_the_day dl dt.extrahour {
1396         /* font-size: 80%; commenting out because we need to line it up with the actual size */
1397 }
1398
1399 .hour_label, .extra_events dl dt {
1400         background-color: #CCCCDD;
1401         vertical-align: middle;
1402         text-align: left;       
1403 }
1404
1405 .hour_events, .extra_events {
1406         background-color: #FFFFFF;
1407         vertical-align: top;
1408         text-align: left;       
1409 }
1410
1411
1412 .extra_events ul {
1413         list-style: none;
1414         margin: 0;
1415         padding: 0;
1416 }
1417
1418 .extra_events ul li {
1419         margin: 4px;
1420 }
1421
1422 .calday, .calout, .calweekend, .caltoday {
1423         width: 14%;
1424         height: 60px;
1425         text-align: left;
1426         vertical-align: top;
1427 }
1428
1429 .event_framed_unread {
1430         filter:alpha(opacity=50);   /* Internet Explorer 6     */
1431         -moz-opacity:0.5;           /* Mozilla 1.6 and prec.   */
1432         opacity: 0.5;               /* CSS3 draft and Mozilla  */
1433         -moz-border-radius: 8px;    /* CSS3 draft and Mozilla  */
1434         border: solid 1px red;
1435         background-color: yellow;
1436         z-index: 10;
1437         padding: 0 4px 0 4px; 
1438 }
1439
1440 li.event_framed_unread span, a.event_title {
1441         filter:alpha(opacity=100); 
1442         -moz-opacity:1.0;         
1443         opacity: 1.0;
1444         font-size: 100%;     
1445 }
1446
1447 .event_framed_read {
1448         filter:alpha(opacity=50);   /* Internet Explorer 6     */
1449         -moz-opacity:0.5;           /* Mozilla 1.6 and prec.   */
1450         opacity: 0.5;               /* CSS3 draft and Mozilla  */
1451         -moz-border-radius: 8px;    /* CSS3 draft and Mozilla  */
1452         border: solid 1px red;
1453         background-color: yellow;
1454         z-index: 10;
1455         padding: 0 4px 0 4px; 
1456 }
1457
1458 li.event_framed_read span, a.event_title {
1459         filter:alpha(opacity=100); 
1460         -moz-opacity:1.0;         
1461         opacity: 1.0;
1462         font-size: 100%;  
1463 }
1464
1465 .event_read {
1466 }
1467
1468 li.event_read span, a.event_read_title {
1469         filter:alpha(opacity=100); 
1470         -moz-opacity:1.0;         
1471         opacity: 1.0;
1472         font-size: 100%;     
1473 }
1474
1475 .event_unread {
1476 }
1477
1478 li.event_unread span, a.event_read_title {
1479         filter:alpha(opacity=100); 
1480         -moz-opacity:1.0;         
1481         opacity: 1.0;
1482         font-size: 100%;     
1483 }
1484
1485 .mini_calendar {
1486    color: #fff;
1487 }
1488
1489 .mini_calendar a {
1490    color: #fff;
1491 }
1492
1493 .mini_calendar a:link,.mini_calendar a:visited {
1494    color: #fff;
1495 }
1496
1497 .mini_calendar a:hover,.mini_calendar a:active {
1498    color: #fff;
1499    background-color: #AD1C00;
1500 }
1501
1502 .mini_calendar td a {
1503    color: #fff;
1504 }
1505
1506 .mini_calendar td a:link,.mini_calendar td a:visited {
1507    color: #fff;
1508 }
1509
1510 .mini_calendar td a:hover,.mini_calendar td a:active {
1511    color: #fff;
1512    background-color: #AD1C00;
1513
1514 }
1515
1516 .menudesc {
1517         margin: 4px;
1518         padding: 4px;
1519 }
1520
1521 .roompic {
1522       height: 48px;
1523       width: 48px;
1524       border: none;
1525 }
1526 #navbar ul li a img {
1527       vertical-align: middle;
1528       border: none;
1529 }
1530 .table-row, .table-alt-row {
1531     width: 100%;
1532 }
1533
1534 .stickynote_outer {
1535         position: absolute;
1536         width: 200px;
1537         height: 200px;
1538         border: 1px solid #333;
1539         background-color: #ffff00;
1540         overflow: hidden;
1541 }
1542
1543 .stickynote_titlebar {
1544         position: relative;
1545         width: 100%;
1546         height: 16px;
1547         top: 0px;
1548         left: 0px;
1549         background-color: #888800;
1550         font-size: 60%;     
1551 }
1552
1553 .stickynote_body {
1554         position: relative;
1555         font-family: "Comic Sans MS", sans-serif;
1556 }
1557
1558 .stickynote_resize {
1559         position: absolute;
1560         background-image: url('resizecorner.png');
1561         height: 16px;
1562         width: 16px;
1563         right: -1px;
1564         bottom: -1px;
1565 }
1566
1567 .stickynote_palette {
1568         position: absolute;
1569         width: 48px;
1570         height: 48px;
1571         top: 16px;
1572         left: 0px;
1573         background-color: #ffffff;
1574         border: 1px solid #333;
1575         display: none;
1576 }
1577
1578 .stickynote_palette table {
1579         margin: 0;
1580         padding: 0;
1581 }
1582
1583 .stickynote_palette td {
1584         width: 16px;
1585         height: 16px;
1586 }
1587
1588
1589 .login_using_openid_link {
1590         text-align: center;
1591 }
1592
1593 .openid_urlarea {
1594         background: url('openid-small.gif') no-repeat scroll 0pt 50%;
1595         padding-left: 18px;
1596 }
1597
1598 .conftitle {
1599         font-size: 140%;
1600         font-weight: bold;
1601         text-align: center;
1602 }
1603
1604 .confdescr {
1605         font-size: 110%;
1606         text-align: center;
1607 }
1608
1609 #noscript_warning {
1610         position: fixed;
1611         top: 0;
1612         left: 0;
1613         background-color: #FF0000;
1614         color: #FFFFFF;
1615 }
1616
1617 .chatrecv_history {
1618         margin-left: 5px;
1619         margin-right: 5px;
1620         margin-top: 5px;
1621         margin-bottom: 5px;
1622         height: 70%;
1623         background-color: #FFFFFF;
1624         overflow: auto;
1625 }
1626
1627 .chatrecv {
1628         display: none;
1629 }
1630
1631 .chatsend {
1632         width: 90%;
1633         margin-left: auto;
1634         margin-right: auto;
1635 }
1636
1637 .chat_username_me {
1638         font-weight: bold;
1639         color: #f00;
1640 };
1641
1642 .chat_username_notme {
1643         font-weight: bold;
1644         color: #00f;
1645 };
1646
1647 .chat_text {
1648 };