view/theme/dispy/style.css

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