view/theme/dispy/style.css

   1 /*
   2  * dispy
   3  *
   4  * modernised, sort of, by simon <http://simon.kisikew.org/>
   5  *
   6  */
   7
   8 /* from html5boilerplate */
   9
  10 /* these are to tell browsers they should be displayed a certain way */
  11 article, aside, details, figcaption, figure, footer,
  12 header, hgroup, nav, section {
  13     display: block;
  14 }
  15 audio, canvas, video, time {
  16     display: inline-block;
  17     *display: inline;
  18     *zoom: 1;
  19 }
  20 audio:not([controls]) {
  21     display: none;
  22 }
  23 [hidden] {
  24     display: none;
  25 }
  26
  27 /*
  28  *  Base
  29  */
  30
  31 /*
  32  * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
  33  * 2. Force vertical scrollbar in non-IE
  34  * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
  35  */
  36
  37 html {
  38     font-size: 100%;
  39     overflow-y: scroll;
  40     -webkit-text-size-adjust: 100%;
  41     -ms-text-size-adjust: 100%;
  42 }
  43 body {
  44     margin: 0;
  45     font-size: 16px;
  46     line-height: 1.1em;
  47 }
  48 body, button, input, select, textarea {
  49     font-family: sans-serif;
  50     color: #222;
  51     background-color: #efefef;
  52 }
  53 select {
  54         border: 1px #555 dotted;
  55         padding: 3px;
  56         margin: 2px;
  57 }
  58 option {
  59         padding: 3px;
  60         vertical-align: middle;
  61 }
  62 li {
  63         padding: 0 0 0 2px;
  64 }
  65 /* remember to define focus styles! */
  66 :focus {
  67     outline: 0;
  68 }
  69
  70 /* remember to highlight inserts somehow! */
  71 ins {
  72     background-color: #ff9;
  73     color: #000;
  74     text-decoration: none;
  75 }
  76 mark {
  77     background-color: #ff9;
  78     color: #000;
  79     font-style: italic;
  80     font-weight: bold;
  81 }
  82 /* Redeclare monospace font family: h5bp.com/j */
  83 pre, code, kbd, samp, .wall-item-body code {
  84     font-family: monospace, monospace;
  85     _font-family: monospace;
  86     font-size: 1em; }
  87
  88 /* Improve readability of pre-formatted text in all browsers */
  89 pre, .wall-item-body code {
  90     white-space: pre;
  91     white-space: pre-wrap;
  92     word-wrap: break-word;
  93 }
  94
  95 q {
  96     quotes: none;
  97 }
  98 q:before, q:after {
  99     content: "";
 100     content: none;
 101 }
 102 small {
 103     font-size: 85%;
 104 }
 105
 106 /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
 107 sub, sup {
 108     font-size: 75%;
 109     line-height: 0;
 110     position: relative;
 111     vertical-align: baseline;
 112 }
 113 sup {
 114     top: -0.5em;
 115 }
 116 sub {
 117     bottom: -0.25em;
 118 }
 119 img {
 120     border: 0 none;
 121     /*vertical-align: middle;*/
 122 }
 123 a {
 124     color: #3465a4;
 125     text-decoration: none;
 126     margin-bottom: 1px;
 127 }
 128 a:hover img {
 129     text-decoration: none;
 130 }
 131 blockquote {
 132     background: #eee;
 133         color: #111;
 134     text-indent: 5px;
 135     padding: 5px;
 136     border: 1px #aaa solid;
 137     border-radius: 5px;
 138 }
 139 a:hover {
 140     color: #729fcf;
 141     border-bottom: 1px dotted #729fcf;
 142 }
 143 .required {
 144     display: inline;
 145     color: #ff0;
 146     font-size: 16px;
 147     font-weight: bold;
 148     margin: 3px;
 149 }
 150 .fakelink, .lockview {
 151     color: #3465a4;
 152     cursor: pointer;
 153 }
 154 .fakelink:hover {
 155     color: #729fcf;
 156 }
 157 input[type=submit] {
 158     background-color: #555753;
 159         color: #eeeeec;
 160         font-weight: bold;
 161     margin-top: 10px;
 162     height: 22px;
 163     -webkit-border-radius: 5px;
 164     -moz-border-radius: 5px;
 165     border-radius: 5px;
 166     border: 0;
 167 }
 168 .smalltext {
 169     font-size: 0.7em;
 170 }
 171 #panel {
 172         position: absolute;
 173         font-size: 0.8em;
 174         -webkit-border-radius: 5px;
 175         -moz-border-radius: 5px;
 176         border-radius: 5px;
 177         border: 1px solid #fff;
 178         background-color: #2e3436;
 179         color: #eeeeec;
 180         padding: 1em;
 181 }
 182 .pager {
 183         margin-top: 60px;
 184         display: block;
 185         clear: both;
 186         text-align: center;
 187 }
 188 .pager span {
 189     padding: 4px;
 190     margin: 4px;
 191 }
 192 .pager_current {
 193     background-color: #729fcf;
 194     color: #fff;
 195 }
 196
 197
 198 /**
 199  * global
 200  */
 201 /* .tool .action */
 202 .action {
 203         margin: 5px 0;
 204 }
 205 .tool {
 206         margin: 5px 0;
 207         list-style: none;
 208 }
 209
 210
 211 /**
 212  *      login
 213  */
 214 #login-extra-links {
 215     overflow: auto;
 216     padding-top: 140px !important;
 217     width: 100%;
 218 }
 219 #login-extra-links a {
 220     margin-right: 20px;
 221 }
 222 #login_standard {
 223     display: block;
 224     float: none;
 225     height: 100px;
 226     position: absolute;
 227         width: 100%;
 228 }
 229 #login_standard .field label {
 230         width: 200px;
 231 }
 232 #login_standard input, #login_standard input[type="text"] {
 233         margin: 0 0 8px;
 234     width: 210px;
 235 }
 236 #login-submit-wrapper {
 237         margin: 0;
 238 }
 239 #login-submit-button {
 240     margin-left: 0px !important;
 241 }
 242 #login_openid #id_openid_url {
 243         width: 200px;
 244 }
 245 #login_openid label {
 246         width: 208px;
 247 }
 248
 249
 250 /**
 251  * nav
 252  */
 253 nav {
 254         height: 60px;
 255         display: block;
 256         background-color: #2e3436;
 257         color: #eeeeec;
 258         position: relative;
 259         padding: 20px 20px 10px 95px;
 260     margin-left: auto;
 261     margin-right: auto;
 262 }
 263 nav a {
 264         text-decoration: none;
 265         color: #eeeeec;
 266         border: 0px;
 267 }
 268 nav a:hover {
 269         text-decoration: none;
 270         color: #eeeeec;
 271     border: 0px;
 272 }
 273 nav #banner {
 274         display: block;
 275         position: absolute;
 276         left: 51px;
 277         top: 25px;
 278 }
 279 nav #banner #logo-text a {
 280         font-size: 40px;
 281         font-weight: bold;
 282         margin-left: 3px;
 283 }
 284 ul#user-menu-popup {
 285         display: none;
 286         position: absolute;
 287         background-color: #555753;
 288         width: 100%;
 289     padding: 10px 0px;
 290     margin: 0px;
 291         top: 20px;
 292         left: 0;
 293         -webkit-border-radius: 0 0 5px 5px;
 294         -moz-border-radius: 0 0 5px 5px;
 295         border-radius: 0 0 5px 5px;
 296         z-index: 10000;
 297 }
 298 ul#user-menu-popup li {
 299         display: block;
 300 }
 301 ul#user-menu-popup li a {
 302         display: block;
 303         padding: 5px;
 304 }
 305 ul#user-menu-popup li a:hover {
 306         color: #2e3436;
 307         background-color: #eeeeec;
 308 }
 309 ul#user-menu-popup li a.nav-sep {
 310         border-top: 1px solid #eeeeec;
 311 }
 312 nav .nav-link {
 313         float: right;
 314         display: block;
 315         width: 22px;
 316         height: 22px;
 317         overflow: hidden;
 318         margin: 0px 5px 5px;
 319         text-indent: 50px;
 320         background: transparent url(icons.png) 0 0 no-repeat;
 321 }
 322 #nav-apps-link {
 323         background-position: 0 -66px;
 324 }
 325 #nav-apps-link:hover {
 326         background-position: -22px -66px;
 327 }
 328 #nav-community-link {
 329     background-position: 0 -22px;
 330 }
 331 #nav-community-link:hover {
 332     background-position: -22px -22px;
 333 }
 334 #nav-contacts-link {
 335     background-position: 0 -22px;
 336 }
 337 #nav-contacts-link:hover {
 338     background-position: -22px -22px;
 339 }
 340 #nav-directory-link {
 341         background-position: -44px -154px;
 342 }
 343 #nav-directory-link:hover {
 344         background-position: -66px -154px;
 345 }
 346 #nav-help-link {
 347         background-position: 0 -110px;
 348 }
 349 #nav-help-link:hover {
 350         background-position: -22px -110px;
 351 }
 352 #nav-home-link {
 353     background-position: -44px -132px;
 354 }
 355 #nav-home-link:hover {
 356     background-position: -66px -132px;
 357 }
 358 #nav-intro-link {
 359         background-position: 0px -190px;
 360 }
 361 #nav-intro-link:hover {
 362         background-position: -44px -190px;
 363 }
 364 #nav-login-link {
 365         background-position: 0 -88px;
 366 }
 367 #nav-login-link:hover {
 368         background-position: -22px -88px;
 369 }
 370 #nav-logout-link {
 371         background-position: 0 -88px;
 372 }
 373 #nav-logout-link:hover {
 374         background-position: -22px -88px;
 375 }
 376 #nav-messages-link {
 377     background-position: -44px -88px;
 378 }
 379 #nav-messages-link:hover {
 380     background-position: -66px -88px;
 381 }
 382 #nav-notify-link, #nav-notifications-linkmenu {
 383     background-position: -44px -110px;
 384 }
 385 #nav-notify-link:hover {
 386     background-position: -66px -110px;
 387 }
 388 #nav-network-link {
 389     background-position: 0px -177px;
 390 }
 391 #nav-network-link:hover {
 392     background-position: -22px -177px;
 393 }
 394 #nav-search-link {
 395         background-position: 0 -44px;
 396 }
 397 #nav-search-link:hover {
 398         background-position: -22px -44px;
 399 }
 400 #profile-link,
 401 #profile-title,
 402 #wall-image-upload,
 403 #wall-file-upload,
 404 #profile-attach-wrapper,
 405 #profile-audio,
 406 #profile-link,
 407 #profile-location,
 408 #profile-nolocation,
 409 #profile-title,
 410 #jot-title,
 411 #profile-upload-wrapper,
 412 #profile-video,
 413 #profile-jot-submit,
 414 #wall-image-upload-div,
 415 #wall-file-upload-div,
 416 .icon, .hover, .focus, .pointer {
 417     cursor: pointer;
 418 }
 419 /* popup notifications */
 420 div.jGrowl div.notice {
 421     background: #511919 url("../../../images/icons/48/notice.png") no-repeat 5px center;
 422     color: #ffffff;
 423     padding-left: 58px;
 424 }
 425 div.jGrowl div.info {
 426     background: #364e59 url("../../../images/icons/48/info.png") no-repeat 5px center;
 427     color: #ffffff;
 428     padding-left: 58px;
 429 }
 430 #nav-notifications-menu {
 431     margin: 30px 0 0 -45px;
 432     width: 300px;
 433     max-height: 400px;
 434     overflow: auto;
 435     font-size: 9pt;
 436 }
 437 #nav-notifications-menu .contactname {
 438     font-weight: bold;
 439     font-size: 0.9em;
 440 }
 441 #nav-notifications-menu img {
 442     float: left;
 443     margin-right: 5px;
 444 }
 445 #nav-notifications-menu .notif-when {
 446     font-size: 0.8em;
 447     display: block;
 448 }
 449 #nav-notifications-menu li {
 450     padding: 7px 0px 7px 10px;
 451     word-wrap: normal;
 452     border-bottom: 1px solid #000;
 453 }
 454 #nav-notifications-menu li:hover {
 455     color: black;
 456 }
 457 #nav-notifications-menu a:hover {
 458     color: black;
 459     text-decoration: underline;
 460 }
 461 nav #nav-notifications-linkmenu.on .icon.s22.notify, nav #nav-notifications-linkmenu.selected .icon.s22.notify {
 462   background-image: url("../../../images/icons/22/notify_on.png");
 463 }
 464 .show {
 465     display: block;
 466 }
 467 #notifications {
 468         height: 20px;
 469         width: 170px;
 470         position: absolute;
 471         top: -19px;
 472         left: 7px;
 473 }
 474 #nav-floater {
 475     position: fixed;
 476     top: 20px;
 477     right: 1%;
 478     padding: 5px;
 479     background: #2e3436;
 480         color: transparent;
 481     border-radius: 5px;
 482     z-index: 100;
 483         width: 300px;
 484         height: 60px;
 485 }
 486 #nav-buttons {
 487     clear: both;
 488         list-style: none;
 489         padding: 0px;
 490         margin: 0 7px 0 0;
 491         height: 25px;
 492 }
 493 #nav-buttons li {
 494         padding: 0;
 495 }
 496 .floaterflip {
 497         display: block;
 498     position: fixed;
 499     z-index: 110;
 500     top: 56px;
 501     right: 19px;
 502         width: 22px;
 503         height: 22px;
 504         overflow: hidden;
 505         margin: 0px;
 506         background: transparent url(icons.png) -190px -60px no-repeat;
 507 }
 508 .search-box {
 509         display: inline-block;
 510         margin: 5px;
 511         position: fixed;
 512         right: 0px;
 513         bottom: 0px;
 514         z-index: 100;
 515         background: #1d1f1d;
 516         border-radius: 5px;
 517 }
 518 #search-text {
 519         border: 1px #eec solid;
 520         background: #2e3436;
 521         color: #eec;
 522 }
 523 .search-box #search-text {
 524         margin: 8px;
 525         width: 10em;
 526         color: #eec;
 527 }
 528 nav #user-menu {
 529     display: block;
 530     width: 75%;
 531     margin: 3px 0 0 0;
 532     position: relative;
 533         background-color: #555753;
 534     -webkit-border-radius: 5px;
 535     -moz-border-radius: 5px;
 536     border-radius: 5px;
 537     background: #555753 url("menu-user-pin.jpg") 98% center no-repeat;
 538     clear: both;
 539         top: 4px;
 540         left: 10px;
 541 }
 542 nav #user-menu-label {
 543         font-size: 12px;
 544     padding: 3px 20px 9px 5px;
 545     height: 10px;
 546 }
 547 .nav-ajax-update, .nav-ajax-left {
 548         width: 30px;
 549         height: 19px;
 550         background: transparent url(notifications.png) 0 0 no-repeat;
 551         color: #222;
 552         font-weight: bold;
 553         font-size: 0.8em;
 554         padding-top: 0.2em;
 555         text-align: center;
 556         float: left;
 557         margin: 0 -1px 0 3px;
 558         display: block;
 559         visibility: hidden;
 560 }
 561 .nav-ajax-update.show, .nav-ajax-left.show {
 562     visibility: visible;
 563 }
 564 #net-update {
 565         background-position: 0px 0px;
 566 }
 567 #mail-update {
 568         background-position: -30px 0;
 569 }
 570 #notify-update {
 571         background-position: -60px 0px;
 572 }
 573 #home-update {
 574         background-position: -90px 0px;
 575 }
 576 #intro-update {
 577         background-position: -120px 0px;
 578 }
 579 #lang-select-icon {
 580         cursor: pointer;
 581         position: fixed;
 582         left: 28px;
 583         bottom: 6px;
 584         z-index: 10;
 585 }
 586 #language-selector {
 587     position: fixed;
 588     bottom: 2px;
 589     left: 52px;
 590         z-index: 10;
 591 }
 592 .menu-popup {
 593     position: absolute;
 594     display: none;
 595     width: 11em;
 596     background: #ffffff;
 597     color: #2d2d2d;
 598     margin: 0px;
 599     padding: 0px;
 600     list-style: none;
 601     border: 3px solid #364e59;
 602     z-index: 100000;
 603     -webkit-box-shadow: 3px 3px 10px 0 rgba(0, 0, 0, 0.7);
 604     -moz-box-shadow: 3px 3px 10px 0 rgba(0, 0, 0, 0.7);
 605     box-shadow: 3px 3px 10px 0 rgba(0, 0, 0, 0.7);
 606 }
 607 .menu-popup a {
 608     display: block;
 609     color: #2d2d2d;
 610     padding: 5px 10px;
 611     text-decoration: none;
 612 }
 613 .menu-popup a:hover {
 614     background-color: #bdcdd4;
 615 }
 616 .menu-popup .menu-sep {
 617     border-top: 1px solid #9eabb0;
 618 }
 619 .menu-popup li {
 620     float: none;
 621     overflow: auto;
 622     height: auto;
 623     display: block;
 624 }
 625 .menu-popup li img {
 626     float: left;
 627     width: 16px;
 628     height: 16px;
 629     padding-right: 5px;
 630 }
 631 .menu-popup .empty {
 632     padding: 5px;
 633     text-align: center;
 634     color: #9eabb0;
 635 }
 636 .notif-item {
 637     font-size: small;
 638 }
 639 .notif-item a {
 640     vertical-align: middle;
 641 }
 642 .notif-image {
 643     width: 32px;
 644     height: 32px;
 645     padding: 7px 7px 0px 0px;
 646 }
 647 .notify-seen {
 648     background: #ddd;
 649 }
 650
 651
 652 /** sysmsg **/
 653 #sysmsg_info {
 654         position: fixed;
 655         bottom: 0;
 656         -moz-box-shadow: 3px 3px 3px 10px 0 #000;
 657         -webkit-box-shadow: 3px 3px 10px 0 #000;
 658         box-shadow: 3px 3px 10px 0 #000;
 659     padding: 10px;
 660         background-color: #fcaf3e;
 661         border:2px solid #f8911b;
 662         border-bottom: 0;
 663         padding-bottom: 50px;
 664         z-index: 1000;
 665 }
 666 #sysmsg {
 667         position: fixed;
 668         bottom: 0;
 669         -moz-box-shadow: 3px 3px 10px 0 #000;
 670         -webkit-box-shadow: 3px 3px 10px 0 #000;
 671         box-shadow: 3px 3px 10px 0 #000;
 672     padding: 10px;
 673         background-color: #fcaf3e;
 674         border: 2px solid #f8911b;
 675         border-bottom: 0;
 676         padding-bottom: 50px;
 677         z-index: 1000;
 678 }
 679 #sysmsg_info br,
 680 #sysmsg br {
 681         display: block;
 682         margin: 2px 0px;
 683         border-top: 1px solid #ccccce;
 684 }
 685
 686
 687 /**
 688 * aside
 689 **/
 690 aside {
 691     position: absolute;
 692     right: 15px;
 693     width: 245px;
 694         padding-top: 15px;
 695     font-size: smaller;
 696 }
 697 .vcard .fn {
 698         font-size: 1.7em;
 699         font-weight: bold;
 700         border-bottom: 1px solid #729fcf;
 701         padding-bottom: 3px;
 702 }
 703 .vcard #profile-photo-wrapper {
 704         margin: 20px;
 705 }
 706 /* http://css-tricks.com/snippets/css/css-box-shadow/
 707  * box-shadow:
 708  * 1. The horizontal offset of the shadow, positive means
 709  * the shadow will be on the right of the box, a negative
 710  * offset will put the shadow on the left of the box.
 711  * 2. The vertical offset of the shadow, a negative one
 712  * means the box-shadow will be above the box, a
 713  * positive one means the shadow will be below the box.
 714  * 3. The blur radius (optional), if set to 0 the shadow
 715  * will be sharp, the higher the number, the more blurred
 716  * it will be.
 717  * 4. The spread radius (optional), positive values increase
 718  * the size of the shadow, negative values decrease the size.
 719  * Default is 0 (the shadow is same size as blur).
 720  * 5. Colo[u]r
 721  */
 722 .vcard #profile-photo-wrapper img {
 723         box-shadow: 3px 3px 10px 0 #000;
 724 }
 725 aside h4 {
 726         font-size: 1.2em;
 727 }
 728 aside #viewcontacts {
 729         text-align: right;
 730 }
 731 .aprofile dt {
 732     color: #666666;
 733         background: transparent;
 734         font-weight: bold;
 735     box-shadow: 1px 1px 5px 0 #000;
 736     margin: 15px 0 5px;
 737     padding-left: 5px;
 738 }
 739 #profile-extra-links ul {
 740         margin-left: 0px;
 741     padding-left: 0px;
 742     list-style: none;
 743 }
 744 #dfrn-request-link {
 745         background:#3465A4 url(connect.png) no-repeat 95% center;
 746         border-radius:5px 5px 5px 5px;
 747         color:#fff;
 748         display:block;
 749         font-size:1.2em;
 750         padding:.2em .5em;
 751 }
 752 #netsearch-box {
 753         margin: 20px 0px 30px;
 754     width: 150px;
 755 }
 756 #netsearch-box #search-submit {
 757     margin: 5px 5px 0px 0px;
 758 }
 759 .ttright {
 760         margin: 0px 0px 0px 0px;
 761 }
 762
 763
 764 /**
 765 * contacts block
 766 */
 767 .contact-block-div {
 768     width: 50px;
 769     height: 50px;
 770     float: left;
 771 }
 772 .contact-block-textdiv {
 773     width: 150px;
 774     height: 34px;
 775     float: left;
 776 }
 777 #contact-block-end {
 778     clear: both;
 779 }
 780
 781
 782 /**
 783  * jot
 784  **/
 785 #jot {
 786   /*width: 785px;*/
 787   margin: 10px 0 20px 0px;
 788   width: 100%;
 789 }
 790 #jot #jot-tools {
 791   margin: 0px;
 792   padding: 0px;
 793   height: 35px;
 794   overflow: none;
 795   width: 100%;
 796   /*background-color: #0e232e;*/
 797   /*border-bottom: 2px solid #9eabb0;*/
 798 }
 799 #jot #jot-tools span {
 800     float: left;
 801     margin: 10px 20px 2px 0px;
 802 }
 803 #jot #jot-tools span a {
 804     display: block;
 805 }
 806 #jot #jot-tools .perms {
 807     float: right;
 808     width: 40px;
 809 }
 810 #jot #jot-tools li.loading {
 811     float: right;
 812     background-color: #ffffff;
 813     width: 20px;
 814     vertical-align: center;
 815     text-align: center;
 816     border-top: 2px solid #9eabb0;
 817     height: 38px;
 818 }
 819 #jot #jot-tools li.loading img {
 820     margin-top: 10px;
 821 }
 822 #jot #jot-title {
 823         border: 1px solid #ccc;
 824     margin: 0 0 5px;
 825     height: 20px;
 826     width: 90%;
 827     font-weight: bold;
 828     border-radius: 5px;
 829         vertical-align: middle;
 830 }
 831 #jot #character-counter {
 832         width: 6%;
 833         float: right;
 834         text-align: right;
 835         height: 15px;
 836         line-height: 20px;
 837         padding: 2px 20px 5px 0;
 838 }
 839 #profile-jot-text_tbl {
 840         margin-bottom: 10px;
 841 }
 842 #profile-jot-text_ifr {
 843         width:99.900002% !important;
 844 }
 845 [id$="jot-text_ifr"] {
 846         width: 99.900002% !important;
 847         color: #2e2f2e;
 848         background: #eec;
 849 }
 850 [id$="jot-text_ifr"] .mceContentBody {
 851         color: #2e2f2e;
 852         background: #eec;
 853 }
 854 #profile-attach-wrapper,
 855 #profile-audio-wrapper,
 856 #profile-link-wrapper,
 857 #profile-location-wrapper,
 858 #profile-nolocation-wrapper,
 859 #profile-title-wrapper,
 860 #profile-upload-wrapper,
 861 #profile-video-wrapper {
 862     float: left;
 863         margin: 0 20px 0 0;
 864 }
 865 #profile-rotator-wrapper {
 866         float: right;
 867 }
 868 #profile-jot-tools-end,
 869 #profile-jot-banner-end {
 870         clear: both;
 871 }
 872 #profile-jot-email-wrapper {
 873         margin:10px 10% 0;
 874         border:1px solid #555753;
 875         border-bottom:0;
 876 }
 877 #profile-jot-email-label {
 878         background-color:#555753;
 879         color:#ccccce;
 880         padding:5px;
 881 }
 882 #profile-jot-email {
 883         width:90%;
 884         margin:5px;
 885 }
 886 #profile-jot-networks {
 887         margin: 0 10%;
 888         border: 1px solid #555753;
 889         border-top: 0;
 890         border-bottom: 0;
 891         padding: 5px;
 892 }
 893 #profile-jot-net {
 894         margin: 5px 0;
 895 }
 896 #jot-preview-link {
 897     margin: 0 0 0 10px;
 898     border: 0;
 899     text-decoration: none;
 900         float: right;
 901 }
 902 .icon-text-preview {
 903         margin: 0 0 -18px 0;
 904         display: block;
 905     width: 20px;
 906     height: 20px;
 907     background: url(icons.png) no-repeat -128px -40px;
 908     border: 0;
 909     text-decoration: none;
 910         float: right;
 911         cursor: pointer;
 912 }
 913 #profile-jot-perms {
 914         float: right;
 915     background-color: #555753;
 916     height: 22px;
 917     width: 20px;
 918     -webkit-border-radius: 5px;
 919     -moz-border-radius: 5px;
 920     border-radius: 5px;
 921     overflow: hidden;
 922     border: 0px;
 923     margin: 0 10px 0 10px;
 924 }
 925 #profile-jot-plugin-wrapper {
 926         width: 1px;
 927         margin: 10px 0 0 0;
 928         float: right;
 929 }
 930 #profile-jot-submit-wrapper {
 931         float: right;
 932         width: 100%;
 933         list-style: none;
 934         margin: 10px 0 0 0;
 935         padding: 0;
 936 }
 937 #profile-jot-submit {
 938         height: 22px;
 939         background-color: #555753;
 940         color: #eeeeec;
 941         -webkit-border-radius: 5px;
 942         -moz-border-radius: 5px;
 943         border-radius: 5px;
 944         border: 0;
 945         margin: 0;
 946         float: right;
 947 }
 948 #jot-perms-icon {
 949         height: 22px;
 950         width: 20px;
 951         -webkit-border-radius: 5px;
 952         -moz-border-radius: 5px;
 953         border-radius: 5px;
 954         overflow: hidden;
 955         border: 0;
 956 }
 957 #profile-jot-acl-wrapper {
 958         margin: 0 10px;
 959         border: 1px solid #555753;
 960         border-top: 0;
 961         display: block !important;
 962 }
 963 #group_allow_wrapper,
 964 #group_deny_wrapper,
 965 #acl-permit-outer-wrapper {
 966         width:47%;
 967         float:left;
 968 }
 969 #contact_allow_wrapper,
 970 #contact_deny_wrapper,
 971 #acl-deny-outer-wrapper {
 972         width:47%;
 973         float:right;
 974 }
 975 #acl-permit-text {
 976         background-color: #555753;
 977         color: #ccccce;
 978         padding: 5px;
 979         float: left;
 980 }
 981 #jot-public {
 982         background-color: #555753;
 983         color: #ff0000;
 984         padding: 5px;
 985         float: left;
 986 }
 987 #acl-deny-text {
 988         background-color: #555753;
 989         color: #ccccce;
 990         padding: 5px;
 991         float: left;
 992 }
 993 #acl-permit-text-end,
 994 #acl-deny-text-end {
 995         clear: both;
 996 }
 997 #jot-title-desc {
 998         color: #ccc;
 999 }
1000 #profile-jot-desc {
1001         color: #a00;
1002         margin: 5px 0;
1003 }
1004 #jot-title-wrapper {
1005         margin-bottom: 5px;
1006 }
1007 #jot-title-display {
1008         font-weight: bold;
1009 }
1010 .jothidden {
1011     display: none;
1012 }
1013 #jot-preview-content {
1014     background-color: #ffffe0;
1015         color: #111;
1016     border: 1px #aa0 solid;
1017     border-radius: 5px;
1018     padding: 3px 3px 6px 10px;
1019 }
1020 #jot-preview-content .wall-item-outside-wrapper {
1021         border: 0;
1022         border-radius: 0px;
1023 }
1024
1025
1026 /**
1027  * section
1028  */
1029 section {
1030     margin: 20px 9% 0 4%;
1031     font-size: 0.8em;
1032     padding-right: 230px;
1033         min-width: 475px;
1034         width: 65%;
1035 }
1036
1037 /** tabs **/
1038 .tabs {
1039     list-style: none;
1040     margin: 10px 0;
1041     padding: 0;
1042 }
1043 .tabs li {
1044     display: inline;
1045 }
1046 .tab {
1047     border: 1px solid #729fcf;
1048         padding: 4px;
1049 }
1050 .tab:hover, .tab.active:hover {
1051     background: #729fcf;
1052     color: #eeeeec;
1053 }
1054 .tab:active {
1055     background: #729fcf;
1056     color: #eeeeec;
1057 }
1058 .tab.active {
1059         background: #729fcf;
1060     color: #eeeeec;
1061 }
1062 .tab.active a {
1063         color: #729fcf;
1064 }
1065 .tab a {
1066         border: 0;
1067         text-decoration: none;
1068 }
1069
1070
1071 /**
1072  *      items
1073  */
1074 .wall-item-outside-wrapper {
1075         border: 1px solid #aaa;
1076         border-radius: 5px;
1077 }
1078 .wall-item-outside-wrapper.comment {
1079         margin-top: 5px;
1080 }
1081 .wall-item-outside-wrapper-end {
1082     clear: both;
1083 }
1084 .wall-item-content-wrapper {
1085     position: relative;
1086         padding: 10px;
1087         width: auto;
1088 }
1089 .wall-item-outside-wrapper .wall-item-comment-wrapper {
1090     /*margin-left: 90px;*/
1091 }
1092 .shiny {
1093     background: #efefdf;
1094 }
1095 .wall-outside-wrapper .shiny {
1096         border-radius: 5px;
1097 }
1098 .heart {
1099         color: red;
1100 }
1101 .wall-item-content {
1102         overflow-x: auto;
1103 }
1104 /* removing it from here, vs. putting it in .wall-item-content
1105  * might break things for people. we shall see ;) */
1106 [id^="tread-wrapper"], [class^="tread-wrapper"] {
1107     margin: 15px 0 0 0;
1108     padding: 0px;
1109         /*overflow-x: auto;*/
1110 }
1111 .wall-item-photo-menu {
1112     display: none;
1113 }
1114 .wall-item-photo-menu-button {
1115     display:none;
1116     text-indent:-99999px;
1117     background:#555753 url(menu-user-pin.jpg) no-repeat 75px center;
1118     position:absolute;
1119     overflow:hidden;
1120     height:20px;
1121     width:90px;
1122     top:85px;
1123     left:0;
1124     -webkit-border-radius:0 0 5px 5px;
1125     -moz-border-radius:0 0 5px 5px;
1126     border-radius:0 0 5px 5px;
1127 }
1128 .wall-item-info {
1129     float: left;
1130     width: 110px;
1131 }
1132 .wall-item-photo-wrapper {
1133     width: 80px;
1134     height: 80px;
1135     position: relative;
1136     padding: 5px;
1137     background-color: #555753;
1138     -webkit-border-radius: 5px;
1139     -moz-border-radius: 5px;
1140     border-radius: 5px;
1141 }
1142 [class^="wall-item-tools"] > *, [class^="wall-item-tools"] > * > * {
1143         /*margin: 0 0 5px 0;*/
1144 }
1145 .wall-item-tools {
1146     float: right;
1147     filter: alpha(opacity=35);
1148     opacity: 0.4;
1149     -webkit-transition: all 1s ease-in-out;
1150     -moz-transition: all 1s ease-in-out;
1151     -o-transition: all 1s ease-in-out;
1152     -ms-transition: all 1s ease-in-out;
1153     transition: all 1s ease-in-out;
1154 }
1155 .wall-item-tools:hover {
1156     filter: alpha(opacity=100);
1157     opacity: 1;
1158     -webkit-transition: all 1s ease-in-out;
1159     -moz-transition: all 1s ease-in-out;
1160     -o-transition: all 1s ease-in-out;
1161     -ms-transition: all 1s ease-in-out;
1162     transition: all 1s ease-in-out;
1163 }
1164 .wall-item-subtools1 {
1165     height: 30px;
1166     list-style: none outside none;
1167     margin: 20px 0 30px -20px;
1168     padding: 0;
1169     width: 30px;
1170 }
1171 .wall-item-subtools2 {
1172     height: 25px;
1173     list-style: none outside none;
1174     margin: -75px 0 0 5px;
1175     padding: 0;
1176     width: 25px;
1177 }
1178 .wall-item-title {
1179         font-size: 1.2em;
1180         font-weight: bold;
1181     margin-bottom: 1em;
1182 }
1183 .wall-item-body {
1184         margin: 20px 20px 10px 0px;
1185     text-align: left;
1186 }
1187 .wall-item-lock-wrapper {
1188         float: right;
1189     height: 22px;
1190     margin: 0 -5px 0 0;
1191     width: 22px;
1192         opacity: 1;
1193 }
1194 .wall-item-dislike,
1195 .wall-item-like {
1196         clear: left;
1197         font-size: 0.8em;
1198         color: #878883;
1199         margin: 5px 0 5px 120px;
1200 }
1201 .wall-item-author, .wall-item-actions-author {
1202         clear: left;
1203         font-size: 0.8em;
1204         color: #878883;
1205         margin: 20px 20px 0 110px;
1206 }
1207 .wall-item-ago {
1208         display: inline;
1209         padding-left: 10px;
1210 }
1211 .wall-item-wrapper-end {
1212         clear:both;
1213 }
1214 .wall-item-location {
1215     margin-top: 15px;
1216     width: 100px;
1217     overflow: hidden;
1218     text-overflow: ellipsis;
1219     -o-text-overflow: ellipsis;
1220 }
1221 .wall-item-location .icon {
1222     float: left;
1223 }
1224 .wall-item-location > a {
1225     margin-left: 25px;
1226     font-size: 0.7em;
1227     display: block;
1228 }
1229 .wall-item-location .smalltext {
1230     margin-left: 25px;
1231     font-size: 0.7em;
1232     display: block;
1233 }
1234 .wall-item-location > br {
1235     display: none;
1236 }
1237 .wallwall .wwto {
1238     left: 5px;
1239     margin: 0;
1240     position: absolute;
1241     top: 75px;
1242     width: 30px;
1243     z-index: 10001;
1244     width: 30px;
1245     height: 30px;
1246 }
1247 .wallwall .wwto img {
1248     width: 30px !important;
1249     height: 30px !important;
1250 }
1251 .wallwall .wall-item-photo-end {
1252     clear: both;
1253 }
1254 .wall-item-arrowphoto-wrapper {
1255     position: absolute;
1256     left: 35px;
1257     top: 80px;
1258     z-index: 10002;
1259 }
1260 .wall-item-photo-menu {
1261         min-width: 92px;
1262         border: 2px solid #FFFFFF;
1263         border-top: 0px;
1264         background: #555753;
1265         position: absolute;
1266         left: -2px; top: 101px;
1267         display: none;
1268         z-index: 10003;
1269         -webkit-border-radius: 0px 5px 5px 5px;
1270         -moz-border-radius: 0px 5px 5px 5px;
1271         border-radius: 0px 5px 5px 5px;
1272 }
1273 .wall-item-photo-menu ul {
1274     margin:0px;
1275     padding: 0px;
1276     list-style: none;
1277 }
1278 .wall-item-photo-menu li a {
1279     white-space: nowrap;
1280     display: block;
1281     padding: 5px 2px;
1282     color: #eeeeec;
1283 }
1284 .wall-item-photo-menu li a:hover {
1285     color: #555753;
1286     background: #eeeeec;
1287 }
1288 #item-delete-selected {
1289     overflow: auto;
1290     width: 100%;
1291 }
1292 #connect-services-header {
1293
1294 }
1295 #connect-services {
1296         margin: 5px 0 0 0;
1297 }
1298 #extra-help-header {
1299
1300 }
1301 #extra-help {
1302         margin: 5px 0 0 0;
1303 }
1304 #postit-header {
1305
1306 }
1307 #postit {
1308         margin: 5px 0 0 0;
1309 }
1310
1311
1312 /**
1313  *      comment
1314  */
1315 .ccollapse-wrapper {
1316     font-size: 0.9em;
1317     margin-left: 80px;
1318 }
1319
1320 .wall-item-outside-wrapper.comment {
1321     margin-left: 80px;
1322 }
1323 .wall-item-outside-wrapper.comment .wall-item-photo {
1324     width: 40px!important;
1325     height: 40px!important;
1326 }
1327 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {
1328     width: 40px;
1329     height: 40px;
1330 }
1331 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1332         width: 50px;
1333     top: 45px;
1334     background-position: 35px center;
1335 }
1336 .wall-item-outside-wrapper.comment .wall-item-info {
1337     width: 60px;
1338 }
1339 .wall-item-outside-wrapper.comment .wall-item-body {
1340     margin-left: 10px;
1341 }
1342 .wall-item-outside-wrapper.comment .wall-item-author {
1343     margin-left: 50px;
1344 }
1345
1346 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1347     min-width: 50px;
1348     top: 60px;
1349 }
1350 .comment-wwedit-wrapper {
1351     /*margin: 30px 0px 0px 80px;*/
1352 }
1353 .comment-edit-wrapper {
1354     border-top: 1px #aaa solid;
1355 }
1356 .comment-wwedit-wrapper img,
1357 .comment-edit-wrapper img {
1358         width: 20px;
1359         height: 20px;
1360 }
1361 .comment-edit-photo-link, .comment-edit-photo {
1362         float: left;
1363         margin-left: 10px;
1364 }
1365 .my-comment-photo {
1366     width: 40px;
1367     height: 40px;
1368     padding: 5px;
1369 }
1370 [class^="comment-edit-text"] {
1371     margin: 5px 0 10px 20px;
1372     width: 84.5%;
1373 }
1374 .comment-edit-text-empty {
1375         height: 20px;
1376         border: 2px #babdd6 solid;
1377         border-radius: 5px;
1378         color: #babdb6;
1379         -webkit-transition: all 0.5s ease-in-out;
1380         -moz-transition: all 0.5s ease-in-out;
1381         -o-transition: all 0.5s ease-in-out;
1382         -ms-transition: all 0.5s ease-in-out;
1383         transition: all 0.5s ease-in-out;
1384 }
1385 .comment-edit-text-empty:hover {
1386         color: #999999;
1387 }
1388 .comment-edit-text-full {
1389         height: 10em;
1390     border-radius: 5px;
1391         -webkit-transition: all 0.5s ease-in-out;
1392         -moz-transition: all 0.5s ease-in-out;
1393         -o-transition: all 0.5s ease-in-out;
1394         -ms-transition: all 0.5s ease-in-out;
1395         transition: all 0.5s ease-in-out;
1396 }
1397 .comment-edit-submit-wrapper {
1398         width: 90%;
1399         margin: 5px 5px 10px 50px;
1400         text-align: right;
1401 }
1402 .comment-edit-submit {
1403     height: 22px;
1404     background-color: #555753;
1405     color: #eeeeec;
1406     -webkit-border-radius: 5px;
1407     -moz-border-radius: 5px;
1408     border-radius: 5px;
1409     border: 0;
1410 }
1411
1412
1413 /**
1414  * item text style
1415  **/
1416 .wall-item-body code {
1417         display: block;
1418         padding: 0 0 10px 5px;
1419         border-color: #ccc;
1420         border-style: solid;
1421         border-width: 1px 1px 1px 10px;
1422         background: #eee;
1423         color: #444;
1424         width: 95%;
1425 }
1426
1427
1428 /**
1429  * profile
1430  **/
1431 div[id$="text"] {
1432     font-weight: bold;
1433     border-bottom: 1px solid #ccc;
1434 }
1435 div[id$="wrapper"] {
1436     height: 100%;
1437     margin-bottom: 1em;
1438 }
1439 div[id$="wrapper"] br {
1440     clear: left;
1441 }
1442 #advanced-profile-with {
1443     margin-left: 200px;
1444 }
1445
1446
1447 /**
1448  * photos
1449  **/
1450 .photos {
1451         height: auto;
1452         overflow: auto;
1453 }
1454 #photo-top-links {
1455     margin-bottom: 30px;
1456 }
1457 .photo-album-image-wrapper,
1458 .photo-top-image-wrapper {
1459     float: left;
1460     -moz-box-shadow: 3px 3px 10px 0 #000;
1461     -webkit-box-shadow: 3px 3px 10px 0 #000;
1462     box-shadow: 3px 3px 10px 0 #000;
1463     background-color: #eee;
1464         color: #111;
1465     -webkit-border-radius: 5px;
1466     -moz-border-radius: 5px;
1467     border-radius: 5px;
1468     padding-bottom: 30px;
1469     position: relative;
1470     margin: 0 10px 10px 0;
1471 }
1472
1473 #photo-photo {
1474     max-width: 100%;
1475 }
1476 #photo-photo img {
1477     max-width: 100%;
1478 }
1479 .photo-top-image-wrapper a:hover,
1480 #photo-photo a:hover,
1481 .photo-album-image-wrapper a:hover {
1482     border-bottom: 0;
1483 }
1484 .photo-top-photo,.photo-album-photo {
1485     -webkit-border-radius:5px 5px 0 0;
1486     -moz-border-radius:5px 5px 0 0;
1487     border-radius:5px 5px 0 0;
1488 }
1489 .photo-top-album-name {
1490     position: absolute;
1491     bottom: 0;
1492     padding: 0 5px;
1493 }
1494 .caption {
1495     position: absolute;
1496     bottom: 0;
1497     margin: 0 5px;
1498 }
1499 #photo-photo {
1500         position: relative;
1501         float:left;
1502 }
1503 #photo-photo-end {
1504     clear: both;
1505 }
1506 #photo-prev-link,
1507 #photo-next-link {
1508     position:absolute;
1509     width:30%;
1510     height:100%;
1511     background-color:rgba(255,255,255,0.5);
1512     opacity:0;
1513     -webkit-transition:all .2s ease-in-out;
1514     -moz-transition:all .2s ease-in-out;
1515     -o-transition:all .2s ease-in-out;
1516     -ms-transition:all .2s ease-in-out;
1517     transition:all .2s ease-in-out;
1518     background-position:center center;
1519     background-repeat:no-repeat;
1520 }
1521 #photo-prev-link {
1522     left:0;
1523     top:0;
1524     background-image:url(prev.png);
1525 }
1526 #photo-next-link {
1527     right:0;
1528     top:0;
1529     background-image:url(next.png);
1530 }
1531
1532 #photo-prev-link a,#photo-next-link a {
1533     display:block;
1534     width:100%;
1535     height:100%;
1536     overflow:hidden;
1537     text-indent:-900000px;
1538 }
1539 #photo-prev-link:hover,
1540 #photo-next-link:hover {
1541     opacity:1;
1542     -webkit-transition:all .2s ease-in-out;
1543     -moz-transition:all .2s ease-in-out;
1544     -o-transition:all .2s ease-in-out;
1545     -ms-transition:all .2s ease-in-out;
1546     transition:all .2s ease-in-out;
1547 }
1548 #photo-next-link .icon,
1549 #photo-prev-link .icon {
1550     display: none;
1551 }
1552 #photos-upload-spacer,
1553 #photos-upload-new-wrapper,
1554 #photos-upload-exist-wrapper {
1555     margin-bottom: 1em;
1556 }
1557 #photos-upload-existing-album-text,
1558 #photos-upload-newalbum-div {
1559     background-color:#555753;
1560     color:#eeeeec;
1561     padding:1px;
1562 }
1563 #photos-upload-album-select,
1564 #photos-upload-newalbum {
1565     width: 99%;
1566 }
1567 #photos-upload-perms-menu {
1568     text-align: right;
1569 }
1570 #photo-edit-caption, #photo-edit-newtag, #photo-edit-albumname {
1571     float: left;
1572     margin-bottom: 25px;
1573 }
1574 #photo-edit-link-wrap {
1575     margin-bottom: 15px;
1576 }
1577 #photo-edit-caption {
1578         width: 100%;
1579 }
1580 #photo-edit-newtag {
1581         width: 100%;
1582 }
1583 #photo-like-div {
1584     margin-bottom: 25px;
1585 }
1586 #photo-edit-caption-end, #photo-edit-tags-end, #photo-edit-albumname-end {
1587     clear: both;
1588 }
1589 #photo-edit-delete-button {
1590     margin-left: 200px;
1591 }
1592 #photo-edit-end {
1593     margin-bottom: 35px;
1594 }
1595 #photo-caption {
1596     font-size: 110%;
1597     font-weight: bold;
1598     margin-top: 15px;
1599     margin-bottom: 15px;
1600 }
1601
1602 /**
1603  *      message
1604  */
1605 .prvmail-text {
1606     width: 100%;
1607 }
1608 #prvmail-subject {
1609     width: 100%;
1610         color: #eec;
1611         background: #444;
1612 }
1613 #prvmail-submit-wrapper {
1614     margin-top: 10px;
1615 }
1616 #prvmail-submit {
1617     float:right;
1618     margin-top: 0;
1619 }
1620 #prvmail-submit-wrapper > div {
1621     margin-right:5px;
1622     float:left;
1623 }
1624 .mail-list-outside-wrapper {
1625     margin-top: 20px;
1626 }
1627 .mail-list-sender {
1628     float: left;
1629 }
1630 .mail-list-detail {
1631     margin-left: 90px;
1632 }
1633 .mail-list-sender-name {
1634     display: inline;
1635         font-size: 1.1em;
1636 }
1637 .mail-list-date {
1638     display: inline;
1639     font-size: 0.9em;
1640     padding-left: 10px;
1641 }
1642 .mail-list-sender-name, .mail-list-date {
1643         font-style: italic;
1644 }
1645 .mail-list-subject {
1646     font-size: 1.2em;
1647 }
1648 .mail-list-delete-wrapper {
1649     float: right;
1650 }
1651 .mail-list-outside-wrapper-end {
1652     clear: both;
1653         border-bottom: 1px #eec dotted;
1654 }
1655 .mail-conv-sender {
1656     float: left;
1657     margin: 0px 5px 5px 0px;
1658 }
1659 .mail-conv-sender-photo {
1660     width: 32px;
1661     height: 32px;
1662 }
1663 .mail-conv-sender-name {
1664     float: left;
1665 }
1666 .mail-conv-date {
1667     float: right;
1668 }
1669 .mail-conv-subject {
1670     clear: right;
1671     font-weight: bold;
1672     font-size: 1.2em;
1673 }
1674 .mail-conv-body {
1675     clear: both;
1676 }
1677 .mail-conv-delete-wrapper {
1678     margin-top: 5px;
1679 }
1680
1681
1682 /**
1683  *      contacts
1684  */
1685 .view-contact-wrapper,
1686 .contact-entry-wrapper {
1687     float: left;
1688     margin: 0 5px 40px 0;
1689     width: 120px;
1690         height: 120px;
1691         padding: 3px;
1692     position: relative;
1693 }
1694 .contact-direction-wrapper {
1695     position: absolute;
1696     top: 20px;
1697 }
1698 .contact-edit-links {
1699     position: absolute;
1700     top: 60px;
1701 }
1702 .contact-entry-photo-wrapper {
1703
1704 }
1705 .contact-entry-photo {
1706         margin-left: 20px;
1707 }
1708 .contact-entry-name {
1709     width: 120px;
1710     font-weight: bold;
1711     /*overflow: hidden;*/
1712 }
1713 .contact-entry-photo {
1714         position: relative;
1715 }
1716 .contact-entry-edit-links .icon {
1717     border: 1px solid #babdb6;
1718     -webkit-border-radius: 3px;
1719     -moz-border-radius: 3px;
1720     border-radius: 3px;
1721     background-color: #fff;
1722 }
1723 #contact-entry-url, [id^="contact-entry-url"] {
1724     font-size: smaller;
1725     /*overflow: scroll;*/
1726 }
1727 #contact-entry-network, [id^="contact-entry-network"] {
1728     font-size: smaller;
1729     font-style: italic;
1730 }
1731 #contact-edit-banner-name {
1732     font-size: 1.5em;
1733 }
1734 #contact-edit-photo-wrapper {
1735     position: relative;
1736     float: left;
1737     padding: 20px;
1738 }
1739 #contact-edit-direction-icon {
1740     position:absolute;
1741     top:60px;
1742     left:0;
1743 }
1744 #contact-edit-nav-wrapper {
1745     margin-left: 0px;
1746 }
1747 #contact-edit-links {
1748     margin-top: 23px;
1749 }
1750 #contact-edit-links ul {
1751     list-style-type: none;
1752 }
1753 #contact-drop-links {
1754     margin-left:5px;
1755 }
1756 #contact-edit-nav-wrapper .icon {
1757         border: 1px solid #babdb6;
1758     -webkit-border-radius: 3px;
1759     -moz-border-radius: 3px;
1760     border-radius: 3px;
1761 }
1762 #contact-edit-poll-wrapper {
1763     margin-left: 0px;
1764 }
1765 #contact-edit-last-update-text {
1766     margin-bottom: 15px;
1767 }
1768 #contact-edit-last-updated {
1769     font-weight: bold;
1770 }
1771 #contact-edit-poll-text {
1772     display: inline;
1773 }
1774 #contact-edit-info_tbl, #contact-edit-info_parent {
1775     width: 100%;
1776 }
1777 .mceLayout {
1778     width: 100%;
1779 }
1780 #contact-edit-end {
1781     clear: both;
1782     margin-bottom: 65px;
1783 }
1784
1785 .contact-photo-menu-button {
1786     position: absolute;
1787     background-image: url("photo-menu.jpg");
1788     background-position: top left;
1789     background-repeat: no-repeat;
1790     margin: 0px; padding: 0px;
1791     width: 16px;
1792     height: 16px;
1793     top: 64px; left:0px;
1794     overflow: hidden;
1795     text-indent: 40px;
1796     display: none;
1797 }
1798 .contact-photo-menu {
1799     width: auto;
1800     border: 2px solid #444;
1801     background: #eee;
1802         color: #111;
1803     position: absolute;
1804     left: 0px; top: 90px;
1805     display: none;
1806     z-index: 10000;
1807 }
1808 .contact-photo-menu ul {
1809     margin:0px;
1810     padding: 0px;
1811     list-style: none;
1812 }
1813 .contact-photo-menu li a {
1814     display: block;
1815     padding: 2px;
1816 }
1817 .contact-photo-menu li a:hover {
1818     color: #fff;
1819     background: #3465A4;
1820     text-decoration: none;
1821 }
1822
1823
1824 /**
1825  *      register, settings & profile forms
1826  */
1827 .openid {
1828
1829 }
1830 #id_openid_url {
1831     background:url(login-bg.gif) no-repeat;
1832     background-position:0 50%;
1833     padding-left:18px;
1834 }
1835
1836 #settings-nickname-desc {
1837     background-color: #eee;
1838     -webkit-border-radius: 5px;
1839     -moz-border-radius: 5px;
1840     border-radius: 5px;
1841     padding: 5px;
1842         color: #111;
1843 }
1844 #settings-default-perms {
1845     margin-bottom: 20px;
1846 }
1847 #register-form div,
1848 #profile-edit-form div {
1849     clear: both;
1850 }
1851
1852 /*#register-form label,     */
1853 /*#profile-edit-form label {*/
1854 /*    width: 300px;         */
1855 /*    float: left;          */
1856 /*}                         */
1857
1858 /*#register-form span,     */
1859 /*#profile-edit-form span {*/
1860 /*    color: #555753;      */
1861 /*    display: block;      */
1862 /*    margin-bottom: 20px; */
1863 /*}                        */
1864 #profile-edit-marital-label span {
1865         margin: -4px;
1866 }
1867 .settings-submit-wrapper,
1868 .profile-edit-submit-wrapper {
1869     margin: 30px 0px;
1870 }
1871 .profile-edit-side-div {
1872         display: none;
1873 }
1874 /*.profile-edit-side-div:hover {
1875         display: block;
1876 }
1877 .profile-edit-side-link {
1878         margin: 3px 0px 0px 70px;
1879 }*/
1880 #profiles-menu-trigger {
1881         margin: 0px 0px 0px 25px;
1882 }
1883 .profile-listing {
1884     float: left;
1885     margin: 20px 20px 0px 0px;
1886 }
1887 .icon-profile-edit {
1888     background: url("icons.png") -150px 0px no-repeat;
1889     border: 0;
1890         cursor: pointer;
1891     display: block;
1892     float: right;
1893         width: 20px;
1894     height: 20px;
1895     margin: 0 0 -18px;
1896         position: absolute;
1897     text-decoration: none;
1898         top: 18px;
1899         right: 226px;
1900 }
1901 #profile-edit-links ul {
1902     margin: 20px 0;
1903     padding: 0;
1904     list-style: none;
1905 }
1906 .marital {
1907         margin-top: 5px;
1908 }
1909 #register-sitename {
1910     display: inline;
1911     font-weight: bold;
1912 }
1913 #advanced-expire-popup {
1914         background: #2e2f2e;
1915         color: #eec;
1916 }
1917 #id_ssl_policy {
1918         width: 374px;
1919 }
1920
1921
1922 /**
1923  *      contacts selector
1924  */
1925 .group-delete-wrapper {
1926         margin: -31px 50px 0 0;
1927     float: right;
1928 }
1929 /*.group-delete-icon {
1930     margin: 0 0 0 10px;
1931 }*/
1932 #group-edit-submit-wrapper {
1933     margin: 0 0 10px 0;
1934     display: inline;
1935 }
1936 #group-edit-desc {
1937     margin: 10px 0px;
1938 }
1939 #group-members,
1940 #prof-members {
1941     height:200px;
1942     overflow:auto;
1943     border:1px solid #555753;
1944     -webkit-border-radius:5px 5px 0 0;
1945     -moz-border-radius:5px 5px 0 0;
1946     border-radius:5px 5px 0 0;
1947 }
1948 #group-all-contacts,
1949 #prof-all-contacts {
1950     height:200px;
1951     overflow:auto;
1952     border:1px solid #555753;
1953     -webkit-border-radius:0 0 5px 5px;
1954     -moz-border-radius:0 0 5px 5px;
1955     border-radius:0 0 5px 5px;
1956 }
1957 #group-members h3,
1958 #group-all-contacts h3,
1959 #prof-members h3,
1960 #prof-all-contacts h3 {
1961     color:#eeeeec;
1962     background-color:#555753;
1963     margin:0;
1964     padding:5px;
1965 }
1966 #group-separator,
1967 #prof-separator {
1968     display: none;
1969 }
1970
1971
1972 /**
1973  * profile
1974  */
1975 #cropimage-wrapper {
1976     float:left;
1977 }
1978 #crop-image-form {
1979     clear:both;
1980 }
1981
1982
1983 /**
1984  * intros
1985  */
1986 .intro-wrapper {
1987     margin-top: 20px;
1988 }
1989
1990 .intro-fullname {
1991     font-size: 1.1em;
1992     font-weight: bold;
1993
1994 }
1995 .intro-desc {
1996     margin-bottom: 20px;
1997     font-weight: bold;
1998 }
1999
2000 .intro-note {
2001     padding: 10px;
2002 }
2003
2004 .intro-end {
2005     padding: 30px;
2006 }
2007
2008 .intro-form {
2009     float: left;
2010 }
2011 .intro-approve-form {
2012     clear: both;
2013 }
2014 .intro-approve-as-friend-end {
2015     clear: both;
2016 }
2017 .intro-submit-approve, .intro-submit-ignore {
2018     margin-right: 20px;
2019 }
2020 .intro-submit-approve {
2021     margin-top: 15px;
2022 }
2023
2024 .intro-approve-as-friend-label, .intro-approve-as-fan-label {
2025     float: left;
2026 }
2027 .intro-approve-as-friend, .intro-approve-as-fan {
2028     float: left;
2029 }
2030 .intro-form-end {
2031     clear: both;
2032     margin-bottom: 10px;
2033 }
2034 .intro-approve-as-friend-desc {
2035     margin-top: 10px;
2036 }
2037 .intro-approve-as-end {
2038     clear: both;
2039     margin-bottom: 10px;
2040 }
2041
2042 .intro-end {
2043     clear: both;
2044 }
2045
2046
2047 /**
2048  * events
2049  **/
2050 .clear { clear: both; }
2051 .eventcal {
2052     float:left;
2053     font-size:20px;
2054 }
2055 .vevent {
2056     border:1px solid #ccc;
2057 }
2058 .vevent .event-description, .vevent .event-location {
2059         margin-left: 10px;
2060         margin-right: 10px;
2061 }
2062 .vevent .event-start {
2063         margin-left: 10px;
2064         margin-right: 10px;
2065 }
2066
2067 #new-event-link {
2068         margin-bottom: 10px;
2069 }
2070 .edit-event-link, .plink-event-link {
2071         float: left;
2072         margin-top: 4px;
2073         margin-right: 4px;
2074         margin-bottom: 15px;
2075 }
2076 .event-description:before {
2077         content: url('../../../images/calendar.png');
2078         margin-right: 15px;
2079 }
2080 .event-start, .event-end {
2081         margin-left: 10px;
2082         width: 330px;
2083 }
2084 .event-start .dtstart, .event-end .dtend {
2085         float: right;
2086 }
2087 .event-list-date {
2088         margin-bottom: 10px;
2089 }
2090 .prevcal, .nextcal {
2091         float: left;
2092         margin-left: 32px;
2093         margin-right: 32px;
2094         margin-top: 64px;
2095 }
2096 .event-calendar-end {
2097         clear: both;
2098 }
2099 .calendar {
2100     font-family: monospace;
2101 }
2102 .today {
2103         font-weight: bold;
2104         color: #FF0000;
2105 }
2106 #event-start-text,
2107 #event-finish-text {
2108         margin-top: 10px;
2109         margin-bottom: 5px;
2110 }
2111 #event-nofinish-checkbox,
2112 #event-nofinish-text,
2113 #event-adjust-checkbox,
2114 #event-adjust-text,
2115 #event-share-checkbox {
2116     float:left;
2117 }
2118 #event-datetime-break {
2119         margin-bottom: 10px;
2120 }
2121 #event-nofinish-break,
2122 #event-adjust-break,
2123 #event-share-break {
2124         clear: both;
2125 }
2126 #event-desc-text,
2127 #event-location-text {
2128         margin-top: 10px;
2129         margin-bottom: 5px;
2130 }
2131 #event-submit {
2132         margin-top: 10px;
2133 }
2134 .body-tag {
2135         margin: 10px 0;
2136         opacity: 0.5;
2137         filter:alpha(opacity=50);
2138 }
2139 .body-tag:hover {
2140         opacity: 1.0 !important;
2141         filter:alpha(opacity=100) !important;
2142 }
2143 .filesavetags {
2144         margin: 20px 0;
2145         opacity: 0.5;
2146         filter:alpha(opacity=50);
2147 }
2148 .filesavetags:hover {
2149         margin: 20px 0;
2150         opacity: 1.0 !important;
2151         filter:alpha(opacity=100) !important;
2152 }
2153 .item-select {
2154         opacity: 0.1;
2155         filter:alpha(opacity=10);
2156         float: right;
2157         margin-right: 10px;
2158 }
2159 .item-select:hover, .checkeditem {
2160         opacity: 1;
2161         filter:alpha(opacity=100);
2162 }
2163 #item-delete-selected {
2164         margin-top: 30px;
2165 }
2166 /* was tired of having no way of moving it around, so
2167  * here's a little 'hook' to do so */
2168 .delete-checked {
2169         position: absolute;
2170         left: 35px;
2171         margin-top: 20px;
2172 }
2173 #item-delete-selected-end {
2174         clear: both;
2175 }
2176 #item-delete-selected-icon, #item-delete-selected-desc {
2177         float: left;
2178         margin-right: 5px;
2179 }
2180 #item-delete-selected-desc:hover {
2181         text-decoration: underline;
2182 }
2183
2184
2185 /**
2186  *      directory
2187  */
2188 .directory-item {
2189     float: left;
2190         /*margin: 50px 50px 0px 0px;*/
2191         margin: 0 5px 4px 0;
2192         padding: 3px;
2193         width: 180px;
2194         height: 250px;
2195     position: relative;
2196 }
2197
2198
2199 /**
2200  * sidebar
2201  */
2202 #group-sidebar {
2203     margin-bottom: 10px;
2204 }
2205 .group-selected, .nets-selected, .fileas-selected {
2206     padding: 3px;
2207         color: #111;
2208     background: #f8f8f8;
2209     font-weight: bold;
2210 }
2211 .group-selected:hover, .nets-selected:hover, .fileas-selected:hover {
2212         color: #111;
2213 }
2214 .groupsideedit {
2215     margin-right: 10px;
2216 }
2217 #sidebar-group-ul {
2218     padding-left: 0;
2219 }
2220 #sidebar-group-list {
2221     margin: 0 0 5px 0;
2222 }
2223 #sidebar-group-list ul {
2224     list-style-type: none;
2225     list-style-position: inside;
2226 }
2227 #sidebar-group-list li {
2228     margin-top: 10px;
2229 }
2230 #sidebar-group-list .icon {
2231     display: inline-block;
2232     height: 12px;
2233     width: 12px;
2234 }
2235 #sidebar-new-group {
2236     margin: auto;
2237     display: inline-block;
2238     color: #efefef;
2239     text-decoration: none;
2240     text-align: center;
2241 }
2242 #peoplefind-sidebar form {
2243         margin-bottom: 10px;
2244 }
2245 #sidebar-new-group:hover {
2246     /*background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );*/
2247     /*background: -moz-linear-gradient( center top, #b20202 5%, #d60808 100% );*/
2248     /*background-color: #b20202;*/
2249 }
2250
2251 #sidebar-new-group:active {
2252     position: relative;
2253     top: 1px;
2254 }
2255 #side-peoplefind-url {
2256     background-color: #e5e0cf;
2257     color: #666;
2258         border: 1px 666 solid;
2259         margin-right: 3px;
2260         width: 75%;
2261 }
2262 #side-peoplefind-url:hover, #side-peoplefind-url:focus {
2263     background-color: #efefef;
2264     color: #222;
2265         border: 1px 333 solid;
2266 }
2267 .nets-ul {
2268     list-style-type: none;
2269     padding-left: 0px;
2270 }
2271 .nets-ul li {
2272     margin: 10px 0 0;
2273 }
2274
2275 .nets-link {
2276     margin-left: 0px;
2277 }
2278 .nets-all {
2279     margin-left: 0px;
2280 }
2281 #netsearch-box {
2282     margin-top: 20px;
2283     width: 150px;
2284 }
2285 #netsearch-box #search-submit {
2286     margin: 5px 0px 0px 0px;
2287 }
2288
2289
2290 /**
2291  * ADMIN
2292  */
2293 #pending-update {
2294     float:right;
2295     color: #fff;
2296     font-weight: bold;
2297     background-color: #ff0000;
2298     padding: 0 .3em;
2299 }
2300 .admin.linklist {
2301     border: 0; padding: 0;
2302 }
2303 .admin.link {
2304     list-style-position: inside;
2305 }
2306 #adminpage dl {
2307     clear:left;
2308     margin-bottom: 2px;
2309     padding-bottom: 2px;
2310     border-bottom: 1px solid #000;
2311 }
2312 #adminpage dt {
2313     width: 250px;
2314     float: left;
2315     font-weight: bold;
2316 }
2317 #adminpage dd {
2318         margin-left: 250px;
2319 }
2320 #adminpage h3 {
2321     border-bottom:1px solid #ccc;
2322 }
2323
2324 #adminpage .submit {
2325         clear:left;
2326 }
2327
2328 #adminpage #pluginslist {
2329     margin: 0;
2330     padding: 0;
2331 }
2332 #adminpage .plugin {
2333     list-style: none;
2334     display: block;
2335     border: 1px solid #888;
2336     padding: 1em;
2337     margin-bottom: 5px;
2338     clear: left;
2339 }
2340 #adminpage .toggleplugin {
2341         float:left;
2342         margin-right: 1em;
2343 }
2344
2345 #adminpage table {
2346     width: 100%;
2347     border-bottom: 1px solid #000;
2348     margin: 5px 0;
2349 }
2350 #adminpage table th {
2351     text-align: left;
2352 }
2353 #adminpage td .icon {
2354     float: left;
2355 }
2356 #adminpage table#users img {
2357     width: 16px; height: 16px;
2358 }
2359 #adminpage table tr:hover {
2360 /*      color: ;*/
2361     background-color: #bbc7d7;
2362 }
2363 #adminpage .selectall {
2364     text-align: right;
2365 }
2366 #adminpage #users a {
2367 /*      color: #;*/
2368         text-decoration: underline;
2369 }
2370
2371 /**
2372  * Form fields
2373  */
2374 .field {
2375         /*margin-bottom: 10px;*/
2376         /*padding-bottom: 10px;*/
2377         overflow: auto;
2378     width: 100%;
2379 }
2380 .field label, label {
2381     float: left;
2382     width: 275px;
2383         display: block;
2384         font-size: 1.077em;
2385         margin: 0 10px 0.5em 0;
2386         border: 1px #999 solid;
2387         padding: 5px;
2388         background: #ccc;
2389         vertical-align: middle;
2390         color: #111;
2391 }
2392 .field input, input[type="text"] {
2393         width: 250px;
2394         height: 25px;
2395         border: 1px #999 solid;
2396 }
2397 .field textarea {
2398     width: 80%;
2399     height: 100px;
2400 }
2401 .field_help {
2402     display: block;
2403     margin-left: 297px;
2404     color: #666;
2405 }
2406 .field .onoff {
2407     float: left;
2408     width: 80px;
2409 }
2410 .field .onoff a {
2411     display: block;
2412     border: 1px solid #666;
2413     padding: 3px 6px 4px 10px;
2414     height: 16px;
2415     text-decoration: none;
2416 }
2417 .field .onoff .on {
2418         background: url("../../../images/onoff.jpg") no-repeat 42px 1px #999;
2419     color: #111;
2420     text-align: left;
2421 }
2422 .field .onoff .off {
2423         background: url("../../../images/onoff.jpg") no-repeat 2px 1px #ccc;
2424     color: #333;
2425     text-align: right;
2426 }
2427 .hidden {
2428     display:none !important;
2429 }
2430 .field.radio .field_help {
2431     margin-left: 297px;
2432 }
2433
2434
2435 /*
2436  * UPDATE
2437  */
2438 .popup {
2439         width: 100%;
2440     height: 100%;
2441         top: 0px;
2442     left: 0px;
2443         position: absolute;
2444         display: none;
2445 }
2446 .popup .background {
2447         background-color: rgba(0,0,0,128);
2448         opacity: 0.5;
2449         width: 100%;
2450     height: 100%;
2451         position: absolute;
2452         top:0px;
2453     left:0px;
2454 }
2455 .popup .panel {
2456         top: 25%;
2457     left: 25%;
2458     width: 50%;
2459     height: 50%;
2460         padding: 1em;
2461         position: absolute;
2462         border: 4px solid #000000;
2463         background-color: #FFFFFF;
2464 }
2465 #panel {
2466     z-index: 100;
2467 }
2468 .grey {
2469     color: grey;
2470 }
2471 .orange {
2472     color: orange;
2473 }
2474 .red {
2475     color: red;
2476 }
2477 .popup .panel .panel_text {
2478     display: block;
2479     overflow: auto;
2480     height: 80%;
2481 }
2482 .popup .panel .panel_in {
2483     width: 100%;
2484     height: 100%;
2485     position: relative;
2486 }
2487 .popup .panel .panel_actions {
2488     width: 100%;
2489     bottom: 4px;
2490     left: 0px;
2491     position: absolute;
2492 }
2493 .panel_text .progress {
2494     width: 50%;
2495     overflow: hidden;
2496     height: auto;
2497     border: 1px solid #cccccc;
2498     margin-bottom: 5px;
2499 }
2500 .panel_text .progress span {
2501     float: right;
2502     display: block;
2503     width: 25%;
2504     background-color: #eeeeee;
2505     text-align: right;
2506 }
2507
2508 /**
2509  * OAuth
2510  */
2511 .oauthapp {
2512         height: auto;
2513     overflow: auto;
2514         border-bottom: 2px solid #cccccc;
2515         padding-bottom: 1em;
2516         margin-bottom: 1em;
2517 }
2518 .oauthapp img {
2519         float: left;
2520         width: 48px; height: 48px;
2521         margin: 10px;
2522 }
2523 .oauthapp img.noicon {
2524         background-image: url("../../../images/icons/48/plugin.png");
2525         background-position: center center;
2526         background-repeat: no-repeat;
2527 }
2528 .oauthapp a {
2529         float: left;
2530 }
2531
2532
2533 /**
2534  * ICONS
2535  */
2536 .iconspacer {
2537         display: block;
2538     width: 16px;
2539     height: 16px;
2540 }
2541 .icon {
2542     display: block;
2543     width: 20px;
2544     height: 20px;
2545     background: url(icons.png) no-repeat;
2546     border: 0;
2547     text-decoration: none;
2548         border-radius: 5px;
2549 }
2550 .icon:hover {
2551     border: 0;
2552     text-decoration: none;
2553 }
2554 .icon.drop,
2555 .icon.drophide, .icon.delete {
2556     float: left;
2557 }
2558 .icon.s22.delete {
2559         display: block;
2560         background-position: -110px 0;
2561 }
2562 .icon.s22.text {
2563         padding: 10px 0px 0px 25px;
2564         width: 200px;
2565 }
2566 .icon.text {
2567     text-indent: 0px;
2568 }
2569 .icon.s16 {
2570     min-width: 16px;
2571     height: 16px;
2572 }
2573 .s16 .add {
2574     background: url("../../../images/icons/16/add.png") no-repeat;
2575 }
2576 .add {
2577     margin: 0px 5px;
2578 }
2579 .article {
2580         background-position: -50px 0;
2581 }
2582 .audio {
2583         background-position: -70px 0;
2584 }
2585 .block {
2586         background-position: -90px 0px;
2587 }
2588 .drop, .delete {
2589         background-position: -110px 0;
2590 }
2591 .drophide {
2592         background-position: -130px 0;
2593 }
2594 .edit {
2595         background-position: -150px 0;
2596 }
2597 .camera {
2598         background-position: -170px 0;
2599 }
2600 .dislike {
2601         background-position: -190px 0;
2602 }
2603 .file-as {
2604         background-position: -230px -60px;
2605 }
2606 .like {
2607         background-position: -211px 0;
2608 }
2609 .link {
2610         background-position: -230px 0;
2611 }
2612 .globe, .location {
2613         background-position: -50px -20px;
2614 }
2615 .noglobe, .nolocation {
2616         background-position: -70px -20px;
2617 }
2618 .no {
2619         background-position: -90px -20px;
2620 }
2621 .pause {
2622         background-position: -110px -20px;
2623 }
2624 .play {
2625         background-position: -130px -20px;
2626 }
2627 .pencil {
2628         background-position: -151px -18px;
2629 }
2630 .small-pencil {
2631         background-position: -170px -20px;
2632 }
2633 .recycle {
2634         background-position: -190px -20px;
2635 }
2636 .remote-link {
2637         background-position: -210px -20px;
2638 }
2639 .share {
2640         background-position: -230px -20px;
2641 }
2642 .tools {
2643         background-position: -50px -40px;
2644 }
2645 .lock {
2646         background-position: -70px -40px;
2647 }
2648 .unlock {
2649         background-position: -88px -40px;
2650 }
2651 .video {
2652         background-position: -110px -40px;
2653 }
2654 .attach {
2655         background-position: -190px -40px;
2656 }
2657 .language {
2658         background-position: -210px -40px;
2659 }
2660 .starred {
2661         background-position: -130px -60px;
2662 }
2663 .unstarred {
2664         background-position: -150px -60px;
2665 }
2666 .tagged {
2667         background-position: -170px -60px;
2668 }
2669 .on {
2670         background-position: -50px  -60px;
2671 }
2672 .off {
2673         background-position: -70px  -60px;
2674 }
2675 .prev {
2676         background-position: -90px  -60px;
2677 }
2678 .next {
2679         background-position: -110px  -60px;
2680 }
2681 .icon.dim {
2682         opacity: 0.3;
2683         filter: alpha(opacity=30);
2684 }
2685 #pause {
2686         position: fixed;
2687         bottom: 5px;
2688         right: 5px;
2689 }
2690 .border, .border:hover {
2691         border: 1px solid #babdb6;
2692     -webkit-border-radius: 5px;
2693     -moz-border-radius: 5px;
2694     border-radius: 5px;
2695 }
2696 .attachtype {
2697     display: block;
2698     width: 20px;
2699     height: 23px;
2700     background-image: url(../../../images/content-types.png);
2701 }
2702 .type-video {
2703     background-position: 0px 0px;
2704 }
2705 .type-image {
2706     background-position: -20px 0;
2707 }
2708 .type-audio {
2709     background-position: -40px 0;
2710 }
2711 .type-text {
2712     background-position: -60px 0px;
2713 }
2714 .type-unkn {
2715     background-position: -80px 0;
2716 }
2717
2718
2719 /**
2720  *      footer
2721  */
2722 .cc-license {
2723     margin-top: 100px;
2724     font-size: 0.7em;
2725 }
2726 footer {
2727     display: block;
2728     margin: 50px 20%;
2729     clear: both;
2730 }
2731 #profile-jot-text {
2732     height: 20px;
2733     color: #666;
2734     border: 1px solid #ccc;
2735     border-radius: 5px;
2736     width: 99.5%;
2737 }
2738
2739
2740 /** acl **/
2741 #photo-edit-perms-select,
2742 #photos-upload-permissions-wrapper,
2743 #profile-jot-acl-wrapper {
2744     display: block !important;
2745         background: #eec;
2746         color: #2e2f2e;
2747 }
2748 #acl-wrapper {
2749     width: 660px;
2750         margin: 0 auto;
2751 }
2752 #acl-search {
2753     float: right;
2754     background: #fff url("../../../images/search_18.png") no-repeat right center;
2755     padding-right: 20px;
2756         margin: 6px;
2757 }
2758 #acl-showall {
2759     float: left;
2760     display: block;
2761     width: auto;
2762     height: 18px;
2763     background: #eec url("../../../images/show_all_off.png") 8px 8px no-repeat;
2764     padding: 7px 10px 7px 30px;
2765     -webkit-border-radius: 5px;
2766     -moz-border-radius: 5px;
2767     border-radius: 5px;
2768     color: #999;
2769         margin: 5px 0;
2770 }
2771 #acl-showall.selected {
2772     color: #000;
2773     background: #f90 url(../../../images/show_all_on.png) 8px 8px no-repeat;
2774 }
2775 #acl-list {
2776     height: 210px;
2777     border: 1px solid #ccc;
2778     clear: both;
2779     margin-top: 30px;
2780     overflow: auto;
2781 }
2782 /*#acl-list-content {
2783 }*/
2784 .acl-list-item {
2785         border: 1px solid #ccc;
2786     display: block;
2787     float: left;
2788     height: 110px;
2789     margin: 3px 0 5px 5px;
2790     width: 120px;
2791 }
2792 .acl-list-item img {
2793     width: 22px;
2794     height: 22px;
2795     float: left;
2796     margin: 5px 5px 20px;
2797 }
2798 .acl-list-item p {
2799     height: 12px;
2800     font-size: 10px;
2801     margin: 0 0 22px;
2802     padding: 2px 0 1px;
2803 }
2804 .acl-list-item a {
2805     background: #ccc 3px 3px no-repeat;
2806     -webkit-border-radius: 2px;
2807     -moz-border-radius: 2px;
2808     border-radius: 2px;
2809         clear: both;
2810     font-size: 10px;
2811     display: block;
2812     width: 55px;
2813     height: 20px;
2814     color: #999;
2815     margin: 5px auto 0;
2816         padding: 0 3px;
2817         text-align: center;
2818         vertical-align: middle;
2819 }
2820 #acl-wrapper a:hover {
2821     text-decoration: none;
2822     color: #000;
2823         border: 0;
2824 }
2825 .acl-button-show {
2826     background-image: url('../../../images/show_off.png');
2827         margin: 0 auto;
2828 }
2829 .acl-button-hide {
2830     background-image: url('../../../images/hide_off.png');
2831         margin: 0 auto;
2832 }
2833 .acl-button-show.selected {
2834     color: #000;
2835     background-color: #9ade00;
2836     background-image: url(../../../images/show_on.png);
2837 }
2838 .acl-button-hide.selected {
2839     color: #000;
2840     background-color: #ff4141;
2841     background-image: url(../../../images/hide_on.png);
2842 }
2843 .acl-list-item.groupshow {
2844     border-color: #9ade00;
2845 }
2846 .acl-list-item.grouphide {
2847     border-color: #ff4141;
2848 }
2849 /** /acl **/
2850
2851
2852 /* autocomplete popup */
2853 .acpopup {
2854         max-height: 175px;
2855     max-width: 42%;
2856         background-color: #555753;
2857         color: #fff;
2858         overflow: auto;
2859         z-index: 100000;
2860         border: 1px solid #cccccc;
2861 }
2862 .acpopupitem {
2863         background-color: #555753;
2864     padding: 4px;
2865         clear: left;
2866 }
2867 .acpopupitem img {
2868         float: left;
2869         margin-right: 4px;
2870 }
2871 .acpopupitem.selected {
2872         color: #2e3436;
2873     background-color: #eeeeec;
2874 }
2875 .qcomment-wrapper {
2876     padding: 0px;
2877     margin: 2px;
2878     list-style-type: none;
2879 }
2880 .qcomment, .qcomment:hover {
2881     display: inline;
2882     padding: 5px;
2883     margin: 5px;
2884 }
2885 .qcomment {
2886         opacity: 0.5;
2887         filter:alpha(opacity=50);
2888 }
2889 .qcomment:hover {
2890         opacity: 1.0;
2891         filter:alpha(opacity=100);
2892 }
2893 #network-star-link {
2894     margin-top: 10px;
2895 }
2896 .network-star {
2897     float: left;
2898     margin-right: 5px;
2899 }
2900 .network-star.icon.starred {
2901     display: inline-block;
2902 }
2903 #fileas-sidebar {
2904
2905 }
2906 .fileas-ul {
2907         padding: 0;
2908 }
2909
2910
2911
2912 /*
2913  * ADDONS THEMING
2914  */
2915
2916 #sidebar-page-list {
2917
2918 }
2919 #sidebar-page-list ul {
2920         padding: 0;
2921         margin: 5px 0;
2922 }
2923 #sidebar-page-list li {
2924         list-style: none;
2925 }
2926
2927
2928 @media handheld {
2929         body {
2930                 font-size: 15pt;
2931         }
2932 }