view/theme/smoothly/style.css

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