view/theme/dispy-dark/style.css

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