view/theme/smoothly/style.css

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