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