view/theme/dispy/style.css

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