view/theme/dispy-dark/style.css

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