webcit/static/styles/webcit.css

   1 /*
   2  * Copyright 2005 - 2011 The Citadel Team
   3  * Licensed under the GPL V3
   4  */
   5
   6 /* These stylesheets were split from this one for convenience */
   7
   8 @import url("login.css");
   9 @import url("global.css");
  10 @import url("iconbar.css");
  11 @import url("banner.css");
  12 @import url("navbar.css");
  13 @import url("content.css");
  14 @import url("box.css");
  15 @import url("message.css");
  16 @import url("modal.css");
  17 @import url("service.css");
  18
  19 @media print {
  20         input#toggler, .toolbar { display: none }
  21 }
  22
  23 html, body {
  24         font-size: 100%;
  25         height:100%;
  26         width:100%;
  27         margin:0;
  28         padding:0;
  29         overflow:hidden;
  30 }
  31
  32 .address_book_popup_title { font-size: 130% }
  33
  34 #button, #content .button_link a, input#delbutton,.attachfile, .buttons input, .buttons a, .customize, .menubar_link, #banner ul.room_actions li, .selector_top, .selector_bottom, .banner .infos,li.search,li.view, .room_actions form select option, .selectbox, ul.adminitems li span, #message_list tr > td {
  35         font-size: 100%;
  36 }
  37
  38 #message_list_hdr table { font-size: 80% }
  39
  40 .mailbox_summary { font-size: 80% }
  41
  42 /* Color */
  43
  44 body {
  45         background-color: #F3F6F2;
  46         font-family: sans-serif;
  47 }
  48
  49 .marked_row {
  50         color: white;
  51         background-color: #69aaff !important;
  52 }
  53
  54 .service form div,table.altern .odd, #message_list, #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 {
  55         background-color: #FFF;
  56         color: #000;
  57 }
  58
  59 #message_list_hdr table, #resize_msglist, .vcard_edit_background_alt,.roomops_background_alt {
  60         background-color: #CCC;
  61 }
  62
  63 #room_infos, #address_book_popup, .roomops_cell, .roomops_cell_edit, .mimepart {
  64         background-color: #deded0;
  65         color: #5C646B;
  66 }
  67
  68 #room_infos, #address_book_popup, .mimepart, .room_actions form select {
  69         border: 1px solid #5C646B;
  70         overflow: scroll;
  71 }
  72
  73 .buttons a,.tablabel,.treetitle {
  74         color: #000;
  75         font-weight: 700;
  76 }
  77
  78 .mimepart div,.required { font-weight: 700 }
  79
  80 .selector_top,.selector_bottom {
  81         background-color: #022750;
  82         border-top: 1px solid black;
  83         border-bottom: 1px solid black;
  84         color: #FFF;
  85 }
  86
  87 #message_list_hdr form input { border: 0 }
  88
  89 #message_list_hdr select {
  90         background-color: #3E65AF;
  91         color: #F1BD22;
  92         border: 1px solid #6C91A6;
  93 }
  94
  95 #message_list_hdr table { font-style: italic }
  96
  97 #resize_msglist {
  98         background-image: url(/static/webcit_icons/resizegrippy.gif);
  99         background-position: center;
 100         background-repeat: no-repeat;
 101 }
 102
 103 #resize_msglist hr {
 104         background-color: #999;
 105         border: 0;
 106         color: #999;
 107         height: 3px;
 108 }
 109
 110 .adminlist { list-style: none }
 111
 112 .customize {
 113         background-color: #DDC;
 114         color: #004;
 115         font-style: italic;
 116 }
 117
 118 .default {
 119         font-style: normal;
 120         text-decoration: underline;
 121 }
 122
 123 .editednodeinput {
 124         background-color: #FFF;
 125         border: 1px solid #000;
 126         color: #000;
 127         height: 17px;
 128         width: 150px;
 129 }
 130
 131 .error a:link, .error a:visited, .error a:active {
 132         background: none;
 133         color: #DC143C;
 134         text-decoration: underline;
 135 }
 136
 137 .error strong {
 138         background: #FFD700;
 139         color: #DC143C;
 140         text-decoration: none;
 141 }
 142
 143 .error strong a:link,.error strong a:visited,.error strong a:active {
 144         background: #FFD700;
 145         color: #DC143C;
 146 }
 147
 148 .errormsg {
 149         background: none;
 150         color: #A00;
 151         font-style: italic;
 152         font-weight: 700;
 153 }
 154
 155 .floors_config, .roomops_zap {
 156         background-color: #700;
 157         border: 0;
 158 }
 159
 160 .imsg {
 161         background: none;
 162         color: #AAA;
 163         font-style: italic;
 164         font-weight: 700;
 165 }
 166
 167 .menubar_bg { background-color: red }
 168
 169 .mimepart div span {
 170         display: block;
 171         font-style: italic;
 172 }
 173
 174 .mimepart dl dd, .mimepart dl dt {
 175         border-top: 1px solid #AAA;
 176 }
 177
 178 .mailbox_summary td {
 179         /* border-top: 1px solid #AAA; */
 180         white-space: nowrap;
 181         overflow: hidden;
 182 }
 183
 184 .mimepart dl dt { font-weight: 700 }
 185
 186 .roomops_cell_label, .tab_cell_label {
 187         background-color: #424b52;
 188         color: #EABB3A;
 189         font-size: 80%;
 190         font-weight: bold;
 191         border-radius: 8px 8px 0 0;
 192         -webkit-border-radius: 8px 8px 0 0;
 193         -moz-border-radius: 8px 8px 0 0;
 194 }
 195
 196 .selectbox {
 197         background-color: #FF8000;
 198 }
 199
 200 .tab_cell, .tab_cell_edit {
 201         background-color: #5c646b;
 202         color: #F9FDFB;
 203         font-size: 80%;
 204         font-weight: bold;
 205         border-radius: 8px 8px 0 0;
 206         -webkit-border-radius: 8px 8px 0 0;
 207         -moz-border-radius: 8px 8px 0 0;
 208 }
 209
 210 .tabcontent {
 211         background-color: #FEFFFC;
 212         border: 2px solid #424B52;
 213 }
 214
 215 .treetitleselectedblured {
 216         background-color: menu;
 217         color: windowtext;
 218 }
 219
 220 .treetitleselectedfocused {
 221         background-color: highlight;
 222         color: highlighttext;
 223 }
 224
 225 .warning a:link, .warning a:visited, .warning a:active, .warning {
 226         background: none;
 227         color: #FF4500;
 228 }
 229
 230 .warning, .warning strong { text-decoration: none }
 231
 232 .warning a:link,.warning a:visited,.warning a:active {
 233         text-decoration: underline;
 234 }
 235
 236 .warning strong {
 237         background: #FFD700;
 238         color: #FF4500;
 239 }
 240
 241 .warning strong a:link,.warning strong a:visited,.warning strong a:active {
 242         background: #FFD700;
 243         color: #FF4500;
 244 }
 245
 246 blockquote {
 247         background-color: #f5f5f5 !important;
 248         color: navy !important;
 249 }
 250
 251 blockquote blockquote {
 252         background-color: #ebebeb !important;
 253         color: maroon !important;
 254 }
 255
 256 blockquote blockquote blockquote {
 257         background-color: #e1e1e1 !important;
 258         color: green !important;
 259 }
 260
 261 blockquote blockquote blockquote blockquote {
 262         background-color: #d7d7d7 !important;
 263         color: purple !important;
 264 }
 265
 266 blockquote blockquote blockquote blockquote blockquote {
 267         background-color: #cdcdcd !important;
 268         color: teal !important;
 269 }
 270
 271 blockquote pre {
 272         margin-left: 1%;
 273         margin-right: 1%;
 274 }
 275
 276 div.auto_complete ul {
 277         background: #fff;
 278         border: 1px solid #888;
 279         list-style-type: none;
 280 }
 281
 282 div.auto_complete ul li.selected {
 283         background-color: #ffc;
 284 }
 285
 286 div.auto_complete ul strong.highlight { color: #800 }
 287
 288 table.altern {
 289         border-bottom: solid 2px #AAA;
 290         border-top: solid 2px #AAA;
 291 }
 292
 293 table.altern .even {
 294         background-color: #DDD;
 295 }
 296
 297 td li.frameset,.elements li.frameset {
 298         background: none;
 299         color: gray;
 300         font-weight: lighter;
 301 }
 302
 303 td li.transitional,.elements li.transitional {
 304         background: none;
 305         color: #696969;
 306         font-weight: lighter;
 307 }
 308
 309 ul.adminitems {
 310         list-style-type: disc;
 311         padding: 0;
 312 }
 313
 314 ul.adminitems li { font-weight: 700 }
 315
 316 ul.adminitems li span { color: #666 }
 317
 318 var sub { font-style: normal }
 319
 320 .week_of_year {
 321         background-color: #e1e1e1;
 322         font-size: 70%;
 323 }
 324
 325 .day { font-weight: 700 }
 326
 327 .calout { background-color: #DDDDDD }
 328
 329 .calday { background-color: #FFFFFF }
 330
 331 .calweekend { background-color: #EEEECC }
 332
 333 .caltoday { background-color: #EEEEFF }
 334
 335 .current_sort_mode { background-color: white }
 336
 337 #loading { background-color: white }
 338
 339 /* Message list in mailbox/summaryview */
 340 .table-row { background-color: white }
 341
 342 .table-alt-row { background-color: #DDDDDD }
 343
 344 /* Links */
 345
 346 a { text-decoration: none }
 347
 348 a:link, .calendar a:visited { color: #0e73e3 } /*color: #2F65DD;*/
 349
 350 a:active { color: #3E65AF }
 351
 352 a:visited { color: #70342e }
 353
 354 .roomlist_old { color: #424b52 }
 355
 356 .roomlist_new { color: #ef7114 }
 357
 358 .roomlist_new, .roomlist_old {
 359         font-size: medium;
 360         font-weight: bold;
 361         padding: 0.1em 0.3em;
 362 }
 363
 364 .roomlist_new:hover, .roomlist_old:hover{
 365         outline: 1px solid #7d858c;
 366         outline-radius: 5px;
 367         -khtml-outline-radius: 5px;
 368         -moz-outline-radius: 5px;
 369         behavior: url(/static/styles/PIE.htc);
 370 }
 371
 372 #customize a:active, #customize a:link, #customize a:visited {
 373         color: black;
 374 }
 375
 376 #important_message {
 377         background-color: #3E65AF;
 378         color: #FFF;
 379 }
 380
 381 input, select, .room_actions form select, .room_actions li.search input, .address_book_popup_title {
 382         background-color: #efefe0; /*#fbf4ca;*/
 383         border: 2px solid #5c646b;
 384         color: #333;
 385 }
 386
 387 .buttons a:hover { background-color: #5c646b; }
 388
 389 .button_link a, input#delbutton,.attachfile, .buttons input {
 390         background-color: #4d555c;
 391 }
 392
 393 .button_link a, input#delbutton,.attachfile, .buttons input {
 394         border: 2px solid #5c646b;
 395         color: #F0FEFF;
 396 }
 397
 398
 399 .button_link a, input#delbutton,.attachfile, .buttons input {
 400         cursor: pointer;
 401         -webkit-border-radius: 8px;
 402         -moz-border-radius: 8px;
 403         border-radius: 8px;
 404         behavior: url(/static/styles/PIE.htc);
 405         text-align: center;
 406 }
 407
 408 .button_link a, .attachfile,.buttons input {
 409         font-weight: bold;
 410 }
 411
 412 input#delbutton { font-weight: normal }
 413
 414 /* Layout */
 415
 416 * html { overflow: hidden }
 417
 418 html { overflow: auto }
 419
 420 body {
 421         height: 100%;
 422         overflow: hidden;
 423         text-align: center;
 424         margin-left: 0;
 425         padding: 0;
 426 }
 427
 428 #important_message {
 429         position: absolute;
 430         top: 0;
 431         right: 0;
 432         z-index: 4;
 433         padding: 3px;
 434 }
 435
 436 #hellomsg, .fmout, .nomsgs {
 437         text-align: center;
 438 }
 439
 440 #validate { text-align: center }
 441
 442 #iconbar, #banner, #content, #message_list_hdr, #message_list, #preview_pane  { text-align: left }
 443
 444 /* Please avoid setting heights for any of the mailbox view elements (except summary_view
 445  * and resize). In particular, do NOT set any for message_list_hdr as its not good feng shui
 446  */
 447 #message_listview th {
 448         border-right: 0.2em solid #fff;
 449 }
 450 #message_listview td {
 451         padding-left: 1em;
 452 }
 453
 454 #message_list_hdr {
 455         display: block;
 456         padding-bottom: 0;
 457         margin-bottom: 0;
 458         background-color: #CCCCCC;
 459 }
 460
 461 #summary_view {
 462         overflow-y: scroll;
 463         overflow-x: hidden;
 464         cursor: pointer;
 465 }
 466
 467 #summary_headers {
 468         background-color: white;
 469         table-layout: fixed;
 470 }
 471
 472 #summary_headers tr td {
 473         overflow-y: hidden;
 474         overflow-x: hidden; /* stop long subjects overflowing */
 475 }
 476
 477 #message_listview .col1 { width: 66% }
 478
 479 #message_listview .col2 { width: 22% }
 480
 481 #message_listview .col3 { width: 12% }
 482
 483 .col1, .col2, .col3 {
 484         cursor: pointer;
 485         text-overflow: ellipsis;
 486         -o-text-overflow: ellipsis;
 487 }
 488
 489 .new_message { font-weight: bold; !important }
 490
 491 #loading { text-align: center}
 492
 493 #resize_msglist {
 494         width: 100%;
 495         overflow: hidden;
 496         cursor: s-resize;
 497         height: 6px;
 498 }
 499
 500 #preview_pane { overflow: auto }
 501
 502 .ctdlTemplate { display: none }
 503
 504 #ctdlContextMenu {
 505         position: fixed;
 506         background-color: white;
 507         border: 1px solid black;
 508 }
 509
 510 .draganddrop {
 511         position: fixed;
 512         display: block;
 513         border: 1px solid black;
 514         z-index: 65535;
 515         background-color: white;
 516         text-align: left;
 517         opacity: 0.9;
 518 }
 519
 520 .draganddrop > ul {
 521         list-style: none;
 522         padding-left: 0;
 523         margin-left: 0;
 524 }
 525
 526 .hidden { display: none }
 527
 528 .floor { margin-left: 0px }
 529
 530 .floor > ul { display: none }
 531
 532 .floor-expanded > ul{ display: block !important }
 533
 534 #roomlist > ul {
 535         margin: 0;
 536         padding: 0;
 537 }
 538
 539 #roomlist > div > ul > li {
 540         margin: 0;
 541         padding: 0;
 542 }
 543
 544 /* Override to disable list-style-image" */
 545 .room a, .room a, .room a:visited, .room a:link { color: #f0feff }
 546
 547 .room-private { list-style-image: url("/static/webcit_icons/essen/16x16/email.png") }
 548
 549 .room-addr { list-style-image: url("/static/webcit_icons/essen/16x16/contact.png") }
 550
 551 .room-cal { list-style-image: url("/static/webcit_icons/essen/16x16/calendar.png") }
 552
 553 .room-tasks { list-style-image: url("/static/webcit_icons/essen/16x16/task.png") }
 554
 555 .room-notes { list-style-image: url("/static/webcit_icons/essen/16x16/note.png") }
 556
 557 .room-chat { list-style-image: url("/static/webcit_icons/essen/16x16/room.png") }
 558
 559 .room-newmsgs { font-weight: bold }
 560
 561 .room-emphasized { text-decoration: underline }
 562
 563 #message_list_hdr table { width: 100% }
 564
 565 .selector_top, .selector_bottom { text-align: center }
 566
 567 .selector_top p,.selector_bottom p {
 568         margin: 0;
 569         padding: 2px;
 570 }
 571
 572 .button_link a, .attachfile, .buttons input .logbutton {
 573         margin: 3px;
 574         padding: 2px 4px 2px 4px;
 575 }
 576
 577 input#delbutton {
 578         margin: 0 3px 0 3px;
 579         padding: 2px 4px 2px 4px;
 580 }
 581
 582
 583 .mimepart {
 584         margin-top: 15px;
 585         margin-bottom: 15px;
 586         margin-left: 15%;
 587         width: 70%;
 588         padding: 0;
 589 }
 590
 591 .mimepart img {
 592         vertical-align: middle;
 593         float: left;
 594 }
 595
 596 .mimepart div {
 597         vertical-align: middle;
 598         margin: 0 0 15px 0 ;
 599         padding: 5px;
 600 }
 601
 602 .mimepart div span { vertical-align: top }
 603
 604 .mimepart dl {
 605         width: 100%;
 606         margin-left: 5px;
 607         padding: 5px;
 608 }
 609
 610 .mimepart dl dt {
 611         width: 30%;
 612         float: left;
 613         margin: 0 0 0 0;
 614         padding: .5em;
 615 }
 616
 617 .mimepart dl dd {
 618         float: left;
 619         width: 62%;
 620         margin: 0;
 621         padding: .5em;
 622 }
 623
 624 .mimepart p {
 625         margin-top: 1em;
 626         margin-bottom: 0;
 627         clear: both;
 628 }
 629
 630 .buttons a { text-align: center }
 631
 632 .imgedit {
 633         vertical-align: middle
 634 }
 635
 636 .edit_msg_table th {
 637         text-align: right;
 638         padding: 0px;
 639         padding-right: 5px;
 640         color: #333;
 641         width: 20%;
 642 }
 643
 644 .edit_msg_table td {
 645         padding: 0px;
 646 }
 647
 648 .edit_msg_table #recp_id, .edit_msg_table #cc_id, .edit_msg_table #bcc_id, .edit_msg_table #subject_id  {
 649         width: 98%;
 650 }
 651
 652 .note {
 653         font-size: 85%;
 654         margin-left: 10%;
 655 }
 656
 657 .toolbar { text-align: center }
 658
 659 .toolbar img { float: right }
 660
 661 .imsg { text-align: center }
 662
 663 colgroup.entity { text-align: center }
 664
 665 div.auto_complete ul {
 666         margin: 0;
 667         padding: 0;
 668         width: 100%;
 669 }
 670
 671 div.auto_complete ul li {
 672         margin: 0;
 673         padding: 3px;
 674 }
 675
 676 div.auto_complete ul strong.highlight {
 677         margin: 0;
 678         padding: 0;
 679 }
 680
 681 .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 {
 682         width: 100%;
 683 }
 684
 685 #address_book_popup {
 686         position: absolute;
 687         top: 100px;
 688         right: 25px;
 689         width: 320px;
 690         height: auto;
 691         z-index: 100;
 692         display: none;
 693         -webkit-box-shadow: #666 0px 2px 3px;
 694         -moz-box-shadow: #666 0px 2px 3px;
 695         box-shadow: #666 0px 2px 3px;
 696 }
 697
 698 #address_book_popup_container_div {
 699         position: relative;
 700         width: 100%;
 701         height: 100%;
 702 }
 703
 704 #address_book_popup_middle_div { position: relative }
 705
 706 #address_book_inner_div { margin: 5px }
 707
 708 #address_book_inner_div select { width: 100% }
 709
 710 #address_book_inner_div input { margin: 4px 5px 0 5px }
 711
 712 #citlogo { display: none; /* Overriden later */ }
 713
 714 .sort_ascending, .sort_descending {
 715         background-repeat: no-repeat;
 716         background-position: center right;
 717 }
 718
 719 .sort_ascending { background-image: url("/static/webcit_icons/down_pointer.gif") }
 720
 721 .sort_descending { background-image: url("/static/webcit_icons/up_pointer.gif") }
 722
 723 #message_list_hdr > table { border-collapse: collapse }
 724
 725 #summary_view > table { border-collapse: collapse }
 726
 727 /* System Administration Menu */
 728
 729 ul.adminitems {
 730         margin: 15px;
 731         padding: 0;
 732 }
 733
 734 ul.adminitems li {
 735         margin: 0.5em;
 736         padding: 0;
 737 }
 738
 739 ul.adminitems li span { display: block }
 740
 741
 742 /* Room list - Tree Node */
 743
 744 .treetitle, .editednode, .treetitleselectedfocused, .treetitleselectedblured {
 745         padding: 2px;
 746         cursor: default;
 747 }
 748
 749 table.altern {
 750         margin: 0 auto 0 auto;
 751         width: 98%
 752 }
 753
 754 table.altern tr td {
 755         height: 2em;
 756 }
 757
 758 /* Advanced menu */
 759
 760 table.advanced {
 761         margin: 0 auto 0 auto;
 762         width: 96%;
 763         border-collapse: separate;
 764         border-spacing: 15px;
 765 }
 766
 767 .advanced .boxcontent ul { margin-left: 4em }
 768
 769 .advanced .boxcontent .col1, .advanced .boxcontent .col2 {
 770         float: left;
 771         width: 33%;
 772 }
 773
 774 .advanced .boxcontent .col2, .advanced .boxcontent .lastcol {
 775         margin-left: 0;
 776         margin-bottom: 4em;
 777 }
 778
 779 /* Site configuration */
 780
 781 .tabs_background { margin-top: 0 }
 782
 783 /* Links and buttons */
 784
 785 .buttons {
 786         margin: 2px auto 2px auto;
 787         width: 96%;
 788         text-align: center;
 789 }
 790
 791 /* Tabs */
 792
 793 #TheTabs {
 794         margin: 3% auto 0 auto;
 795         width: 94%;
 796 }
 797
 798 ul.tabbed_dialog {
 799         list-style: none;
 800         margin: 3% auto 0 auto;
 801         width: 96%;
 802         padding: 0;
 803         white-space: nowrap;
 804         text-align: center;
 805         vertical-align: middle;
 806 }
 807
 808 ul.tabbed_dialog li {
 809         margin: 0 3% 0 3%;
 810         padding: 4px;
 811         float: left;
 812 }
 813
 814 .tabcontent {
 815         margin: 0 auto 0 auto;
 816         width: 96%;
 817         padding: 10px;
 818         clear: both;
 819 }
 820
 821 .tabcontent_submit {
 822         margin: 0 auto 0 auto;
 823         width: 96%;
 824         padding: 10px;
 825         text-align: center;
 826 }
 827
 828
 829 /* Calendar view */
 830
 831 .calendar {
 832         background-color: #424b52;
 833         margin: 0 auto;
 834         width: 98%;
 835         height: 302px;
 836         border-radius: 8px;
 837         -webkit-border-radius: 8px;
 838         -moz-border-radius: 8px;
 839         behavior: url(/static/styles/PIE.htc);
 840 }
 841
 842 .calendar th {
 843         background-color: #424b52;
 844         border-color: #424b52; }
 845
 846 #inner_day { padding: 0.1em; }
 847
 848 td.events_of_the_day { width: 50% }
 849
 850 .events_of_the_day dl {
 851         margin: 0;
 852 /*      padding: 0;
 853         position: absolute;
 854         top: 0;
 855         left:0; */
 856         width: 100%;
 857 }
 858
 859 .events_of_the_day dl dt {
 860         background-color: #FFFFFF;
 861         margin: 0;
 862         width: 500px;
 863         border: 1px solid #CCC;
 864 }
 865
 866 .events_of_the_day dl dt.hour {
 867         /* font-size: 160%; commenting out because we need to line it up with the actual size */
 868 }
 869
 870 .events_of_the_day dl dt.extrahour {
 871         /* font-size: 80%; commenting out because we need to line it up with the actual size */
 872 }
 873
 874 .hour_label, .extra_events dl dt {
 875         background-color: #CCCCDD;
 876         vertical-align: middle;
 877         text-align: left;
 878 }
 879
 880 .hour_events, .extra_events {
 881         background-color: #FFFFFF;
 882         vertical-align: top;
 883         text-align: left;
 884 }
 885
 886 .extra_events { border: 1px solid #ccc }
 887
 888 .extra_events ul {
 889         list-style: none;
 890         padding: 0;
 891         margin: 0;
 892 }
 893
 894 .extra_events ul li { margin: 4px }
 895
 896 .calday, .calout, .calweekend, .caltoday {
 897         width: 14%;
 898         height: 60px;
 899         text-align: left;
 900         vertical-align: top;
 901 }
 902
 903 .event_framed_unread {
 904         -webkit-border-radius: 8px;
 905         -moz-border-radius: 8px;
 906         border-radius: 8px;
 907         behavior: url(/static/styles/PIE.htc);
 908         border: solid 1px red;
 909         background-color: yellow;
 910         z-index: 10;
 911         padding: 0 4px 0 4px;
 912 }
 913
 914 li.event_framed_unread span, a.event_title { font-size: 100% }
 915
 916 .event_framed_read {
 917         -webkit-border-radius: 8px;
 918         -moz-border-radius: 8px;
 919         border-radius: 8px;
 920         behavior: url(/static/styles/PIE.htc);
 921         border: solid 1px red;
 922         background-color: yellow;
 923         z-index: 10;
 924         padding: 0 4px 0 4px;
 925 }
 926
 927 li.event_framed_read span, a.event_title { font-size: 100% }
 928
 929 .event_read {}
 930
 931 li.event_read span, a.event_read_title { font-size: 100% }
 932
 933 .event_unread {}
 934
 935 li.event_unread span, a.event_read_title { font-size: 100% }
 936
 937 .mini_calendar { color: #fff }
 938
 939 .mini_calendar a { color: #fff }
 940
 941 .mini_calendar a:link,.mini_calendar a:visited { color: #fff }
 942
 943 .mini_calendar a:hover,.mini_calendar a:active {
 944    color: #3E65AF;
 945    background-color: #3E65AF;
 946 }
 947
 948 .mini_calendar td a { color: #fff }
 949
 950 .mini_calendar td a:link,.mini_calendar td a:visited { color: #fff }
 951
 952 .mini_calendar td a:hover,.mini_calendar td a:active {
 953    color: #3E65AF;
 954    background-color: #3E65AF;
 955
 956 }
 957
 958 .menudesc {
 959         margin: 4px;
 960         padding: 4px;
 961 }
 962
 963 .roompic { border: none; }
 964
 965 .table-row, .table-alt-row { width: 100% }
 966
 967 .stickynote_outer {
 968         position: absolute;
 969         width: 200px;
 970         height: 200px;
 971         border: 1px solid #333;
 972         background-color: #ffff00;
 973         overflow: hidden;
 974         -webkit-box-shadow: #666 0px 2px 3px;
 975         -moz-box-shadow: #666 0px 2px 3px;
 976         box-shadow: #666 0px 2px 3px;
 977         behavior: url(/static/styles/PIE.htc);
 978 }
 979
 980 .stickynote_titlebar {
 981         position: relative;
 982         width: 100%;
 983         height: 16px;
 984         top: 0px;
 985         left: 0px;
 986         background-color: #888800;
 987         font-size: 60%;
 988 }
 989
 990 .stickynote_body {
 991         position: relative;
 992         font-family: "Comic Sans MS", sans-serif;
 993 }
 994
 995 .stickynote_resize {
 996         position: absolute;
 997         background-image: url('resizecorner.png');
 998         height: 16px;
 999         width: 16px;
1000         right: -1px;
1001         bottom: -1px;
1002 }
1003
1004 .stickynote_palette {
1005         position: absolute;
1006         width: 48px;
1007         height: 48px;
1008         top: 16px;
1009         left: 0px;
1010         background-color: #ffffff;
1011         border: 1px solid #333;
1012         display: none;
1013 }
1014
1015 .stickynote_palette table {
1016         margin: 0;
1017         padding: 0;
1018 }
1019
1020 .stickynote_palette td {
1021         width: 16px;
1022         height: 16px;
1023 }
1024
1025 .conftitle {
1026         font-size: 140%;
1027         font-weight: bold;
1028         text-align: center;
1029 }
1030
1031 .confdescr {
1032         font-size: 110%;
1033         text-align: center;
1034 }
1035
1036 #noscript_warning {
1037         position: fixed;
1038         z-index: 999;
1039         top: 0;
1040         right: 0;
1041         background-color: #FF0000;
1042         color: #FFFFFF;
1043         font-size: 120%;
1044         border: 2px solid #FF0000;
1045 }
1046
1047 .chatrecv_history_class {
1048         position: absolute;
1049         top: 0.5em;
1050         left: 0.5%;
1051         width: 700px;
1052         height: 70%;
1053         background-color: #edede0;
1054         overflow: auto;
1055         border: 2px solid #424d52;
1056         border-radius: 8px;
1057         -khtml-border-radius: 8px;
1058         -moz-border-radius: 8px;
1059         behavior: url(/static/styles/PIE.htc);
1060         -webkit-box-shadow: #666 0px 1px 2px;
1061         -moz-box-shadow: #666 0px 2px 3px;
1062         box-shadow: #666 0px 2px 3px;
1063         padding: 0.5em;
1064 }
1065
1066 .chat_userlist_class {
1067         position: absolute;
1068         top: 0.5em;
1069         right: 0.5%;
1070         width: 110px;
1071         height: 92%;
1072         background-color: #edede0;
1073         overflow: auto;
1074         border: 2px solid #424d52;
1075         border-radius: 8px;
1076         -khtml-border-radius: 8px;
1077         -moz-border-radius: 8px;
1078         box-shadow: #666 0px 2px 3px;
1079         -webkit-box-shadow: #666 0px 1px 2px;
1080         -moz-box-shadow: #666 0px 2px 3px;
1081         behavior: url(/static/styles/PIE.htc);
1082         padding: 0.5em;
1083 }
1084
1085 .chatrecv_class { display: none }
1086
1087 .chatsend_class {
1088         position: absolute;
1089         left: 0.5%;
1090         bottom: 3%;
1091         height: 95px;
1092         width: 700px;
1093         border: 2px solid #424d52;
1094         border-radius: 8px;
1095         -khtml-border-radius: 8px;
1096         -moz-border-radius: 8px;
1097         box-shadow: #666 0px 2px 3px;
1098         -webkit-box-shadow: #666 0px 1px 2px;
1099         -moz-box-shadow: #666 0px 2px 3px;
1100         behavior: url(/static/styles/PIE.htc);
1101         background-color: #7d858c;
1102         padding: 0.5em;
1103 }
1104
1105 .chat_myname_class {
1106         font-weight: bold;
1107         color: #ff0000;
1108 }
1109
1110 .chat_notmyname_class {
1111         font-weight: bold;
1112         color: #0000ff;
1113 }
1114
1115 .chat_text_class {}
1116
1117 /*---------- bubble tooltips start -----------*/
1118
1119 a.event_title, a.event_unread, a.event_read {
1120         position:relative;
1121         z-index:24;
1122 }
1123
1124 a.event_title span, a.event_unread span, a.event_read span {
1125         display: none;
1126 }
1127
1128 /* background:; ie hack, something must be changed in a for ie to execute it */
1129
1130 a.event_title:hover, a.event_unread:hover, a.event_read:hover {
1131         z-index:25;
1132 }
1133
1134 a.event_title:hover span.tooltip, a.event_unread:hover span.tooltip, a.event_read:hover span.tooltip {
1135         display:block;
1136         position:absolute;
1137         top:0px; left:0;
1138         padding: 15px 0 0 0;
1139         width:200px;
1140         text-align: center;
1141 }
1142
1143 a.event_title:hover span.btttop, a.event_unread:hover span.btttop, a.event_read:hover span.btttop {
1144         display: block;
1145         padding: 30px 8px 0;
1146         background: url(/static/webcit_icons/bubble.gif) no-repeat top;
1147 }
1148
1149 /* different middle bg for stretch */
1150 a.event_title:hover span.bttmiddle, a.event_unread:hover span.bttmiddle, a.event_read:hover span.bttmiddle {
1151         display: block;
1152         padding: 0 8px;
1153         background: url(/static/webcit_icons/bubble_filler.gif) repeat bottom;
1154         color: #022750;
1155         font-size: 10px;
1156 }
1157
1158 a.event_title:hover span.bttbottom, a.event_unread:hover span.bttbottom, a.event_read:hover span.bttbottom {
1159         display: block;
1160         padding:3px 8px 10px;
1161         background: url(/static/webcit_icons/bubble.gif) no-repeat bottom;
1162 }
1163
1164
1165 /*---------- styles for the blog view -----------*/
1166
1167 .blog_post {
1168 }
1169
1170 .blog_post_title {
1171         font-size: 150%;
1172         font-weight: bold;
1173 }
1174
1175 .blog_post_title a:link, .blog_post_title a:visited, .blog_post_title a:active {
1176         color: #000000;
1177 }
1178
1179 .blog_post_title a:hover {
1180         color: #0000FF;
1181 }
1182
1183
1184 .blog_post_header {
1185         font-size: 100%;
1186         font-style: italic;
1187 }
1188
1189 .blog_post_content {
1190 }
1191
1192 .blog_comment {
1193         border: 1px solid grey;
1194         margin-top: 5px;
1195         margin-bottom: 5px;
1196         margin-left: 5%;
1197         margin-right: 5%;
1198         padding: 5px;
1199 }
1200
1201 .blog_comment_header {
1202         margin-bottom: 1em;
1203         font-size: 100%;
1204         font-style: italic;
1205 }
1206
1207 .post_a_comment_title {
1208         font-size: 120%;
1209 }
1210
1211 /*---------- styles for the attachments form -----------*/
1212
1213 #attachments_form {
1214         display:none;
1215         position:absolute;
1216         top:5%;
1217         bottom:5%;
1218         right:5%;
1219         left:5%;
1220         z-index: 10;
1221         padding: 5px;
1222         border-width: 1px;
1223         border-style: solid;
1224         border-color: #022750;
1225         -webkit-border-radius: 10px;
1226         -moz-border-radius: 10px;
1227         border-radius: 10px;
1228         background: #FFFFFF;
1229         background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#DDDDEE));
1230         background: -moz-linear-gradient(#FFFFFF, #DDDDEE);
1231         background: linear-gradient(#FFFFFF, #DDDDEE);
1232         -pie-background: linear-gradient(#FFFFFF, #DDDDEE);
1233         -webkit-box-shadow: #666 0px 2px 3px;
1234         -moz-box-shadow: #666 0px 2px 3px;
1235         box-shadow: #666 0px 2px 3px;
1236 }
1237
1238 /*---------- styles for the login modal box -----------*/
1239
1240 #loginbox_topline_container {
1241         position: relative;
1242         font-size: 110%;
1243         color: white;
1244 }
1245
1246 #loginbox_title {
1247         float: left;
1248         width: 75%;
1249         text-align: center;
1250         background-color: #022750;
1251         border: 3px solid #022750;
1252 }
1253
1254 #loginbox_closebutton {
1255         float: right;
1256         width: 23%;
1257         text-align: right;
1258         background-color: #ddd;
1259         border: 3px solid #ddd;
1260 }
1261
1262 #auth_container {
1263         position: relative;
1264         border: 1px solid #777;
1265 }
1266
1267 #authbar {
1268         top: 0;
1269         left: 0;
1270         width: 23%;
1271         z-index: 0;
1272         overflow: auto;
1273         overflow-x: hidden !important;
1274 }
1275
1276 #authbar ul {
1277         margin-top: 1px;
1278         margin-bottom: 0;
1279 }
1280
1281 .authbox {
1282         text-align: center;
1283         position: absolute;
1284         top: 0;
1285         right: 0;
1286         width: 75%;
1287         height: 100%;
1288         z-index: 0;
1289         overflow: auto;
1290         overflow-x: hidden !important;
1291         background-color: #ddd;
1292 }
1293
1294 #ajax_username_password_form, #ajax_newuser_form {
1295         margin: auto;
1296         width: 20em;
1297 }
1298
1299 #ajax_username_password_form label, #ajax_newuser_form label {
1300         float: left;
1301         width: 10em;
1302 }
1303
1304 .openid_urlarea {
1305         background: url('../webcit_icons/openid-small.gif') no-repeat scroll 0pt 50%;
1306         padding-left: 18px;
1307 }
1308
1309 .older_blog_posts, .newer_blog_posts {
1310         font-size: 110%;
1311 }
1312
1313 .older_blog_posts {
1314         text-align: left;
1315 }
1316
1317 .newer_blog_posts {
1318         text-align: right;
1319 }