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: right;
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         width: 82%;
1916         padding: 5px;
1917         margin-bottom: 10px;
1918         margin-left: 20px;
1919         background-color: #f6f6f6;
1920         border: 1px solid #dddddd;
1921         box-shadow: 3px 3px 4px #959494;
1922                 -moz-box-shadow: 3px 3px 4px #959494;
1923                 -webkit-box-shadow: 3px 3px 4px #959494;
1924         clear: both;
1925 }
1926
1927 .profile-match-end {
1928         clear: both;
1929 }
1930
1931 .profile-match-photo {
1932         float: left;
1933         margin-right: 10px;
1934         margin-bottom: 5px;
1935 }
1936
1937 /* ========== */
1938 /* = Photos = */
1939 /* ========== */
1940
1941 .photos {
1942         height: auto;
1943         overflow: auto;
1944 }
1945
1946 .photo {
1947         height: 191px;
1948         width: 191px;
1949 }
1950
1951 #side-bar-photos-albums h3:before {
1952         content: url("photography.png");
1953         padding-right: 10px;
1954         vertical-align: middle;
1955 }
1956
1957 #side-bar-photos-albums li {
1958         font-size: 14px;
1959         font-variant: none;
1960         text-align: left;
1961         padding-left: 20px;
1962         margin-bottom: 5px;
1963 }
1964
1965 #photo-top-links {
1966         width: 130px;
1967         margin-bottom: 20px;
1968         margin-top: 20px;
1969         background-color: #a2a2a2;
1970         color: #eeeeec;
1971         padding: 5px 10px 5px 10px;
1972         margin-right: 5px;
1973         font-style: bold;
1974         border-radius: 5px;
1975                 -moz-border-radius: 5px;
1976                 -webkit-border-radius: 5px;
1977 }
1978
1979 #photo-top-links a {
1980         color: #efefef;
1981 }
1982
1983 #photo-top-links:hover {
1984         background-color: #1873a2;
1985 }
1986
1987 #photo-top-links:active {
1988         background-color: #1873a2;
1989 }
1990
1991 .photo-album-image-wrapper {
1992         float: left;
1993         margin: 0px 10px 10px 0px;
1994         padding-bottom: 30px;
1995         position: relative;
1996 }
1997
1998 .photo-top-image-wrapper {
1999         float: left;
2000         width: 180px;
2001         height: 180px;
2002         margin: 0px 10px 10px 0px;
2003         padding-bottom: 30px;
2004         position: relative;
2005 }
2006
2007 #photo-album-wrapper-inner {
2008         position: relative;
2009         float: left;
2010         width: 180px;
2011         height: 180px;
2012         overflow: hidden;
2013 }
2014
2015 #photo-photo {
2016         max-width: 85%;
2017         height: auto;
2018 }
2019
2020 #photo-photo img {
2021         max-width: 100%
2022 }
2023
2024 .photo-top-image-wrapper a:hover,
2025 #photo-photo a:hover,
2026 .photo-album-image-wrapper a:hover {
2027         border-bottom: 0px;
2028 }
2029
2030 .photo-top-photo {}
2031 .photo-album-photo {}
2032
2033 .photo-top-album-name {
2034         position: absolute;
2035         bottom: 0px;
2036         padding: 0px 5px;
2037         font-weight: bold;
2038         font-stretch: semi-expanded;
2039 }
2040
2041 .photo-top-album-name a {
2042         text-align: center;
2043         color: #6e6e6e;
2044 }
2045 .caption {
2046         position: absolute;
2047         bottom: 0px;
2048         margin: 0px 5px;
2049         text-align: center;
2050         color: #6e6e6e;
2051         font-size: 0.9em;
2052 }
2053
2054 #photo-photo {
2055         position: relative;
2056         float: left;
2057 }
2058
2059 #photo-caption {
2060         margin-top: 10px;
2061         color: #6E6E6E;
2062         font-size: 1.1em;
2063 }
2064
2065 #photo-photo-end {
2066         clear: both;
2067 }
2068
2069 #photo-prev-link,
2070 #photo-next-link {
2071         position: absolute;
2072         width: 10%;
2073         height: 100%;
2074         background-color: rgba(255,255,255,0.2);
2075         opacity: 0;
2076         transition: all 0.2s ease-in-out;
2077                 -webkit-transition: all 0.2s ease-in-out;
2078                 -moz-transition: all 0.2s ease-in-out;
2079         background-position: center center;
2080         background-repeat: no-repeat;
2081 }
2082
2083 #photo-prev-link {
2084         left: 0px;
2085         top: 0px;
2086         background-image: url('prev.png');
2087 }
2088
2089 #photo-next-link {
2090         right: 0px;
2091         top: 0px;
2092         background-image: url('next.png');
2093 }
2094
2095 #photo-prev-link a,
2096 #photo-next-link a {
2097         display: block;
2098         width: 100%;
2099         height: 100%;
2100         overflow: hidden;
2101         text-indent: -900000px;
2102 }
2103
2104 #photo-prev-link:hover,
2105 #photo-next-link:hover {
2106         opacity: 1;
2107         transition: all 0.2s ease-in-out;
2108                 -webkit-transition: all 0.2s ease-in-out;
2109                 -moz-transition: all 0.2s ease-in-out;
2110 }
2111
2112 #photo-next-link .icon,
2113 #photo-prev-link .icon {
2114         display: none;
2115 }
2116
2117 #photos-upload-spacer,
2118 #photos-upload-new-wrapper,
2119 #photos-upload-exist-wrapper {
2120         margin-bottom: 1em;
2121 }
2122
2123 #photos-upload-existing-album-text,
2124 #photos-upload-newalbum-div {
2125         background-color: #fff;
2126         color: #909090;
2127         font-size: 1.2em;
2128         padding: 3px 0px;
2129         padding-left: 0px;
2130         width: 300px;
2131 }
2132
2133 #photos-upload-album-select,
2134 #photos-upload-newalbum {
2135         width: 400px;
2136 }
2137
2138 #photos-upload-perms-menu {
2139         width: 180px;
2140         padding: 7px;
2141 }
2142
2143 #photos-upload-perms-menu .icon {
2144         display: none;
2145 }
2146
2147 select, input {
2148         border: 1px solid #b0b0b0;
2149         padding: 2px;
2150         border-radius: 3px;
2151                 -moz-border-radius: 3px;
2152                 -webkit-border-radius: 3px;
2153 }
2154
2155 select[size],
2156 select[multiple],
2157 select[size][multiple] {
2158         margin: 5px 0px 10px 0px;
2159 }
2160
2161 select {
2162         -webkit-appearance: menulist;
2163         box-sizing: border-box;
2164         -webkit-box-align: center;
2165         cursor: default;
2166 }
2167
2168 textarea, keygen {
2169         margin-top: 3px;
2170         font-size: 0.9em;
2171         letter-spacing: normal;
2172         word-spacing: normal;
2173         line-height: 1.2em;
2174         text-transform: none;
2175         text-indent: 0px;
2176         text-shadow: none;
2177         display: inline-block;
2178         text-align: -webkit-auto;
2179 }
2180
2181 input {
2182         margin-top: 3px;
2183         margin-right: 10px;
2184         text-align: -webkit-auto;
2185 }
2186
2187 .qq-upload-button {
2188         border-radius: 5px;
2189                 -moz-border-radius: 5px;
2190                 -webkit-border-radius: 5px;
2191 }
2192
2193 #album-edit-link {
2194         width: 70px;
2195         margin-bottom: 20px;
2196         margin-top: 20px;
2197         background-color: #a2a2a2;
2198         color: #eeeeec;
2199         padding: 5px 10px 5px 10px;
2200         margin-right: 5px;
2201         font-style: bold;
2202         border-radius: 5px;
2203                 -moz-border-radius: 5px;
2204                 -webkit-border-radius: 5px;
2205 }
2206
2207 #album-edit-link  a {
2208         color: #efefef;
2209 }
2210
2211 #album-edit-link:hover {
2212         background-color: #1873a2;
2213 }
2214
2215 #photo-edit-link-wrap {
2216         margin-bottom: 10px;
2217 }
2218
2219 #photo_edit_form {
2220         width: 500px;
2221         margin-top: 20px;
2222         text-align: left;
2223 }
2224
2225 input #photo_edit_form {
2226         display: block;
2227         width: 100%;
2228 }
2229
2230 #photo-edit-perms-menu {
2231         float: left;
2232         display: inline;
2233         margin-top: 10px;
2234         margin-right: 10px;
2235         padding: 4px;
2236         width: 100px;
2237 }
2238
2239 #photo-edit-perms-menu .icon {
2240         display: none;
2241 }
2242
2243 #photo-edit-delete-button {
2244         float: left;
2245         display: inline;
2246         margin-left: 190px;
2247 }
2248
2249 #photo-album-edit-wrapper {
2250         margin-bottom: 10px;
2251 }
2252
2253 /* ============ */
2254 /* = Messages = */
2255 /* ============ */
2256
2257 #prvmail-wrapper,
2258 .mail-conv-detail,
2259 .mail-list-detail {
2260         position: relative;
2261         width: 500px;
2262         padding: 50px;
2263         margin: 20px auto;
2264         background-color: #fff;
2265         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2266         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2267         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2268 }
2269
2270 #prvmail-wrapper:before,
2271 #prvmail-wrapper:after,
2272 .mail-conv-detail:before,
2273 .mail-conv-detail:after,
2274 .mail-list-detail:before,
2275 .mail-list-detail:after {
2276         position: absolute;
2277         width: 40%;
2278         height: 10px;
2279         content: ' ';
2280         left: 12px;
2281         bottom: 12px;
2282         background: transparent;
2283         transform: skew(-5deg) rotate(-5deg);
2284                 -webkit-transform: skew(-5deg) rotate(-5deg);
2285                 -moz-transform: skew(-5deg) rotate(-5deg);
2286                 -ms-transform: skew(-5deg) rotate(-5deg);
2287                 -o-transform: skew(-5deg) rotate(-5deg);
2288         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2289                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2290                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2291         z-index: -1;
2292 }
2293
2294 #prvmail-wrapper:after,
2295 .mail-conv-detail:after,
2296 .mail-list-detail:after {
2297         left: auto;
2298         right: 12px;
2299         transform: skew(5deg) rotate(5deg);
2300                 -webkit-transform: skew(5deg) rotate(5deg);
2301                 -moz-transform: skew(5deg) rotate(5deg);
2302                 -ms-transform: skew(5deg) rotate(5deg);
2303                 -o-transform: skew(5deg) rotate(5deg);
2304 }
2305
2306 .prvmail-text {
2307         width: 100%;
2308 }
2309
2310 #prvmail-form input
2311
2312 #prvmail-subject {
2313         width: 490px;
2314         padding-left: 10px;
2315         font-size: 1.1em;
2316         font-style: bold;
2317 }
2318
2319 #prvmail-subject .input {
2320         border: none !important;
2321 }
2322
2323 #prvmail-subject-label {}
2324
2325 #prvmail-to {
2326         padding-left: 10px;
2327 }
2328
2329 #prvmail-to-label {}
2330
2331 #prvmail-message-label {
2332         font-size: 1em;
2333 }
2334
2335 #prvmail-submit-wrapper {
2336         margin-top: 10px;
2337 }
2338
2339 #prvmail-submit {
2340         float: right;
2341         margin-top: 0px;
2342         margin-right: 0px;
2343 }
2344
2345 #prvmail-upload {
2346 margin-left: 0px;
2347 }
2348
2349 #prvmail-submit-wrapper > div {
2350         margin-right: 5px;
2351         float: left;
2352 }
2353
2354 .mail-list-outside-wrapper {
2355         margin-top: 20px;
2356 }
2357
2358 .mail-list-sender {
2359         float: left;
2360         padding: 2px;
2361         background-color: #efefef;
2362         border: 1px solid #C5C5C5;
2363         border-radius: 3px;
2364                 -moz-border-radius: 3px;
2365                 -webkit-border-radius: 3px;
2366         box-shadow: 0 0 8px #BDBDBD;
2367                 -moz-box-shadow: 3px 3px 4px #959494;
2368                 -webkit-box-shadow: 3px 3px 4px #959494;
2369 }
2370
2371 .mail-list-detail {
2372         margin-left: 100px;
2373         width: 600px;
2374         min-height: 70px;
2375         padding: 20px;
2376         padding-top: 10px;
2377         border: 1px solid #dddddd;
2378 }
2379
2380 .mail-list-sender-name {
2381         font-size: 1.1em;
2382         display: inline;
2383 }
2384
2385 .mail-list-date {
2386         float: right;
2387         clear: block;
2388         display: inline;
2389         font-size: 0.9em;
2390         padding-left: 10px;
2391         font-stretch: ultra-condensed;
2392 }
2393
2394 .mail-list-subject {
2395         clear: block;
2396         font-size: 1.2em;
2397         padding-top: 20px;
2398         padding-right: 50px;
2399 }
2400
2401 .mail-list-subject a {
2402         color: #626262;
2403 }
2404
2405 .mail-list-delete-wrapper {
2406         float: right;
2407 }
2408
2409 .mail-list-outside-wrapper-end {
2410         clear: both;
2411 }
2412
2413 .mail-conv-outside-wrapper {
2414         margin-bottom: 10px;
2415         margin-top: 30px;
2416 }
2417
2418 .mail-conv-sender {
2419         float: left;
2420         margin: 0px 5px 5px 0px;
2421 }
2422
2423 .mail-conv-sender-photo {
2424         width: 64px;
2425         height: 64px;
2426 }
2427
2428 .mail-conv-sender-name {
2429         float: left;
2430         font-style: bold;
2431 }
2432
2433 .mail-conv-date {
2434         float: right;
2435 }
2436
2437 .mail-conv-subject {
2438         clear: right;
2439         font-weight: bold;
2440         font-size: 1.2em;
2441 }
2442
2443 .mail-conv-body {
2444         clear: both;
2445 }
2446
2447 .mail-conv-detail {
2448         width: 500px;
2449         padding: 20px;
2450         padding-bottom: 20px;
2451         margin-left: 20px;
2452         margin-bottom: 0px;
2453         vertical-align: middle;
2454         margin: auto;
2455         border: 1px solid #dddddd;
2456 }
2457
2458 .mail-conv-break {
2459         display: none;
2460         border: none;
2461 }
2462
2463 .mail-conv-delete-wrapper {
2464         padding-top: 10px;
2465         width: 510px;
2466         text-align: right;
2467 }
2468
2469 #prvmail-subject {
2470         font-weight: bold;
2471         border: 1px solid #dddddd;
2472 }
2473
2474 /* ================= */
2475 /* = Notifications = */
2476 /* ================= */
2477
2478 #notification-show-hide-wrapper {
2479         width: 160px;
2480         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2481                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2482                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2483         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2484         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2485         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2486         background-color: #bdbdbd;
2487         border-radius: 5px;
2488                 -moz-border-radius: 5px;
2489                 -webkit-border-radius: 5px;
2490         padding: 5px 10px 5px 10px;
2491         margin-right: 5px;
2492         margin-top: 10px;
2493         font-style: bold;
2494         color: #efefef;
2495         text-align: center;
2496 }
2497
2498 #notification-show-hide-wrapper:hover {
2499         color: #efefef;
2500         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2501         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2502         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2503         background-color: #1873a2;
2504 }
2505
2506 #notification-show-hide-wrapper:active {
2507         background-color: #1873a2;
2508         position: relative;
2509         top: 1px;
2510 }
2511
2512 #notification-show-hide-wrapper a {
2513         color: #efefef;
2514 }
2515
2516 /* ============ */
2517 /* = Contacts = */
2518 /* ============ */
2519
2520 #contacts-main {
2521         margin-bottom: 10px;
2522 }
2523
2524 .contact-wrapper {
2525         float: left;
2526         width: 150px;
2527         height: 150px;
2528         overflow: auto;
2529 }
2530
2531 .view-contact-wrapper,
2532 .contact-entry-wrapper {
2533         float: left;
2534         margin-right: 30px;
2535         margin-bottom: 20px;
2536         width: 88px;
2537         height: 120px;
2538         position: relative;
2539 }
2540
2541 #view-contact-end {
2542         clear: both;
2543 }
2544
2545 #viewcontacts {
2546         margin-top: 15px;
2547 }
2548
2549 .contact-entry-direction-wrapper {
2550         position: absolute;
2551         top: 20px;
2552 }
2553
2554 .contact-entry-edit-links {
2555         position: absolute;
2556         top: 60px;
2557 }
2558
2559 #contacts-show-hide-link {
2560         margin-bottom: 20px;
2561         margin-top: 10px;
2562         font-weight: bold;
2563 }
2564
2565 .contact-entry-name {
2566         width: 100px;
2567         overflow: hidden;
2568         font: #999;
2569         font-size: 12px;
2570         text-align: center;
2571         font-weight: bold;
2572         margin-top: 5px;
2573 }
2574
2575 .contact-entry-photo {
2576         position: relative;
2577 }
2578
2579 .contact-entry-edit-links .icon {
2580         border: 1px solid #babdb6;
2581         border-radius: 3px;
2582                 -webkit-border-radius: 3px;
2583                 -moz-border-radius: 3px;
2584         background-color: #ffffff;
2585 }
2586
2587 #contact-edit-banner-name {
2588         font-size: 1.5em;
2589         margin-left: 30px;
2590 }
2591
2592 #contact-edit-update-now {
2593         padding: 7px;
2594         width: 165px;
2595         margin: auto;
2596         margin-left: 40px;
2597         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2598                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2599                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2600         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2601         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2602         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2603         background-color: #bdbdbd;
2604         border-radius: 5px;
2605                 -moz-border-radius: 5px;
2606                 -webkit-border-radius: 5px;
2607         display: inline-block;
2608         color: #efefef;
2609         text-decoration: none;
2610         text-align: center;
2611 }
2612
2613 #contact-edit-update-now:hover {
2614         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2615         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2616         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2617         background-color: #1873a2;
2618 }
2619
2620 #contact-edit-update-now:active {
2621         position: relative;
2622         top: 1px;
2623 }
2624
2625 #contact-edit-update-now a {
2626         color: #efefef;
2627         font-size: 14px;
2628         text-align: center;
2629         margin: auto;
2630 }
2631
2632 #contact-edit-info-wrapper,
2633 #contact-edit-info-end,
2634 #contact-edit-profile-select-text,
2635 #contact-edit-profile-select-end,
2636 #contact-edit-poll-wrapper,
2637 #contact-edit-end {
2638 }
2639
2640 .contact-edit-submit {
2641 }
2642
2643 #contact-profile-selector {
2644 }
2645
2646 .contact-photo-menu-button {
2647         position: absolute;
2648         background-image: url("photo-menu.jpg");
2649         background-position: top left;
2650         background-repeat: no-repeat;
2651         margin: 10px 0 0 0;
2652         padding: 0px;
2653         width: 16px;
2654         height: 16px;
2655         top: 64px; left:0px;
2656         overflow: hidden;
2657         text-indent: 40px;
2658         display: none;
2659 }
2660
2661 .contact-photo-menu {
2662         width: auto;
2663         border: 1px solid #ddd;
2664         background: #f1f1f1;
2665         position: absolute;
2666         left: 0px;
2667         top: 90px;
2668         display: none;
2669         z-index: 10000;
2670         box-shadow: 3px 3px 5px #888;
2671                 -moz-box-shadow: 3px 3px 5px #888;
2672                 -webkit-box-shadow: 3px 3px 5px #888;
2673 }
2674
2675 .contact-photo-menu ul {
2676         margin: 0px;
2677         padding: 0px;
2678         list-style: none;
2679 }
2680
2681 .contact-photo-menu li a {
2682         display: block;
2683         padding: 3px;
2684         color: #626262;
2685         font-size: 1em;
2686 }
2687
2688 .contact-photo-menu li a:hover {
2689         color: #FFFFFF;
2690         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2691         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2692         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2693         background-color: #1873a2;
2694         text-decoration: none;
2695 }
2696
2697 .view-contact-name {}
2698
2699 #div.side-link {
2700         background-color: #efefef;
2701         padding: 10px;
2702         margin-top: 20px;
2703 }
2704
2705 #follow-sidebar {
2706         margin-bottom: 80px;
2707 }
2708
2709 #follow-sidebar h3:before {
2710         content: url("user.png");
2711         padding-right: 10px;
2712         vertical-align: middle;
2713 }
2714
2715 #follow-sidebar input[type="text"] {
2716         margin-left: 3px;
2717         margin-bottom: 10px;
2718 }
2719
2720 #side-follow-submit {
2721         width: 178px;
2722         margin: 10px;
2723         text-align: center;
2724 }
2725
2726 #side-match-link {
2727         width: 158px;
2728         padding: 10px;
2729         margin: auto 10px 20px;
2730         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2731         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2732         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2733         background-color: #bdbdbd;
2734         padding: 5px 10px 5px 10px;
2735         color: #efefef;
2736         font-size: 1.1em;
2737         text-align: center;
2738         border: 1px solid #7C7D7B;
2739         border-radius: 5px;
2740                 -moz-border-radius: 5px;
2741                 -webkit-border-radius: 5px;
2742 }
2743
2744 #side-match-link:hover {
2745         color: #efefef;
2746         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2747         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2748         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2749         background-color: #1873a2;
2750         border: 1px solid #7C7D7B;
2751         box-shadow: 0 0 8px #BDBDBD;
2752                 -moz-box-shadow: 3px 3px 4px #959494;
2753                 -webkit-box-shadow: 3px 3px 4px #959494;
2754         border-radius: 5px;
2755                 -moz-border-radius: 5px;
2756                 -webkit-border-radius: 5px;
2757 }
2758
2759 #side-match-link:active {
2760         background-color: #1873a2;
2761         position: relative;
2762         top: 1px;
2763 }
2764
2765 #side-match-link a {
2766         color: #efefef;
2767 }
2768
2769 #side-invite-link {
2770         width: 80%;
2771         padding: 10px;
2772         margin: auto;
2773         margin-bottom: 20px;
2774         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2775         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2776         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2777         background-color: #bdbdbd;
2778         padding: 5px 10px 5px 10px;
2779         color: #efefef;
2780         font-size: 1.1em;
2781         text-align: center;
2782         border: 1px solid #7C7D7B;
2783         border-radius: 5px;
2784                 -moz-border-radius: 5px;
2785                 -webkit-border-radius: 5px;
2786 }
2787
2788 #side-invite-link:hover {
2789         color: #efefef;
2790         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2791         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2792         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2793         background-color: #1873a2;
2794         border: 1px solid #7C7D7B;
2795         box-shadow: 0 0 8px #BDBDBD;
2796                 -moz-box-shadow: 3px 3px 4px #959494;
2797                 -webkit-box-shadow: 3px 3px 4px #959494;
2798         border-radius: 5px;
2799                 -moz-border-radius: 5px;
2800                 -webkit-border-radius: 5px;
2801 }
2802
2803
2804 #side-invite-link:active {
2805         background-color: #1873a2;
2806         position: relative;
2807         top: 1px;
2808 }
2809
2810 #side-invite-link a {
2811         color: #efefef;
2812 }
2813
2814 #side-suggest-link {
2815         width: 80%;
2816         padding: 10px;
2817         margin: auto;
2818         margin-bottom: 20px;
2819         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2820         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2821         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2822         background-color: #bdbdbd;
2823         padding: 5px 10px 5px 10px;
2824         color: #efefef;
2825         font-size: 1.1em;
2826         text-align: center;
2827         border: 1px solid #7C7D7B;
2828         border-radius: 5px;
2829                 -moz-border-radius: 5px;
2830                 -webkit-border-radius: 5px;
2831 }
2832
2833 #side-suggest-link:hover {
2834         color: #efefef;
2835         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2836         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2837         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2838         background-color: #1873a2;
2839         border: 1px solid #7C7D7B;
2840         box-shadow: 0 0 8px #BDBDBD;
2841                 -moz-box-shadow: 3px 3px 4px #959494;
2842                 -webkit-box-shadow: 3px 3px 4px #959494;
2843         border-radius: 5px;
2844                 -moz-border-radius: 5px;
2845                 -webkit-border-radius: 5px;
2846 }
2847
2848 #side-suggest-link:active {
2849         background-color: #1873a2;
2850         position: relative;
2851         top: 1px;
2852 }
2853
2854 #side-suggest-link a {
2855         color: #efefef;
2856 }
2857
2858 #invite-message,
2859 #invite-recipients,
2860 #invite-recipient-text {
2861         padding: 10px;
2862 }
2863
2864 #side-follow-wrapper {
2865         font-size: 1em;
2866         font-weight: bold;
2867         font-stretch: semi-expanded;
2868         background-color: #f3f3f3;
2869         border: 1px solid #cdcdcd;
2870         padding: 10px;
2871         margin-top: 20px;
2872         border-radius: 5px;
2873                 -moz-border-radius: 5px;
2874                 -webkit-border-radius: 5px;
2875 }
2876
2877 #side-follow-wrapper label{
2878         font-size: 1.1em;
2879         font-variant: normal;
2880 }
2881
2882 #contact-suggest {
2883         float: left;
2884         margin-left: 10px;
2885         width: 120px;
2886         padding: 10px;
2887         margin-bottom: 20px;
2888         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2889                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2890                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2891         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2892         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2893         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2894         background-color: #bdbdbd;
2895         border-radius: 5px;
2896                 -moz-border-radius: 5px;
2897                 -webkit-border-radius: 5px;
2898         padding: 5px 10px 5px 10px;
2899         color: #efefef;
2900         font-size: 1.2em;
2901         text-align: center;
2902 }
2903
2904 #contact-suggest:hover {
2905         color: #efefef;
2906         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2907         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2908         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2909         background-color: #1873a2;
2910 }
2911
2912 #contact-suggest:active {
2913         background-color: #1873a2;
2914         position: relative;
2915         top: 1px;
2916 }
2917
2918 #contact-suggest a {
2919         color: #efefef;
2920 }
2921
2922 .crepair-label {
2923         margin-top: 10px;
2924         float: left;
2925         width: 250px;
2926 }
2927
2928 .crepair-input {
2929         margin-top: 10px;
2930         float: left;
2931         width: 200px;
2932 }
2933
2934 /* ===================================== */
2935 /* = Register, Settings, Profile Forms = */
2936 /* ===================================== */
2937
2938 #id_openid_url,
2939 .openid input {
2940         background: url(login-bg.gif) no-repeat;
2941         background-position: 0 50%;
2942         padding-left: 18px;
2943         width: 250px!important;
2944 }
2945
2946 .openid:hover {
2947 }
2948
2949 #profile-tabs-wrapper {
2950         padding-top: 10px;
2951 }
2952
2953 #profile-tab-status-link {
2954         border: 0px;
2955         padding: 5px 10px 5px 10px;
2956         font-style: bold;
2957 }
2958
2959 #uexport-link a {
2960         color: #efefef;
2961 }
2962
2963 #profile-tab-profile-link {
2964         border: 0px;
2965         padding: 5px 10px 5px 10px;
2966 }
2967
2968 #uexport-link {
2969         width: 140px;
2970         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2971                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2972                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2973         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2974         background: -moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2975         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2976         background-color: #7c7d7b;
2977         border-radius: 5px;
2978                 -moz-border-radius: 5px;
2979                 -webkit-border-radius: 5px;
2980         padding: 5px 10px 5px 10px;
2981         margin-bottom: 10px;
2982 }
2983
2984 #uexport-link:hover {
2985         color: #efefef;
2986         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
2987         background: -moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
2988         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
2989         background-color: #555753;
2990 }
2991
2992 #uexport-link:active {
2993         color: #efefef;
2994         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2995         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2996         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2997         background-color: #1873a2;
2998         position: relative;
2999         top: 1px;
3000 }
3001
3002 #settings-default-perms .fakelink {
3003         color: #efefef;
3004 }
3005
3006 #settings-default-perms {
3007         width: 260px;
3008         text-align: center;
3009         color: #EFEFEF;
3010         padding: 5px 10px 5px 10px;
3011         margin-bottom: 10px;
3012         background-color: #BDBDBD;
3013         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
3014         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3015         border: 1px solid #7C7D7B;
3016         border-radius: 5px;
3017                 -moz-border-radius: 5px;
3018                 -webkit-border-radius: 5px;
3019 }
3020
3021 #settings-default-perms:hover {
3022         color: #efefef;
3023         background-color: #555753;
3024         border: 1px solid #7C7D7B;
3025         box-shadow: 0 0 8px #BDBDBD;
3026                 -moz-box-shadow: 3px 3px 4px #959494;
3027                 -webkit-box-shadow: 3px 3px 4px #959494;
3028         border-radius: 5px;
3029                 -moz-border-radius: 5px;
3030                 -webkit-border-radius: 5px;
3031 }
3032
3033 #settings-default-perms:active {
3034         color: #efefef;
3035         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3036         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3037         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3038         background-color: #1873a2;
3039         position: relative;
3040         top: 1px;
3041 }
3042
3043 #settings-nickname-desc {
3044         width: 80%;
3045         background-color: #efefef;
3046         margin-top: 10px;
3047         margin-bottom: 10px;
3048         border-radius: 5px;
3049                 -webkit-border-radius: 5px;
3050                 -moz-border-radius: 5px;
3051         padding: 10px;
3052 }
3053
3054 #register-form div {
3055         clear: both;
3056 }
3057
3058 #profile-edit-form div {
3059         margin-bottom: 5px;
3060 }
3061
3062 #profile-edit-form div[id$='desc'] {
3063         font-size: 0.8em;
3064         margin-left: 2%;
3065 }
3066
3067 #register-form label,
3068 #profile-edit-form label {
3069         width: 575px;
3070         float: right;
3071         margin-right: 155px;
3072 }
3073
3074 #register-form span {
3075         color: #555753;
3076         display: block;
3077         margin-bottom: 20px;
3078 }
3079
3080 .settings-submit,
3081 .settings-submit-wrapper,
3082 .profile-edit-submit-wrapper {
3083         margin: 30px 0px;
3084 }
3085
3086 .profile-listing,
3087 .profile-listing-end {
3088         float: left;
3089         clear: both;
3090         margin: 20px 20px 0px 0px;
3091 }
3092
3093
3094 #register-sitename {
3095         display: inline;
3096         font-weight: bold;
3097 }
3098
3099 #register-submit-button {
3100         margin-top: 10px;
3101 }
3102
3103 #label-register-name,
3104 #label-register-email,
3105 #label-register-nickname,
3106 #label-register-openid {
3107         float: left;
3108         width: 350px;
3109         margin-top: 10px;
3110 }
3111
3112 #register-name,
3113 #register-email,
3114 #register-nickname {
3115         float: left;
3116         margin-top: 10px;
3117         width: 150px;
3118 }
3119
3120 #register-openid {
3121         float: left;
3122         margin-top: 10px;
3123         width: 130px;
3124 }
3125
3126 #register-fill-ext {
3127         margin-bottom: 25px;
3128 }
3129
3130 #register-name-end,
3131 #register-email-end,
3132 #register-nickname-end,
3133 #register-submit-end,
3134 #register-openid-end {
3135         clear: both;
3136 }
3137
3138 #register-nickname-desc {
3139         margin-top: 30px;
3140         width: 650px;
3141 }
3142
3143 /* ===================== */
3144 /* = Contacts Selector = */
3145 /* ===================== */
3146
3147 #group-edit-wrapper {
3148         margin-bottom: 10px;
3149 }
3150
3151 #group-edit-name-wrapper {
3152         margin-bottom: 0px;
3153         display: inline;
3154 }
3155 #group-edit-submit-wrapper {
3156         margin-bottom: 10px;
3157         margin-right: 400px;
3158         float: right;
3159         display: inline;
3160 }
3161
3162 .group-delete-wrapper {
3163         width: 90px;
3164         display: inline;
3165         padding: 5px;
3166         margin-bottom: 10px;
3167         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3168                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3169                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3170         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3171         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3172         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3173         background-color: #bdbdbd;
3174         border-radius: 5px;
3175                 -moz-border-radius: 5px;
3176                 -webkit-border-radius: 5px;
3177 }
3178
3179 .group-delete-wrapper:hover {
3180         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3181         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3182         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3183         background-color: #1873a2;
3184 }
3185
3186 .group-delete-wrapper:active {
3187         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3188         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3189         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3190         background-color: #1873a2;
3191 }
3192
3193 .group-delete-wrapper a {
3194         color: #efefef;
3195         font-size: 0.9em;
3196 }
3197
3198 #group-edit-desc {
3199         margin: 10px 0xp;
3200 }
3201
3202 #group-new-text {
3203         font-size: 1.1em;
3204 }
3205
3206 #group-members,
3207 #prof-members {
3208         width: 83%;
3209         height: 200px;
3210         overflow: auto;
3211         border: none;
3212         background-color: #f0edf0;
3213         color: #555753;
3214         border: 1px solid #ccc;
3215         margin-bottom: 10px;
3216         padding: 10px;
3217 }
3218
3219 #group-all-contacts,
3220 #prof-all-contacts {
3221         width: 83%;
3222         height: 200px;
3223         overflow: auto;
3224         border: 1px solid #ccc;
3225         background-color: #f0edf0;
3226         padding: 10px;
3227 }
3228
3229 #group-members h3,
3230 #group-all-contacts h3,
3231 #prof-members h3,
3232 #prof-all-contacts h3 {
3233         color: #555753;
3234         margin: 0px;
3235         padding: 5px;
3236 }
3237
3238 #group-separator,
3239 #prof-separator {
3240         display: none;
3241 }
3242
3243 /* ========== */
3244 /* = Events = */
3245 /* ========== */
3246
3247 #events-reminder {}
3248
3249 .clear {
3250         clear: both;
3251         margin-top: 10px;
3252 }
3253
3254 .eventcal {
3255         float: left;
3256         font-size: 20px;
3257         padding: 20px;
3258 }
3259
3260 .vevent {
3261         position: relative;
3262         width: 400px;
3263         padding: 20px;
3264         padding-top: 10px;
3265         margin: 0 0px;
3266         margin-bottom: 10px;
3267         background-color: #fff;
3268         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3269                 -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3270                 -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3271 }
3272
3273 .vevent:before,
3274 .vevent:after {
3275         position: absolute;
3276         width: 40%;
3277         height: 10px;
3278         content: ' ';
3279         left: 12px;
3280         bottom: 12px;
3281         background: transparent;
3282         transform: skew(-5deg) rotate(-5deg);
3283                 -webkit-transform: skew(-5deg) rotate(-5deg);
3284                 -moz-transform: skew(-5deg) rotate(-5deg);
3285                 -ms-transform: skew(-5deg) rotate(-5deg);
3286                 -o-transform: skew(-5deg) rotate(-5deg);
3287         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3288                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3289                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3290         z-index: -1;
3291 }
3292
3293 .vevent:after {
3294         left: auto;
3295         right: 12px;
3296         transform: skew(5deg) rotate(5deg);
3297                 -webkit-transform: skew(5deg) rotate(5deg);
3298                 -moz-transform: skew(5deg) rotate(5deg);
3299                 -ms-transform: skew(5deg) rotate(5deg);
3300                 -o-transform: skew(5deg) rotate(5deg);
3301 }
3302
3303 .vevent .event-description {
3304         margin-left: 10px;
3305         margin-right: 10px;
3306         text-align: center;
3307         font-size: 1.2em;
3308         font-weight: bolder;
3309 }
3310
3311 .vevent .event-location {
3312         margin-left: 10px;
3313         margin-right: 10px;
3314         font-size: 1em;
3315         font-style: oblique;
3316         text-align: center;
3317 }
3318
3319 .vevent .event-start,
3320 .vevent .event-end  {
3321         margin-left: 20px;
3322         margin-right: 20px;
3323         margin-bottom: 2px;
3324         margin-top: 2px;
3325         font-size: 0.9em;
3326         text-align: left;
3327 }
3328
3329 #new-event-link {
3330         width: 130px;
3331         padding: 7px;
3332         margin-bottom: 10px;
3333         margin-left: 170px;
3334         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3335                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3336                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3337         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3338         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3339         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3340         background-color: #bdbdbd;
3341         border-radius: 5px;
3342                 -moz-border-radius: 5px;
3343                 -webkit-border-radius: 5px;
3344         color: #efefef;
3345 }
3346
3347 #new-event-link:hover {
3348         color: #efefef;
3349         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3350         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3351         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3352         background-color: #1873a2;
3353 }
3354
3355 #new-event-link:active {
3356         background-color: #1873a2;
3357         position: relative;
3358         top: 1px;
3359 }
3360
3361 #new-event-link a {
3362         color: #efefef;
3363         text-align: center;
3364 }
3365
3366 .edit-event-link, .plink-event-link {
3367         float: left;
3368         margin-top: 4px;
3369         margin-right: 4px;
3370         margin-bottom: 15px;
3371 }
3372
3373 .event-description:before {
3374         content: url('calendar.png');
3375         margin-right: 15px;
3376         vertical-align: middle;
3377 }
3378
3379 .event-start,
3380 .event-end {
3381         margin-left: 10px;
3382         width: 330px;
3383 }
3384
3385 .event-start .dtstart,
3386 .event-end .dtend {
3387         float: right;
3388 }
3389
3390 .event-list-date {
3391         color: #626262;
3392         margin-bottom: 10px;
3393         font-stretch: condensed;
3394 }
3395
3396 .prevcal,
3397 .nextcal {
3398         float: left;
3399         margin-left: 32px;
3400         margin-right: 32px;
3401         margin-top: 64px;
3402 }
3403
3404 .event-calendar-end {
3405         clear: both;
3406 }
3407
3408 .calendar {
3409         width: 300px;
3410         font-family: Helvetica, Arial, sans-serif;
3411         background-color: #f1f1f1;
3412         border: 1px solid #dedede;
3413         margin-bottom: 10px;
3414         box-shadow: 5px 5px 8px #959494;
3415                 -moz-box-shadow: 5px 5px 8px #959494;
3416                 -webkit-box-shadow: 5px 5px 8px #959494;
3417 }
3418
3419 .calendar caption {
3420         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
3421         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
3422         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
3423         background-color: #1873a2;
3424         padding: 10px 0px 10px 0px;
3425         width: 300px;
3426         color: #ffffff;
3427         font-weight: bold;
3428         text-align: center;
3429         box-shadow: 5px 2px 8px #959494;
3430                 -moz-box-shadow: 5px 2px 8px #959494;
3431                 -webkit-box-shadow: 5px 2px 8px #959494;
3432 }
3433
3434 .calendar td {
3435         font-size: 14px;
3436         text-align: center;
3437         padding: 3px 0px;
3438 }
3439
3440 .calendar td > a {
3441         background-color: #cdcdcd;
3442         padding: 2px;
3443         color: #000000;
3444 }
3445
3446 .calendar th {
3447         font-size: 16px;
3448 }
3449
3450 .today {
3451         font-weight: bold;
3452         text-align: center;
3453         background-color: #1873a2;
3454         color: #ffffff;
3455 }
3456
3457 #event-start-text,
3458 #event-finish-text {
3459         margin-top: 10px;
3460         margin-bottom: 5px;
3461 }
3462
3463 #event-nofinish-checkbox,
3464 #event-nofinish-text,
3465 #event-adjust-checkbox,
3466 #event-adjust-text,
3467 #event-share-checkbox {
3468         float: left;
3469 }
3470
3471 #event-datetime-break {
3472         margin-bottom: 10px;
3473 }
3474
3475 #event-nofinish-break,
3476 #event-adjust-break,
3477 #event-share-break {
3478         clear: both;
3479 }
3480
3481 #event-desc-text,
3482 #event-location-text {
3483         margin-top: 10px;
3484         margin-bottom: 5px;
3485 }
3486
3487 #event-submit {
3488         margin-top: 10px;
3489 }
3490
3491 /* ============= */
3492 /* = Directory = */
3493 /* ============= */
3494
3495 .directory-item {
3496         float: left;
3497         margin: 50px 50px 0px 0px;
3498 }
3499
3500 .directory-details {
3501         font-size: 0.9em;
3502         width: 160px;
3503 }
3504
3505 .directory-name {
3506         font-size: 1em;
3507         width: 150px;
3508 }
3509
3510 /* ========= */
3511 /* = Admin = */
3512 /* ========= */
3513
3514 #adminpage {
3515         width: 80%;
3516 }
3517
3518 #pending-update {
3519         float:right;
3520         color: #ffffff;
3521         font-weight: bold;
3522         background-color: #FF0000;
3523         padding: 0em 0.3em;
3524 }
3525
3526 .admin.linklist {
3527         border: 0px; padding: 0px;
3528 }
3529
3530 .admin.link {
3531         list-style-position: inside;
3532         font-size: 1em;
3533         padding: 5px;
3534         width: auto;
3535         margin: 5px;
3536 }
3537
3538 #adminpage dl {
3539         clear: left;
3540         margin-bottom: 2px;
3541         padding-bottom: 2px;
3542         border-bottom: 1px solid black;
3543 }
3544
3545 #adminpage dt {
3546         width: 200px;
3547         float: left;
3548         font-weight: bold;
3549 }
3550
3551 #adminpage dd {
3552         margin-left: 200px;
3553 }
3554 #adminpage h3 {
3555         border-bottom: 1px solid #898989;
3556         margin-bottom: 5px;
3557         margin-top: 10px;
3558 }
3559
3560 #adminpage .submit {
3561         clear:left;
3562 }
3563
3564 #adminpage
3565 #pluginslist {
3566         margin: 0px;
3567         padding: 0px;
3568 }
3569
3570 #adminpage .plugin {
3571         list-style: none;
3572         display: block;
3573         border: 1px solid #888888;
3574         padding: 1em;
3575         margin-bottom: 5px;
3576         clear: left;
3577 }
3578
3579 #adminpage .toggleplugin {
3580         float: left;
3581         margin-right: 1em;
3582 }
3583
3584 #adminpage table {
3585         width: 100%;
3586         border-bottom: 1p solid #000000;
3587         margin: 5px 0px;
3588 }
3589
3590 #adminpage table th {
3591         text-align: left;
3592 }
3593
3594 #adminpage td .icon {
3595         float: left;
3596 }
3597
3598 #adminpage table#users img {
3599         width: 16px;
3600         height: 16px;
3601 }
3602
3603 #adminpage table tr:hover {
3604         background-color: #eeeeee;
3605 }
3606
3607 #adminpage .selectall {
3608         text-align: right;
3609 }
3610
3611 /* =============== */
3612 /* = Form Fields = */
3613 /* =============== */
3614
3615 .field {
3616         width: 90%;
3617 }
3618
3619 .field label {
3620         float: left;
3621         min-width: 120px;
3622         margin: 5px 10px 0 0;
3623 }
3624
3625 .field checkbox {
3626         float: left;
3627         width: 480px;
3628 }
3629
3630 .field input,
3631 .field textarea {
3632         width: 220px;
3633         border: 1px solid #CDCDCD;
3634         border-radius: 5px;
3635                 -moz-border-radius: 5px;
3636                 -webkit-border-radius: 5px;
3637 }
3638
3639 .field textarea {
3640         height: 100px;
3641 }
3642
3643 .field password {
3644         height: 100px;
3645         margin-left: 150px;
3646 }
3647
3648 .field_help {
3649         display: block;
3650         margin-left: 0px;
3651         margin-bottom: 10px;
3652         color: #666666;
3653 }
3654
3655 .field .onoff {
3656         float: left;
3657         width: 80px;
3658 }
3659 .field .onoff a {
3660         display: block;
3661         border: 1px solid #c1c1c1;
3662         background-image: url("../../../images/onoff.jpg");
3663         background-repeat: no-repeat;
3664         padding: 4px 2px 2px 2px;
3665         height: 16px;
3666         text-decoration: none;
3667 }
3668 .field .onoff .off {
3669         border-color: #c1c1c1;
3670         padding-left: 40px;
3671         background-position: left center;
3672         background-color: #cccccc;
3673         color: #666666;
3674         text-align: right;
3675 }
3676
3677 .field .onoff .on {
3678         border-color: #c1c1c1;
3679         padding-right: 40px;
3680         background-position: right center;
3681         background-color: #1873a2;
3682         color: #FFFFFF;
3683         text-align: left;
3684 }
3685
3686 .field .radio .field_help {
3687         margin-left: 0px;
3688 }
3689
3690 /* ========= */
3691 /* = Icons = */
3692 /* ========= */
3693
3694 .sparkle {
3695         cursor: url('lock.cur'), pointer;
3696 }
3697
3698 .icon {
3699         margin-left: 5px;
3700         margin-right: 5px;
3701         display: block;
3702         width: 20px;
3703         height: 20px;
3704         background-image: url("icons.png");
3705 }
3706 .starred {
3707         background-image: url("star.png");
3708         repeat: no-repeat;
3709 }
3710 .unstarred {
3711         background-image: url("premium.png");
3712         repeat: no-repeat;
3713 }
3714
3715 .notify {
3716         background-image: url("notifications.png");
3717         repeat: no-repeat;
3718 }
3719
3720 .border {
3721         border: 1px solid #c1c1c1;
3722         border-radius: 3px;
3723                 -webkit-border-radius: 3px;
3724                 -moz-border-radius: 3px;
3725 }
3726
3727 .article        { background-position: -50px  0px;}
3728 .audio          { background-position: -70px  0px;}
3729 .block          { background-position: -90px  0px;}
3730 .drop           { background-position: -110px 0px;}
3731 .drophide       { background-position: -130px 0px;}
3732 .edit           { background-position: -150px 0px;}
3733 .camera         { background-position: -170px 0px;}
3734 .dislike        { background-position: -190px 0px;}
3735 .like           { background-position: -210px 0px;}
3736 .link           { background-position: -230px 0px;}
3737 .globe          { background-position: -50px  -20px;}
3738 .noglobe        { background-position: -70px  -20px;}
3739 .no             { background-position: -90px  -20px;}
3740 .pause          { background-position: -110px -20px;}
3741 .play           { background-position: -130px -20px;}
3742 .pencil         { background-position: -150px -20px; margin-right: 12px;}
3743 .small-pencil   { background-position: -170px -20px;}
3744 .recycle        { background-position: -190px -20px;}
3745 .remote-link    { background-position: -210px -20px; margin-right: 10px;}
3746 .share          { background-position: -230px -20px;}
3747 .tools          { background-position: -50px  -40px;}
3748 .lock           { background-position: -70px  -40px;}
3749 .unlock         {
3750         background-position: -90px  -40px;
3751         background-image: none;
3752         width: 70px;
3753         height: 20px;
3754 }
3755
3756 .sharePerms {
3757         background-image: url("icons.png");
3758         width: 20px;
3759         height: 20px;
3760         margin: 2px 0px 2px 3px;
3761         display: block;
3762 }
3763
3764 .video          { background-position: -110px -40px;}
3765 .youtube        { background-position: -130px -40px;}
3766 .attach         { background-position: -190px -40px;}
3767 .language       { background-position: -210px -40px;}
3768 .on             { background-position: -50px  -60px;}
3769 .off            { background-position: -70px  -60px;}
3770 .prev           { background-position: -90px  -60px;}
3771 .next           { background-position: -110px -60px;}
3772 .tagged         { background-position: -130px -60px; margin-right: 10px;}
3773 .icon.dim       { opacity: 0.3;filter:alpha(opacity=30);}
3774
3775 .attachtype {
3776         display: block; width: 20px; height: 23px;
3777         background-image: url("../../../images/content-types.png");
3778 }
3779
3780 .type-video { background-position: 0px 0px; }
3781 .type-image { background-position: -20px 0px; }
3782 .type-audio { background-position: -40px 0px; }
3783 .type-text  { background-position: -60px 0px; }
3784 .type-unkn  { background-position: -80px 0px; }
3785
3786 /* ========== */
3787 /* = Footer = */
3788 /* ========== */
3789
3790 .cc-license {
3791         margin-top: 100px;
3792         font-size: 0.7em;
3793 }
3794
3795 footer {
3796         display: block;
3797         margin: 50px 20%;
3798         clear: both;
3799 }
3800
3801
3802 /* ======= */
3803 /* = ACL = */
3804 /* ======= */
3805
3806 #photo-edit-perms-select,
3807 #photos-upload-permissions-wrapper,
3808 #profile-jot-acl-wrapper{
3809         display: block!important;
3810 }
3811
3812 #acl-wrapper {
3813         width: 690px;
3814         float:left;
3815 }
3816 #acl-search {
3817         float:right;
3818         background: #ffffff url("../../../images/search_18.png") no-repeat right center;
3819         padding-right: 20px;
3820 }
3821
3822 #acl-showall {
3823         float: left;
3824         display: block;
3825         font-size: 1em;
3826         font-style: bold;
3827         text-align: center;
3828         padding: 3px;
3829         margin-bottom: 5px;
3830         background-color: #cccccc;
3831         background-position: 7px 7px;
3832         background-repeat: no-repeat;
3833         padding: 5px;
3834         border-radius: 5px;
3835                 -webkit-border-radius: 5px ;
3836                 -moz-border-radius: 5px;
3837         color: #999999;
3838 }
3839
3840 #acl-showall.selected {
3841         color: #ffffff;
3842         background-color: #1873a2;
3843 }
3844
3845 #acl-list {
3846         height: 400px;
3847         border: 1px solid #cccccc;
3848         background-color: #efefef;
3849         clear: both;
3850         margin-top: 30px;
3851         overflow: auto;
3852 }
3853
3854 #acl-list-content {
3855 }
3856
3857 .acl-list-item {
3858         display: block;
3859         width: 155px;
3860         height: 50px;
3861         border: 1px solid #cccccc;
3862         background-color: #fff;
3863         margin: 5px;
3864         float: left;
3865         box-shadow: 2px 2px 3px #c1c1c1;
3866                 -moz-box-shadow: 2px 2px 3px #c1c1c1;
3867                 -webkit-box-shadow: 2px 2px 3px #c1c1c1;
3868 }
3869 .acl-list-item img {
3870         width: 30px;
3871         height: 30px;
3872         float: left;
3873         margin: 5px;
3874 }
3875
3876 .acl-list-item p {
3877         color: #999999;
3878         height: 12px;
3879         font-size: 0.7em;
3880         margin: 0px;
3881         padding: 2px 0px 1px;
3882         overflow: hidden;
3883 }
3884
3885 .acl-list-item a {
3886         font-size: 10px;
3887         display: block;
3888         float: left;
3889         color: #efefef;
3890         background-color: #898989;
3891         background-position: 3px 3px;
3892         background-repeat: no-repeat;
3893         margin: 10px 0 0 5px;
3894         border-radius: 2px;
3895                 -webkit-border-radius: 2px ;
3896                 -moz-border-radius: 2px;
3897         padding: 3px;
3898 }
3899
3900 #acl-wrapper a:hover {
3901         text-decoration: none;
3902         background-color:#1873a2;
3903 }
3904
3905 .acl-button-show.selected {
3906         color: #efefef;
3907         background-color: #1873a2;
3908 }
3909
3910 .acl-button-hide .selected {
3911         color: #efefef;
3912         background-color: #a2a2a2;
3913 }
3914
3915 .acl-list-item.groupshow { border-color: #1873a2; }
3916 .acl-list-item.grouphide { border-color: #a2a2a2; }
3917
3918 /* ========================= */
3919 /* = Global Directory Link = */
3920 /* ========================= */
3921
3922 #global-directory-link {
3923         width: 150px;
3924         padding: 4px;
3925         /*margin-bottom: 10px;*/
3926         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3927         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3928         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3929         background-color: #bdbdbd;
3930         color: #efefef;
3931         text-align: center;
3932         -webkit-padding-start: 0px;
3933         border: 1px solid #7C7D7B;
3934         border-radius: 5px;
3935                 -moz-border-radius: 5px;
3936                 -webkit-border-radius: 5px;
3937 }
3938
3939 #global-directory-link:hover {
3940         color: #efefef;
3941         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3942         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3943         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3944         background-color: #1873a2;
3945         border: 1px solid #7C7D7B;
3946         box-shadow: 0 0 8px #BDBDBD;
3947                 -moz-box-shadow: 3px 3px 4px #959494;
3948                 -webkit-box-shadow: 3px 3px 4px #959494;
3949         border-radius: 5px;
3950                 -moz-border-radius: 5px;
3951                 -webkit-border-radius: 5px;
3952 }
3953
3954 #global-directory-link:active {
3955         background-color: #1873a2;
3956         position: relative;
3957         top: 1px;
3958 }
3959
3960 #global-directory-link a {
3961         color: #efefef;
3962 }
3963
3964 a.active {
3965         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3966         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3967         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3968         background-color: #1873a2;
3969         color: #fec01d;
3970         padding: 5px 10px 5px 10px;
3971         margin-right: 5px;
3972 }
3973
3974 /* notifications popup menu */
3975 .nav-notify {
3976         display: none;
3977         position: absolute;
3978         font-size: 10px;
3979         padding: 1px 3px;
3980         top: 0px;
3981         right: -10px;
3982         min-width: 15px;
3983         text-align: right;
3984 }
3985 .nav-notify.show {
3986         display: block;
3987 }
3988 ul.menu-popup {
3989         position: absolute;
3990         display: none;
3991         width: 10em;
3992         margin: 0px;
3993         padding: 0px;
3994         list-style: none;
3995         z-index: 100000;
3996         top: 40px;
3997 }
3998 #nav-notifications-menu {
3999         width: 320px;
4000         max-height: 400px;
4001         overflow-y: scroll;
4002         overflow-style: scrollbar;
4003         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
4004         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
4005         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
4006         background-color: #a2a2a2;
4007         border-radius: 0px 0px 5px 5px;
4008                 -moz-border-radius: 0px 0px 5px 5px;
4009                 -webkit-border-radius: 0px 0px 5px 5px;
4010         border: 1px solid #9A9A9A;
4011         border-top: none;
4012         box-shadow: 5px 5px 10px #242424;
4013                 -moz-box-shadow: 5px 5px 10px #242424;
4014                 -webkit-box-shadow: 5px 5px 10px #242424;
4015 }
4016
4017 #nav-notifications-menu .contactname {
4018         font-weight: bold;
4019         font-size: 0.9em;
4020 }
4021
4022 #nav-notifications-menu img {
4023         float: left;
4024         margin-right: 5px;
4025 }
4026
4027 #nav-notifications-menu .notif-when {
4028         font-size: 0.8em;
4029         display: block;
4030 }
4031
4032 #nav-notifications-menu li {
4033         padding: 7px 0px 7px 10px;
4034         word-wrap: normal;
4035         border-bottom: 1px solid #626262;
4036 }
4037
4038 #nav-notifications-menu li:hover {
4039         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4040         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4041         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4042         background-color: #1873a2;
4043 }
4044
4045 #nav-notifications-menu a:hover {
4046         text-decoration: underline;
4047 }
4048
4049 .notif-item a {
4050         vertical-align: middle;
4051         color: #626262;
4052         padding-bottom: 7px;
4053 }
4054
4055 .notif-item a:hover {
4056         color: #1873a2;
4057 }
4058
4059 .notif-image {
4060         width: 32px;
4061         height: 32px;
4062         padding: 7px 7px 0px 0px;
4063 }
4064
4065 #jGrowl {
4066         z-index: 20000;
4067 }
4068
4069 /* autocomplete popup */
4070 .acpopup {
4071         max-height: 150px;
4072         overflow: auto;
4073         z-index: 100000;
4074         color: #2e3436;
4075         border-top: 0px;
4076         background: #eeeeee;
4077         border-right: 1px solid #dddddd;
4078         border-left: 1px solid #dddddd;
4079         border-bottom: 1px solid #dddddd;
4080         border-radius: 0px 5px 5px 5px;
4081                 -webkit-border-radius: 0px 5px 5px 5px;
4082                 -moz-border-radius: 0px 5px 5px 5px;
4083         box-shadow: 3px 3px 4px #959494;
4084                 -moz-box-shadow: 3px 3px 4px #959494;
4085                 -webkit-box-shadow: 3px 3px 4px #959494;
4086 }
4087
4088 .acpopupitem {
4089         color: #2e3436;
4090         padding: 4px;
4091         clear:left;
4092 }
4093 .acpopupitem img {
4094         float: left;
4095         margin-right: 4px;
4096 }
4097
4098 .acpopupitem.selected {
4099         color: #efefef;
4100         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4101         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4102         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4103         background-color: #1873a2;
4104         order-bottom: none;
4105 }
4106
4107 .qcomment {
4108         opacity: 0.8;
4109         filter: alpha(opacity=0);
4110         position: relative;
4111         left: 30px;
4112 }
4113
4114 .qcomment:hover {
4115         opacity: 1.0;
4116         filter: alpha(opacity=100);
4117 }
4118
4119 .notify-seen {
4120         background: #000000;
4121 }
4122
4123 /* Pages profile widget ----------------------------------------------------------- */
4124
4125 #page-profile,
4126 #profile-page-list {
4127         margin-left: 45px;
4128 }
4129
4130 #page-profile .title {
4131         font-weight: bold;
4132 }
4133
4134 #profile-vcard-break {
4135         clear: both;
4136 }
4137
4138 #profile-extra-links {
4139         clear: both;
4140         margin-top: 10px;
4141 }
4142
4143 #profile-extra-links ul {
4144         list-style-type: none;
4145         padding: 0px;
4146 }
4147
4148
4149 #profile-extra-links li {
4150         margin-top: 5px;
4151 }
4152
4153 .profile-edit-side-div {
4154         float: right;
4155 }
4156
4157 .profile-edit-side-link {
4158         opacity: 0.3;
4159         filter:alpha(opacity=30);
4160 }
4161 .profile-edit-side-link:hover {
4162         opacity: 1.0;
4163         filter:alpha(opacity=100);
4164 }
4165
4166 /* SCROLL TO TOP
4167 ----------------------------------------------------------- */
4168 #scrollup {
4169         position: fixed;
4170         right: 1px;
4171         bottom: 30px;
4172         z-index: 100;
4173 }
4174
4175 #scrollup a:hover {
4176         text-decoration: none;
4177         border: 0;
4178 }
4179
4180 /* New posts and comments => background color
4181 ----------------------------------------------------------- */
4182 .shiny {
4183         background: #fbfde9;
4184 }
4185
4186 div.wall-item-content-wrapper.shiny {
4187         background-image: url("shiny.png");
4188         background-repeat: repeat-x;
4189 }
4190
4191 /* from default */
4192 #jot-perms-icon,
4193 #profile-location,
4194 #profile-nolocation,
4195 #profile-youtube,
4196 #profile-video,
4197 #profile-audio,
4198 #profile-link,
4199 #profile-title,
4200 #wall-image-upload,
4201 #wall-file-upload,
4202 #profile-upload-wrapper,
4203 #wall-image-upload-div,
4204 #wall-file-upload-div,
4205
4206 .hover,
4207 .focus {
4208         cursor: pointer;
4209 }
4210
4211 hr.line-dots {
4212     background: url("dot.png") repeat-x scroll left center transparent;
4213     border: medium none;
4214 }
4215
4216 .body-tag,
4217 .filesavetags,
4218 .categorytags {
4219         opacity: 0.5;
4220         filter:alpha(opacity=50);
4221 }
4222
4223 .body-tag:hover,
4224 .filesavetags:hover,
4225 .categorytags:hover {
4226         opacity: 1.0 !important;
4227         filter:alpha(opacity=100) !important;
4228 }
4229
4230 .item-select {
4231         opacity: 0.5;
4232         filter:alpha(opacity=10);
4233         float: right;
4234         margin-right: 10px;
4235
4236 }
4237 .item-select:hover,
4238 .checkeditem {
4239         opacity: 1;
4240         filter:alpha(opacity=100);
4241 }
4242
4243 .filer-icon {
4244         display: block; width: 16px; height: 16px;
4245         background-image: url('file.gif');
4246 }
4247
4248 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
4249 [class^="comment-edit-bb"] {
4250         list-style: none;
4251         display: none;
4252         margin: 0px 0 -5px 0px;
4253         padding: 0px;
4254         width: 75%;
4255 }
4256
4257 .body-attach {
4258         margin-top: 10px;
4259 }
4260
4261 .grey {
4262         color: #888888;
4263 }
4264
4265 .location,
4266 .location-label,
4267 .gender-label,
4268 .marital-label,
4269 .homepage-label {
4270         float: left;
4271         text-align: left;
4272         display: block;
4273 }
4274
4275 .adr,
4276 .x-gender,
4277 .marital-text,
4278 .homepage-url {
4279         float: left;
4280         display: block;
4281         margin-left: 8px;
4282 }
4283
4284 #birthday-notice {}
4285 #nav-notifications-template {}
4286 #categories-sidebar {}
4287 #nets-desc {}
4288 #status-tab {}
4289 #page-footer {}
4290 #live-profile {}
4291
4292 .city-state-zip {}
4293 .country-name {}
4294 .locality {}
4295 .region {}
4296 .postal-code {}
4297 .mpfriend {}
4298 .toplevel_item {}
4299
4300 .fc-header,
4301 .fc-view,
4302 .fc-view-basicWeek,
4303 .fc-grid,
4304 .fc-border-separate,
4305 .fc-content {}
4306
4307 div #datebrowse-sidebar.widget {
4308         text-align:center;
4309 }
4310
4311 /* Fakelink */
4312
4313 .fakelink,
4314 .fakelink:visited,
4315 .fakelink:link {
4316         color: #1873a2;
4317         cursor: pointer;
4318         margin-bottom: 10px;
4319         margin-left: 5px;
4320         /*background: url("down.png") no-repeat scroll left center transparent;*/
4321 }
4322
4323 .fakelink:hover {
4324         color: #6da6c4;
4325 }
4326
4327 #id_theme {
4328         margin:10px 10px 0 0;
4329 }
4330
4331 #id_post_newfriend,
4332 #id_post_joingroup,
4333 #id_post_profilechange,
4334 #id_notify1,
4335 #id_notify2,
4336 #id_notify3,
4337 #id_notify4,
4338 #id_notify5,
4339 #id_notify6,
4340 #id_notify7,
4341 #id_notify8,
4342 #id_allow_location {
4343         margin: 6px 0 0 0;
4344 }
4345
4346 #settings-form {}
4347 .select {}
4348 .field_help {
4349         margin: 5px 0 10px;
4350 }
4351
4352 #settings-activity-desc,
4353 #settings-notify-desc {
4354         margin:10px 10px 10px 0;
4355         font-weight: bold;
4356 }
4357
4358 #settings-notifications {
4359         border: 1px solid #7C7D7B;
4360         border-radius: 5px;
4361                 -moz-border-radius: 5px;
4362                 -webkit-border-radius: 5px;
4363         padding:10px;
4364 }
4365
4366 #id_npassword {}
4367
4368 #posted-date-selector {
4369         margin-left: 33px;
4370 }
4371
4372 #hide-comments-page-widget {
4373         margin-left: 40px;
4374 }
4375
4376 #collapsed-comments-page-widget {}
4377
4378 .tool {}
4379
4380 #logo-text {
4381 }
4382
4383 #logo-img {
4384         margin: 3px 0 0 0;
4385 }