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