view/theme/dispy-dark/style.css

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