* Changed the room banner layout back to a table. Say what you want about table...
[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: hidden;
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         margin: 0;
613         padding: 3% 6% 3% 6%;
614 }
615
616 #convlogin, #validate {
617         text-align: center;
618 }
619
620 #iconbar, #banner, #content, #message_list_hdr, #message_list, #preview_pane  {
621         text-align: left;
622 }
623
624 .message_content > div > div {
625         text-align: justify !important;
626 }
627
628 #iconbar {
629         position: absolute;
630         top: 0;
631         left: 0;
632         bottom: 0;
633         width: 16%;             /* when changing this, also change #banner width */
634         z-index: 0;
635         overflow: auto;
636         overflow-x: hidden !important;
637 }
638
639 /* Please avoid setting heights for any of the mailbox view elements (except summary_view
640  * and resize). In particular, do NOT set any for message_list_hdr as its not good feng shui
641  */
642
643 #message_list_hdr {
644         display: block;
645         top: 0;
646         left: 0;
647         width: 100%;
648         padding-bottom: 0;
649         margin-bottom: 0;
650         background-color: #CCCCCC;
651 }
652
653 #summary_view {
654         height: 100px;
655         overflow-y: scroll;
656         overflow-x: hidden;
657         cursor: pointer;
658 }
659
660 #summary_headers {
661         background-color: white;
662         width: 100%;
663         table-layout: fixed;
664 }
665
666 #summary_headers tr td {
667         overflow-y: hidden;
668         overflow-x: hidden; /* stop long subjects overflowing */
669 }
670
671 .col1 {
672         width: 50%;
673 }
674
675 .col2 { 
676         width: 30%;
677 }
678
679 .col3 {
680         width: 20%;
681 }
682
683 .col1, .col2, .col3 {
684         cursor: pointer;
685         text-overflow: ellipsis;
686         -o-text-overflow: ellipsis;
687 }
688
689 .new_message {
690         font-weight: bold; !important;
691 }
692
693 #loading {
694         text-align: center;
695 }
696
697 #resize_msglist {
698         width: 100%;
699         overflow: hidden;
700         cursor: s-resize;
701         height: 6px;
702 }
703
704 #preview_pane {
705         overflow: auto; 
706 }
707
708 .fix_scrollbar_bug {
709         margin-right: 1px;              /* Gecko and other non-broken browsers */
710         font-size: 90%;                 /* Most stuff needs to be a little smaller than normal. */
711 }
712
713 /* Boxes */
714
715 .box {
716         width: 100%;
717         padding: 0;
718         margin: 0;
719 }
720
721 #content .boxlabel, #global .boxlabel {
722         margin: 0;
723         padding: 0;
724         width: 100%;
725         text-align: center;
726 }
727
728 #content .box {
729         margin: 0;
730         padding: 0;
731         width: 100%;
732         text-align: center;
733 }
734
735 .boxlabel, .boxcontent {
736         margin: 0;
737 }
738
739 .boxlabel {
740         text-align: center;
741         padding: 0;
742 }
743
744 .boxcontent {
745         text-align: left;
746         padding: 5px;
747 }
748
749 .ctdlTemplate {
750         display: none;
751 }
752
753 #ctdlContextMenu {
754         position: fixed;
755         background-color: white;
756         border: 1px solid black;
757 }
758
759 .draganddrop {
760         position: fixed;
761         display: block;
762         border: 1px solid black;
763         z-index: 65535;
764         background-color: white;
765         text-align: left;
766         opacity: 0.9;
767 }
768
769 .draganddrop > ul {
770         list-style: none;
771         padding-left: 0;
772         margin-left: 0;
773 }
774
775 .hidden {
776         display: none;
777 }
778
779 /* Login */
780
781 #login_screen .login_message, #login_screen .login_image, .login_hello, #login_screen #login_form {
782         display: block;
783         margin: 5px auto 5px auto;
784 }
785
786 #login_screen .login_message, .login_hello, #global center {
787         width: 80%;
788 }
789
790 #login_screen .login_image {
791         width: 135px;
792 }
793
794 #login_screen .login_image img {
795         text-align: center;
796 }
797
798 #login_screen #login_form {
799         padding: 10px;
800         width: 330px;
801 }
802
803 #login_form input, #login_form label, #login_form select {
804         display: block;
805         float: left;
806         margin: 6pt;
807 }
808
809 #login_form label, #pname, #uname {
810         width: 130px;
811         text-align: left;
812 }
813
814 #login_form br {
815         clear: left;
816 }
817
818 .login_infos {
819         display: block;
820         margin: 20px auto 0 auto;
821         width: 80%;
822         text-align: left;
823 }
824
825
826 /* Iconbar */
827
828 .logo, .logo_citadel, #iconbar #button, .iconbar_text, .ib_button {
829         margin: 0;
830         padding: 0;
831 }
832
833 .logo, #citlogo, .iconbar_text, #online_users li {
834         text-align: center;
835 }
836
837 .iconbar_text > span {
838         cursor: pointer;
839 }
840
841 #iconbar #button {
842         width: 100%;
843 }
844
845 .ib_button {
846         margin: 4px 8px 4px 8px;
847         padding: 0;
848         display: block;
849 }
850
851 .ib_button_link {
852         /* width: 100%; */
853         display: block;
854 }
855
856 #online_users {
857         display: none; /* Hide by default */
858         border: 0;
859         max-height: 200px;
860         overflow: auto;
861         padding-left: 0;
862
863 #online_users li {
864         list-style: none;
865         margin: 0;
866         padding: 2px;
867         white-space: nowrap;
868 }
869
870
871 .ib_roomlist_floor, .ib_roomlist_new, .ib_roomlist_old, .roomlist_floor, .roomlist_new, .roomlist_old {
872         margin: 4px;
873         padding: 0;
874 }
875
876 /* Banner */
877 #banner .banner {
878         display: table-cell;
879         width: 90%;
880 }
881
882 #banner .banner img {
883         float: left;
884         margin: 0 5px 15px 0;
885 }
886
887 #banner h1, #banner h2, #banner .banner .infos, #banner .banner p {
888         margin: 2px;
889         padding: 0;
890 }
891
892 #room_infos {
893         position: absolute;
894         top: 0;
895         left: 50%;
896         width: 45%;
897         z-index: 10;
898         cursor: pointer;
899         text-align: left;
900         padding: 10px 2px 2px 2px;
901 }
902
903 #room_infos img.close_infos {
904         float: right;
905 }
906
907 #actiondiv {
908         position: absolute;
909         right: 0;
910         top: 0;
911 }
912
913 #banner ul.room_actions {
914         list-style: none;
915         text-align: left;
916 }
917 #banner ul.room_actions li {
918         white-space: nowrap;
919         display: inline;
920 }
921 #banner ul.room_actions li form {
922         margin: 0;
923         padding: 0;
924 }
925 #banner ul.room_actions li select, #banner ul.room_actions li input {
926         margin-top: 8px;
927         margin-right: 4px;
928 }
929 #selectpage.hidden {
930         display: none !important;
931 }
932
933 /* Navbar */
934
935 #navbar ul, .selector_top, .selector_bottom {
936         width: 100%;
937         margin: 0 auto 0 auto;
938         padding: 0;
939         white-space: nowrap;
940         text-align: center;
941         vertical-align: middle;
942 }
943
944 #navbar ul li {
945         display: inline;
946         list-style: none;
947         vertical-align: middle;
948 }
949
950 #navbar ul li a {
951         padding: 2px 8px 8px 8px;
952         white-space: nowrap;
953 }
954
955 #navbar ul li img {
956         float: none;
957         margin: 0 2px 0 2px;
958 }
959
960 .floor {
961         margin-left: 0px;
962 }
963
964 .floor > ul {
965         display: none;
966 }
967
968 .floor-expanded > ul{
969         display: block !important;
970 }
971
972 #roomlist > ul {
973         margin: 0;
974         padding: 0;
975 }
976
977 #roomlist > div > ul > li {
978         margin: 0;
979         padding: 0;
980 }
981
982 /* Override to disable list-style-image" */
983 .room a, .room a, .room a:visited, .room a:link {
984         color: #333333;
985 }
986
987 .room-private {
988         list-style-image: url("/static/privatemess_16x.gif");
989 }
990
991 .room-addr {
992         list-style-image: url("/static/viewcontacts_16x.gif");
993 }
994
995 .room-cal {
996         list-style-image: url("/static/calarea_16x.gif");
997 }
998
999 .room-tasks {
1000         list-style-image: url("/static/taskmanag_16x.gif");
1001 }
1002
1003 .room-notes {
1004         list-style-image: url("/static/storenotes_16x.gif");
1005 }
1006
1007 .room-chat {
1008         list-style-image: url("/static/chatrooms_16x.gif");
1009 }
1010
1011 .room-newmsgs {
1012         font-weight: bold;
1013 }
1014
1015 .room-emphasized {
1016         text-decoration: underline;
1017 }
1018
1019 /* Content */
1020
1021 .boxcontent table {
1022         margin: 0;
1023         padding: 0;
1024 }
1025
1026 #content table .box {
1027         margin: 0;
1028         width: 100%;
1029         text-align: left;
1030 }
1031
1032 .service, .who_is_online {
1033         text-align: center;
1034         width: 100%;
1035 }
1036
1037 .service table {
1038         margin: 0 auto 0 auto;
1039         width: 100%;
1040         text-align: left;
1041 }
1042
1043 .instructions {
1044         text-align: center;
1045 }
1046
1047 #message_list_hdr table {
1048         width: 100%;    
1049 }
1050 .selector_top, .selector_bottom {
1051         text-align: center;
1052 }
1053
1054 .selector_top p,.selector_bottom p {
1055         margin: 0;
1056         padding: 2px;
1057 }
1058
1059 .message {
1060         margin: 1%;
1061         padding: 0;
1062 }
1063
1064 .message_header p {
1065         margin: 2px 0 2px 0;
1066         padding: 0 0 2px 0;
1067 }
1068
1069 .button_link a, .attachfile, .logbuttons input,.buttons input, .send_edit_msg input, .logbutton {
1070         margin: 3px;
1071         padding: 2px 4px 2px 4px;
1072 }
1073
1074 .msgbuttons a, input#delbutton {
1075         margin: 0 3px 0 3px;
1076         padding: 2px 4px 2px 4px;
1077 }
1078
1079
1080 .mimepart {
1081         margin-top: 15px;
1082         margin-bottom: 15px;
1083         margin-left: 15%;
1084         width: 70%;
1085         padding: 0;
1086 }
1087
1088 .mimepart img {
1089         vertical-align: middle;
1090         float: left;
1091 }
1092
1093 .mimepart div {
1094         vertical-align: middle;
1095         margin: 0 0 15px 0 ;
1096         padding: 5px;
1097 }
1098
1099 .mimepart div span {
1100         vertical-align: top;
1101 }
1102
1103 .mimepart dl {
1104         width: 100%;
1105         margin-left: 5px;
1106         padding: 5px;
1107 }
1108
1109 .mimepart dl dt {
1110         width: 30%;
1111         float: left;
1112         margin: 0 0 0 0;
1113         padding: .5em;
1114 }
1115
1116 .mimepart dl dd {
1117         float: left;
1118         width: 62%;
1119         margin: 0;
1120         padding: .5em;
1121 }
1122
1123 .mimepart p {
1124         margin-top: 1em;
1125         margin-bottom: 0;
1126         clear: both;
1127 }
1128
1129 .msgbuttons {
1130         float: right;
1131         visibility: hidden;
1132         padding: 2px;
1133         font-size: 80%;
1134 }
1135
1136 .buttons a {
1137         text-align: center;
1138 }
1139
1140 .msgbuttons a span {
1141         display: none;
1142 }
1143
1144 .message_content {
1145         margin: 0;
1146         padding: 0.3em;
1147         clear: both;
1148 }
1149
1150 .message form div label {
1151         display: block;
1152         float: left;
1153         margin: 0.3em;
1154         width: 9em;
1155         text-align: right;
1156 }
1157
1158 .message form div input, .message form div select {
1159         margin: 0.3em;
1160
1161 }
1162
1163 .imgedit {
1164         vertical-align: middle;
1165 }
1166
1167 .send_edit_msg {
1168         float: right;
1169         margin-top: 0 ;
1170         margin-right: 0;
1171         padding: 2px 50px 2px 50px;
1172 }
1173
1174 .edit_msg_table th {
1175         text-align: right;
1176         padding-right: 5px;
1177         color: #333;
1178         width: 20%;
1179 }
1180
1181 .edit_msg_table td { 
1182         width: 40%;
1183 }
1184
1185 .edit_msg_table #recp_id, .edit_msg_table #cc_id, .edit_msg_table #bcc_id, .edit_msg_table #subject_id  {
1186         width: 98%
1187 }
1188
1189 .note {
1190         font-size: 85%;
1191         margin-left: 10%;
1192 }
1193
1194 .toolbar {
1195         text-align: center;
1196 }
1197
1198 .toolbar img {
1199         float: right;
1200 }
1201
1202 .imsg {
1203         text-align: center;
1204 }
1205
1206 colgroup.entity {
1207         text-align: center;
1208 }
1209
1210 div.auto_complete ul {
1211         margin: 0;
1212         padding: 0;
1213         width: 100%;
1214 }
1215
1216 div.auto_complete ul li {
1217         margin: 0;
1218         padding: 3px;
1219 }
1220
1221 div.auto_complete ul strong.highlight {
1222         margin: 0;
1223         padding: 0;
1224 }
1225
1226 .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  {
1227  width: 100%;
1228 }
1229
1230 #address_book_popup {
1231         position: absolute;
1232         top: 100px;
1233         right: 25px;
1234         width: 320px;
1235         height: auto;
1236         z-index: 100;
1237         display: none;
1238 }
1239
1240 #address_book_popup_container_div {
1241         position: relative;
1242         width: 100%;
1243         height: 100%;
1244 }
1245
1246 #address_book_popup_middle_div {
1247         position: relative;
1248 }
1249
1250 #address_book_inner_div {
1251         margin: 5px;
1252 }
1253
1254 #address_book_inner_div select {
1255         width: 100%;
1256 }
1257
1258 #address_book_inner_div input {
1259         margin: 4px 5px 0 5px;
1260 }
1261
1262 .service .edit_col, .service .host_col {
1263         display: none;
1264 }
1265
1266 .who_is_online .edit_col, .who_is_online .host_col {
1267         display: block;
1268 }
1269
1270 #citlogo {
1271         display: none; /* Overriden later */
1272 }
1273
1274 .sort_ascending, .sort_descending {
1275         background-repeat: no-repeat;
1276         background-position: center right;
1277 }
1278
1279 .sort_ascending {
1280         background-image: url("/static/down_pointer.gif");
1281 }
1282
1283 .sort_descending {
1284         background-image: url("/static/up_pointer.gif");
1285 }
1286
1287 #message_list_hdr > table {
1288         border-collapse: collapse;
1289 }
1290
1291 #message_list_hdr > table > tbody > tr > th {
1292         border-left: 2px solid white;
1293         border-right: 2px solid white;
1294 }
1295
1296 #summary_view > table { 
1297         border-collapse: collapse;
1298 }
1299
1300 th.col1 {
1301         border-left: none !important;
1302 }
1303
1304 th.col3 {
1305         border-right: none !important;
1306 }
1307
1308 /* System Administration Menu */
1309
1310 ul.adminitems {
1311         margin: 15px;
1312         padding: 0;
1313 }
1314
1315 ul.adminitems li {
1316         margin: 0.5em;
1317         padding: 0;
1318 }
1319
1320 ul.adminitems li span {
1321         display: block;
1322 }
1323
1324
1325 /* Room list - Tree Node */
1326
1327 .treetitle, .editednode, .treetitleselectedfocused, .treetitleselectedblured {
1328         padding: 2px;
1329         cursor: default;
1330 }
1331
1332 table.altern {
1333         margin: 0 auto 0 auto;
1334         width: 98%
1335
1336
1337 table.altern tr td {
1338         height: 2em;    
1339
1340
1341 /* Advanced menu */
1342
1343 table.advanced {
1344         margin: 0 auto 0 auto;
1345         width: 96%;
1346         border-collapse: separate;
1347         border-spacing: 15px;
1348
1349
1350 .advanced .boxcontent ul {
1351         margin-left: 4em;
1352 }
1353
1354 .advanced .boxcontent .col1, .advanced .boxcontent .col2 { 
1355         float: left;
1356         width: 33%;
1357 }
1358
1359 .advanced .boxcontent .col2, .advanced .boxcontent .lastcol {
1360         margin-left: 0;
1361         margin-bottom: 4em;
1362 }
1363
1364 /* Site configuration */
1365
1366 #TheTabs {
1367 }
1368
1369 .tabs_background {
1370         margin-top: 0;
1371 }
1372
1373 /* Links and buttons */
1374
1375 .logbuttons, .buttons {
1376         margin: 2px auto 2px auto;
1377         width: 96%;
1378         text-align: center;
1379 }
1380
1381 /* Tabs */
1382
1383 #TheTabs {
1384         margin: 3% auto 0 auto;
1385         width: 94%;
1386 }
1387
1388 ul.tabbed_dialog {
1389         list-style: none;
1390         margin: 3% auto 0 auto;
1391         width: 96%;
1392         padding: 0;
1393         white-space: nowrap;
1394         text-align: center;
1395         vertical-align: middle;
1396 }
1397
1398 ul.tabbed_dialog li {
1399         margin: 0 3% 0 3%;
1400         padding: 4px;
1401         float: left;
1402 }
1403
1404 .tabcontent {
1405         margin: 0 auto 0 auto;
1406         width: 96%;
1407         padding: 10px;
1408         clear: both;
1409 }
1410
1411 .tabcontent_submit {
1412         margin: 0 auto 0 auto;
1413         width: 96%;
1414         padding: 10px;
1415         text-align: center;
1416 }
1417
1418
1419 /* Calendar view */
1420
1421 .calendar {
1422         background-color: #204B78;
1423         margin: 0;
1424         width: 100%;
1425         height: 302px;
1426 }
1427
1428 td.events_of_the_day {
1429         width: 500px;
1430 }
1431
1432 .events_of_the_day dl {
1433         margin: 0;
1434         padding: 0;
1435         position: absolute;
1436         top: 0;
1437         left:0;
1438         width: 500px;
1439 }
1440
1441 .events_of_the_day dl dt {
1442         background-color: #FFFFFF;
1443         margin: 0;
1444         width: 500px;
1445         border: 1px solid #CCC;
1446 }
1447
1448 .events_of_the_day dl dt.hour {
1449         /* font-size: 160%; commenting out because we need to line it up with the actual size */
1450 }
1451
1452 .events_of_the_day dl dt.extrahour {
1453         /* font-size: 80%; commenting out because we need to line it up with the actual size */
1454 }
1455
1456 .hour_label, .extra_events dl dt {
1457         background-color: #CCCCDD;
1458         vertical-align: middle;
1459         text-align: left;       
1460 }
1461
1462 .hour_events, .extra_events {
1463         background-color: #FFFFFF;
1464         vertical-align: top;
1465         text-align: left;       
1466 }
1467
1468
1469 .extra_events ul {
1470         list-style: none;
1471         margin: 0;
1472         padding: 0;
1473 }
1474
1475 .extra_events ul li {
1476         margin: 4px;
1477 }
1478
1479 .calday, .calout, .calweekend, .caltoday {
1480         width: 14%;
1481         height: 60px;
1482         text-align: left;
1483         vertical-align: top;
1484 }
1485
1486 .event_framed_unread {
1487         -moz-border-radius: 8px;
1488         border: solid 1px red;
1489         background-color: yellow;
1490         z-index: 10;
1491         padding: 0 4px 0 4px; 
1492 }
1493
1494 li.event_framed_unread span, a.event_title {
1495         font-size: 100%;     
1496 }
1497
1498 .event_framed_read {
1499         -moz-border-radius: 8px;
1500         border: solid 1px red;
1501         background-color: yellow;
1502         z-index: 10;
1503         padding: 0 4px 0 4px; 
1504 }
1505
1506 li.event_framed_read span, a.event_title {
1507         font-size: 100%;  
1508 }
1509
1510 .event_read {
1511 }
1512
1513 li.event_read span, a.event_read_title {
1514         font-size: 100%;     
1515 }
1516
1517 .event_unread {
1518 }
1519
1520 li.event_unread span, a.event_read_title {
1521         font-size: 100%;     
1522 }
1523
1524 .mini_calendar {
1525    color: #fff;
1526 }
1527
1528 .mini_calendar a {
1529    color: #fff;
1530 }
1531
1532 .mini_calendar a:link,.mini_calendar a:visited {
1533    color: #fff;
1534 }
1535
1536 .mini_calendar a:hover,.mini_calendar a:active {
1537    color: #fff;
1538    background-color: #AD1C00;
1539 }
1540
1541 .mini_calendar td a {
1542    color: #fff;
1543 }
1544
1545 .mini_calendar td a:link,.mini_calendar td a:visited {
1546    color: #fff;
1547 }
1548
1549 .mini_calendar td a:hover,.mini_calendar td a:active {
1550    color: #fff;
1551    background-color: #AD1C00;
1552
1553 }
1554
1555 .menudesc {
1556         margin: 4px;
1557         padding: 4px;
1558 }
1559
1560 .roompic {
1561         height: 48px;
1562         width: 48px;
1563         border: none;
1564 }
1565
1566 #navbar ul li a img {
1567       vertical-align: middle;
1568       border: none;
1569 }
1570
1571 .table-row, .table-alt-row {
1572         width: 100%;
1573 }
1574
1575 .stickynote_outer {
1576         position: absolute;
1577         width: 200px;
1578         height: 200px;
1579         border: 1px solid #333;
1580         background-color: #ffff00;
1581         overflow: hidden;
1582 }
1583
1584 .stickynote_titlebar {
1585         position: relative;
1586         width: 100%;
1587         height: 16px;
1588         top: 0px;
1589         left: 0px;
1590         background-color: #888800;
1591         font-size: 60%;     
1592 }
1593
1594 .stickynote_body {
1595         position: relative;
1596         font-family: "Comic Sans MS", sans-serif;
1597 }
1598
1599 .stickynote_resize {
1600         position: absolute;
1601         background-image: url('resizecorner.png');
1602         height: 16px;
1603         width: 16px;
1604         right: -1px;
1605         bottom: -1px;
1606 }
1607
1608 .stickynote_palette {
1609         position: absolute;
1610         width: 48px;
1611         height: 48px;
1612         top: 16px;
1613         left: 0px;
1614         background-color: #ffffff;
1615         border: 1px solid #333;
1616         display: none;
1617 }
1618
1619 .stickynote_palette table {
1620         margin: 0;
1621         padding: 0;
1622 }
1623
1624 .stickynote_palette td {
1625         width: 16px;
1626         height: 16px;
1627 }
1628
1629
1630 .login_using_openid_link {
1631         text-align: center;
1632 }
1633
1634 .openid_urlarea {
1635         background: url('openid-small.gif') no-repeat scroll 0pt 50%;
1636         padding-left: 18px;
1637 }
1638
1639 .conftitle {
1640         font-size: 140%;
1641         font-weight: bold;
1642         text-align: center;
1643 }
1644
1645 .confdescr {
1646         font-size: 110%;
1647         text-align: center;
1648 }
1649
1650 #noscript_warning {
1651         position: fixed;
1652         top: 0;
1653         left: 0;
1654         background-color: #FF0000;
1655         color: #FFFFFF;
1656 }
1657
1658 .chatrecv_history_class {
1659         position: absolute;
1660         top: 0;
1661         left: 1%;
1662         width: 74%;
1663         margin-top: 5px;
1664         margin-bottom: 5px;
1665         height: 70%;
1666         background-color: #FFFFFF;
1667         overflow: auto;
1668         border-style: solid;
1669         border-color: #022750;
1670         border-width: 1px;
1671         padding-left: 3px;
1672         padding-right: 3px;
1673 }
1674
1675 .chat_userlist_class {
1676         position: absolute;
1677         top: 0;
1678         right: 1%;
1679         width: 23%;
1680         margin-top: 5px;
1681         margin-bottom: 5px;
1682         height: 70%;
1683         background-color: #FFFFFF;
1684         overflow: auto;
1685         border-style: solid;
1686         border-color: #022750;
1687         border-width: 1px;
1688         padding-left: 3px;
1689         padding-right: 3px;
1690 }
1691
1692 .chatrecv_class {
1693         display: none;
1694 }
1695
1696 .chatsend_class {
1697         position: absolute;
1698         left: 1%;
1699         right: 1%;
1700         height: 28%;
1701         bottom: 0;
1702         margin-top: 5px;
1703         margin-bottom: 5px;
1704         margin-left: auto;
1705         margin-right: auto;
1706         border-style: solid;
1707         border-color: #022750;
1708         border-width: 1px;
1709         padding-left: 3px;
1710         padding-right: 3px;
1711         background-color: #004E79;
1712 }
1713
1714 .chat_myname_class {
1715         font-weight: bold;
1716         color: #ff0000;
1717 }
1718
1719 .chat_notmyname_class {
1720         font-weight: bold;
1721         color: #0000ff;
1722 }
1723
1724 .chat_text_class {
1725 }
1726
1727 /*---------- bubble tooltips start -----------*/
1728
1729 a.event_title, a.event_unread, a.event_read {
1730         position:relative;
1731         z-index:24;
1732 }
1733
1734 a.event_title span, a.event_unread span, a.event_read span {
1735         display: none;
1736 }
1737
1738 /* background:; ie hack, something must be changed in a for ie to execute it */
1739
1740 a.event_title:hover, a.event_unread:hover, a.event_read:hover {
1741         z-index:25;
1742         background:;
1743 }
1744
1745 a.event_title:hover span.tooltip, a.event_unread:hover span.tooltip, a.event_read:hover span.tooltip {
1746         display:block;
1747         position:absolute;
1748         top:0px; left:0;
1749         padding: 15px 0 0 0;
1750         width:200px;
1751         text-align: center;
1752 }
1753
1754 a.event_title:hover span.btttop, a.event_unread:hover span.btttop, a.event_read:hover span.btttop {
1755         display: block;
1756         padding: 30px 8px 0;
1757         background: url(/static/bubble.gif) no-repeat top;
1758 }
1759
1760 /* different middle bg for stretch */
1761 a.event_title:hover span.bttmiddle, a.event_unread:hover span.bttmiddle, a.event_read:hover span.bttmiddle {
1762         display: block;
1763         padding: 0 8px; 
1764         background: url(/static/bubble_filler.gif) repeat bottom; 
1765         color: #022750;
1766         font-size: 10px;
1767 }
1768
1769 a.event_title:hover span.bttbottom, a.event_unread:hover span.bttbottom, a.event_read:hover span.bttbottom {
1770         display: block;
1771         padding:3px 8px 10px;
1772         background: url(/static/bubble.gif) no-repeat bottom;
1773 }
1774
1775 /*---------- bubble tooltips end -----------*/