view/theme/smoothly/style.css

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