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