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