view/theme/smoothly/style.css

   1 /*
   2         style.css
   3         Smoothly
   4
   5         Created by alex@friendica.pixelbits.de on 2013-03-11
   6
   7 ** Colors **
   8 Blue links - #1873a2
   9 Blue link hover - #6da6c4
  10 Blue Gradients (buttons and other gradients) - #1873a2 and #6da6c4
  11 Grey/body text - #626262
  12 Grey Gradients (buttons and other gradients) - #bdbdbd and #a2a2a2
  13 Dark Grey Gradients - #7c7d7b and #555753
  14 Orange - #fec01d
  15 */
  16
  17 @import url('css/typography.css');
  18
  19 .lockview {
  20         cursor: pointer;
  21 }
  22
  23 .heart {
  24         color: #FF0000;
  25         font-size: 100%;
  26 }
  27
  28 input[type=text] {
  29         float: left;
  30         border: 1px solid #b0b0b0;
  31         padding: 2px;
  32         width: 550px;
  33         border-radius: 3px;
  34                 -moz-border-radius: 3px;
  35                 -webkit-border-radius: 3px;
  36 }
  37
  38 input[type=text-sidebar] {
  39         border: 1px solid #b0b0b0;
  40         padding: 2px;
  41         width: 172px;
  42         margin-left: 10px;
  43         margin-top: 10px;
  44         border-radius: 3px;
  45                 -moz-border-radius: 3px;
  46                 -webkit-border-radius: 3px;
  47 }
  48
  49 input[type=submit] {
  50         margin:10px 10px 0 0;
  51         font-size: 0.9em;
  52         padding: 5px;
  53         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
  54         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
  55         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
  56         background-color: #bdbdbd;
  57         color: #efefef;
  58         text-align: center;
  59         border: 1px solid #7C7D7B;
  60         border-radius: 5px;
  61                 -moz-border-radius: 5px;
  62                 -webkit-border-radius: 5px;
  63 }
  64
  65 input[type=submit]:hover {
  66         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
  67         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
  68         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
  69         background-color: #1873a2;
  70         color: #efefef;
  71         border: 1px solid #7C7D7B;
  72         box-shadow: 0 0 8px #BDBDBD;
  73                 -moz-box-shadow: 3px 3px 4px #959494;
  74                 -webkit-box-shadow: 3px 3px 4px #959494;
  75         border-radius: 5px;
  76                 -moz-border-radius: 5px;
  77                 -webkit-border-radius: 5px;
  78 }
  79
  80 input[type=submit]:active {
  81         position: relative;
  82         top: 1px;
  83 }
  84
  85 #search-text,
  86 #search-submit,
  87 #search-save {
  88         margin: 10px 10px 0 0;
  89 }
  90
  91 #directory-search,
  92 #directory-search-submit,
  93 #search-save {
  94 }
  95
  96 .dirsearch-desc {
  97 }
  98
  99 .smalltext {
 100         font-size: 0.7em
 101 }
 102
 103 ::selection {
 104         background: #fec01d;
 105         color: #000; /* Safari and Opera */
 106 }
 107
 108 ::-moz-selection {
 109         background: #fec01d;
 110         color: #000; /* Firefox */
 111 }
 112
 113 section {
 114         float: left;
 115         margin-top: 50px;
 116         width: 730px;
 117         font-size: 0.9em;
 118         line-height: 1.2em;
 119 }
 120
 121 .lframe {
 122         border: 1px solid #dddddd;
 123         box-shadow: 3px 3px 6px #959494;
 124                 -moz-box-shadow: 3px 3px 6px #959494;
 125                 -webkit-box-shadow: 3px 3px 6px #959494;
 126         background-color: #efefef;
 127         padding: 10px;
 128 }
 129
 130 .mframe {
 131         padding: 3px;
 132         background: none repeat scroll 0 0 #FFFFFF;
 133         border: 1px solid #C5C5C5;
 134         border-radius: 3px;
 135                 -moz-border-radius: 3px;
 136                 -webkit-border-radius: 3px;
 137         box-shadow: 0 0 8px #BDBDBD;
 138                 -moz-box-shadow: 3px 3px 4px #959494;
 139                 -webkit-box-shadow: 3px 3px 4px #959494;
 140 }
 141
 142 #wall-item-lock {
 143         margin-left: 10px;
 144 }
 145
 146 .button {
 147         border: 1px solid #7C7D7B;
 148         border-radius: 5px;
 149                 -moz-border-radius: 5px;
 150                 -webkit-border-radius: 5px;
 151         font-size: 1em;
 152         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 153         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 154         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 155         background-color: #bdbdbd;
 156         color: #efefef;
 157         text-align: center;
 158 }
 159
 160 .button:hover {
 161         border: 1px solid #7C7D7B;
 162         box-shadow: 0 0 8px #BDBDBD;
 163                 -moz-box-shadow: 3px 3px 4px #959494;
 164                 -webkit-box-shadow: 3px 3px 4px #959494;
 165         border-radius: 5px;
 166                 -moz-border-radius: 5px;
 167                 -webkit-border-radius: 5px;
 168         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
 169         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
 170         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
 171         background-color: #1873a2;
 172         color: #efefef;
 173 }
 174
 175 .button:active {
 176         position: relative;
 177         top: 1px;
 178 }
 179
 180 .button a {
 181         color: #efefef;
 182 }
 183
 184 /* ========= */
 185 /* = Login = */
 186 /* ========= */
 187
 188 #login-name-wrapper,
 189 #login-password-wrapper {
 190         vertical-align: middle;
 191         margin: auto;
 192 }
 193
 194 #login-name-wrapper input {
 195         width: 120px;
 196         margin-left: 20px;
 197 }
 198
 199 #login-extra-links {
 200         width: auto;
 201         margin-top: 20px;
 202         clear: both;
 203 }
 204
 205 .login-extra-links {
 206         width: 100%;
 207         margin-left: 0px;
 208         clear: both;
 209 }
 210
 211 #login-extra-links a {
 212         display: block;
 213         margin: 0px;
 214         padding: 5px 0px 5px 0px;
 215         text-align: left;
 216 }
 217
 218 #login-extra-filler {
 219         display: none;
 220 }
 221
 222 #login_standard {
 223         width: 260px;
 224         float: left;
 225         border: 1px solid #7C7D7B;
 226         border-radius: 5px;
 227                 -moz-border-radius: 5px;
 228                 -webkit-border-radius: 5px;
 229         padding: 10px;
 230         margin: 10px 0 0 0;
 231 }
 232
 233 #login_openid {
 234         width: 300px;
 235         margin-left: 150px;
 236 }
 237
 238 #login_standard input,
 239 #login_openid input {
 240         width: 240px;
 241 }
 242
 243 #register-link,
 244 #lost-password-link {
 245         font-size: 80%;
 246         width: 210px;
 247         margin-left: 5px;
 248 }
 249
 250 #login-name-end,
 251 #login-password-end,
 252 #login-extra-end,
 253 #login-submit-end {
 254         height: 50px;
 255 }
 256
 257 #login-submit-button,
 258 #login-submit-wrapper {
 259 }
 260
 261 #login-submit-button {
 262         width: 280px;
 263 }
 264
 265 .login-form,
 266         margin-top: 10px;
 267 }
 268
 269 /* ========= */
 270 /* = Panel = */
 271 /* ========= */
 272
 273 #panel {
 274         position: absolute;
 275         font-size: 0.8em;
 276         border-radius: 5px;
 277                 -webkit-border-radius: 5px;
 278                 -moz-border-radius: 5px;
 279         border: 1px solid #494948;
 280         background-color: #2e3436;
 281         opacity: 50%;
 282         color: #eeeeec;
 283         padding:1em;
 284         z-index: 200;
 285         box-shadow: 7px 7px 10px #434343;
 286                 -moz-box-shadow: 7px 7px 12px #434343;
 287                 -webkit-box-shadow: 7px75px 12px #434343;
 288 }
 289
 290 /* ========= */
 291 /* = Pager = */
 292 /* ========= */
 293
 294 .pager {
 295         padding-top: 10px;
 296         padding-bottom: 10px;
 297         display: block;
 298         clear: both;
 299         text-align: center;
 300 }
 301
 302 .pager a {
 303         color: #626262;
 304 }
 305
 306 .pager span {
 307         padding: 4px;
 308         margin: 4px;
 309 }
 310
 311 .pager_current {
 312         background-color: #1873a2;
 313         color: #ffffff;
 314 }
 315
 316 /* ======= */
 317 /* = Nav = */
 318 /* ======= */
 319
 320 nav {
 321         display: block;
 322         float: left;
 323         list-style: none outside none;
 324         margin: 0;
 325         padding: 0;
 326         width: 960px;
 327         z-index: 10000;
 328         height: 40px;
 329         position: fixed;
 330         color: #efefef;
 331         margin-bottom: 16px;
 332         font-size: 15px;
 333         background-color: #BDBDBD;
 334         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
 335         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 336         border: 1px solid #7C7D7B;
 337         box-shadow: 0 0 8px #BDBDBD;
 338                 -moz-box-shadow: 3px 3px 4px #959494;
 339                 -webkit-box-shadow: 3px 3px 4px #959494;
 340         border-radius: 5px;
 341                 -moz-border-radius: 5px;
 342                 -webkit-border-radius: 5px;
 343 }
 344
 345 nav a {
 346         text-decoration: none;
 347         color: #eeeeec;
 348         border: 0px;
 349 }
 350
 351 nav a:hover {
 352         text-decoration: none;
 353         color: #eeeeec;
 354         border: 0px;
 355 }
 356
 357 nav #site-location {
 358         color: #888a85;
 359         font-size: 0.8em;
 360         position: absolute;
 361 }
 362
 363 nav #banner {
 364         display: block;
 365         position: absolute;
 366         margin-left: 3px;
 367         /*margin-top: 2px;*/
 368         padding-bottom: 5px;
 369 }
 370
 371 nav #banner #logo-text a {
 372         display: hidden;
 373         font-size: 40px;
 374         font-weight: bold;
 375         margin-left: 3px;
 376         text-shadow: #7C7D7B 3px 3px 5px;
 377 }
 378
 379 nav #user-menu {
 380         display: block;
 381         width: auto;
 382         min-width: 190px;
 383         float: right;
 384         margin-right: 5px;
 385         margin-top: 4px;
 386         padding: 5px;
 387         position: relative;
 388         vertical-align: middle;
 389         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
 390         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
 391         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
 392         background-color: #a2a2a2;
 393         border-radius: 5px;
 394                 -moz-border-radius: 5px;
 395                 -webkit-border-radius: 5px;
 396         border: 1px solid #7C7D8B;
 397         color: #efefef;
 398         text-decoration: none;
 399         text-align: center;
 400 }
 401
 402 nav #user-menu:hover {
 403         border: 1px solid #7C7D7B;
 404         box-shadow: 0 0 8px #BDBDBD;
 405                 -moz-box-shadow: 3px 3px 4px #959494;
 406                 -webkit-box-shadow: 3px 3px 4px #959494;
 407         border-radius: 5px;
 408                 -moz-border-radius: 5px;
 409                 -webkit-border-radius: 5px;
 410         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
 411         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
 412         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
 413         background-color: #1873a2;
 414         color: #efefef;
 415 }
 416
 417 nav #user-menu-label::after {
 418         content: url("images/menu-user-pin.png") no-repeat;
 419         padding-left: 15px;
 420 }
 421
 422 nav #user-menu-label {
 423         vertical-align: middle;
 424         font-size: 12px;
 425         padding: 5px;
 426         text-align: center;
 427 }
 428
 429 .nav-ajax-left {
 430         font-size: 0.8em;
 431         float: left;
 432         margin-top: 62px;
 433 }
 434
 435 nav #nav-link-wrapper .nav-link {
 436         border-right: 1px solid #babdb6;
 437 }
 438
 439 .error-message {
 440         color: #FF0000;
 441         font-size: 1.1em;
 442         border: 1px solid #FF8888;
 443         background-color: #FFEEEE;
 444         padding: 10px;
 445 }
 446
 447 .info-message {
 448         color: #204a87;
 449         font-size: 1.1em;
 450         border: 1px solid #3465a4;
 451         background-color: #d7e3f1;
 452         padding: 10px;
 453 }
 454
 455 ul#user-menu-popup {
 456         display: none;
 457         position: absolute;
 458         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
 459         background: -moz-linear-gradient( center top, #a2a2a2 5%, #898988 100% );
 460         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
 461         background-color: #898988;
 462         width: 100%;
 463         padding: 0;
 464         margin: 0px;
 465         margin-top: 10px;
 466         top: 20px;
 467         left: 0px;
 468         border: 1px solid #9a9a9a;
 469         border-top: none;
 470         border-radius: 0px 0px 5px 5px;
 471                 -webkit-border-radius: 0px 0px 5px 5px;
 472                 -moz-border-radius: 0px 0px 5px 5px;
 473         box-shadow: 5px 5px 10px #242424;
 474                 -moz-box-shadow: 5px 5px 10px #242424;
 475                 -webkit-box-shadow: 5px 5px 10px #242424;
 476         z-index: 10000;
 477 }
 478
 479 ul#user-menu-popup li {
 480         display: block;
 481 }
 482
 483 ul#user-menu-popup li a {
 484         display: block;
 485         padding: 5px;
 486 }
 487
 488 ul#user-menu-popup li a:hover {
 489         color: #efefef;
 490         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
 491         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
 492         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
 493         background-color: #1873a2;
 494 }
 495
 496 ul#user-menu-popup li a.nav-sep {
 497         border-top: 1px solid #989898;
 498         border-style:inset;
 499 }
 500
 501 /* ============= */
 502 /* = Notifiers = */
 503 /* ============= */
 504
 505 #notifications {
 506         height: 32px;
 507         position: absolute;
 508         top: 3px;
 509         left: 35%;
 510 }
 511
 512 .nav-ajax-update {
 513         width: 44px;
 514         height: 32px;
 515         background: transparent url('images/notifications.png') 0px 0px no-repeat;
 516         color: #333333;
 517         font-weight: bold;
 518         font-size: 0.8em;
 519         padding-top: 0.5em;
 520         float: left;
 521         padding-left: 11px;
 522 }
 523
 524 #notify-update {
 525         background-position: 0px -168px;
 526 }
 527
 528 #net-update {
 529         background-position: 0px -126px;
 530 }
 531
 532 #mail-update {
 533         background-position: 0px -40px;
 534 }
 535
 536 #intro-update {
 537         background-position: 0px -84px;
 538 }
 539
 540 #home-update {
 541         background-position: 0px 0px;
 542 }
 543
 544 #lang-select-icon {
 545         bottom: 6px;
 546         cursor: pointer;
 547         left: 28px;
 548         position: fixed;
 549         z-index: 10;
 550 }
 551 #language-selector {
 552         position: fixed;
 553         bottom: 2px;
 554         left: 52px;
 555         z-index: 10;
 556 }
 557
 558 /* =================== */
 559 /* = System Messages = */
 560 /* =================== */
 561
 562 #sysmsg_info,
 563 #sysmsg {
 564         position: fixed;
 565         bottom: 0px; right:20%;
 566         box-shadow: 7px 7px 10px #434343;
 567                 -moz-box-shadow: 7px 7px 12px #434343;
 568                 -webkit-box-shadow: 7px75px 12px #434343;
 569         padding: 10px;
 570         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
 571         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
 572         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
 573         background-color: #1873a2;
 574         border-radius: 5px 5px 0px 0px;
 575                 -webkit-border-radius: 5px 5px 0px 0px;
 576                 -moz-border-radius: 5px 5px 0px 0px;
 577         border: 1px solid #da2c2c;
 578         border-bottom: 0px;
 579         padding-bottom: 50px;
 580         z-index: 1000;
 581         color: #efefef;
 582         font-style: bold;
 583 }
 584
 585 #sysmsg_info br,
 586 #sysmsg br {
 587         display:block;
 588         margin:2px 0px;
 589         border-top: 1px solid #dddddd;
 590 }
 591
 592 /* ================= */
 593 /* = Aside/Sidebar = */
 594 /* ================= */
 595
 596 aside {
 597         float: right;
 598         width: 205px;
 599         margin-top: 45px;
 600         /*font-size: 0.9em;*/
 601         font-style: bold;
 602 }
 603
 604 aside a {
 605         /*padding-bottom: 5px;*/
 606 }
 607
 608 aside h4 {
 609         font-size: 1.3em;
 610 }
 611
 612 .vcard .title {
 613         font-size: 1em;
 614 }
 615
 616 .vcard dd {
 617         font-size: 12px;
 618         font-variant: normal;
 619         -webkit-margin-start: 10px;
 620 }
 621
 622 .fn {
 623 }
 624
 625 .vcard .fn {
 626         font-size: 1.4em;
 627         font-weight: bold;
 628         border-bottom: none;
 629         margin-top:10px;
 630 }
 631
 632 .vcard #profile-photo-wrapper {
 633         margin: 10px 0px;
 634         padding: 6px;
 635         width: auto;
 636         background: none repeat scroll 0 0 #FFFFFF;
 637         border: 1px solid #C5C5C5;
 638         box-shadow: 0 0 8px #BDBDBD;
 639                 -moz-box-shadow: 3px 3px 4px #959494;
 640                 -webkit-box-shadow: 3px 3px 4px #959494;
 641                 -moz-box-shadow: 3px 3px 4px #959494;
 642                 -webkit-box-shadow: 3px 3px 4px #959494;
 643         border-radius: 5px;
 644                 -moz-border-radius: 5px;
 645                 -webkit-border-radius: 5px;
 646 }
 647
 648
 649 .allcontact-link {
 650         color: #626262;
 651         text-align: center;
 652         font-weight: bold;
 653         font-size: 1em;
 654 }
 655 .allcontact-link a {
 656         padding-bottom: 10px;
 657 }
 658
 659 #profile-extra-links ul {
 660         margin-left: 0px;
 661         padding-left: 0px;
 662         list-style: none;
 663 }
 664
 665 #dfrn-request-link {
 666         box-shadow: inset 0px 1px 0px 0px #a65151;
 667                 -moz-box-shadow: inset 0px 1px 0px 0px #a65151;
 668                 -webkit-box-shadow: inset 0px 1px 0px 0px #a65151;
 669         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
 670         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
 671         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
 672         background-color: #6da6c4;
 673         border-radius: 5px;
 674                 -moz-border-radius: 5px;
 675                 -webkit-border-radius: 5px;
 676         border: 1px solid #fc5656;
 677         display: inline-block;
 678         color: #f0e7e7;
 679         font-family: Trebuchet MS;
 680         font-size: 19px;
 681         font-weight: bold;
 682         text-align: center;
 683         padding: 10px;
 684         width: 185px;
 685         text-decoration: none;
 686         text-shadow: 1px 1px 0px #b36f6f;
 687 }
 688
 689 #wallmessage-link {
 690         display: block;
 691         color: #FFFFFF;
 692         border-radius: 5px;
 693                 -webkit-border-radius: 5px ;
 694                 -moz-border-radius: 5px;
 695         padding: 5px;
 696         font-weight: bold;
 697         background-color: #3465a4;
 698 }
 699
 700 #dfrn-request-link:hover {
 701         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
 702         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
 703         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
 704         background-color: #1873a2;
 705 }
 706
 707 #dfrn-request-link:active {
 708         position: relative;
 709         top: 1px;
 710 }
 711
 712 #dfrn-request-intro {
 713         width: 600px;
 714 }
 715
 716 #netsearch-box {
 717         background-color: #f6f6f6;
 718         padding: 5px 5px 0px 15px;
 719 }
 720 #netsearch-box input[type="text"] {
 721         width: 90%;
 722 }
 723 #netsearch-box input[type="submit"] {
 724         width: auto;
 725 }
 726
 727 h3 #search:before {
 728         content: url("images/search.png");
 729         padding-right: 10px;
 730         vertical-align: middle;
 731 }
 732
 733 #network-new-link {
 734         background-color: #f3f3f3;
 735         border: 1px solid #cdcdcd;
 736         margin-bottom: 10px;
 737         border-radius: 5px;
 738                 -webkit-border-radius: 5px;
 739                 -moz-border-radius: 5px;
 740 }
 741
 742 #group-sidebar {
 743         vertical-align: middle;
 744         margin: auto;
 745         margin-top: 20px;
 746         padding-bottom: 10px;
 747 }
 748
 749 #message-sidebar {
 750         vertical-align: middle;
 751         margin-top: 40px;
 752 }
 753
 754 #message-new {
 755         padding: 7px;
 756         width: 165px;
 757         margin: 10px;
 758         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 759         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 760         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 761         background-color: #bdbdbd;
 762         display: inline-block;
 763         color: #efefef;
 764         text-decoration: none;
 765         text-align: center;
 766         border: 1px solid #7C7D7B;
 767         border-radius: 5px;
 768                 -moz-border-radius: 5px;
 769                 -webkit-border-radius: 5px;
 770 }
 771
 772 #peoplefind-desc {
 773         margin-left: 10px;
 774 }
 775
 776 #sidebar-group-list {
 777         margin-left: 0px;
 778         margin-right: 30px;
 779 }
 780
 781 #sidebar-ungrouped {
 782         margin: 10px;
 783 }
 784
 785 #sidebar-group-list  a {
 786 }
 787
 788 #sidebar-group-list .icon,
 789 #sidebar-group-list .iconspacer {
 790         display: inline-block;
 791         height: 12px;
 792         width: 12px;
 793 }
 794
 795 #side-peoplefind-submit {
 796         margin: 10px;
 797 }
 798
 799 #side-peoplefind-url {
 800         margin: 10px;
 801         width: 175px;
 802 }
 803
 804 #sidebar-page-list {}
 805
 806 .widget {
 807         margin-top: 20px;
 808         box-shadow: 1px 2px 6px 0px #959494;
 809                 -moz-box-shadow: 1px 2px 6px 0px #959494;
 810                 -webkit-box-shadow: 1px 2px 6px 0px #959494;
 811         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f8f8f8), color-stop(1, #f6f6f6) );
 812         background: -moz-linear-gradient( center top, #f8f8f8 5%, #f6f6f6 100% );
 813         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='#f6f6f6');
 814         background-color: #f8f8f8;
 815         border-radius: 5px;
 816                 -moz-border-radius: 5px;
 817                 -webkit-border-radius: 5px;
 818         color: #7c7d7b;
 819         border: 1px solid #cdcdcd;
 820 }
 821
 822 li.widget-list {
 823         list-style: none outside none;
 824         background: url("images/arrow.png") no-repeat scroll left center transparent;
 825         display: block;
 826         padding: 3px 24px;
 827 }
 828
 829 #sidebar-new-group {
 830         padding: 7px;
 831         width: 165px;
 832         margin: auto;
 833         margin-left: 10px;
 834         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 835         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 836         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 837         background-color: #bdbdbd;
 838         display: inline-block;
 839         color: #efefef;
 840         text-decoration: none;
 841         text-align: center;
 842         border: 1px solid #7C7D7B;
 843         border-radius: 5px;
 844                 -moz-border-radius: 5px;
 845                 -webkit-border-radius: 5px;
 846 }
 847
 848
 849 #sidebar-new-group:hover {
 850         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
 851         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
 852         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
 853         background-color: #1873a2;
 854         border: 1px solid #7C7D7B;
 855         box-shadow: 0 0 8px #BDBDBD;
 856                 -moz-box-shadow: 3px 3px 4px #959494;
 857                 -webkit-box-shadow: 3px 3px 4px #959494;
 858         border-radius: 5px;
 859                 -moz-border-radius: 5px;
 860                 -webkit-border-radius: 5px;
 861 }
 862
 863 #sidebar-new-group:active {
 864         position: relative;
 865         top: 1px;
 866 }
 867
 868 .group-selected,
 869 .nets-selected,
 870 .fileas-selected,
 871 .categories-selected {
 872         padding-bottom: 0px;
 873         padding-left: 2px;
 874         padding-right: 2px;
 875         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
 876                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
 877                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
 878         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 879         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 880         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 881         background-color: #bdbdbd;
 882         border-radius: 5px;
 883                 -moz-border-radius: 5px;
 884                 -webkit-border-radius: 5px;
 885         display: inline-block;
 886         color: #efefef;
 887         text-decoration: none;
 888 }
 889
 890 .settings-widget .selected {
 891         font-weight: bold;
 892 }
 893
 894 #sidebar-new-group a {
 895         color: #efefef;
 896         font-size: 14px;
 897         text-align: center;
 898         margin: auto;
 899 }
 900
 901 ul .sidebar-group-li {
 902         list-style: none;
 903         font-size: 1.0em;
 904 }
 905
 906 ul .sidebar-group-li .icon {
 907         display: inline-block;
 908         height: 12px;
 909         width: 12px;
 910 }
 911
 912 .nets-ul, .fileas-ul, .categories-ul  {
 913         list-style-type: none;
 914 }
 915
 916 .nets-ul li,
 917 .fileas-ul li,
 918 .categories-ul li {
 919 }
 920
 921 .nets-link {
 922         color: #1873A2;
 923         text-decoration: none;
 924         margin-left: 2px;
 925         padding-left: 20px;
 926         background: url("images/arrow.png") no-repeat scroll left center transparent;
 927         box-shadow: none;
 928 }
 929 .nets-all {
 930         margin-left: 42px;
 931 }
 932
 933 .fileas-link,
 934 .categories-link {
 935         margin-left: 0px;
 936 }
 937
 938 .fileas-all,
 939 .categories-all {
 940         margin-left: 0px;
 941 }
 942
 943 .widget h3 {
 944         font-size: 125%;
 945         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0edf0), color-stop(1, #e2e2e2) );
 946         background: -moz-linear-gradient( center top, #f0edf0 5%, #e2e2e2 100% );
 947         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0edf0', endColorstr='#e2e2e2');
 948         background-color: #f0edf0;
 949         border-radius: 5px 5px 0px 0px;
 950                 -moz-border-radius: 5px 5px 0px 0px;
 951                 -webkit-border-radius: 5px 5px 0px 0px;
 952         border: 1px solid #e2e2e2;
 953         border-bottom: 1px solid #cdcdcd;
 954         padding-top: 5px;
 955         padding-bottom: 5px;
 956         vertical-align: baseline;
 957         text-align: center;
 958         text-shadow: -1px 0px 0px #bdbdbd;
 959 }
 960
 961 #connect-desc {
 962         margin-left: 10px;
 963 }
 964
 965 #group-sidebar h3:before {
 966         content: url("images/groups.png");
 967         padding-right: 10px;
 968         vertical-align: middle;
 969 }
 970
 971 #saved-search-list {
 972         margin-top: 15px;
 973 }
 974
 975 .saved-search-li {
 976         list-style: none;
 977         font-size: 1.2em;
 978 }
 979
 980 .saved-search-li .icon {
 981         margin-right: 5px;
 982 }
 983
 984 .birthday-today,
 985 .event-today {
 986         font-weight: bold;
 987 }
 988
 989 #birthday-wrapper,
 990 #event-wrapper {
 991         margin-left: 15px;
 992 }
 993
 994 #pause {
 995         position: fixed;
 996         bottom: 5px;
 997         right: 5px;
 998 }
 999
1000 /* ================== */
1001 /* = Contacts Block = */
1002 /* ================== */
1003
1004 .contact-block-img {
1005         width: 47px;
1006         height: 47px;
1007         margin-right: 2px;
1008         border: 1px solid #C5C5C5;
1009         border-radius: 3px;
1010                 -moz-border-radius: 3px;
1011                 -webkit-border-radius: 3px;
1012         box-shadow: 0 0 8px #BDBDBD;
1013                 -moz-box-shadow: 3px 3px 4px #959494;
1014                 -webkit-box-shadow: 3px 3px 4px #959494;
1015 }
1016
1017 .contact-block-div {
1018         float: left;
1019 }
1020
1021 .contact-block-link {
1022         float: left;
1023 }
1024
1025 .contact-block-textdiv {
1026         width: 150px;
1027         height: 34px;
1028         float: left;
1029 }
1030
1031 .contact-block-h4,
1032 .contact-block-content {
1033         margin: 0;
1034 }
1035
1036 #contact-block,
1037 #contact-block-end {
1038         clear: both;
1039 }
1040
1041 /* ======= */
1042 /* = Jot = */
1043 /* ======= */
1044
1045 #profile-jot-text-loading,
1046 #profile-jot-text {
1047         height: 20px;
1048         color: #cccccc;
1049 }
1050
1051 #profile-jot-text_tbl {
1052         margin-bottom: 10px;
1053         margin-top: 10px;
1054 }
1055
1056 #profile-jot-text_ifr {
1057         width: 99.9% !important;
1058 }
1059
1060 #profile-jot-submit-wrapper {
1061         margin-top: 30px;
1062 }
1063
1064 #jot-title,
1065 #jot-category {
1066         margin: 0px;
1067         height: 20px;
1068         width: 575px;
1069         font-weight: bold;
1070         border: 1px solid #cccccc;
1071 }
1072
1073 #jot-perms-icon {
1074         float: left;
1075 }
1076
1077 #jot-title::-webkit-input-placeholder,
1078 #jot-category::-webkit-input-placeholder {
1079         font-weight: normal;
1080 }
1081
1082 #jot-title:-moz-placeholder,
1083 #jot-category:-moz-placeholder {
1084         font-weight: normal;
1085 }
1086
1087 #jot-title:hover,
1088 #jot-title:focus,
1089 #jot-category:hover,
1090 #jot-category:focus {
1091         border: 1px solid #cccccc;
1092 }
1093
1094 .jothidden {
1095         display: none;
1096 }
1097
1098 .preview {
1099         background: #FFFFC8;
1100 }
1101
1102 #theme-preview {
1103         margin: 15px 0 15px 0;
1104 }
1105
1106 #profile-jot-perms,
1107 #profile-jot-submit {
1108         width: 60px;
1109         font-size: 12px;
1110         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1111         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1112         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1113         background-color: #bdbdbd;
1114         display: inline-block;
1115         color: #efefef;
1116         text-decoration: none;
1117         text-align: center;
1118         border: 1px solid #7C7D7B;
1119         border-radius: 5px;
1120                 -moz-border-radius: 5px;
1121                 -webkit-border-radius: 5px;
1122 }
1123
1124 #jot-preview-form {}
1125
1126 #jot-preview-link {
1127         float: left;
1128         width: 60px;
1129         font-size: 12px;
1130         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1131         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1132         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1133         background-color: #bdbdbd;
1134         display: inline-block;
1135         color: #efefef;
1136         text-decoration: none;
1137         text-align: center;
1138         padding: 5px 5px;
1139         border: 1px solid #7C7D7B;
1140         border-radius: 5px;
1141                 -moz-border-radius: 5px;
1142                 -webkit-border-radius: 5px;
1143 }
1144
1145 #profile-jot-perms {
1146         width: 27px;
1147         height: 27px;
1148         float: right;
1149         overflow: hidden;
1150         margin-left: 10px;
1151         margin-top: -20px;
1152         border: 1px solid #7C7D7B;
1153         border-radius: 5px;
1154                 -moz-border-radius: 5px;
1155                 -webkit-border-radius: 5px;
1156 }
1157
1158 #jot-perms-perms .icon {
1159         height: 1px;
1160 }
1161
1162 #profile-jot-submit {
1163         width: 80px;
1164         float: right;
1165         margin-right: 145px;
1166         margin-top: -20px;
1167         margin-left: 10px;
1168         padding: 5px 5px;
1169         border: 1px solid #7C7D7B;
1170         border-radius: 5px;
1171                 -moz-border-radius: 5px;
1172                 -webkit-border-radius: 5px;
1173 }
1174
1175 #profile-jot-perms:hover,
1176 #profile-jot-submit:hover,
1177 #jot-preview-link:hover {
1178         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
1179         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
1180         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
1181         background-color: #1873a2;
1182         border: 1px solid #7C7D7B;
1183         box-shadow: 0 0 8px #BDBDBD;
1184                 -moz-box-shadow: 3px 3px 4px #959494;
1185                 -webkit-box-shadow: 3px 3px 4px #959494;
1186         border-radius: 5px;
1187                 -moz-border-radius: 5px;
1188                 -webkit-border-radius: 5px;
1189 }
1190
1191 #profile-jot-perms:active,
1192 #profile-jot-submit:active,
1193 #jot-preview-link:active {
1194         position: relative;
1195         top: 1px;
1196 }
1197
1198 #character-counter {
1199         position: relative;
1200         float: left;
1201         right: 0px;
1202         top: 0px;
1203 }
1204 #profile-rotator-wrapper {
1205         float: right;
1206 }
1207
1208 .jot-tool {
1209         float: left;
1210         margin-right: 5px;
1211 }
1212
1213 #profile-jot-tools-end,
1214 #profile-jot-banner-end {
1215         clear: both;
1216 }
1217
1218 #profile-jot-email-wrapper {
1219         margin: 10px 10% 0px 10%;
1220         border: 1px solid #eeeeee;
1221         border-bottom: 0px;
1222 }
1223
1224 #profile-jot-email-label {
1225         background-color: #555753;
1226         color: #ccccce;
1227         padding: 5px;
1228 }
1229
1230 #profile-jot-email {
1231         margin: 5px;
1232         width: 95%;
1233 }
1234
1235 #profile-jot-networks {
1236         margin: 0px 10%;
1237         border: 1px solid #eeeeee;
1238         border-top: 0px;
1239         border-bottom: 0px;
1240         padding: 5px;
1241 }
1242 #profile-jot-acl-wrapper {
1243         margin: 0px 10px;
1244         border: 1px solid #eeeeee;
1245         border-top: 0px;
1246     display:block!important;
1247 }
1248
1249 #profile-video-wrapper,
1250 #profile-audio-wrapper,
1251 #profile-location-wrapper,
1252 #profile-nolocation-wrapper {
1253 }
1254
1255 #group_allow_wrapper,
1256 #group_deny_wrapper,
1257 #acl-permit-outer-wrapper {
1258         width: 47%;
1259         float: left;
1260 }
1261
1262 #contact_allow_wrapper,
1263 #contact_deny_wrapper,
1264 #acl-deny-outer-wrapper {
1265         width: 47%;
1266         float: right;
1267 }
1268
1269 #acl-permit-text {
1270         background-color: #555753;
1271         color: #ccccce;
1272         padding: 5px; float: left;
1273 }
1274
1275 #jot-public {
1276         background-color: #555753;
1277         color: #ff0000;
1278         padding: 5px;
1279         float: left;
1280 }
1281
1282 #acl-deny-text {
1283         background-color: #555753;
1284         color: #ccccce;
1285         padding: 5px;
1286         float: left;
1287 }
1288
1289 #acl-permit-text-end,
1290 #acl-deny-text-end {
1291         clear: both;
1292 }
1293
1294 #profile-jot-wrapper {
1295         margin-top: -15px;
1296 }
1297
1298 #profile-jot-desc,
1299 #profile-jot-form,
1300 #jot-location,
1301 #jot-coord,
1302 #jot-preview,
1303 #jot-title-wrap,
1304 #jot-category-wrap,
1305 #jot-text-wrap,
1306 #profile-jot-text-loading,
1307 #profile-attach-wrapper,
1308 #profile-link-wrapper,
1309 #profile-jot-banner-wrapper {}
1310
1311 .contact-h4 {
1312         font-size: 1.2em;
1313 }
1314
1315 /* ======== */
1316 /* = Tabs = */
1317 /* ======== */
1318
1319 .tabs {
1320         min-width: 400px;
1321         list-style: none;
1322         padding: 20px 0px 0px;
1323         font-size: 0.9em;
1324 }
1325
1326 .tabs li {
1327         display: inline;
1328 }
1329
1330 .tab {
1331         padding: 5px 10px 5px 10px;
1332         display: inline-block;
1333         margin-bottom: 5px;
1334         margin-right: 5px;
1335         font-style: bold;
1336 }
1337
1338 .tab:hover {
1339         padding: 5px 10px 5px 10px;
1340 }
1341
1342 /* ========= */
1343 /* = Posts = */
1344 /* ========= */
1345
1346 .wall-item-outside-wrapper {
1347         max-width: 100%;
1348         border-bottom: 1px solid #dedede;
1349         margin-top: 10px;
1350         margin-bottom: 20px;
1351         padding-right: 10px;
1352         padding-left: 12px;
1353         background: none repeat scroll 0 0 #FFFFFF;
1354         border: 1px solid #CDCDCD;
1355         border-radius: 5px;
1356                 -moz-border-radius: 5px;
1357                 -webkit-border-radius: 5px;
1358         box-shadow: 0 0 8px #BDBDBD;
1359                 -moz-box-shadow: 3px 3px 4px #959494;
1360                 -webkit-box-shadow: 3px 3px 4px #959494;
1361 }
1362
1363 .wall-item-outside-wrapper-end {
1364         clear: both;
1365 }
1366
1367 .wall-item-content-wrapper {
1368         position: relative;
1369         max-width: 100%;
1370         padding-top: 10px;
1371 }
1372
1373 .wall-item-comment-wrapper {
1374         margin-left: 10px;
1375 }
1376
1377 .wall-item-photo-menu-button {
1378         display: none;
1379         text-indent: -99999px;
1380         background: #eeeeee url("images/menu-user-pin.png") no-repeat 75px center;
1381         position: absolute;
1382         overflow: hidden;
1383         height: 20px;
1384         width: 100%;
1385         top: 85px;
1386         left: -1px;
1387         border-right: 1px solid #dddddd;
1388         border-left: 1px solid #dddddd;
1389         border-bottom: 1px solid #dddddd;
1390         box-shadow: 3px 3px 4px #959494;
1391                 -moz-box-shadow: 3px 3px 4px #959494;
1392                 -webkit-box-shadow: 3px 3px 4px #959494;
1393         border-radius: 0px 0px 5px  5px;
1394                 -webkit-border-radius: 0px 0px 5px  5px;
1395                 -moz-border-radius: 0px 0px 5px  5px;
1396 }
1397
1398 .wall-item-info {
1399         float: left;
1400         width: 100px;
1401 }
1402
1403 .wall-item-photo-wrapper {
1404         width: 80px;
1405         height: 80px;
1406         padding: 4px;
1407         position: relative;
1408         border: 1px solid #dddddd;
1409         border-radius: 5px;
1410                 -webkit-border-radius: 5px;
1411                 -moz-border-radius: 5px;
1412         box-shadow: 3px 3px 4px #959494;
1413                 -moz-box-shadow: 3px 3px 4px #959494;
1414                 -webkit-box-shadow: 3px 3px 4px #959494;
1415 }
1416
1417 .wall-item-tools {
1418         filter: alpha(opacity=60);
1419         opacity: 0.7;
1420         transition: all 0.25s ease-in-out;
1421                 -webkit-transition: all 0.25s ease-in-out;
1422                 -moz-transition: all 0.25s ease-in-out;
1423         margin-top: 20px;
1424         padding-bottom: 5px;
1425         float: right;
1426         width: auto;
1427 }
1428
1429 .wall-item-tools:hover {
1430         filter: alpha(opacity=100);
1431         opacity: 1;
1432         transition: all 0.25s ease-in-out;
1433                 -webkit-transition: all 0.25s ease-in-out;
1434                 -moz-transition: all 0.25s ease-in-out;
1435 }
1436
1437 .wall-item-social {
1438         filter: alpha(opacity=60);
1439         opacity: 0.7;
1440         transition: all 0.25s ease-in-out;
1441                 -webkit-transition: all 0.25s ease-in-out;
1442                 -moz-transition: all 0.25s ease-in-out;
1443         margin-top: 20px;
1444         margin-left: 0px;
1445         padding-bottom: 5px;
1446         float: left;
1447         width: auto;
1448 }
1449
1450 .wall-item-social:hover {
1451         filter: alpha(opacity=100);
1452         opacity: 1;
1453         transition: all 0.25s ease-in-out;
1454                 -webkit-transition: all 0.25s ease-in-out;
1455                 -moz-transition: all 0.25s ease-in-out;
1456 }
1457
1458 .wall-item-outside-wrapper.comment .wall-item-tools {
1459         float: right;
1460 }
1461
1462 .wall-item-like-buttons {
1463         float: left;
1464 }
1465
1466 .wall-item-like-buttons a.icon {
1467         float: left;
1468         margin-right: 10px;
1469         display: inline;
1470 }
1471
1472 .wall-item-links-wrapper {
1473         width: 30px;
1474         float: left;
1475 }
1476
1477 .wall-item-delete-wrapper {
1478         float: left;
1479         margin-right: 10px;
1480 }
1481
1482 .wall-item-links-wrapper a.icon {
1483         float: left;
1484         margin-right: 10px;
1485         display: inline;
1486 }
1487
1488 .pencil {
1489         float: left;
1490         margin-right: 20px;
1491 }
1492
1493 .star-item,
1494 .tag-item {
1495         float: left;
1496 }
1497
1498 .wall-item-title {
1499         font-size: 1.2em;
1500         font-weight: bold;
1501         padding-top: 5px;
1502         margin-left: 100px;
1503 }
1504
1505 .wall-item-body {
1506         margin-left: 100px;
1507         padding-right: 10px;
1508         padding-top: 5px;
1509         max-width: 100%;
1510 }
1511
1512 .wall-item-body img {
1513         max-width: 100%;
1514         height: auto;
1515 }
1516
1517 .wall-item-body p {
1518         font-size: 0.8em;
1519 }
1520
1521 .wall-item-lock-wrapper {
1522         float: right;
1523 }
1524
1525 .wall-item-dislike,
1526 .wall-item-like {
1527         clear: left;
1528         font-size: 0.9em;
1529         margin: 0px 0px 10px 0px;
1530         padding-left: 10px;
1531 }
1532
1533 .wall-item-author {
1534         font-size: 0.9em;
1535         margin: 0px 0px 0px 100px;
1536         padding-left: 0px;
1537 }
1538
1539 .wall-item-author a {
1540         color: #898989;
1541 }
1542
1543 .wall-item-ago {
1544         display: inline;
1545         padding-left: 0px;
1546         color: #898989;
1547 }
1548
1549 .wall-item-wrapper-end {
1550         clear:both;
1551 }
1552
1553 .wall-item-location {
1554         margin-top: 5px;
1555         overflow: hidden;
1556         text-overflow: ellipsis;
1557                 -o-text-overflow: ellipsis;
1558 }
1559
1560 .wall-item-location .icon {
1561         float: left;
1562 }
1563
1564 .wall-item-location > a {
1565         margin-left: 0px;
1566         margin-right: 3px;
1567         font-size: 0.9em;
1568         display: block;
1569         font-variant: small-caps;
1570         color: #898989;
1571 }
1572
1573 .wall-item-location .smalltext {
1574         margin-left: 0px;
1575         font-size: 0.9em;
1576         display: block;
1577 }
1578
1579 .wall-item-location > br {
1580         display: none;
1581 }
1582
1583 .wall-item-conv a{
1584         font-size: 0.9em;
1585         color: #898989;
1586 }
1587
1588 .wallwall .wwto {
1589         left: -10px;
1590         margin: 0;
1591         position: absolute;
1592         top: 65px;
1593         width: 30px;
1594         z-index: 900;
1595         width: 30px;
1596         height: 30px;
1597 }
1598
1599 .wallwall .wwto img {
1600         width: 30px!important;
1601         height: 30px!important;
1602 }
1603
1604 .wallwall .wall-item-photo-end {
1605         clear: both;
1606 }
1607
1608 .wall-item-arrowphoto-wrapper {
1609         position: absolute;
1610         left: 20px;
1611         top: 70px;
1612         z-index: 950;
1613 }
1614
1615 .wall-item-photo-menu {
1616         display: none;
1617         min-width: 88px;
1618         color: #2e3436;
1619         border-top: 1px;
1620         background: #eeeeee;
1621         border-right: 1px solid #dddddd;
1622         border-left: 1px solid #dddddd;
1623         border-bottom: 1px solid #dddddd;
1624         position: absolute;
1625         left: -1px;
1626         top: 101px;
1627         display: none;
1628         z-index: 10000;
1629         border-radius: 0px 5px 5px 5px;
1630                 -webkit-border-radius: 0px 5px 5px 5px;
1631                 -moz-border-radius: 0px 5px 5px 5px;
1632         box-shadow: 3px 3px 4px #959494;
1633                 -moz-box-shadow: 3px 3px 4px #959494;
1634                 -webkit-box-shadow: 3px 3px 4px #959494;
1635
1636 }
1637
1638 .fakelink wall-item-photo-menu-button {
1639         -webkit-border-radius: 0px 5px 5px 5px;
1640         -moz-border-radius: 0px 5px 5px 5px;
1641         border-radius: 0px 5px 5px 5px;
1642         box-shadow: 3px 3px 4px #959494;
1643                 -moz-box-shadow: 3px 3px 4px #959494;
1644                 -webkit-box-shadow: 3px 3px 4px #959494;
1645 }
1646
1647 .wall-item-photo-menu ul {
1648         margin: 0px;
1649         padding: 0px;
1650         list-style: none;
1651 }
1652
1653 .wall-item-photo-menu li a {
1654         white-space: nowrap;
1655         display: block;
1656         padding: 5px 2px;
1657         color: #2e3436;
1658 }
1659
1660 .wall-item-photo-menu li a:hover {
1661         color: #efefef;
1662         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
1663         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
1664         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
1665         background-color: #1873a2;
1666 }
1667
1668 .icon.drop,
1669 .icon.drophide {
1670         float: left;
1671 }
1672
1673 #item-delete-selected-end,
1674 #item-delete-selected {
1675         overflow: auto;
1676         margin-top: 20px;
1677         float: right;
1678         width: 250px;
1679 }
1680
1681 #item-delete-selected-icon {}
1682
1683 code {
1684         font-family: Courier, monospace;
1685         display: block;
1686         overflow: auto;
1687         border: 1px solid #444;
1688         background: #EEE;
1689         color: #444;
1690         padding: 10px;
1691         margin-top: 10px;
1692 }
1693
1694
1695 /* ============ */
1696 /* = Comments = */
1697 /* ============ */
1698
1699  .ccollapse-wrapper {
1700         font-size: 0.9em;
1701         color: #898989;
1702         margin-left: 60px;
1703 }
1704
1705 #tread-wrapper {}
1706
1707 .tread-wrapper  {
1708         border: 0px solid #CDCDCD;
1709         border-radius: 5px;
1710                 -moz-border-radius: 5px;
1711                 -webkit-border-radius: 5px;
1712         margin-bottom: 20px;
1713         background-color: #E2E2E2;
1714 }
1715
1716 .collapsed-comments,
1717 .hide-comments,
1718 .hide-comments-outer,
1719 .wall-item-outside-wrapper.comment {
1720         margin-left: 30px;
1721         margin-bottom: 20px;
1722 }
1723
1724 .wall-item-outside-wrapper.comment .wall-item-photo {
1725         width: 40px!important;
1726         height: 40px!important;
1727 }
1728
1729 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {
1730         width: 40px;
1731         height: 40px;
1732 }
1733
1734 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1735         top: 45px;
1736         background-position: 35px center;
1737 }
1738
1739 .wall-item-outside-wrapper.comment .wall-item-info {
1740         width: 60px;
1741 }
1742
1743 .wall-item-outside-wrapper.comment .wall-item-body {
1744         margin-left: 60px;
1745         max-width: 100%;
1746         padding-right: 10px;
1747         padding-left: 0px;
1748 }
1749
1750 .wall-item-outside-wrapper.comment .wall-item-author {
1751         margin-left: 60px;
1752 }
1753
1754 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1755         min-width: 50px;
1756         top: 60px;
1757 }
1758 .icollapse-wrapper {
1759         font-size: 0.9em;
1760         color: #898989;
1761 }
1762
1763 .comment-wwedit-wrapper,
1764 .comment-edit-wrapper {
1765         margin: 0px 0px 5px 0px;
1766 }
1767
1768 .comment-wwedit-wrapper img,
1769 .comment-edit-wrapper img {
1770         width: 20px;
1771         height: 20px;
1772         margin-top: 5px;
1773 }
1774
1775 .comment-edit-photo-link {
1776         float: left;
1777         width: 30px;
1778 }
1779
1780 .comment-edit-text-empty {
1781         width: 98%;
1782         max-width: 672px;
1783         height: 20px;
1784         color: #babdb6;
1785         transition: all 0.5s ease-in-out;
1786                 -webkit-transition: all 0.5s ease-in-out;
1787                 -moz-transition: all 0.5s ease-in-out;
1788 }
1789
1790 .comment-edit-text-empty:hover {
1791         color: #999999;
1792 }
1793
1794 .comment-edit-text-full {
1795         width: 98%;
1796         max-width: 672px;
1797         height: 6em;
1798         transition: all 0.5s ease-in-out;
1799                 -webkit-transition: all 0.5s ease-in-out;
1800                 -moz-transition: all 0.5s ease-in-out;
1801 }
1802
1803 .comment-edit-submit-wrapper {
1804         width: 98%;
1805         max-width: 672px;
1806         margin-left: 20px;
1807         text-align: left;
1808 }
1809
1810 .comment-edit-submit {
1811         height: 22px;
1812         padding: 5px 5px;
1813         background-color: #a2a2a2;
1814         color: #eeeeec;
1815         border: 1px solid #CDCDCD;
1816         border-radius: 5px;
1817                 -moz-border-radius: 5px;
1818                 -webkit-border-radius: 5px;
1819 }
1820
1821 .comment-edit-submit:hover {
1822         background-color: #1873a2;
1823         border: 1px solid #CDCDCD;
1824         border-radius: 5px;
1825                 -moz-border-radius: 5px;
1826                 -webkit-border-radius: 5px;
1827         box-shadow: 0 0 8px #BDBDBD;
1828                 -moz-box-shadow: 3px 3px 4px #959494;
1829                 -webkit-box-shadow: 3px 3px 4px #959494;
1830 }
1831
1832 .comment-edit-submit:active {
1833         background-color: #1873a2;
1834 }
1835
1836 #item-delete-selected-desc {
1837         color: #898989;
1838         float: right;
1839 }
1840
1841 .wall-item-body code {
1842         font-family: Courier, monospace;
1843         display: block;
1844         overflow: auto;
1845         border: 1px solid #cccccc;
1846         border-width: 1px 1px 1px 3px;
1847         padding-left: 5px;
1848         margin-top: 10px;
1849 }
1850
1851 /* =========== */
1852 /* = Profile = */
1853 /* =========== */
1854
1855 .advanced-profile-content {
1856         margin-top: 5px;
1857         margin-bottom: 10px;
1858         margin-left: 30px;
1859         width: 60%;
1860 }
1861
1862 .advanced-profile-label {
1863         margin-top: 10px;
1864         margin-bottom: 0px;
1865         padding-bottom: 5px;
1866         font-size: 18px;
1867 }
1868
1869 div[id$="wrapper"] {
1870         height: 100%;
1871 }
1872
1873 div[id$="wrapper"] br {
1874         clear: left;
1875 }
1876
1877 #advanced-profile-with {
1878         margin-left: 20px;
1879 }
1880
1881 #profile-listing-desc,
1882 #profile-listing-new-link-wrapper {
1883         float: left;
1884         display: inline;
1885         padding: 5px 10px 5px 10px;
1886         width: 150px;
1887         margin:20px 10px 0 0;
1888         display: inline-block;
1889         font-style: bold;
1890         text-align: center;
1891 }
1892
1893 .profile-listing-name {
1894         font-size: 1em;
1895 }
1896 .profile-listing-name a {
1897         color: #898989;
1898 }
1899
1900 #profile-edit-links {
1901         margin-left: 0;
1902 }
1903
1904 #profile-edit-links li {
1905         display: inline;
1906         width: 150px;
1907         margin-bottom: 20px;
1908         margin-top: 20px;
1909         background-color: #a2a2a2;
1910         color: #eeeeec;
1911         padding: 5px 10px 5px 10px;
1912         margin-right: 5px;
1913         font-style: bold;
1914         border-radius: 5px;
1915                 -moz-border-radius: 5px;
1916                 -webkit-border-radius: 5px;
1917 }
1918
1919 #profile-edit-links li a {
1920         color: #efefef;
1921 }
1922
1923 #profile-edit-links li:hover {
1924         background-color: #1873a2;
1925 }
1926
1927 #profile-edit-links li:active {
1928         background-color: #1873a2;
1929 }
1930
1931 #profile-edit-links-end {
1932         clear: both;
1933         margin-bottom: 15px;
1934 }
1935
1936 .profile-edit-side-div {
1937         margin-top: 10px;
1938         margin-right: 0px;
1939         margin-left: 180px;
1940         float: left;
1941         position: absolute;
1942 }
1943
1944 #cropimage-wrapper {
1945         float:left;
1946 }
1947
1948 #crop-image-form {
1949         clear:both;
1950 }
1951
1952 .profile-match-name {
1953         float: left;
1954         text-align: left;
1955         overflow: hidden;
1956 }
1957
1958 .profile-match-name a:hover {
1959         color: #999;
1960 }
1961
1962 .profile-match-wrapper {
1963         position: relative;
1964         float:left;
1965         height:80px;
1966         padding:5px;
1967         width:80px;
1968         margin-bottom: 70px;
1969         margin-right: 29px;
1970         background-color: #f6f6f6;
1971         border: 1px solid #dddddd;
1972         box-shadow: 3px 3px 4px #959494;
1973                 -moz-box-shadow: 3px 3px 4px #959494;
1974                 -webkit-box-shadow: 3px 3px 4px #959494;
1975 }
1976
1977 .profile-match-break,
1978 .profile-match-end {
1979         clear: both;
1980 }
1981
1982 .profile-match-connect {
1983         text-align: left;
1984         font-weight: bold;
1985 }
1986 .profile-match-ignore {
1987         height: 0!important;
1988 }
1989
1990 #profile-match-wrapper-end {
1991         clear: both;
1992 }
1993 .profile-match-end {
1994         clear: both;
1995 }
1996
1997 .profile-match-photo {
1998         float: left;
1999         margin-right: 10px;
2000         margin-bottom: 5px;
2001 }
2002
2003 /* ========== */
2004 /* = Photos = */
2005 /* ========== */
2006
2007 .photos {
2008         height: auto;
2009         overflow: auto;
2010 }
2011
2012 .photo {
2013         height: 191px!important;
2014         width: 191px!important;
2015 }
2016
2017 #side-bar-photos-albums {
2018 }
2019
2020 #photo-albums-upload-link {
2021         margin: 20px;
2022 }
2023
2024 #side-bar-photos-albums h3:before {
2025         content: url("images/photography.png");
2026         padding-right: 10px;
2027         vertical-align: middle;
2028 }
2029
2030 #side-bar-photos-albums li {
2031         font-size: 14px;
2032         font-variant: none;
2033         text-align: left;
2034         padding-left: 20px;
2035         margin-bottom: 5px;
2036 }
2037
2038 #photo-top-links {
2039         width: 130px;
2040         margin-bottom: 20px;
2041         margin-top: 20px;
2042         background-color: #a2a2a2;
2043         color: #eeeeec;
2044         padding: 5px 10px 5px 10px;
2045         margin-right: 5px;
2046         font-style: bold;
2047         border-radius: 5px;
2048                 -moz-border-radius: 5px;
2049                 -webkit-border-radius: 5px;
2050 }
2051
2052 #photo-top-links a {
2053         color: #efefef;
2054 }
2055
2056 #photo-top-links:hover {
2057         background-color: #1873a2;
2058 }
2059
2060 #photo-top-links:active {
2061         background-color: #1873a2;
2062 }
2063
2064 .photo-album-image-wrapper {
2065         float: left;
2066         margin: 0px 10px 10px 0px;
2067         padding-bottom: 30px;
2068         position: relative;
2069 }
2070
2071 .photo-top-image-wrapper {
2072         float: left;
2073         width: 180px;
2074         height: 180px;
2075         margin: 0px 10px 10px 0px;
2076         padding-bottom: 30px;
2077         position: relative;
2078 }
2079
2080 #photo-album-wrapper-inner {
2081         position: relative;
2082         float: left;
2083         width: 180px;
2084         height: 180px;
2085         overflow: hidden;
2086 }
2087
2088 #photo-photo {
2089         max-width: 85%;
2090         height: auto;
2091 }
2092
2093 #photo-photo img {
2094         max-width: 100%
2095 }
2096
2097 .photo-top-image-wrapper a:hover,
2098 #photo-photo a:hover,
2099 .photo-album-image-wrapper a:hover {
2100         border-bottom: 0px;
2101 }
2102
2103 .photo-top-photo {
2104         width: 180px;
2105 }
2106 .photo-album-photo {}
2107
2108 .photo-top-album-name {
2109         position: absolute;
2110         bottom: 0px;
2111         padding: 0px 5px;
2112         font-weight: bold;
2113         font-stretch: semi-expanded;
2114 }
2115
2116 .photo-top-album-name a {
2117         text-align: center;
2118         color: #6e6e6e;
2119 }
2120 .caption {
2121         position: absolute;
2122         bottom: 0px;
2123         margin: 0px 5px;
2124         text-align: center;
2125         color: #6e6e6e;
2126         font-size: 0.9em;
2127 }
2128
2129 #photo-photo {
2130         position: relative;
2131         float: left;
2132 }
2133
2134 #photo-caption {
2135         margin-top: 10px;
2136         color: #6E6E6E;
2137         font-size: 1.1em;
2138 }
2139
2140 #photo-photo-end {
2141         clear: both;
2142 }
2143
2144 #photo-prev-link,
2145 #photo-next-link {
2146         position: absolute;
2147         width: 10%;
2148         height: 100%;
2149         background-color: rgba(255,255,255,0.2);
2150         opacity: 0;
2151         transition: all 0.2s ease-in-out;
2152                 -webkit-transition: all 0.2s ease-in-out;
2153                 -moz-transition: all 0.2s ease-in-out;
2154         background-position: center center;
2155         background-repeat: no-repeat;
2156 }
2157
2158 #photo-prev-link {
2159         left: 0px;
2160         top: 0px;
2161         background-image: url('images/prev.png');
2162 }
2163
2164 #photo-next-link {
2165         right: 0px;
2166         top: 0px;
2167         background-image: url('images/next.png');
2168 }
2169
2170 #photo-prev-link a,
2171 #photo-next-link a {
2172         display: block;
2173         width: 100%;
2174         height: 100%;
2175         overflow: hidden;
2176         text-indent: -900000px;
2177 }
2178
2179 #photo-prev-link:hover,
2180 #photo-next-link:hover {
2181         opacity: 1;
2182         transition: all 0.2s ease-in-out;
2183                 -webkit-transition: all 0.2s ease-in-out;
2184                 -moz-transition: all 0.2s ease-in-out;
2185 }
2186
2187 #photo-next-link .icon,
2188 #photo-prev-link .icon {
2189         display: none;
2190 }
2191
2192 #photos-upload-spacer,
2193 #photos-upload-new-wrapper,
2194 #photos-upload-exist-wrapper {
2195         margin-bottom: 1em;
2196 }
2197
2198 #photos-upload-existing-album-text,
2199 #photos-upload-newalbum-div {
2200         color: #909090;
2201         padding: 3px 0px;
2202         width: 300px;
2203 }
2204
2205 #photos-upload-album-select,
2206 #photos-upload-newalbum {
2207         width: 400px;
2208         margin-bottom: 10px;
2209 }
2210
2211 #photos-upload-perms-menu {
2212         width: 180px;
2213         padding: 7px;
2214 }
2215
2216 #photos-upload-perms-menu .icon {
2217         display: none;
2218 }
2219
2220 #photos-upload-perms {
2221         margin-top: 10px;
2222 }
2223
2224 .photos-upload-perms {}
2225
2226 select, input {
2227         border: 1px solid #b0b0b0;
2228         padding: 2px;
2229         border-radius: 3px;
2230                 -moz-border-radius: 3px;
2231                 -webkit-border-radius: 3px;
2232 }
2233
2234 select[size],
2235 select[multiple],
2236 select[size][multiple] {
2237         margin: 5px 0px 10px 0px;
2238 }
2239
2240 select {
2241         -webkit-appearance: menulist;
2242         box-sizing: border-box;
2243         -webkit-box-align: center;
2244         cursor: default;
2245 }
2246
2247 textarea, keygen {
2248         margin-top: 3px;
2249         font-size: 0.9em;
2250         letter-spacing: normal;
2251         word-spacing: normal;
2252         line-height: 1.2em;
2253         text-transform: none;
2254         text-indent: 0px;
2255         text-shadow: none;
2256         display: inline-block;
2257         text-align: -webkit-auto;
2258 }
2259
2260 input {
2261         margin-top: 3px;
2262         margin-right: 10px;
2263         text-align: -webkit-auto;
2264 }
2265
2266 .qq-upload-button {
2267         border-radius: 5px;
2268                 -moz-border-radius: 5px;
2269                 -webkit-border-radius: 5px;
2270 }
2271
2272 #album-edit-link {
2273         width: 70px;
2274         margin-bottom: 20px;
2275         margin-top: 20px;
2276         background-color: #a2a2a2;
2277         color: #eeeeec;
2278         padding: 5px 10px 5px 10px;
2279         margin-right: 5px;
2280         font-style: bold;
2281         border-radius: 5px;
2282                 -moz-border-radius: 5px;
2283                 -webkit-border-radius: 5px;
2284 }
2285
2286 #album-edit-link  a {
2287         color: #efefef;
2288 }
2289
2290 #album-edit-link:hover {
2291         background-color: #1873a2;
2292 }
2293
2294 #photo-edit-link-wrap {
2295         margin-bottom: 10px;
2296 }
2297
2298 #photo_edit_form {
2299         width: 500px;
2300         margin-top: 20px;
2301         text-align: left;
2302 }
2303
2304 input #photo_edit_form {
2305         display: block;
2306         width: 100%;
2307 }
2308
2309 #photo-edit-perms-menu {
2310         float: left;
2311         display: inline;
2312         margin-top: 10px;
2313         margin-right: 10px;
2314         padding: 4px;
2315         width: 100px;
2316 }
2317
2318 #photo-edit-perms-menu .icon {
2319         display: none;
2320 }
2321
2322 #photo-edit-delete-button {
2323         float: left;
2324         display: inline;
2325         margin-left: 190px;
2326 }
2327
2328 #photo-album-edit-wrapper {
2329         margin-bottom: 10px;
2330 }
2331
2332 /* ============ */
2333 /* = Messages = */
2334 /* ============ */
2335
2336 #prvmail-wrapper,
2337 .mail-conv-detail,
2338 .mail-list-detail {
2339         position: relative;
2340         width: 550px;
2341         padding: 50px;
2342         margin: 20px 0 0 0;
2343         background-color: #fff;
2344         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2345         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2346         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2347 }
2348
2349 #prvmail-wrapper:before,
2350 #prvmail-wrapper:after,
2351 .mail-conv-detail:before,
2352 .mail-conv-detail:after,
2353 .mail-list-detail:before,
2354 .mail-list-detail:after {
2355         position: absolute;
2356         width: 40%;
2357         height: 10px;
2358         content: ' ';
2359         left: 12px;
2360         bottom: 12px;
2361         background: transparent;
2362         transform: skew(-5deg) rotate(-5deg);
2363                 -webkit-transform: skew(-5deg) rotate(-5deg);
2364                 -moz-transform: skew(-5deg) rotate(-5deg);
2365                 -ms-transform: skew(-5deg) rotate(-5deg);
2366                 -o-transform: skew(-5deg) rotate(-5deg);
2367         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2368                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2369                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2370         z-index: -1;
2371 }
2372
2373 #prvmail-wrapper:after,
2374 .mail-conv-detail:after,
2375 .mail-list-detail:after {
2376         left: auto;
2377         right: 12px;
2378         transform: skew(5deg) rotate(5deg);
2379                 -webkit-transform: skew(5deg) rotate(5deg);
2380                 -moz-transform: skew(5deg) rotate(5deg);
2381                 -ms-transform: skew(5deg) rotate(5deg);
2382                 -o-transform: skew(5deg) rotate(5deg);
2383 }
2384
2385 .prvmail-text {
2386         width: 100%;
2387 }
2388
2389 #prvmail-form input
2390
2391 #prvmail-subject {
2392         width: 490px;
2393         padding-left: 10px;
2394         font-size: 1.1em;
2395         font-style: bold;
2396 }
2397
2398 #prvmail-subject .input {
2399         border: none !important;
2400 }
2401
2402 #prvmail-subject-label {}
2403
2404 #prvmail-to {
2405         padding-left: 10px;
2406 }
2407
2408 #prvmail-to-label {}
2409
2410 #prvmail-message-label {
2411         font-size: 1em;
2412 }
2413
2414 #prvmail-submit-wrapper {
2415         margin-top: 10px;
2416 }
2417
2418 #prvmail-submit {
2419         float: right;
2420         margin-top: 0px;
2421         margin-right: 0px;
2422 }
2423
2424 #prvmail-upload {
2425 margin-left: 0px;
2426 }
2427
2428 #prvmail-submit-wrapper > div {
2429         margin-right: 5px;
2430         float: left;
2431 }
2432
2433 .mail-list-outside-wrapper {
2434         margin-top: 20px;
2435 }
2436
2437 .mail-list-sender {
2438         float: left;
2439         padding: 2px;
2440         background-color: #efefef;
2441         border: 1px solid #C5C5C5;
2442         border-radius: 3px;
2443                 -moz-border-radius: 3px;
2444                 -webkit-border-radius: 3px;
2445         box-shadow: 0 0 8px #BDBDBD;
2446                 -moz-box-shadow: 3px 3px 4px #959494;
2447                 -webkit-box-shadow: 3px 3px 4px #959494;
2448 }
2449
2450 .mail-list-detail {
2451         margin-left: 100px;
2452         width: 600px;
2453         min-height: 70px;
2454         padding: 20px;
2455         padding-top: 10px;
2456         border: 1px solid #dddddd;
2457 }
2458
2459 .mail-list-sender-name {
2460         font-size: 1.1em;
2461         display: inline;
2462 }
2463
2464 .mail-list-date {
2465         float: right;
2466         clear: block;
2467         display: inline;
2468         font-size: 0.9em;
2469         padding-left: 10px;
2470         font-stretch: ultra-condensed;
2471 }
2472
2473 .mail-list-subject {
2474         clear: block;
2475         font-size: 1.2em;
2476         padding-top: 20px;
2477         padding-right: 50px;
2478 }
2479
2480 .mail-list-subject a {
2481         color: #626262;
2482 }
2483
2484 .mail-list-delete-wrapper {
2485         float: right;
2486 }
2487
2488 .mail-list-outside-wrapper-end {
2489         clear: both;
2490 }
2491
2492 .mail-conv-outside-wrapper {
2493         margin-bottom: 10px;
2494         margin-top: 30px;
2495 }
2496
2497 .mail-conv-sender {
2498         float: left;
2499         margin: 0px 5px 5px 0px;
2500 }
2501
2502 .mail-conv-sender-photo {
2503         width: 64px;
2504         height: 64px;
2505 }
2506
2507 .mail-conv-sender-name {
2508         float: left;
2509         font-style: bold;
2510 }
2511
2512 .mail-conv-date {
2513         float: right;
2514 }
2515
2516 .mail-conv-subject {
2517         clear: right;
2518         font-weight: bold;
2519         font-size: 1.2em;
2520 }
2521
2522 .mail-conv-body {
2523         clear: both;
2524 }
2525
2526 .mail-conv-detail {
2527         width: 500px;
2528         padding: 20px;
2529         padding-bottom: 20px;
2530         margin-left: 20px;
2531         margin-bottom: 0px;
2532         vertical-align: middle;
2533         margin: auto;
2534         border: 1px solid #dddddd;
2535 }
2536
2537 .mail-conv-break {
2538         display: none;
2539         border: none;
2540 }
2541
2542 .mail-conv-delete-wrapper {
2543         padding-top: 10px;
2544         width: 510px;
2545         text-align: right;
2546 }
2547
2548 #prvmail-subject {
2549         font-weight: bold;
2550         border: 1px solid #dddddd;
2551 }
2552
2553 /* ================= */
2554 /* = Notifications = */
2555 /* ================= */
2556
2557 #notification-show-hide-wrapper {
2558         width: 160px;
2559         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2560                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2561                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2562         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2563         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2564         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2565         background-color: #bdbdbd;
2566         border-radius: 5px;
2567                 -moz-border-radius: 5px;
2568                 -webkit-border-radius: 5px;
2569         padding: 5px 10px 5px 10px;
2570         margin-right: 5px;
2571         margin-top: 10px;
2572         font-style: bold;
2573         color: #efefef;
2574         text-align: center;
2575 }
2576
2577 #notification-show-hide-wrapper:hover {
2578         color: #efefef;
2579         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2580         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2581         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2582         background-color: #1873a2;
2583 }
2584
2585 #notification-show-hide-wrapper:active {
2586         background-color: #1873a2;
2587         position: relative;
2588         top: 1px;
2589 }
2590
2591 #notification-show-hide-wrapper a {
2592         color: #efefef;
2593 }
2594
2595 /* ============ */
2596 /* = Contacts = */
2597 /* ============ */
2598
2599 #contacts-main {
2600         margin-bottom: 10px;
2601 }
2602
2603 .contact-wrapper {
2604         float: left;
2605         width: 150px;
2606         height: 150px;
2607         overflow: auto;
2608 }
2609
2610 .view-contact-wrapper,
2611 .contact-entry-wrapper {
2612         float: left;
2613         margin-right: 30px;
2614         margin-bottom: 20px;
2615         width: 88px;
2616         height: 120px;
2617         position: relative;
2618 }
2619
2620 #view-contact-end {
2621         clear: both;
2622 }
2623
2624 #viewcontacts {
2625         margin-top: 15px;
2626 }
2627
2628 .contact-entry-direction-wrapper {
2629         position: absolute;
2630         top: 20px;
2631 }
2632
2633 .contact-entry-edit-links {
2634         position: absolute;
2635         top: 60px;
2636 }
2637
2638 #contacts-show-hide-link {
2639         margin-bottom: 20px;
2640         margin-top: 10px;
2641         font-weight: bold;
2642 }
2643
2644 .contact-entry-name {
2645         width: 100px;
2646         overflow: hidden;
2647         font: #999;
2648         font-size: 12px;
2649         text-align: center;
2650         font-weight: bold;
2651         margin-top: 5px;
2652 }
2653
2654 .contact-entry-photo {
2655         position: relative;
2656 }
2657
2658 .contact-entry-edit-links .icon {
2659         border: 1px solid #babdb6;
2660         border-radius: 3px;
2661                 -webkit-border-radius: 3px;
2662                 -moz-border-radius: 3px;
2663         background-color: #ffffff;
2664 }
2665
2666 #contact-edit-banner-name {
2667         font-size: 1.5em;
2668         margin-left: 30px;
2669 }
2670
2671 #contact-edit-update-now {
2672         padding: 7px;
2673         width: 165px;
2674         margin: auto;
2675         margin-left: 40px;
2676         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2677                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2678                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2679         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2680         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2681         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2682         background-color: #bdbdbd;
2683         border-radius: 5px;
2684                 -moz-border-radius: 5px;
2685                 -webkit-border-radius: 5px;
2686         display: inline-block;
2687         color: #efefef;
2688         text-decoration: none;
2689         text-align: center;
2690 }
2691
2692 #contact-edit-update-now:hover {
2693         color: #efefef;
2694         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2695         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2696         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2697         background-color: #1873a2;
2698         border: 1px solid #7C7D7B;
2699         box-shadow: 0 0 8px #BDBDBD;
2700                 -moz-box-shadow: 3px 3px 4px #959494;
2701                 -webkit-box-shadow: 3px 3px 4px #959494;
2702         border-radius: 5px;
2703                 -moz-border-radius: 5px;
2704                 -webkit-border-radius: 5px;
2705 }
2706
2707 #contact-edit-update-now:active {
2708         position: relative;
2709         top: 1px;
2710 }
2711
2712 #contact-edit-update-now a {
2713         color: #efefef;
2714         font-size: 14px;
2715         text-align: center;
2716         margin: auto;
2717 }
2718
2719 #contact-edit-info-wrapper,
2720 #contact-edit-info-end,
2721 #contact-edit-profile-select-text,
2722 #contact-edit-profile-select-end,
2723 #contact-edit-poll-wrapper,
2724 #contact-edit-end {
2725 }
2726
2727 .contact-edit-submit {
2728 }
2729
2730 #contact-profile-selector {
2731 }
2732
2733 .contact-photo-menu-button {
2734         position: absolute;
2735         background-image: url("images/photo-menu.jpg");
2736         background-position: top left;
2737         background-repeat: no-repeat;
2738         margin: 10px 0 0 0;
2739         padding: 0px;
2740         width: 16px;
2741         height: 16px;
2742         top: 64px; left:0px;
2743         overflow: hidden;
2744         text-indent: 40px;
2745         display: none;
2746 }
2747
2748 .contact-photo-menu {
2749         width: auto;
2750         border: 1px solid #ddd;
2751         background: #f1f1f1;
2752         position: absolute;
2753         left: 0px;
2754         top: 90px;
2755         display: none;
2756         z-index: 10000;
2757         box-shadow: 3px 3px 5px #888;
2758                 -moz-box-shadow: 3px 3px 5px #888;
2759                 -webkit-box-shadow: 3px 3px 5px #888;
2760 }
2761
2762 .contact-photo-menu ul {
2763         margin: 0px;
2764         padding: 0px;
2765         list-style: none;
2766 }
2767
2768 .contact-photo-menu li a {
2769         display: block;
2770         padding: 3px;
2771         color: #626262;
2772         font-size: 1em;
2773 }
2774
2775 .contact-photo-menu li a:hover {
2776         color: #FFFFFF;
2777         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2778         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2779         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2780         background-color: #1873a2;
2781         text-decoration: none;
2782 }
2783
2784 .view-contact-name {}
2785
2786 #div.side-link {
2787         background-color: #efefef;
2788         padding: 10px;
2789         margin-top: 20px;
2790 }
2791
2792 #follow-sidebar {
2793         margin-bottom: 10px;
2794 }
2795
2796 #follow-sidebar h3:before {
2797         content: url("images/user.png");
2798         padding-right: 10px;
2799         vertical-align: middle;
2800 }
2801
2802 #follow-sidebar input[type="text"] {
2803         margin-left: 3px;
2804         margin-bottom: 10px;
2805 }
2806
2807 #side-follow-submit {
2808         width: 178px;
2809         margin: 10px;
2810         text-align: center;
2811 }
2812
2813 #side-invite-link,
2814 #side-random-profile-link,
2815 #side-suggest-link,
2816 #side-match-link {
2817         width: 80%;
2818         padding: 10px;
2819         margin: auto;
2820         margin-bottom: 20px;
2821         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2822         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2823         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2824         background-color: #bdbdbd;
2825         padding: 5px 10px 5px 10px;
2826         color: #efefef;
2827         font-size: 1.1em;
2828         text-align: center;
2829         border: 1px solid #7C7D7B;
2830         border-radius: 5px;
2831                 -moz-border-radius: 5px;
2832                 -webkit-border-radius: 5px;
2833 }
2834
2835 #side-invite-link:hover,
2836 #side-random-profile-link:hover,
2837 #side-suggest-link:hover,
2838 #side-match-link:hover {
2839         color: #efefef;
2840         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2841         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2842         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2843         background-color: #1873a2;
2844         border: 1px solid #7C7D7B;
2845         box-shadow: 0 0 8px #BDBDBD;
2846                 -moz-box-shadow: 3px 3px 4px #959494;
2847                 -webkit-box-shadow: 3px 3px 4px #959494;
2848         border-radius: 5px;
2849                 -moz-border-radius: 5px;
2850                 -webkit-border-radius: 5px;
2851 }
2852
2853
2854 #side-invite-link:active,
2855 #side-random-profile-link:active,
2856 #side-suggest-link:active,
2857 #side-match-link:active {
2858         background-color: #1873a2;
2859         position: relative;
2860         top: 1px;
2861 }
2862
2863 #side-invite-link a,
2864 #side-random-profile-link a,
2865 #side-suggest-link a,
2866 #side-match-link a {
2867         color: #efefef;
2868 }
2869
2870
2871 #invite-message,
2872 #invite-recipients,
2873 #invite-recipient-text {
2874         padding: 10px;
2875 }
2876
2877 #side-follow-wrapper {
2878         font-size: 1em;
2879         font-weight: bold;
2880         font-stretch: semi-expanded;
2881         background-color: #f3f3f3;
2882         border: 1px solid #cdcdcd;
2883         padding: 10px;
2884         margin-top: 20px;
2885         border-radius: 5px;
2886                 -moz-border-radius: 5px;
2887                 -webkit-border-radius: 5px;
2888 }
2889
2890 #side-follow-wrapper label{
2891         font-size: 1.1em;
2892         font-variant: normal;
2893 }
2894
2895 #contact-suggest {
2896         float: left;
2897         margin-left: 10px;
2898         width: 120px;
2899         padding: 10px;
2900         margin-bottom: 20px;
2901         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2902                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2903                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2904         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2905         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2906         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2907         background-color: #bdbdbd;
2908         border-radius: 5px;
2909                 -moz-border-radius: 5px;
2910                 -webkit-border-radius: 5px;
2911         padding: 5px 10px 5px 10px;
2912         color: #efefef;
2913         font-size: 1.2em;
2914         text-align: center;
2915 }
2916
2917 #contact-suggest:hover {
2918         color: #efefef;
2919         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2920         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2921         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2922         background-color: #1873a2;
2923 }
2924
2925 #contact-suggest:active {
2926         background-color: #1873a2;
2927         position: relative;
2928         top: 1px;
2929 }
2930
2931 #contact-suggest a {
2932         color: #efefef;
2933 }
2934
2935 .crepair-label {
2936         margin-top: 10px;
2937         float: left;
2938         width: 250px;
2939 }
2940
2941 .crepair-input {
2942         margin-top: 10px;
2943         float: left;
2944         width: 200px;
2945 }
2946
2947 /* ===================================== */
2948 /* = Register, Settings, Profile Forms = */
2949 /* ===================================== */
2950
2951 #id_openid_url,
2952 .openid input {
2953         background: url(images/login-bg.gif) no-repeat;
2954         background-position: 0 50%;
2955         padding-left: 18px;
2956         width: 250px!important;
2957 }
2958
2959 .openid:hover {
2960 }
2961
2962 #profile-tabs-wrapper {
2963         padding-top: 10px;
2964 }
2965
2966 #profile-tab-status-link {
2967         border: 0px;
2968         padding: 5px 10px 5px 10px;
2969         font-style: bold;
2970 }
2971
2972 #uexport-link a {
2973         color: #efefef;
2974 }
2975
2976 #profile-tab-profile-link {
2977         border: 0px;
2978         padding: 5px 10px 5px 10px;
2979 }
2980
2981 #uexport-link {
2982         width: 140px;
2983         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2984                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2985                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2986         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2987         background: -moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2988         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2989         background-color: #7c7d7b;
2990         border-radius: 5px;
2991                 -moz-border-radius: 5px;
2992                 -webkit-border-radius: 5px;
2993         padding: 5px 10px 5px 10px;
2994         margin-bottom: 10px;
2995 }
2996
2997 #uexport-link:hover {
2998         color: #efefef;
2999         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
3000         background: -moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
3001         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
3002         background-color: #555753;
3003 }
3004
3005 #uexport-link:active {
3006         color: #efefef;
3007         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3008         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3009         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3010         background-color: #1873a2;
3011         position: relative;
3012         top: 1px;
3013 }
3014
3015 #settings-default-perms .fakelink {
3016         color: #efefef;
3017 }
3018
3019 #settings-default-perms {
3020         width: 260px;
3021         text-align: center;
3022         color: #EFEFEF;
3023         padding: 5px 10px 5px 10px;
3024         margin-bottom: 10px;
3025         background-color: #BDBDBD;
3026         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
3027         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3028         border: 1px solid #7C7D7B;
3029         border-radius: 5px;
3030                 -moz-border-radius: 5px;
3031                 -webkit-border-radius: 5px;
3032 }
3033
3034 #settings-default-perms:hover {
3035         color: #efefef;
3036         background-color: #555753;
3037         border: 1px solid #7C7D7B;
3038         box-shadow: 0 0 8px #BDBDBD;
3039                 -moz-box-shadow: 3px 3px 4px #959494;
3040                 -webkit-box-shadow: 3px 3px 4px #959494;
3041         border-radius: 5px;
3042                 -moz-border-radius: 5px;
3043                 -webkit-border-radius: 5px;
3044 }
3045
3046 #settings-default-perms:active {
3047         color: #efefef;
3048         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3049         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3050         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3051         background-color: #1873a2;
3052         position: relative;
3053         top: 1px;
3054 }
3055
3056 #settings-nickname-desc {
3057         width: 80%;
3058         background-color: #efefef;
3059         margin-top: 10px;
3060         margin-bottom: 10px;
3061         border-radius: 5px;
3062                 -webkit-border-radius: 5px;
3063                 -moz-border-radius: 5px;
3064         padding: 10px;
3065 }
3066
3067 #register-form div {
3068         clear: both;
3069 }
3070
3071 #profile-edit-form div {
3072         margin-bottom: 5px;
3073 }
3074
3075 #profile-edit-form div[id$='desc'] {
3076         font-size: 0.8em;
3077         margin-left: 2%;
3078 }
3079
3080 #register-form label,
3081 #profile-edit-form label {
3082         width: 575px;
3083         float: right;
3084         margin-right: 155px;
3085 }
3086
3087 #register-form span {
3088         color: #555753;
3089         display: block;
3090         margin-bottom: 20px;
3091 }
3092
3093 .settings-submit,
3094 .settings-submit-wrapper,
3095 .profile-edit-submit-wrapper {
3096         margin: 30px 0px;
3097 }
3098
3099 .profile-listing,
3100 .profile-listing-end {
3101         float: left;
3102         clear: both;
3103         margin: 20px 20px 0px 0px;
3104 }
3105
3106
3107 #register-sitename {
3108         display: inline;
3109         font-weight: bold;
3110 }
3111
3112 #register-submit-button {
3113         margin-top: 10px;
3114 }
3115
3116 #label-register-name,
3117 #label-register-email,
3118 #label-register-nickname,
3119 #label-register-openid {
3120         float: left;
3121         width: 350px;
3122         margin-top: 10px;
3123 }
3124
3125 #register-name,
3126 #register-email,
3127 #register-nickname {
3128         float: left;
3129         margin-top: 10px;
3130         width: 150px;
3131 }
3132
3133 #register-openid {
3134         float: left;
3135         margin-top: 10px;
3136         width: 130px;
3137 }
3138
3139 #register-fill-ext {
3140         margin-bottom: 25px;
3141 }
3142
3143 #register-name-end,
3144 #register-email-end,
3145 #register-nickname-end,
3146 #register-submit-end,
3147 #register-openid-end {
3148         clear: both;
3149 }
3150
3151 #register-nickname-desc {
3152         margin-top: 30px;
3153         width: 650px;
3154 }
3155
3156 /* ===================== */
3157 /* = Contacts Selector = */
3158 /* ===================== */
3159
3160 #group-edit-wrapper {
3161         margin-bottom: 10px;
3162 }
3163
3164 #group-edit-name-wrapper {
3165         margin-bottom: 0px;
3166         display: inline;
3167 }
3168 #group-edit-submit-wrapper {
3169         margin-bottom: 10px;
3170         margin-right: 400px;
3171         float: right;
3172         display: inline;
3173 }
3174
3175 .group-delete-wrapper {
3176         width: 90px;
3177         display: inline;
3178         padding: 5px;
3179         margin-bottom: 10px;
3180         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3181                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3182                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3183         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3184         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3185         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3186         background-color: #bdbdbd;
3187         border-radius: 5px;
3188                 -moz-border-radius: 5px;
3189                 -webkit-border-radius: 5px;
3190 }
3191
3192 .group-delete-wrapper:hover {
3193         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3194         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3195         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3196         background-color: #1873a2;
3197 }
3198
3199 .group-delete-wrapper:active {
3200         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3201         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3202         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3203         background-color: #1873a2;
3204 }
3205
3206 .group-delete-wrapper a {
3207         color: #efefef;
3208         font-size: 0.9em;
3209 }
3210
3211 #group-edit-desc {
3212         margin: 10px 0xp;
3213 }
3214
3215 #group-new-text {
3216         font-size: 1.1em;
3217 }
3218
3219 #group-members,
3220 #prof-members {
3221         width: 83%;
3222         height: 200px;
3223         overflow: auto;
3224         border: none;
3225         background-color: #f0edf0;
3226         color: #555753;
3227         border: 1px solid #ccc;
3228         margin-bottom: 10px;
3229         padding: 10px;
3230 }
3231
3232 #group-all-contacts,
3233 #prof-all-contacts {
3234         width: 83%;
3235         height: 200px;
3236         overflow: auto;
3237         border: 1px solid #ccc;
3238         background-color: #f0edf0;
3239         padding: 10px;
3240 }
3241
3242 #group-members h3,
3243 #group-all-contacts h3,
3244 #prof-members h3,
3245 #prof-all-contacts h3 {
3246         color: #555753;
3247         margin: 0px;
3248         padding: 5px;
3249 }
3250
3251 #group-separator,
3252 #prof-separator {
3253         display: none;
3254 }
3255
3256 /* ========== */
3257 /* = Events = */
3258 /* ========== */
3259
3260 #events-reminder {}
3261
3262 .clear {
3263         clear: both;
3264         margin-top: 10px;
3265 }
3266
3267 .eventcal {
3268         float: left;
3269         font-size: 20px;
3270         padding: 20px;
3271 }
3272
3273 .vevent {
3274         position: relative;
3275         width: 400px;
3276         padding: 20px;
3277         padding-top: 10px;
3278         margin: 0 0px;
3279         margin-bottom: 10px;
3280         background-color: #fff;
3281         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3282                 -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3283                 -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3284 }
3285
3286 .vevent:before,
3287 .vevent:after {
3288         position: absolute;
3289         width: 40%;
3290         height: 10px;
3291         content: ' ';
3292         left: 12px;
3293         bottom: 12px;
3294         background: transparent;
3295         transform: skew(-5deg) rotate(-5deg);
3296                 -webkit-transform: skew(-5deg) rotate(-5deg);
3297                 -moz-transform: skew(-5deg) rotate(-5deg);
3298                 -ms-transform: skew(-5deg) rotate(-5deg);
3299                 -o-transform: skew(-5deg) rotate(-5deg);
3300         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3301                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3302                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3303         z-index: -1;
3304 }
3305
3306 .vevent:after {
3307         left: auto;
3308         right: 12px;
3309         transform: skew(5deg) rotate(5deg);
3310                 -webkit-transform: skew(5deg) rotate(5deg);
3311                 -moz-transform: skew(5deg) rotate(5deg);
3312                 -ms-transform: skew(5deg) rotate(5deg);
3313                 -o-transform: skew(5deg) rotate(5deg);
3314 }
3315
3316 .vevent .event-description {
3317         margin-left: 10px;
3318         margin-right: 10px;
3319         text-align: center;
3320         font-size: 1.2em;
3321         font-weight: bolder;
3322 }
3323
3324 .vevent .event-location {
3325         margin-left: 10px;
3326         margin-right: 10px;
3327         font-size: 1em;
3328         font-style: oblique;
3329         text-align: center;
3330 }
3331
3332 .vevent .event-start,
3333 .vevent .event-end  {
3334         margin-left: 20px;
3335         margin-right: 20px;
3336         margin-bottom: 2px;
3337         margin-top: 2px;
3338         font-size: 0.9em;
3339         text-align: left;
3340 }
3341
3342 #new-event-link {
3343         width: 130px;
3344         padding: 7px;
3345         margin-bottom: 10px;
3346         margin-left: 170px;
3347         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3348                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3349                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3350         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3351         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3352         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3353         background-color: #bdbdbd;
3354         border-radius: 5px;
3355                 -moz-border-radius: 5px;
3356                 -webkit-border-radius: 5px;
3357         color: #efefef;
3358 }
3359
3360 #new-event-link:hover {
3361         color: #efefef;
3362         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3363         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3364         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3365         background-color: #1873a2;
3366 }
3367
3368 #new-event-link:active {
3369         background-color: #1873a2;
3370         position: relative;
3371         top: 1px;
3372 }
3373
3374 #new-event-link a {
3375         color: #efefef;
3376         text-align: center;
3377 }
3378
3379 .edit-event-link, .plink-event-link {
3380         float: left;
3381         margin-top: 4px;
3382         margin-right: 4px;
3383         margin-bottom: 15px;
3384 }
3385
3386 .event-description:before {
3387         content: url('images/calendar.png');
3388         margin-right: 15px;
3389         vertical-align: middle;
3390 }
3391
3392 .event-start,
3393 .event-end {
3394         margin-left: 10px;
3395         width: 330px;
3396 }
3397
3398 .event-start .dtstart,
3399 .event-end .dtend {
3400         float: right;
3401 }
3402
3403 .event-list-date {
3404         color: #626262;
3405         margin-bottom: 10px;
3406         font-stretch: condensed;
3407 }
3408
3409 .prevcal,
3410 .nextcal {
3411         float: left;
3412         margin-left: 32px;
3413         margin-right: 32px;
3414         margin-top: 64px;
3415 }
3416
3417 .event-calendar-end {
3418         clear: both;
3419 }
3420
3421 .calendar {
3422         width: 300px;
3423         font-family: Helvetica, Arial, sans-serif;
3424         background-color: #f1f1f1;
3425         border: 1px solid #dedede;
3426         margin-bottom: 10px;
3427         box-shadow: 5px 5px 8px #959494;
3428                 -moz-box-shadow: 5px 5px 8px #959494;
3429                 -webkit-box-shadow: 5px 5px 8px #959494;
3430 }
3431
3432 .calendar caption {
3433         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
3434         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
3435         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
3436         background-color: #1873a2;
3437         padding: 10px 0px 10px 0px;
3438         width: 300px;
3439         color: #ffffff;
3440         font-weight: bold;
3441         text-align: center;
3442         box-shadow: 5px 2px 8px #959494;
3443                 -moz-box-shadow: 5px 2px 8px #959494;
3444                 -webkit-box-shadow: 5px 2px 8px #959494;
3445 }
3446
3447 .calendar td {
3448         font-size: 14px;
3449         text-align: center;
3450         padding: 3px 0px;
3451 }
3452
3453 .calendar td > a {
3454         background-color: #cdcdcd;
3455         padding: 2px;
3456         color: #000000;
3457 }
3458
3459 .calendar th {
3460         font-size: 16px;
3461 }
3462
3463 .today {
3464         font-weight: bold;
3465         text-align: center;
3466         background-color: #1873a2;
3467         color: #ffffff;
3468 }
3469
3470 #event-start-text,
3471 #event-finish-text {
3472         margin-top: 10px;
3473         margin-bottom: 5px;
3474 }
3475
3476 #event-nofinish-checkbox,
3477 #event-nofinish-text,
3478 #event-adjust-checkbox,
3479 #event-adjust-text,
3480 #event-share-checkbox {
3481         float: left;
3482 }
3483
3484 #event-datetime-break {
3485         margin-bottom: 10px;
3486 }
3487
3488 #event-nofinish-break,
3489 #event-adjust-break,
3490 #event-share-break {
3491         clear: both;
3492 }
3493
3494 #event-desc-text,
3495 #event-location-text {
3496         margin-top: 10px;
3497         margin-bottom: 5px;
3498 }
3499
3500 #event-submit {
3501         margin-top: 10px;
3502 }
3503
3504 /* ============= */
3505 /* = Directory = */
3506 /* ============= */
3507
3508 .directory-item {
3509         float: left;
3510         margin: 50px 50px 0px 0px;
3511 }
3512
3513 .directory-details {
3514         font-size: 0.9em;
3515         width: 160px;
3516 }
3517
3518 .directory-name {
3519         font-size: 1em;
3520         width: 150px;
3521 }
3522
3523 /* ========= */
3524 /* = Admin = */
3525 /* ========= */
3526
3527 #adminpage {
3528         width: 90%;
3529 }
3530
3531 #pending-update {
3532         float:right;
3533         color: #ffffff;
3534         font-weight: bold;
3535         background-color: #FF0000;
3536         padding: 0em 0.3em;
3537 }
3538
3539 .admin.linklist {
3540         border: 0px; padding: 0px;
3541 }
3542
3543 .admin.link {
3544         list-style-position: inside;
3545         font-size: 1em;
3546         padding: 5px;
3547         width: auto;
3548         margin: 5px;
3549 }
3550
3551 #adminpage dl {
3552         clear: left;
3553         margin-bottom: 2px;
3554         padding-bottom: 2px;
3555         border-bottom: 1px solid black;
3556 }
3557
3558 #adminpage dt {
3559         width: 200px;
3560         float: left;
3561         font-weight: bold;
3562 }
3563
3564 #adminpage dd {
3565         margin-left: 200px;
3566 }
3567 #adminpage h3 {
3568         border-bottom: 1px solid #898989;
3569         margin-bottom: 5px;
3570         padding-bottom: 5px;
3571         margin-top: 10px;
3572 }
3573
3574 #adminpage .submit {
3575         clear:left;
3576 }
3577
3578 #adminpage
3579 #pluginslist {
3580         margin: 0px;
3581         padding: 0px;
3582 }
3583
3584 #adminpage .plugin {
3585         list-style: none;
3586         display: block;
3587         clear: left;
3588         border: 1px solid #7C7D7B;
3589         box-shadow: 0 0 8px #BDBDBD;
3590                 -moz-box-shadow: 3px 3px 4px #959494;
3591                 -webkit-box-shadow: 3px 3px 4px #959494;
3592         border-radius: 5px;
3593                 -moz-border-radius: 5px;
3594                 -webkit-border-radius: 5px;
3595         padding:10px;
3596         margin:10px 10px 10px 0;
3597 }
3598
3599 #adminpage .toggleplugin {
3600         float: left;
3601         margin-right: 1em;
3602 }
3603
3604 #adminpage table {
3605         width: 100%;
3606         border-bottom: 1p solid #000000;
3607         margin: 5px 0px;
3608 }
3609
3610 #adminpage table th {
3611         text-align: left;
3612 }
3613
3614 #adminpage td .icon {
3615         float: left;
3616 }
3617
3618 #adminpage table#users img {
3619         width: 16px;
3620         height: 16px;
3621 }
3622
3623 #adminpage table tr:hover {
3624         background-color: #eeeeee;
3625 }
3626
3627 #adminpage .selectall {
3628         text-align: right;
3629 }
3630
3631 /* =============== */
3632 /* = Form Fields = */
3633 /* =============== */
3634
3635 .field {
3636     margin-bottom: 10px;
3637     overflow: auto;
3638     padding-bottom: 0px;
3639     width: 100%;
3640 }
3641
3642 .field.radio .field_help {
3643     margin-left: 205px;
3644 }
3645
3646 .field .field_help {
3647     color: #666666;
3648     display: block;
3649     margin-left: 200px;
3650 }
3651
3652 .field label {
3653     float: left;
3654     width: 200px;
3655 }
3656
3657 .field checkbox {
3658         float: left;
3659         width: 480px;
3660 }
3661
3662 .field input,
3663 .field textarea {
3664         width: 400px;
3665         border: 1px solid #CDCDCD;
3666         border-radius: 5px;
3667                 -moz-border-radius: 5px;
3668                 -webkit-border-radius: 5px;
3669 }
3670
3671 .field password {
3672         height: 100px;
3673         margin-left: 150px;
3674 }
3675
3676 .field_help {
3677         display: block;
3678         margin-left: 0px;
3679         margin-bottom: 10px;
3680         color: #666666;
3681 }
3682
3683 .field .onoff {
3684         float: left;
3685         width: 80px;
3686 }
3687 .field .onoff a {
3688         display: block;
3689         border: 1px solid #c1c1c1;
3690         background-image: url("../../../images/onoff.jpg");
3691         background-repeat: no-repeat;
3692         padding: 4px 2px 2px 2px;
3693         height: 16px;
3694         text-decoration: none;
3695 }
3696 .field .onoff .off {
3697         border-color: #c1c1c1;
3698         padding-left: 40px;
3699         background-position: left center;
3700         background-color: #cccccc;
3701         color: #666666;
3702         text-align: right;
3703 }
3704
3705 .field .onoff .on {
3706         border-color: #c1c1c1;
3707         padding-right: 40px;
3708         background-position: right center;
3709         background-color: #1873a2;
3710         color: #FFFFFF;
3711         text-align: left;
3712 }
3713
3714 .field .radio .field_help {
3715         margin-left: 0px;
3716 }
3717
3718 /* ========= */
3719 /* = Icons = */
3720 /* ========= */
3721
3722 .sparkle {
3723         cursor: url('lock.cur'), pointer;
3724 }
3725
3726 .icon {
3727         margin-left: 5px;
3728         margin-right: 5px;
3729         display: block;
3730         width: 20px;
3731         height: 20px;
3732         background-image: url("images/icons.png");
3733 }
3734 .starred {
3735         background-image: url("images/star.png");
3736         repeat: no-repeat;
3737 }
3738 .unstarred {
3739         background-image: url("images/premium.png");
3740         repeat: no-repeat;
3741 }
3742
3743 .notify {
3744         background-image: url("images/notifications.png");
3745         repeat: no-repeat;
3746 }
3747
3748 .border {
3749         border: 1px solid #c1c1c1;
3750         border-radius: 3px;
3751                 -webkit-border-radius: 3px;
3752                 -moz-border-radius: 3px;
3753 }
3754
3755 .article        { background-position: -50px  0px;}
3756 .audio          { background-position: -70px  0px;}
3757 .block          { background-position: -90px  0px;}
3758 .drop           { background-position: -110px 0px;}
3759 .drophide       { background-position: -130px 0px;}
3760 .edit           { background-position: -150px 0px;}
3761 .camera         { background-position: -170px 0px;}
3762 .dislike        { background-position: -190px 0px;}
3763 .like           { background-position: -210px 0px;}
3764 .link           { background-position: -230px 0px;}
3765 .globe          { background-position: -50px  -20px;}
3766 .noglobe        { background-position: -70px  -20px;}
3767 .no             { background-position: -90px  -20px;}
3768 .pause          { background-position: -110px -20px;}
3769 .play           { background-position: -130px -20px;}
3770 .pencil         { background-position: -150px -20px; margin-right: 12px;}
3771 .small-pencil   { background-position: -170px -20px;}
3772 .recycle        { background-position: -190px -20px;}
3773 .remote-link    { background-position: -210px -20px; margin-right: 10px;}
3774 .share          { background-position: -230px -20px;}
3775 .tools          { background-position: -50px  -40px;}
3776 .lock           { background-position: -70px  -40px;}
3777 .unlock         {
3778         background-position: -90px  -40px;
3779         background-image: none;
3780         width: 70px;
3781         height: 20px;
3782 }
3783
3784 .sharePerms {
3785         background-image: url("images/icons.png");
3786         width: 20px;
3787         height: 20px;
3788         margin: 2px 0px 2px 3px;
3789         display: block;
3790 }
3791
3792 .video          { background-position: -110px -40px;}
3793 .youtube        { background-position: -130px -40px;}
3794 .attach         { background-position: -190px -40px;}
3795 .language       { background-position: -210px -40px;}
3796 .on             { background-position: -50px  -60px;}
3797 .off            { background-position: -70px  -60px;}
3798 .prev           { background-position: -90px  -60px;}
3799 .next           { background-position: -110px -60px;}
3800 .tagged         { background-position: -130px -60px; margin-right: 10px;}
3801 .icon.dim       { opacity: 0.3;filter:alpha(opacity=30);}
3802
3803 .attachtype {
3804         display: block; width: 20px; height: 23px;
3805         background-image: url("../../../images/content-types.png");
3806         background-position: -80px 0px;
3807 }
3808
3809 .type-video { background-position: 0px 0px; }
3810 .type-image { background-position: -20px 0px; }
3811 .type-audio { background-position: -40px 0px; }
3812 .type-text  { background-position: -60px 0px; }
3813 .type-unkn  { background-position: -80px 0px; }
3814
3815 /* ========== */
3816 /* = Footer = */
3817 /* ========== */
3818
3819 .cc-license {
3820         margin-top: 100px;
3821         font-size: 0.7em;
3822 }
3823
3824 footer {
3825         display: block;
3826         margin: 50px 20%;
3827         clear: both;
3828 }
3829
3830
3831 /* ======= */
3832 /* = ACL = */
3833 /* ======= */
3834
3835 #photo-edit-perms-select,
3836 #photos-upload-permissions-wrapper,
3837 #profile-jot-acl-wrapper{
3838         display: block!important;
3839 }
3840
3841 #acl-wrapper {
3842         width: 690px;
3843         float:left;
3844 }
3845 #acl-search {
3846         float:right;
3847         background: #ffffff url("../../../images/search_18.png") no-repeat right center;
3848         padding-right: 20px;
3849 }
3850
3851 #acl-showall {
3852         float: left;
3853         display: block;
3854         font-size: 1em;
3855         font-style: bold;
3856         text-align: center;
3857         padding: 3px;
3858         margin-bottom: 5px;
3859         background-color: #cccccc;
3860         background-position: 7px 7px;
3861         background-repeat: no-repeat;
3862         padding: 5px;
3863         border-radius: 5px;
3864                 -webkit-border-radius: 5px ;
3865                 -moz-border-radius: 5px;
3866         color: #999999;
3867 }
3868
3869 #acl-showall.selected {
3870         color: #ffffff;
3871         background-color: #1873a2;
3872 }
3873
3874 #acl-list {
3875         height: 400px;
3876         border: 1px solid #cccccc;
3877         background-color: #efefef;
3878         clear: both;
3879         margin-top: 30px;
3880         overflow: auto;
3881 }
3882
3883 #acl-list-content {
3884 }
3885
3886 .acl-list-item {
3887         display: block;
3888         width: 155px;
3889         height: 50px;
3890         border: 1px solid #cccccc;
3891         background-color: #fff;
3892         margin: 5px;
3893         float: left;
3894         box-shadow: 2px 2px 3px #c1c1c1;
3895                 -moz-box-shadow: 2px 2px 3px #c1c1c1;
3896                 -webkit-box-shadow: 2px 2px 3px #c1c1c1;
3897 }
3898 .acl-list-item img {
3899         width: 30px;
3900         height: 30px;
3901         float: left;
3902         margin: 5px;
3903 }
3904
3905 .acl-list-item p {
3906         color: #999999;
3907         height: 12px;
3908         font-size: 0.7em;
3909         margin: 0px;
3910         padding: 2px 0px 1px;
3911         overflow: hidden;
3912 }
3913
3914 .acl-list-item a {
3915         font-size: 10px;
3916         display: block;
3917         float: left;
3918         color: #efefef;
3919         background-color: #898989;
3920         background-position: 3px 3px;
3921         background-repeat: no-repeat;
3922         margin: 10px 0 0 5px;
3923         border-radius: 2px;
3924                 -webkit-border-radius: 2px ;
3925                 -moz-border-radius: 2px;
3926         padding: 3px;
3927 }
3928
3929 #acl-wrapper a:hover {
3930         text-decoration: none;
3931         background-color:#1873a2;
3932 }
3933
3934 .acl-button-show.selected {
3935         color: #efefef;
3936         background-color: #1873a2;
3937 }
3938
3939 .acl-button-hide .selected {
3940         color: #efefef;
3941         background-color: #a2a2a2;
3942 }
3943
3944 .acl-list-item.groupshow { border-color: #1873a2; }
3945 .acl-list-item.grouphide { border-color: #a2a2a2; }
3946
3947 /* ========================= */
3948 /* = Global Directory Link = */
3949 /* ========================= */
3950
3951 #global-directory-link {
3952         width: 150px;
3953         padding: 4px;
3954         /*margin-bottom: 10px;*/
3955         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3956         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3957         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3958         background-color: #bdbdbd;
3959         color: #efefef;
3960         text-align: center;
3961         -webkit-padding-start: 0px;
3962         border: 1px solid #7C7D7B;
3963         border-radius: 5px;
3964                 -moz-border-radius: 5px;
3965                 -webkit-border-radius: 5px;
3966 }
3967
3968 #global-directory-link:hover {
3969         color: #efefef;
3970         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3971         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3972         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3973         background-color: #1873a2;
3974         border: 1px solid #7C7D7B;
3975         box-shadow: 0 0 8px #BDBDBD;
3976                 -moz-box-shadow: 3px 3px 4px #959494;
3977                 -webkit-box-shadow: 3px 3px 4px #959494;
3978         border-radius: 5px;
3979                 -moz-border-radius: 5px;
3980                 -webkit-border-radius: 5px;
3981 }
3982
3983 #global-directory-link:active {
3984         background-color: #1873a2;
3985         position: relative;
3986         top: 1px;
3987 }
3988
3989 #global-directory-link a {
3990         color: #efefef;
3991 }
3992
3993 a.active {
3994         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3995         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3996         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3997         background-color: #1873a2;
3998         color: #fec01d;
3999         padding: 5px 10px 5px 10px;
4000         margin-right: 5px;
4001 }
4002
4003 /* notifications popup menu */
4004 .nav-notify {
4005         display: none;
4006         position: absolute;
4007         font-size: 10px;
4008         padding: 1px 3px;
4009         top: 0px;
4010         right: -10px;
4011         min-width: 15px;
4012         text-align: right;
4013 }
4014 .nav-notify.show {
4015         display: block;
4016 }
4017 ul.menu-popup {
4018         position: absolute;
4019         display: none;
4020         width: 10em;
4021         margin: 0px;
4022         padding: 0px;
4023         list-style: none;
4024         z-index: 100000;
4025         top: 40px;
4026 }
4027 #nav-notifications-menu {
4028         width: 320px;
4029         max-height: 400px;
4030         overflow-y: scroll;
4031         overflow-style: scrollbar;
4032         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
4033         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
4034         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
4035         background-color: #a2a2a2;
4036         border-radius: 0px 0px 5px 5px;
4037                 -moz-border-radius: 0px 0px 5px 5px;
4038                 -webkit-border-radius: 0px 0px 5px 5px;
4039         border: 1px solid #9A9A9A;
4040         border-top: none;
4041         box-shadow: 5px 5px 10px #242424;
4042                 -moz-box-shadow: 5px 5px 10px #242424;
4043                 -webkit-box-shadow: 5px 5px 10px #242424;
4044 }
4045
4046 #nav-notifications-menu .contactname {
4047         font-weight: bold;
4048         font-size: 0.9em;
4049 }
4050
4051 #nav-notifications-menu img {
4052         float: left;
4053         margin-right: 5px;
4054 }
4055
4056 #nav-notifications-menu .notif-when {
4057         font-size: 0.8em;
4058         display: block;
4059 }
4060
4061 #nav-notifications-menu li {
4062         padding: 7px 0px 7px 10px;
4063         word-wrap: normal;
4064         border-bottom: 1px solid #626262;
4065 }
4066
4067 #nav-notifications-menu li:hover {
4068         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4069         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4070         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4071         background-color: #1873a2;
4072 }
4073
4074 #nav-notifications-menu a:hover {
4075         text-decoration: underline;
4076 }
4077
4078 .notif-item a {
4079         vertical-align: middle;
4080         color: #626262;
4081         padding-bottom: 7px;
4082 }
4083
4084 .notif-item a:hover {
4085         color: #1873a2;
4086 }
4087
4088 .notif-image {
4089         width: 32px;
4090         height: 32px;
4091         padding: 7px 7px 0px 0px;
4092 }
4093
4094 #jGrowl {
4095         z-index: 20000;
4096 }
4097
4098 /* autocomplete popup */
4099 .acpopup {
4100         max-height: 150px;
4101         overflow: auto;
4102         z-index: 100000;
4103         color: #2e3436;
4104         border-top: 0px;
4105         background: #eeeeee;
4106         border-right: 1px solid #dddddd;
4107         border-left: 1px solid #dddddd;
4108         border-bottom: 1px solid #dddddd;
4109         border-radius: 0px 5px 5px 5px;
4110                 -webkit-border-radius: 0px 5px 5px 5px;
4111                 -moz-border-radius: 0px 5px 5px 5px;
4112         box-shadow: 3px 3px 4px #959494;
4113                 -moz-box-shadow: 3px 3px 4px #959494;
4114                 -webkit-box-shadow: 3px 3px 4px #959494;
4115 }
4116
4117 .acpopupitem {
4118         color: #2e3436;
4119         padding: 4px;
4120         clear:left;
4121 }
4122 .acpopupitem img {
4123         float: left;
4124         margin-right: 4px;
4125 }
4126
4127 .acpopupitem.selected {
4128         color: #efefef;
4129         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4130         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4131         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4132         background-color: #1873a2;
4133         order-bottom: none;
4134 }
4135
4136 .qcomment {
4137         opacity: 0.8;
4138         filter: alpha(opacity=0);
4139         position: relative;
4140         left: 30px;
4141 }
4142
4143 .qcomment:hover {
4144         opacity: 1.0;
4145         filter: alpha(opacity=100);
4146 }
4147
4148 .notify-seen {
4149         background: #000000;
4150 }
4151
4152 /* Pages profile widget ----------------------------------------------------------- */
4153
4154 #page-profile,
4155 #profile-page-list {
4156         margin-left: 45px;
4157 }
4158
4159 #page-profile .title {
4160         font-weight: bold;
4161 }
4162
4163 #profile-vcard-break {
4164         clear: both;
4165 }
4166
4167 #profile-extra-links {
4168         clear: both;
4169         margin-top: 10px;
4170 }
4171
4172 #profile-extra-links ul {
4173         list-style-type: none;
4174         padding: 0px;
4175 }
4176
4177
4178 #profile-extra-links li {
4179         margin-top: 5px;
4180 }
4181
4182 .profile-edit-side-div {
4183         float: right;
4184 }
4185
4186 .profile-edit-side-link {
4187         opacity: 0.3;
4188         filter:alpha(opacity=30);
4189 }
4190 .profile-edit-side-link:hover {
4191         opacity: 1.0;
4192         filter:alpha(opacity=100);
4193 }
4194
4195 /* SCROLL TO TOP
4196 ----------------------------------------------------------- */
4197 #scrollup {
4198         position: fixed;
4199         right: 1px;
4200         bottom: 30px;
4201         z-index: 100;
4202 }
4203
4204 #scrollup a:hover {
4205         text-decoration: none;
4206         border: 0;
4207 }
4208
4209 /* New posts and comments => background color
4210 ----------------------------------------------------------- */
4211 .shiny {
4212         background: #fbfde9;
4213 }
4214
4215 div.wall-item-content-wrapper.shiny {
4216         background-image: url("images/shiny.png");
4217         background-repeat: repeat-x;
4218 }
4219
4220 /* from default */
4221 #jot-perms-icon,
4222 #profile-location,
4223 #profile-nolocation,
4224 #profile-youtube,
4225 #profile-video,
4226 #profile-audio,
4227 #profile-link,
4228 #profile-title,
4229 #wall-image-upload,
4230 #wall-file-upload,
4231 #profile-upload-wrapper,
4232 #wall-image-upload-div,
4233 #wall-file-upload-div,
4234 .hover,
4235 .focus {
4236         cursor: pointer;
4237 }
4238
4239 hr.line-dots {
4240     background: url("images/dot.png") repeat-x scroll left center transparent;
4241     border: medium none;
4242 }
4243
4244 .body-tag,
4245 .filesavetags,
4246 .categorytags {
4247         opacity: 0.5;
4248         filter:alpha(opacity=50);
4249 }
4250
4251 .body-tag:hover,
4252 .filesavetags:hover,
4253 .categorytags:hover {
4254         opacity: 1.0 !important;
4255         filter:alpha(opacity=100) !important;
4256 }
4257
4258 .item-select {
4259         opacity: 0.5;
4260         filter:alpha(opacity=10);
4261         float: right;
4262         margin-right: 10px;
4263
4264 }
4265 .item-select:hover,
4266 .checkeditem {
4267         opacity: 1;
4268         filter:alpha(opacity=100);
4269 }
4270
4271 .filer-icon {
4272         display: block; width: 16px; height: 16px;
4273         background-image: url('images/file.gif');
4274         margin-left: 5px;
4275         float: left;
4276 }
4277
4278 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
4279 [class^="comment-edit-bb"] {
4280         list-style: none;
4281         display: none;
4282         margin: 0px 0 -5px 0px;
4283         padding: 0px;
4284         width: 75%;
4285 }
4286
4287 .body-attach {
4288         margin-top: 10px;
4289 }
4290
4291 .grey {
4292         color: #888888;
4293 }
4294
4295 .location,
4296 .location-label,
4297 .gender-label,
4298 .marital-label,
4299 .homepage-label {
4300         float: left;
4301         text-align: left;
4302         display: block;
4303 }
4304
4305 .adr,
4306 .x-gender,
4307 .marital-text,
4308 .homepage-url {
4309         float: left;
4310         display: block;
4311         margin-left: 8px;
4312 }
4313
4314 #birthday-notice {}
4315 #nav-notifications-template {}
4316 #categories-sidebar {}
4317 #nets-desc {}
4318 #status-tab {}
4319 #page-footer {}
4320 #live-profile {}
4321
4322 .city-state-zip {}
4323 .country-name {}
4324 .locality {}
4325 .region {}
4326 .postal-code {}
4327 .mpfriend {}
4328 .toplevel_item {}
4329
4330 .fc-header,
4331 .fc-view,
4332 .fc-view-basicWeek,
4333 .fc-grid,
4334 .fc-border-separate,
4335 .fc-content {}
4336
4337 div #datebrowse-sidebar.widget {
4338         text-align:center;
4339 }
4340
4341 /* Fakelink */
4342
4343 .fakelink,
4344 .fakelink:visited,
4345 .fakelink:link {
4346         color: #1873a2;
4347         cursor: pointer;
4348         margin-bottom: 10px;
4349         /*background: url("images/down.png") no-repeat scroll left center transparent;*/
4350 }
4351
4352 .fakelink:hover {
4353         color: #6da6c4;
4354 }
4355
4356 #id_theme {
4357         margin:10px 10px 0 0;
4358 }
4359
4360 #id_maxreq,
4361 #id_cntunkmail,
4362 #id_expire {
4363         width: 75px;
4364 }
4365
4366 #id_post_newfriend,
4367 #id_post_joingroup,
4368 #id_post_profilechange,
4369 #id_notify1,
4370 #id_notify2,
4371 #id_notify3,
4372 #id_notify4,
4373 #id_notify5,
4374 #id_notify6,
4375 #id_notify7,
4376 #id_notify8,
4377 #id_allow_location {
4378         margin: 6px 0 0 10px;
4379 }
4380
4381 #settings-form {}
4382 .select {}
4383 .field_help {
4384         margin: 5px 0 10px;
4385 }
4386
4387 #settings-activity-desc,
4388 #settings-notify-desc {
4389         margin: 10px 10px 10px 0;
4390         font-weight: bold;
4391 }
4392
4393 #settings-notifications {
4394         width: 410px;
4395         border: 1px solid #7C7D7B;
4396         box-shadow: 0 0 8px #BDBDBD;
4397                 -moz-box-shadow: 3px 3px 4px #959494;
4398                 -webkit-box-shadow: 3px 3px 4px #959494;
4399         border-radius: 5px;
4400                 -moz-border-radius: 5px;
4401                 -webkit-border-radius: 5px;
4402         padding: 10px;
4403         margin: 10px 10px 10px 0;
4404 }
4405
4406 #id_npassword {}
4407
4408 #posted-date-selector {
4409         margin-left: 33px;
4410 }
4411
4412 #hide-comments-page-widget {
4413         margin-left: 40px;
4414 }
4415
4416 #collapsed-comments-page-widget {}
4417
4418 .tool {}
4419
4420 #logo-text {
4421 }
4422
4423 #logo-img {
4424         margin: 3px 0 0 0;
4425 }
4426
4427 .bigwidget {}
4428
4429 #remote-friends-in-common  {}
4430
4431 .settings-block {
4432         border: 1px solid #7C7D7B;
4433         box-shadow: 0 0 8px #BDBDBD;
4434                 -moz-box-shadow: 3px 3px 4px #959494;
4435                 -webkit-box-shadow: 3px 3px 4px #959494;
4436         border-radius: 5px;
4437                 -moz-border-radius: 5px;
4438                 -webkit-border-radius: 5px;
4439         padding:10px;
4440         margin:10px 10px 10px 0;
4441 }
4442
4443 #page-settings-label{
4444         width: auto !important;
4445         margin-bottom: 5px !important;
4446 }
4447
4448 .onoff {
4449         margin-right: 10px;
4450 }
4451
4452 .settings-heading {
4453         margin: 25px 0 25px 0;
4454 }
4455
4456 #id_itemcache,
4457 #id_basepath,
4458 #id_temppath,
4459 #id_lockpath,
4460 #id_proxyuser,
4461 #id_proxy,
4462 #id_allowed_email,
4463 #id_allowed_sites,
4464 #id_directory_submit_url,
4465 #id_register_text {
4466         width: 440px;
4467 }
4468
4469 #id_itemcache_duration,
4470 #id_abandon_days,
4471 #id_maxloadavg,
4472 #id_poll_interval,
4473 #id_delivery_interval,
4474 #id_timeout,
4475 #id_jpegimagequality,
4476 #id_maximagelength,
4477 #id_maximagesize,
4478 #id_max_daily_registrations {
4479         width: 75px;
4480 }
4481
4482 #id_remember {
4483         width: auto;
4484 }
4485
4486 .field.input.openid {
4487 }