view/theme/smoothly/style.css

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