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 -20px;
 448     width: 275px;
 449     max-height: 300px;
 450     overflow-y: 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: #eec;
 768         display: block;
 769         font-size: 1.2em;
 770         padding: 0.2em 0.5em;
 771 }
 772 #wallmessage-link {
 773         /*background: #3465A4 url(connect.png) no-repeat 95% center;*/
 774         /*border-radius: 5px 5px 5px 5px;*/
 775         color: #eee;
 776         display: block;
 777         font-size: 1.2em;
 778         padding: 0.2em 0.5em;
 779 }
 780 #netsearch-box {
 781         margin: 20px 0px 30px;
 782     width: 150px;
 783 }
 784 #netsearch-box #search-submit {
 785     margin: 5px 5px 0px 0px;
 786 }
 787 .ttright {
 788         margin: 0px 0px 0px 0px;
 789 }
 790
 791
 792 /**
 793 * contacts block
 794 */
 795 .contact-block-div {
 796     width: 50px;
 797     height: 50px;
 798     float: left;
 799 }
 800 .contact-block-textdiv {
 801     width: 150px;
 802     height: 34px;
 803     float: left;
 804 }
 805 #contact-block-end {
 806     clear: both;
 807 }
 808
 809
 810 /**
 811  * jot
 812  **/
 813 #jot {
 814   /*width: 785px;*/
 815   margin: 10px 0 20px 0px;
 816   width: 100%;
 817 }
 818 #jot #jot-tools {
 819   margin: 0px;
 820   padding: 0px;
 821   height: 35px;
 822   overflow: none;
 823   width: 100%;
 824   /*background-color: #0e232e;*/
 825   /*border-bottom: 2px solid #9eabb0;*/
 826 }
 827 #jot #jot-tools span {
 828     float: left;
 829     margin: 10px 20px 2px 0px;
 830 }
 831 #jot #jot-tools span a {
 832     display: block;
 833 }
 834 #jot #jot-tools .perms {
 835     float: right;
 836     width: 40px;
 837 }
 838 #jot #jot-tools li.loading {
 839     float: right;
 840     background-color: #ffffff;
 841     width: 20px;
 842     vertical-align: center;
 843     text-align: center;
 844     border-top: 2px solid #9eabb0;
 845     height: 38px;
 846 }
 847 #jot #jot-tools li.loading img {
 848     margin-top: 10px;
 849 }
 850 #jot #jot-title {
 851         border: 1px solid #ccc;
 852     margin: 0 0 5px;
 853     height: 20px;
 854     width: 90%;
 855     font-weight: bold;
 856     border-radius: 5px;
 857         vertical-align: middle;
 858 }
 859 #jot #character-counter {
 860         width: 6%;
 861         float: right;
 862         text-align: right;
 863         height: 15px;
 864         line-height: 20px;
 865         padding: 2px 20px 5px 0;
 866 }
 867 #profile-jot-text_tbl {
 868         margin-bottom: 10px;
 869 }
 870 #profile-jot-text_ifr {
 871         width:99.900002% !important;
 872 }
 873 [id$="jot-text_ifr"] {
 874         width: 99.900002% !important;
 875         color: #2e2f2e;
 876         background: #eec;
 877 }
 878 [id$="jot-text_ifr"] .mceContentBody {
 879         color: #2e2f2e;
 880         background: #eec;
 881 }
 882 #profile-attach-wrapper,
 883 #profile-audio-wrapper,
 884 #profile-link-wrapper,
 885 #profile-location-wrapper,
 886 #profile-nolocation-wrapper,
 887 #profile-title-wrapper,
 888 #profile-upload-wrapper,
 889 #profile-video-wrapper {
 890     float: left;
 891         margin: 0 20px 0 0;
 892 }
 893 #profile-rotator-wrapper {
 894         float: right;
 895 }
 896 #profile-jot-tools-end,
 897 #profile-jot-banner-end {
 898         clear: both;
 899 }
 900 #profile-jot-email-wrapper {
 901         margin:10px 10% 0;
 902         border:1px solid #555753;
 903         border-bottom:0;
 904 }
 905 #profile-jot-email-label {
 906         background-color:#555753;
 907         color:#ccccce;
 908         padding:5px;
 909 }
 910 #profile-jot-email {
 911         width:90%;
 912         margin:5px;
 913 }
 914 #profile-jot-networks {
 915         margin: 0 10%;
 916         border: 1px solid #555753;
 917         border-top: 0;
 918         border-bottom: 0;
 919         padding: 5px;
 920 }
 921 #profile-jot-net {
 922         margin: 5px 0;
 923 }
 924 #jot-preview-link {
 925     margin: 0 0 0 10px;
 926     border: 0;
 927     text-decoration: none;
 928         float: right;
 929 }
 930 .icon-text-preview {
 931         margin: 0 0 -18px 0;
 932         display: block;
 933     width: 20px;
 934     height: 20px;
 935     background: url(icons.png) no-repeat -128px -40px;
 936     border: 0;
 937     text-decoration: none;
 938         float: right;
 939         cursor: pointer;
 940 }
 941 #profile-jot-perms {
 942         float: right;
 943     background-color: #555753;
 944     height: 22px;
 945     width: 20px;
 946     -webkit-border-radius: 5px;
 947     -moz-border-radius: 5px;
 948     border-radius: 5px;
 949     overflow: hidden;
 950     border: 0px;
 951     margin: 0 10px 0 10px;
 952 }
 953 #profile-jot-plugin-wrapper {
 954         width: 1px;
 955         margin: 10px 0 0 0;
 956         float: right;
 957 }
 958 #profile-jot-submit-wrapper {
 959         float: right;
 960         width: 100%;
 961         list-style: none;
 962         margin: 10px 0 0 0;
 963         padding: 0;
 964 }
 965 #profile-jot-submit {
 966         height: 22px;
 967         background-color: #555753;
 968         color: #eeeeec;
 969         -webkit-border-radius: 5px;
 970         -moz-border-radius: 5px;
 971         border-radius: 5px;
 972         border: 0;
 973         margin: 0;
 974         float: right;
 975 }
 976 #jot-perms-icon {
 977         height: 22px;
 978         width: 20px;
 979         -webkit-border-radius: 5px;
 980         -moz-border-radius: 5px;
 981         border-radius: 5px;
 982         overflow: hidden;
 983         border: 0;
 984 }
 985 #profile-jot-acl-wrapper {
 986         margin: 0 10px;
 987         border: 1px solid #555753;
 988         border-top: 0;
 989         display: block !important;
 990 }
 991 #group_allow_wrapper,
 992 #group_deny_wrapper,
 993 #acl-permit-outer-wrapper {
 994         width:47%;
 995         float:left;
 996 }
 997 #contact_allow_wrapper,
 998 #contact_deny_wrapper,
 999 #acl-deny-outer-wrapper {
1000         width:47%;
1001         float:right;
1002 }
1003 #acl-permit-text {
1004         background-color: #555753;
1005         color: #ccccce;
1006         padding: 5px;
1007         float: left;
1008 }
1009 #jot-public {
1010         background-color: #555753;
1011         color: #ff0000;
1012         padding: 5px;
1013         float: left;
1014 }
1015 #acl-deny-text {
1016         background-color: #555753;
1017         color: #ccccce;
1018         padding: 5px;
1019         float: left;
1020 }
1021 #acl-permit-text-end,
1022 #acl-deny-text-end {
1023         clear: both;
1024 }
1025 #jot-title-desc {
1026         color: #ccc;
1027 }
1028 #profile-jot-desc {
1029         color: #ff2000;
1030         margin: 5px 0;
1031 }
1032 #jot-title-wrapper {
1033         margin-bottom: 5px;
1034 }
1035 #jot-title-display {
1036         font-weight: bold;
1037 }
1038 .jothidden {
1039     display: none;
1040 }
1041 #jot-preview-content {
1042     background-color: #3e3f3e;
1043         color: #eec;
1044     border: 1px #eec solid;
1045     border-radius: 5px;
1046     padding: 3px 3px 6px 10px;
1047 }
1048 #jot-preview-content .wall-item-outside-wrapper {
1049         border: 0;
1050         border-radius: 0px;
1051 }
1052
1053
1054 /**
1055  * section
1056  */
1057 section {
1058     margin: 20px 9% 0 4%;
1059     font-size: 0.8em;
1060     padding-right: 230px;
1061         min-width: 475px;
1062         width: 65%;
1063 }
1064
1065 /** tabs **/
1066 .tabs {
1067     list-style: none;
1068     margin: 10px 0;
1069     padding: 0;
1070 }
1071 .tabs li {
1072     display: inline;
1073         font-size: smaller;
1074         font-weight: bold;
1075 }
1076 .tab {
1077     border: 1px solid #729fcf;
1078         padding: 4px;
1079 }
1080 .tab:hover, .tab.active:hover {
1081     background: #88a9d2;
1082     color: #2e2f2e;
1083 }
1084 .tab:active {
1085     background: #88a9d2;
1086     color: #2e2f2e;
1087 }
1088 .tab.active {
1089         background: #88a9d2;
1090     color: #2e2f2e;
1091 }
1092 .tab.active a {
1093         color: #2e2f2e;
1094 }
1095 .tab a {
1096         border: 0;
1097         text-decoration: none;
1098 }
1099
1100
1101 /**
1102  *      items
1103  */
1104 .wall-item-outside-wrapper {
1105         border: 1px solid #aaa;
1106         border-radius: 5px;
1107 }
1108 .wall-item-outside-wrapper.comment {
1109         margin-top: 5px;
1110 }
1111 .wall-item-outside-wrapper-end {
1112     clear: both;
1113 }
1114 .wall-item-content-wrapper {
1115     position: relative;
1116         padding: 10px;
1117         width: auto;
1118 }
1119 .wall-item-outside-wrapper .wall-item-comment-wrapper {
1120     /*margin-left: 90px;*/
1121 }
1122 .shiny {
1123     background: #2e3436;
1124         border-radius: 5px;
1125 }
1126 .wall-outside-wrapper .shiny {
1127         border-radius: 5px;
1128 }
1129 .heart {
1130         color: red;
1131 }
1132 .wall-item-content {
1133         overflow-x: auto;
1134         margin: 0px 15px 0px 5px;
1135 }
1136 /* removing it from here, vs. putting it in .wall-item-content
1137  * might break things for people. we shall see ;) */
1138 [id^="tread-wrapper"], [class^="tread-wrapper"] {
1139     margin: 15px 0 0 0;
1140     padding: 0px;
1141         /*overflow-x: auto;*/
1142 }
1143 .wall-item-photo-menu {
1144     display: none;
1145 }
1146 .wall-item-photo-menu-button {
1147     display:none;
1148     text-indent:-99999px;
1149     background:#555753 url(menu-user-pin.jpg) no-repeat 75px center;
1150     position:absolute;
1151     overflow:hidden;
1152     height:20px;
1153     width:90px;
1154     top:85px;
1155     left:0;
1156     -webkit-border-radius:0 0 5px 5px;
1157     -moz-border-radius:0 0 5px 5px;
1158     border-radius:0 0 5px 5px;
1159 }
1160 .wall-item-info {
1161     float: left;
1162     width: 110px;
1163 }
1164 .wall-item-photo-wrapper {
1165     width: 80px;
1166     height: 80px;
1167     position: relative;
1168     padding: 5px;
1169     background-color: #555753;
1170     -webkit-border-radius: 5px;
1171     -moz-border-radius: 5px;
1172     border-radius: 5px;
1173 }
1174 [class^="wall-item-tools"] > *, [class^="wall-item-tools"] > * > * {
1175         /*margin: 0 0 5px 0;*/
1176 }
1177 .wall-item-tools {
1178     float: right;
1179     filter: alpha(opacity=35);
1180     opacity: 0.4;
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-tools:hover {
1188     filter: alpha(opacity=100);
1189     opacity: 1;
1190     -webkit-transition: all 1s ease-in-out;
1191     -moz-transition: all 1s ease-in-out;
1192     -o-transition: all 1s ease-in-out;
1193     -ms-transition: all 1s ease-in-out;
1194     transition: all 1s ease-in-out;
1195 }
1196 .wall-item-subtools1 {
1197     height: 30px;
1198     list-style: none outside none;
1199     margin: 20px 0 30px -20px;
1200     padding: 0;
1201     width: 30px;
1202 }
1203 .wall-item-subtools2 {
1204     height: 25px;
1205     list-style: none outside none;
1206     margin: -75px 0 0 5px;
1207     padding: 0;
1208     width: 25px;
1209 }
1210 .wall-item-title {
1211         font-size: 1.2em;
1212         font-weight: bold;
1213     margin-bottom: 1em;
1214 }
1215 .wall-item-body {
1216         margin: 20px 20px 10px 0px;
1217     text-align: left;
1218         overflow-x: auto;
1219 }
1220 .wall-item-lock-wrapper {
1221         float: right;
1222     height: 22px;
1223     margin: 0 -5px 0 0;
1224     width: 22px;
1225         opacity: 1;
1226 }
1227 .wall-item-dislike,
1228 .wall-item-like {
1229         clear: left;
1230         font-size: 0.8em;
1231         color: #878883;
1232         margin: 5px 0 5px 120px;
1233 }
1234 .wall-item-author, .wall-item-actions-author {
1235         clear: left;
1236         font-size: 0.8em;
1237         color: #878883;
1238         margin: 20px 20px 0 110px;
1239 }
1240 .wall-item-ago {
1241         display: inline;
1242         padding-left: 10px;
1243 }
1244 .wall-item-wrapper-end {
1245         clear:both;
1246 }
1247 .wall-item-location {
1248     margin-top: 15px;
1249     width: 100px;
1250     overflow: hidden;
1251     text-overflow: ellipsis;
1252     -o-text-overflow: ellipsis;
1253 }
1254 .wall-item-location .icon {
1255     float: left;
1256 }
1257 .wall-item-location > a {
1258     margin-left: 25px;
1259     font-size: 0.7em;
1260     display: block;
1261 }
1262 .wall-item-location .smalltext {
1263     margin-left: 25px;
1264     font-size: 0.7em;
1265     display: block;
1266 }
1267 .wall-item-location > br {
1268     display: none;
1269 }
1270 .wallwall .wwto {
1271     left: 5px;
1272     margin: 0;
1273     position: absolute;
1274     top: 75px;
1275     width: 30px;
1276     z-index: 10001;
1277     width: 30px;
1278     height: 30px;
1279 }
1280 .wallwall .wwto img {
1281     width: 30px !important;
1282     height: 30px !important;
1283 }
1284 .wallwall .wall-item-photo-end {
1285     clear: both;
1286 }
1287 .wall-item-arrowphoto-wrapper {
1288     position: absolute;
1289     left: 35px;
1290     top: 80px;
1291     z-index: 10002;
1292 }
1293 .wall-item-photo-menu {
1294         min-width: 92px;
1295         border: 2px solid #FFFFFF;
1296         border-top: 0px;
1297         background: #555753;
1298         position: absolute;
1299         left: -2px; top: 101px;
1300         display: none;
1301         z-index: 10003;
1302         -webkit-border-radius: 0px 5px 5px 5px;
1303         -moz-border-radius: 0px 5px 5px 5px;
1304         border-radius: 0px 5px 5px 5px;
1305 }
1306 .wall-item-photo-menu ul {
1307     margin:0px;
1308     padding: 0px;
1309     list-style: none;
1310 }
1311 .wall-item-photo-menu li a {
1312     white-space: nowrap;
1313     display: block;
1314     padding: 5px 2px;
1315     color: #eeeeec;
1316 }
1317 .wall-item-photo-menu li a:hover {
1318     color: #555753;
1319     background: #eeeeec;
1320 }
1321 #item-delete-selected {
1322     overflow: auto;
1323     width: 100%;
1324 }
1325 #connect-services-header {
1326
1327 }
1328 #connect-services {
1329         margin: 5px 0 0 0;
1330 }
1331 #extra-help-header {
1332
1333 }
1334 #extra-help {
1335         margin: 5px 0 0 0;
1336 }
1337 #postit-header {
1338
1339 }
1340 #postit {
1341         margin: 5px 0 0 0;
1342 }
1343
1344
1345 /**
1346  *      comment
1347  */
1348 .ccollapse-wrapper {
1349     font-size: 0.9em;
1350     margin-left: 80px;
1351 }
1352
1353 .wall-item-outside-wrapper.comment {
1354     margin-left: 80px;
1355 }
1356 .wall-item-outside-wrapper.comment .wall-item-photo {
1357     width: 40px!important;
1358     height: 40px!important;
1359 }
1360 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {
1361     width: 40px;
1362     height: 40px;
1363 }
1364 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1365         width: 50px;
1366     top: 45px;
1367     background-position: 35px center;
1368 }
1369 .wall-item-outside-wrapper.comment .wall-item-info {
1370     width: 60px;
1371 }
1372 .wall-item-outside-wrapper.comment .wall-item-body {
1373     margin-left: 10px;
1374 }
1375 .wall-item-outside-wrapper.comment .wall-item-author {
1376     margin-left: 50px;
1377 }
1378
1379 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1380     min-width: 50px;
1381     top: 60px;
1382 }
1383 .comment-wwedit-wrapper {
1384     /*margin: 30px 0px 0px 80px;*/
1385 }
1386 .comment-edit-wrapper {
1387     border-top: 1px #aaa solid;
1388 }
1389 .comment-wwedit-wrapper img,
1390 .comment-edit-wrapper img {
1391         width: 20px;
1392         height: 20px;
1393 }
1394 .comment-edit-photo-link, .comment-edit-photo {
1395         float: left;
1396         margin-left: 10px;
1397 }
1398 .my-comment-photo {
1399     width: 40px;
1400     height: 40px;
1401     padding: 5px;
1402 }
1403 [class^="comment-edit-text"] {
1404     margin: 5px 0 10px 20px;
1405     width: 84.5%;
1406 }
1407 .comment-edit-text-empty {
1408         height: 20px;
1409         border: 2px #c8bebe solid;
1410         border-radius: 5px;
1411         color: #c8bebe;
1412         -webkit-transition: all 0.5s ease-in-out;
1413         -moz-transition: all 0.5s ease-in-out;
1414         -o-transition: all 0.5s ease-in-out;
1415         -ms-transition: all 0.5s ease-in-out;
1416         transition: all 0.5s ease-in-out;
1417 }
1418 .comment-edit-text-empty:hover {
1419         color: #999999;
1420 }
1421 .comment-edit-text-full {
1422         height: 10em;
1423     border-radius: 5px;
1424         -webkit-transition: all 0.5s ease-in-out;
1425         -moz-transition: all 0.5s ease-in-out;
1426         -o-transition: all 0.5s ease-in-out;
1427         -ms-transition: all 0.5s ease-in-out;
1428         transition: all 0.5s ease-in-out;
1429 }
1430 .comment-edit-submit-wrapper {
1431         width: 90%;
1432         margin: 5px 5px 10px 50px;
1433         text-align: right;
1434 }
1435 .comment-edit-submit {
1436     height: 22px;
1437     background-color: #555753;
1438     color: #eeeeec;
1439     -webkit-border-radius: 5px;
1440     -moz-border-radius: 5px;
1441     border-radius: 5px;
1442     border: 0;
1443 }
1444
1445
1446 /**
1447  * item text style
1448  **/
1449 .wall-item-body code {
1450         display: block;
1451         padding: 0 0 10px 5px;
1452         border-color: #ccc;
1453         border-style: solid;
1454         border-width: 1px 1px 1px 10px;
1455         background: #eee;
1456         color: #2e2f2e;
1457         width: 95%;
1458 }
1459
1460
1461 /**
1462  * profile
1463  **/
1464 div[id$="text"] {
1465     font-weight: bold;
1466     border-bottom: 1px solid #ccc;
1467 }
1468 div[id$="wrapper"] {
1469     height: 100%;
1470     margin-bottom: 1em;
1471 }
1472 div[id$="wrapper"] br {
1473     clear: left;
1474 }
1475 #advanced-profile-with {
1476     margin-left: 200px;
1477 }
1478
1479
1480 /**
1481  * photos
1482  **/
1483 .photos {
1484         height: auto;
1485         overflow: auto;
1486 }
1487 #photo-top-links {
1488     margin-bottom: 30px;
1489 }
1490 .photo-album-image-wrapper,
1491 .photo-top-image-wrapper {
1492     float: left;
1493     -moz-box-shadow: 3px 3px 10px 0 #000;
1494     -webkit-box-shadow: 3px 3px 10px 0 #000;
1495     box-shadow: 3px 3px 10px 0 #000;
1496     background-color: #222;
1497         color: #2e2f2e;
1498     -webkit-border-radius: 5px;
1499     -moz-border-radius: 5px;
1500     border-radius: 5px;
1501     padding-bottom: 30px;
1502     position: relative;
1503     margin: 0 10px 10px 0;
1504 }
1505
1506 #photo-photo {
1507     max-width: 100%;
1508 }
1509 #photo-photo img {
1510     max-width: 100%;
1511 }
1512 .photo-top-image-wrapper a:hover,
1513 #photo-photo a:hover,
1514 .photo-album-image-wrapper a:hover {
1515     border-bottom: 0;
1516 }
1517 .photo-top-photo,.photo-album-photo {
1518     -webkit-border-radius:5px 5px 0 0;
1519     -moz-border-radius:5px 5px 0 0;
1520     border-radius:5px 5px 0 0;
1521 }
1522 .photo-top-album-name {
1523     position: absolute;
1524     bottom: 0;
1525     padding: 0 5px;
1526 }
1527 .caption {
1528     position: absolute;
1529     bottom: 0;
1530     margin: 0 5px;
1531 }
1532 #photo-photo {
1533         position: relative;
1534         float:left;
1535 }
1536 #photo-photo-end {
1537     clear: both;
1538 }
1539 #photo-prev-link,
1540 #photo-next-link {
1541     position:absolute;
1542     width:30%;
1543     height:100%;
1544     background-color:rgba(255,255,255,0.5);
1545     opacity:0;
1546     -webkit-transition:all .2s ease-in-out;
1547     -moz-transition:all .2s ease-in-out;
1548     -o-transition:all .2s ease-in-out;
1549     -ms-transition:all .2s ease-in-out;
1550     transition:all .2s ease-in-out;
1551     background-position:center center;
1552     background-repeat:no-repeat;
1553 }
1554 #photo-prev-link {
1555     left:0;
1556     top:0;
1557     background-image:url(prev.png);
1558 }
1559 #photo-next-link {
1560     right:0;
1561     top:0;
1562     background-image:url(next.png);
1563 }
1564
1565 #photo-prev-link a,#photo-next-link a {
1566     display:block;
1567     width:100%;
1568     height:100%;
1569     overflow:hidden;
1570     text-indent:-900000px;
1571 }
1572 #photo-prev-link:hover,
1573 #photo-next-link:hover {
1574     opacity:1;
1575     -webkit-transition:all .2s ease-in-out;
1576     -moz-transition:all .2s ease-in-out;
1577     -o-transition:all .2s ease-in-out;
1578     -ms-transition:all .2s ease-in-out;
1579     transition:all .2s ease-in-out;
1580 }
1581 #photo-next-link .icon,
1582 #photo-prev-link .icon {
1583     display: none;
1584 }
1585 #photos-upload-spacer,
1586 #photos-upload-new-wrapper,
1587 #photos-upload-exist-wrapper {
1588     margin-bottom: 1em;
1589 }
1590 #photos-upload-existing-album-text,
1591 #photos-upload-newalbum-div {
1592     background-color:#555753;
1593     color:#eeeeec;
1594     padding:1px;
1595 }
1596 #photos-upload-album-select,
1597 #photos-upload-newalbum {
1598     width: 99%;
1599 }
1600 #photos-upload-perms-menu {
1601     text-align: right;
1602 }
1603 #photo-edit-caption, #photo-edit-newtag, #photo-edit-albumname {
1604     float: left;
1605     margin-bottom: 25px;
1606 }
1607 #photo-edit-link-wrap {
1608     margin-bottom: 15px;
1609 }
1610 #photo-edit-caption {
1611         width: 100%;
1612 }
1613 #photo-edit-newtag {
1614         width: 100%;
1615 }
1616 #photo-like-div {
1617     margin-bottom: 25px;
1618 }
1619 #photo-edit-caption-end, #photo-edit-tags-end, #photo-edit-albumname-end {
1620     clear: both;
1621 }
1622 #photo-edit-delete-button {
1623     margin-left: 200px;
1624 }
1625 #photo-edit-end {
1626     margin-bottom: 35px;
1627 }
1628 #photo-caption {
1629     font-size: 110%;
1630     font-weight: bold;
1631     margin-top: 15px;
1632     margin-bottom: 15px;
1633 }
1634
1635 /**
1636  *      message
1637  */
1638 .prvmail-text {
1639     width: 100%;
1640 }
1641 #prvmail-subject {
1642     width: 100%;
1643         color: #2e2f2e;
1644         background: #eec;
1645 }
1646 #prvmail-submit-wrapper {
1647     margin-top: 10px;
1648 }
1649 #prvmail-submit {
1650     float:right;
1651     margin-top: 0;
1652 }
1653 #prvmail-submit-wrapper > div {
1654     margin-right:5px;
1655     float:left;
1656 }
1657 .mail-list-outside-wrapper {
1658     margin-top: 20px;
1659 }
1660 .mail-list-sender {
1661     float: left;
1662 }
1663 .mail-list-detail {
1664     margin-left: 90px;
1665 }
1666 .mail-list-sender-name {
1667     display: inline;
1668         font-size: 1.1em;
1669 }
1670 .mail-list-date {
1671     display: inline;
1672     font-size: 0.9em;
1673     padding-left: 10px;
1674 }
1675 .mail-list-sender-name, .mail-list-date {
1676         font-style: italic;
1677 }
1678 .mail-list-subject {
1679     font-size: 1.2em;
1680 }
1681 .mail-list-delete-wrapper {
1682     float: right;
1683 }
1684 .mail-list-outside-wrapper-end {
1685     clear: both;
1686         border-bottom: 1px #eec dotted;
1687 }
1688 .mail-conv-sender {
1689     float: left;
1690     margin: 0px 5px 5px 0px;
1691 }
1692 .mail-conv-sender-photo {
1693     width: 32px;
1694     height: 32px;
1695 }
1696 .mail-conv-sender-name {
1697     float: left;
1698 }
1699 .mail-conv-date {
1700     float: right;
1701 }
1702 .mail-conv-subject {
1703     clear: right;
1704     font-weight: bold;
1705     font-size: 1.2em;
1706 }
1707 .mail-conv-body {
1708     clear: both;
1709 }
1710 .mail-conv-delete-wrapper {
1711     margin-top: 5px;
1712 }
1713
1714
1715 /**
1716  *      contacts
1717  */
1718 .view-contact-wrapper,
1719 .contact-entry-wrapper {
1720     float: left;
1721     margin: 0 5px 40px 0;
1722     width: 120px;
1723         height: 120px;
1724         padding: 3px;
1725     position: relative;
1726 }
1727 .contact-direction-wrapper {
1728     position: absolute;
1729     top: 20px;
1730 }
1731 .contact-edit-links {
1732     position: absolute;
1733     top: 60px;
1734 }
1735 .contact-entry-photo-wrapper {
1736
1737 }
1738 .contact-entry-photo {
1739         margin-left: 20px;
1740 }
1741 .contact-entry-name {
1742     width: 120px;
1743     font-weight: bold;
1744     /*overflow: hidden;*/
1745 }
1746 .contact-entry-photo {
1747         position: relative;
1748 }
1749 .contact-entry-edit-links .icon {
1750     border: 1px solid #babdb6;
1751     -webkit-border-radius: 3px;
1752     -moz-border-radius: 3px;
1753     border-radius: 3px;
1754     background-color: #fff;
1755 }
1756 #contact-entry-url, [id^="contact-entry-url"] {
1757     font-size: smaller;
1758     /*overflow: scroll;*/
1759 }
1760 #contact-entry-network, [id^="contact-entry-network"] {
1761     font-size: smaller;
1762     font-style: italic;
1763 }
1764 #contact-edit-banner-name {
1765     font-size: 1.5em;
1766 }
1767 #contact-edit-photo-wrapper {
1768     position: relative;
1769     float: left;
1770     padding: 20px;
1771 }
1772 #contact-edit-direction-icon {
1773     position:absolute;
1774     top:60px;
1775     left:0;
1776 }
1777 #contact-edit-nav-wrapper {
1778     margin-left: 0px;
1779 }
1780 #contact-edit-links {
1781     margin-top: 23px;
1782 }
1783 #contact-edit-links ul {
1784     list-style-type: none;
1785 }
1786 #contact-drop-links {
1787     margin-left:5px;
1788 }
1789 #contact-edit-nav-wrapper .icon {
1790         border: 1px solid #babdb6;
1791     -webkit-border-radius: 3px;
1792     -moz-border-radius: 3px;
1793     border-radius: 3px;
1794 }
1795 #contact-edit-poll-wrapper {
1796     margin-left: 0px;
1797 }
1798 #contact-edit-last-update-text {
1799     margin-bottom: 15px;
1800 }
1801 #contact-edit-last-updated {
1802     font-weight: bold;
1803 }
1804 #contact-edit-poll-text {
1805     display: inline;
1806 }
1807 #contact-edit-info_tbl, #contact-edit-info_parent {
1808     width: 100%;
1809 }
1810 .mceLayout {
1811     width: 100%;
1812 }
1813 #contact-edit-end {
1814     clear: both;
1815     margin-bottom: 65px;
1816 }
1817
1818 .contact-photo-menu-button {
1819     position: absolute;
1820     background-image: url("photo-menu.jpg");
1821     background-position: top left;
1822     background-repeat: no-repeat;
1823     margin: 0px; padding: 0px;
1824     width: 16px;
1825     height: 16px;
1826     top: 64px; left:0px;
1827     overflow: hidden;
1828     text-indent: 40px;
1829     display: none;
1830 }
1831 .contact-photo-menu {
1832     width: auto;
1833     border: 2px solid #444;
1834     background: #2e2f2e;
1835         color: #eec;
1836     position: absolute;
1837     left: 0px; top: 90px;
1838     display: none;
1839     z-index: 10000;
1840 }
1841 .contact-photo-menu ul {
1842     margin:0px;
1843     padding: 0px;
1844     list-style: none;
1845 }
1846 .contact-photo-menu li a {
1847     display: block;
1848     padding: 2px;
1849 }
1850 .contact-photo-menu li a:hover {
1851     color: #fff;
1852     background: #3465A4;
1853     text-decoration: none;
1854 }
1855
1856
1857 /**
1858  *      register, settings & profile forms
1859  */
1860 .openid {
1861
1862 }
1863 #id_openid_url {
1864     background:url(login-bg.gif) no-repeat;
1865     background-position:0 50%;
1866     padding-left:18px;
1867 }
1868
1869 #settings-nickname-desc {
1870     background-color: #eec;
1871     -webkit-border-radius: 5px;
1872     -moz-border-radius: 5px;
1873     border-radius: 5px;
1874     padding: 5px;
1875         color: #111;
1876 }
1877 #settings-default-perms {
1878     margin-bottom: 20px;
1879 }
1880 #register-form div,
1881 #profile-edit-form div {
1882     clear: both;
1883 }
1884
1885 /*#register-form label,     */
1886 /*#profile-edit-form label {*/
1887 /*    width: 300px;         */
1888 /*    float: left;          */
1889 /*}                         */
1890
1891 /*#register-form span,     */
1892 /*#profile-edit-form span {*/
1893 /*    color: #555753;      */
1894 /*    display: block;      */
1895 /*    margin-bottom: 20px; */
1896 /*}                        */
1897 #profile-edit-marital-label span {
1898         margin: -4px;
1899 }
1900 .settings-submit-wrapper,
1901 .profile-edit-submit-wrapper {
1902     margin: 30px 0px;
1903 }
1904 .profile-edit-side-div {
1905         display: none;
1906 }
1907 /*.profile-edit-side-div:hover {
1908         display: block;
1909 }
1910 .profile-edit-side-link {
1911         margin: 3px 0px 0px 70px;
1912 }*/
1913 #profiles-menu-trigger {
1914         margin: 0px 0px 0px 25px;
1915 }
1916 .profile-listing {
1917     float: left;
1918     margin: 20px 20px 0px 0px;
1919 }
1920 .icon-profile-edit {
1921     background: url("icons.png") -150px 0px no-repeat;
1922     border: 0;
1923         cursor: pointer;
1924     display: block;
1925     float: right;
1926         width: 20px;
1927     height: 20px;
1928     margin: 0 0 -18px;
1929         position: absolute;
1930     text-decoration: none;
1931         top: 18px;
1932         right: 226px;
1933 }
1934 #profile-edit-links ul {
1935     margin: 20px 0;
1936     padding: 0;
1937     list-style: none;
1938 }
1939 .marital {
1940         margin-top: 5px;
1941 }
1942 #register-sitename {
1943     display: inline;
1944     font-weight: bold;
1945 }
1946 #advanced-expire-popup {
1947         background: #2e2f2e;
1948         color: #eec;
1949 }
1950 #id_ssl_policy {
1951         width: 374px;
1952 }
1953
1954
1955 /**
1956  *      contacts selector
1957  */
1958 .group-delete-wrapper {
1959         margin: -31px 50px 0 0;
1960     float: right;
1961 }
1962 /*.group-delete-icon {
1963     margin: 0 0 0 10px;
1964 }*/
1965 #group-edit-submit-wrapper {
1966     margin: 0 0 10px 0;
1967     display: inline;
1968 }
1969 #group-edit-desc {
1970     margin: 10px 0px;
1971 }
1972 #group-members,
1973 #prof-members {
1974     height:200px;
1975     overflow:auto;
1976     border:1px solid #555753;
1977     -webkit-border-radius:5px 5px 0 0;
1978     -moz-border-radius:5px 5px 0 0;
1979     border-radius:5px 5px 0 0;
1980 }
1981 #group-all-contacts,
1982 #prof-all-contacts {
1983     height:200px;
1984     overflow:auto;
1985     border:1px solid #555753;
1986     -webkit-border-radius:0 0 5px 5px;
1987     -moz-border-radius:0 0 5px 5px;
1988     border-radius:0 0 5px 5px;
1989 }
1990 #group-members h3,
1991 #group-all-contacts h3,
1992 #prof-members h3,
1993 #prof-all-contacts h3 {
1994     color:#eeeeec;
1995     background-color:#555753;
1996     margin:0;
1997     padding:5px;
1998 }
1999 #group-separator,
2000 #prof-separator {
2001     display: none;
2002 }
2003
2004
2005 /**
2006  * profile
2007  */
2008 #cropimage-wrapper {
2009     float:left;
2010 }
2011 #crop-image-form {
2012     clear:both;
2013 }
2014
2015
2016 /**
2017  * intros
2018  */
2019 .intro-wrapper {
2020     margin-top: 20px;
2021 }
2022
2023 .intro-fullname {
2024     font-size: 1.1em;
2025     font-weight: bold;
2026
2027 }
2028 .intro-desc {
2029     margin-bottom: 20px;
2030     font-weight: bold;
2031 }
2032
2033 .intro-note {
2034     padding: 10px;
2035 }
2036
2037 .intro-end {
2038     padding: 30px;
2039 }
2040
2041 .intro-form {
2042     float: left;
2043 }
2044 .intro-approve-form {
2045     clear: both;
2046 }
2047 .intro-approve-as-friend-end {
2048     clear: both;
2049 }
2050 .intro-submit-approve, .intro-submit-ignore {
2051     margin-right: 20px;
2052 }
2053 .intro-submit-approve {
2054     margin-top: 15px;
2055 }
2056
2057 .intro-approve-as-friend-label, .intro-approve-as-fan-label {
2058     float: left;
2059 }
2060 .intro-approve-as-friend, .intro-approve-as-fan {
2061     float: left;
2062 }
2063 .intro-form-end {
2064     clear: both;
2065     margin-bottom: 10px;
2066 }
2067 .intro-approve-as-friend-desc {
2068     margin-top: 10px;
2069 }
2070 .intro-approve-as-end {
2071     clear: both;
2072     margin-bottom: 10px;
2073 }
2074
2075 .intro-end {
2076     clear: both;
2077 }
2078
2079
2080 /**
2081  * events
2082  **/
2083 .clear { clear: both; }
2084 .eventcal {
2085     float:left;
2086     font-size:20px;
2087 }
2088 .event {
2089         background: #2e2f2e;
2090 }
2091 .vevent {
2092     border:1px solid #ccc;
2093 }
2094 .vevent .event-description, .vevent .event-location {
2095         margin-left: 10px;
2096         margin-right: 10px;
2097 }
2098 .vevent .event-start {
2099         margin-left: 10px;
2100         margin-right: 10px;
2101 }
2102 #new-event-link {
2103         margin-bottom: 10px;
2104 }
2105 .edit-event-link, .plink-event-link {
2106         /*float: left;      */
2107         /*margin-top: 4px;  */
2108         /*margin-right: 4px;*/
2109         /*margin-bottom: 15px;*/
2110 }
2111 .event-description:before {
2112         content: url('../../../images/calendar.png');
2113         margin-right: 15px;
2114 }
2115 .event-start, .event-end {
2116         margin-left: 10px;
2117         width: 330px;
2118         font-size: smaller;
2119 }
2120 .event-start .dtstart, .event-end .dtend {
2121         float: right;
2122 }
2123 .event-list-date {
2124         margin-bottom: 10px;
2125 }
2126 .prevcal, .nextcal {
2127         float: left;
2128         margin-left: 32px;
2129         margin-right: 32px;
2130         margin-top: 64px;
2131 }
2132 .event-calendar-end {
2133         clear: both;
2134 }
2135 .calendar {
2136     font-family: monospace;
2137 }
2138 .today {
2139         font-weight: bold;
2140         color: #FF0000;
2141 }
2142 #event-start-text,
2143 #event-finish-text {
2144         margin-top: 10px;
2145         margin-bottom: 5px;
2146 }
2147 #event-nofinish-checkbox,
2148 #event-nofinish-text,
2149 #event-adjust-checkbox,
2150 #event-adjust-text,
2151 #event-share-checkbox {
2152     float:left;
2153 }
2154 #event-datetime-break {
2155         margin-bottom: 10px;
2156 }
2157 #event-nofinish-break,
2158 #event-adjust-break,
2159 #event-share-break {
2160         clear: both;
2161 }
2162 #event-desc-text,
2163 #event-location-text {
2164         margin-top: 10px;
2165         margin-bottom: 5px;
2166 }
2167 #event-submit {
2168         margin-top: 10px;
2169 }
2170 .body-tag {
2171         margin: 10px 0;
2172         opacity: 0.5;
2173         filter:alpha(opacity=50);
2174 }
2175 .body-tag:hover {
2176         opacity: 1.0 !important;
2177         filter:alpha(opacity=100) !important;
2178 }
2179 .filesavetags, .categorytags {
2180         margin: 20px 0;
2181         opacity: 0.5;
2182         filter:alpha(opacity=50);
2183 }
2184 .filesavetags:hover, .categorytags:hover {
2185         margin: 20px 0;
2186         opacity: 1.0 !important;
2187         filter:alpha(opacity=100) !important;
2188 }
2189 .item-select {
2190         opacity: 0.1;
2191         filter:alpha(opacity=10);
2192         float: right;
2193         margin-right: 5px;
2194 }
2195 .item-select:hover, .checkeditem {
2196         opacity: 1;
2197         filter:alpha(opacity=100);
2198 }
2199 #item-delete-selected {
2200         margin-top: 30px;
2201 }
2202 /* was tired of having no way of moving it around, so
2203  * here's a little 'hook' to do so */
2204 .delete-checked {
2205         position: absolute;
2206         left: 35px;
2207         margin-top: 20px;
2208 }
2209 #item-delete-selected-end {
2210         clear: both;
2211 }
2212 #item-delete-selected-icon, #item-delete-selected-desc {
2213         float: left;
2214         margin-right: 5px;
2215 }
2216 #item-delete-selected-desc:hover {
2217         text-decoration: underline;
2218 }
2219 .fc-state-highlight {
2220     background: #eec;
2221     color: #2e2f2e;
2222 }
2223
2224
2225 /**
2226  *      directory
2227  */
2228 .directory-item {
2229     float: left;
2230         /*margin: 50px 50px 0px 0px;*/
2231         margin: 0 5px 4px 0;
2232         padding: 3px;
2233         width: 180px;
2234         height: 250px;
2235     position: relative;
2236 }
2237
2238
2239 /**
2240  * sidebar
2241  */
2242 #group-sidebar {
2243     margin-bottom: 10px;
2244 }
2245 .group-selected, .nets-selected, .fileas-selected {
2246     padding: 3px;
2247         color: #2e2f2e;
2248     background: #88a9d2;
2249     font-weight: bold;
2250 }
2251 .group-selected:hover, .nets-selected:hover, .fileas-selected:hover {
2252         color: #2e2f2e;
2253 }
2254 .groupsideedit {
2255     margin-right: 10px;
2256 }
2257 #sidebar-group-ul {
2258     padding-left: 0;
2259 }
2260 #sidebar-group-list {
2261     margin: 0 0 5px 0;
2262 }
2263 #sidebar-group-list ul {
2264     list-style-type: none;
2265     list-style-position: inside;
2266 }
2267 #sidebar-group-list li {
2268     margin-top: 10px;
2269 }
2270 #sidebar-group-list .icon {
2271     display: inline-block;
2272     height: 12px;
2273     width: 12px;
2274 }
2275 #sidebar-new-group {
2276     margin: auto;
2277     display: inline-block;
2278     color: #efefef;
2279     text-decoration: none;
2280     text-align: center;
2281 }
2282 #peoplefind-sidebar form {
2283         margin-bottom: 10px;
2284 }
2285 #sidebar-new-group:hover {
2286     /*background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );*/
2287     /*background: -moz-linear-gradient( center top, #b20202 5%, #d60808 100% );*/
2288     /*background-color: #b20202;*/
2289 }
2290
2291 #sidebar-new-group:active {
2292     position: relative;
2293     top: 1px;
2294 }
2295 #side-peoplefind-url {
2296     background-color: #2e2f2e;
2297     color: #eec;
2298         border: 1px 999 solid;
2299         margin-right: 3px;
2300         width: 75%;
2301 }
2302 #side-peoplefind-url:hover, #side-peoplefind-url:focus {
2303     background-color: #efefef;
2304     color: #222;
2305         border: 1px 333 solid;
2306 }
2307 .nets-ul {
2308     list-style-type: none;
2309     padding-left: 0px;
2310 }
2311 .nets-ul li {
2312     margin: 10px 0 0;
2313 }
2314
2315 .nets-link {
2316     margin-left: 0px;
2317 }
2318 .nets-all {
2319     margin-left: 0px;
2320 }
2321 #netsearch-box {
2322     margin-top: 20px;
2323     width: 150px;
2324 }
2325 #netsearch-box #search-submit {
2326     margin: 5px 0px 0px 0px;
2327 }
2328
2329
2330 /**
2331  * ADMIN
2332  */
2333 #pending-update {
2334     float:right;
2335     color: #fff;
2336     font-weight: bold;
2337     background-color: #ff0000;
2338     padding: 0 .3em;
2339 }
2340 .admin.linklist {
2341     border: 0; padding: 0;
2342 }
2343 .admin.link {
2344     list-style-position: inside;
2345 }
2346 #adminpage dl {
2347     clear:left;
2348     margin-bottom: 2px;
2349     padding-bottom: 2px;
2350     border-bottom: 1px solid #000;
2351 }
2352 #adminpage dt {
2353     width: 250px;
2354     float: left;
2355     font-weight: bold;
2356 }
2357 #adminpage dd {
2358         margin-left: 250px;
2359 }
2360 #adminpage h3 {
2361     border-bottom:1px solid #ccc;
2362 }
2363
2364 #adminpage .submit {
2365         clear:left;
2366 }
2367
2368 #adminpage #pluginslist {
2369     margin: 0;
2370     padding: 0;
2371 }
2372 #adminpage .plugin {
2373     list-style: none;
2374     display: block;
2375     border: 1px solid #888;
2376     padding: 1em;
2377     margin-bottom: 5px;
2378     clear: left;
2379 }
2380 #adminpage .toggleplugin {
2381         float:left;
2382         margin-right: 1em;
2383 }
2384
2385 #adminpage table {
2386     width: 100%;
2387     border-bottom: 1px solid #000;
2388     margin: 5px 0;
2389 }
2390 #adminpage table th {
2391     text-align: left;
2392 }
2393 #adminpage td .icon {
2394     float: left;
2395 }
2396 #adminpage table#users img {
2397     width: 16px; height: 16px;
2398 }
2399 #adminpage table tr:hover {
2400         color: #2e2f2e;
2401     background-color: #eec;
2402 }
2403 #adminpage .selectall {
2404     text-align: right;
2405 }
2406 #adminpage #users a {
2407         color: #2e2f2e;
2408         text-decoration: underline;
2409 }
2410
2411 /**
2412  * Form fields
2413  */
2414 .field {
2415         /*margin-bottom: 10px;*/
2416         /*padding-bottom: 10px;*/
2417         overflow: auto;
2418     width: 100%;
2419 }
2420 .field label, label {
2421     float: left;
2422     width: 275px;
2423         display: block;
2424         font-size: 1.077em;
2425         margin: 0 10px 0.5em 0;
2426         border: 1px #2e2f2e solid;
2427         padding: 5px;
2428         background: #eec;
2429         vertical-align: middle;
2430         color: #111;
2431 }
2432 .field input, input[type="text"] {
2433         width: 250px;
2434         height: 25px;
2435         border: 1px #999 solid;
2436 }
2437 .field textarea {
2438     width: 80%;
2439     height: 100px;
2440 }
2441 .field_help {
2442     display: block;
2443     margin-left: 297px;
2444     color: #aaa;
2445 }
2446 .field .onoff {
2447     float: left;
2448     width: 80px;
2449 }
2450 .field .onoff a {
2451     display: block;
2452     border: 1px solid #666;
2453     padding: 3px 6px 4px 10px;
2454     height: 16px;
2455     text-decoration: none;
2456 }
2457 .field .onoff .on {
2458         background: url("../../../images/onoff.jpg") no-repeat 42px 1px #999;
2459     color: #111;
2460     text-align: left;
2461 }
2462 .field .onoff .off {
2463         background: url("../../../images/onoff.jpg") no-repeat 2px 1px #ccc;
2464     color: #333;
2465     text-align: right;
2466 }
2467 .hidden {
2468     display:none !important;
2469 }
2470 .field.radio .field_help {
2471     margin-left: 297px;
2472 }
2473
2474
2475 /*
2476  * UPDATE
2477  */
2478 .popup {
2479         width: 100%;
2480     height: 100%;
2481         top: 0px;
2482     left: 0px;
2483         position: absolute;
2484         display: none;
2485 }
2486 .popup .background {
2487         background-color: rgba(0,0,0,128);
2488         opacity: 0.5;
2489         width: 100%;
2490     height: 100%;
2491         position: absolute;
2492         top:0px;
2493     left:0px;
2494 }
2495 .popup .panel {
2496         top: 25%;
2497     left: 25%;
2498     width: 50%;
2499     height: 50%;
2500         padding: 1em;
2501         position: absolute;
2502         border: 4px solid #000000;
2503         background-color: #FFFFFF;
2504 }
2505 #panel {
2506     z-index: 100;
2507 }
2508 .grey {
2509     color: grey;
2510 }
2511 .orange {
2512     color: orange;
2513 }
2514 .red {
2515     color: red;
2516 }
2517 .popup .panel .panel_text {
2518     display: block;
2519     overflow: auto;
2520     height: 80%;
2521 }
2522 .popup .panel .panel_in {
2523     width: 100%;
2524     height: 100%;
2525     position: relative;
2526 }
2527 .popup .panel .panel_actions {
2528     width: 100%;
2529     bottom: 4px;
2530     left: 0px;
2531     position: absolute;
2532 }
2533 .panel_text .progress {
2534     width: 50%;
2535     overflow: hidden;
2536     height: auto;
2537     border: 1px solid #cccccc;
2538     margin-bottom: 5px;
2539 }
2540 .panel_text .progress span {
2541     float: right;
2542     display: block;
2543     width: 25%;
2544     background-color: #eeeeee;
2545     text-align: right;
2546 }
2547
2548 /**
2549  * OAuth
2550  */
2551 .oauthapp {
2552         height: auto;
2553     overflow: auto;
2554         border-bottom: 2px solid #cccccc;
2555         padding-bottom: 1em;
2556         margin-bottom: 1em;
2557 }
2558 .oauthapp img {
2559         float: left;
2560         width: 48px; height: 48px;
2561         margin: 10px;
2562 }
2563 .oauthapp img.noicon {
2564         background-image: url("../../../images/icons/48/plugin.png");
2565         background-position: center center;
2566         background-repeat: no-repeat;
2567 }
2568 .oauthapp a {
2569         float: left;
2570 }
2571
2572
2573 /**
2574  * ICONS
2575  */
2576 .iconspacer {
2577         display: block;
2578     width: 16px;
2579     height: 16px;
2580 }
2581 .icon {
2582     display: block;
2583     width: 20px;
2584     height: 20px;
2585     background: url(icons.png) no-repeat;
2586     border: 0;
2587     text-decoration: none;
2588         border-radius: 5px;
2589 }
2590 .icon:hover {
2591     border: 0;
2592     text-decoration: none;
2593 }
2594 .icon.drop,
2595 .icon.drophide, .icon.delete {
2596     float: left;
2597 }
2598 .icon.s22.delete {
2599         display: block;
2600         background-position: -110px 0;
2601 }
2602 .icon.s22.text {
2603         padding: 10px 0px 0px 25px;
2604         width: 200px;
2605 }
2606 .icon.text {
2607     text-indent: 0px;
2608 }
2609 .icon.s16 {
2610     min-width: 16px;
2611     height: 16px;
2612 }
2613 .s16 .add {
2614     background: url("../../../images/icons/16/add.png") no-repeat;
2615 }
2616 .add {
2617     margin: 0px 5px;
2618 }
2619 .article {
2620         background-position: -50px 0;
2621 }
2622 .audio {
2623         background-position: -70px 0;
2624 }
2625 .block {
2626         background-position: -90px 0px;
2627 }
2628 .drop, .delete {
2629         background-position: -110px 0;
2630 }
2631 .drophide {
2632         background-position: -130px 0;
2633 }
2634 .edit {
2635         background-position: -150px 0;
2636 }
2637 .camera {
2638         background-position: -170px 0;
2639 }
2640 .dislike {
2641         background-position: -190px 0;
2642 }
2643 .file-as {
2644         background-position: -230px -60px;
2645 }
2646 .like {
2647         background-position: -211px 0;
2648 }
2649 .link {
2650         background-position: -230px 0;
2651 }
2652 .globe, .location {
2653         background-position: -50px -20px;
2654 }
2655 .noglobe, .nolocation {
2656         background-position: -70px -20px;
2657 }
2658 .no {
2659         background-position: -90px -20px;
2660 }
2661 .pause {
2662         background-position: -110px -20px;
2663 }
2664 .play {
2665         background-position: -130px -20px;
2666 }
2667 .pencil {
2668         background-position: -151px -18px;
2669 }
2670 .small-pencil {
2671         background-position: -170px -20px;
2672 }
2673 .recycle {
2674         background-position: -190px -20px;
2675 }
2676 .remote-link {
2677         background-position: -210px -20px;
2678 }
2679 .share {
2680         background-position: -230px -20px;
2681 }
2682 .tools {
2683         background-position: -50px -40px;
2684 }
2685 .lock {
2686         background-position: -70px -40px;
2687 }
2688 .unlock {
2689         background-position: -88px -40px;
2690 }
2691 .video {
2692         background-position: -110px -40px;
2693 }
2694 .attach {
2695         background-position: -190px -40px;
2696 }
2697 .language {
2698         background-position: -210px -40px;
2699 }
2700 .starred {
2701         background-position: -130px -60px;
2702 }
2703 .unstarred {
2704         background-position: -150px -60px;
2705 }
2706 .tagged {
2707         background-position: -170px -60px;
2708 }
2709 .on {
2710         background-position: -50px  -60px;
2711 }
2712 .off {
2713         background-position: -70px  -60px;
2714 }
2715 .prev {
2716         background-position: -90px  -60px;
2717 }
2718 .next {
2719         background-position: -110px  -60px;
2720 }
2721 .icon.dim {
2722         opacity: 0.3;
2723         filter: alpha(opacity=30);
2724 }
2725 #pause {
2726         position: fixed;
2727         bottom: 5px;
2728         right: 5px;
2729 }
2730 .border, .border:hover {
2731         border: 1px solid #babdb6;
2732     -webkit-border-radius: 5px;
2733     -moz-border-radius: 5px;
2734     border-radius: 5px;
2735 }
2736 .attachtype {
2737     display: block;
2738     width: 20px;
2739     height: 23px;
2740     background-image: url(../../../images/content-types.png);
2741 }
2742 .type-video {
2743     background-position: 0px 0px;
2744 }
2745 .type-image {
2746     background-position: -20px 0;
2747 }
2748 .type-audio {
2749     background-position: -40px 0;
2750 }
2751 .type-text {
2752     background-position: -60px 0px;
2753 }
2754 .type-unkn {
2755     background-position: -80px 0;
2756 }
2757
2758
2759 /**
2760  *      footer
2761  */
2762 .cc-license {
2763     margin-top: 100px;
2764     font-size: 0.7em;
2765 }
2766 footer {
2767     display: block;
2768     margin: 50px 20%;
2769     clear: both;
2770 }
2771 #profile-jot-text {
2772     height: 20px;
2773     color: #eec;
2774     border: 1px solid #eec;
2775     border-radius: 5px;
2776     width: 99.5%;
2777 }
2778
2779
2780 /** acl **/
2781 #photo-edit-perms-select,
2782 #photos-upload-permissions-wrapper,
2783 #profile-jot-acl-wrapper {
2784     display: block !important;
2785         background: #2e2f2e;
2786         color: #eec;
2787 }
2788 #acl-wrapper {
2789     width: 660px;
2790         margin: 0 auto;
2791 }
2792 #acl-search {
2793     float: right;
2794     background: #fff url("../../../images/search_18.png") no-repeat right center;
2795     padding-right: 20px;
2796         margin: 6px;
2797 }
2798 #acl-showall {
2799     float: left;
2800     display: block;
2801     width: auto;
2802     height: 18px;
2803     background: #eec url("../../../images/show_all_off.png") 8px 8px no-repeat;
2804     padding: 7px 10px 7px 30px;
2805     -webkit-border-radius: 5px;
2806     -moz-border-radius: 5px;
2807     border-radius: 5px;
2808     color: #999;
2809         margin: 5px 0;
2810 }
2811 #acl-showall.selected {
2812     color: #000;
2813     background: #f90 url(../../../images/show_all_on.png) 8px 8px no-repeat;
2814 }
2815 #acl-list {
2816     height: 210px;
2817     border: 1px solid #ccc;
2818     clear: both;
2819     margin-top: 30px;
2820     overflow: auto;
2821 }
2822 /*#acl-list-content {
2823 }*/
2824 .acl-list-item {
2825         border: 1px solid #eec;
2826     display: block;
2827     float: left;
2828     height: 110px;
2829     margin: 3px 0 5px 5px;
2830     width: 120px;
2831 }
2832 .acl-list-item img {
2833     width: 22px;
2834     height: 22px;
2835     float: left;
2836     margin: 5px 5px 20px;
2837 }
2838 .acl-list-item p {
2839     height: 12px;
2840     font-size: 10px;
2841     margin: 0 0 22px;
2842     padding: 2px 0 1px;
2843 }
2844 .acl-list-item a {
2845     background: #eec 3px 3px no-repeat;
2846     -webkit-border-radius: 2px;
2847     -moz-border-radius: 2px;
2848     border-radius: 2px;
2849         clear: both;
2850     font-size: 10px;
2851     display: block;
2852     width: 55px;
2853     height: 20px;
2854     color: #2e2f2e;
2855     margin: 5px auto 0;
2856         padding: 0 3px;
2857         text-align: center;
2858         vertical-align: middle;
2859 }
2860 #acl-wrapper a:hover {
2861     text-decoration: none;
2862     color: #2e2f2e;
2863         border: 0;
2864 }
2865 .acl-button-show {
2866     background-image: url('../../../images/show_off.png');
2867         margin: 0 auto;
2868 }
2869 .acl-button-hide {
2870     background-image: url('../../../images/hide_off.png');
2871         margin: 0 auto;
2872 }
2873 .acl-button-show.selected {
2874     color: #2e2f2e;
2875     background-color: #9ade00;
2876     background-image: url(../../../images/show_on.png);
2877 }
2878 .acl-button-hide.selected {
2879     color: #2e2f2e;
2880     background-color: #ff4141;
2881     background-image: url(../../../images/hide_on.png);
2882 }
2883 .acl-list-item.groupshow {
2884     border-color: #9ade00;
2885 }
2886 .acl-list-item.grouphide {
2887     border-color: #ff4141;
2888 }
2889 /** /acl **/
2890
2891
2892 /* autocomplete popup */
2893 .acpopup {
2894         max-height: 175px;
2895     max-width: 42%;
2896         background-color: #555753;
2897         color: #fff;
2898         overflow: auto;
2899         z-index: 100000;
2900         border: 1px solid #cccccc;
2901 }
2902 .acpopupitem {
2903         background-color: #555753;
2904     padding: 4px;
2905         clear: left;
2906 }
2907 .acpopupitem img {
2908         float: left;
2909         margin-right: 4px;
2910 }
2911 .acpopupitem.selected {
2912         color: #2e302e;
2913     background-color: #eeeeec;
2914 }
2915 .qcomment-wrapper {
2916     padding: 0px;
2917     margin: 5px 5px 5px 81%;
2918 }
2919 .qcomment {
2920         opacity: 0.5;
2921         filter:alpha(opacity=50);
2922 }
2923 .qcomment:hover {
2924         opacity: 1.0;
2925         filter:alpha(opacity=100);
2926 }
2927 #network-star-link {
2928     margin-top: 10px;
2929 }
2930 .network-star {
2931     float: left;
2932     margin-right: 5px;
2933 }
2934 .network-star.icon.starred {
2935     display: inline-block;
2936 }
2937 #fileas-sidebar {
2938
2939 }
2940 .fileas-ul {
2941         padding: 0;
2942 }
2943
2944
2945
2946 /*
2947  * ADDONS THEMING
2948  */
2949
2950 #sidebar-page-list {
2951
2952 }
2953 #sidebar-page-list ul {
2954         padding: 0;
2955         margin: 5px 0;
2956 }
2957 #sidebar-page-list li {
2958         list-style: none;
2959 }
2960
2961
2962 @media handheld {
2963         body {
2964                 font-size: 15pt;
2965         }
2966 }