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