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 /* = Poke = */
2698 /* ========== */
2699 #poke-desc {
2700         margin: 5px 0 20px;
2701 }
2702 #poke-wrapper  {
2703         margin: 40px 0 20px;
2704 }
2705 #poke-recipient, #poke-action, #poke-privacy-settings {
2706         margin: 10px 0 30px;
2707 }
2708 #poke-recip-label, #poke-action-label, #prvmail-message-label {
2709         margin: 10px 0 20px;
2710 }
2711 #poke-recip {
2712         float: none;
2713 }
2714
2715 /* ================= */
2716 /* = Notifications = */
2717 /* ================= */
2718
2719 #notification-show-hide-wrapper {
2720         width: 160px;
2721         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2722                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2723                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2724         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2725         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2726         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2727         background-color: #bdbdbd;
2728         border-radius: 5px;
2729                 -moz-border-radius: 5px;
2730                 -webkit-border-radius: 5px;
2731         padding: 5px 10px 5px 10px;
2732         margin-right: 5px;
2733         margin-top: 10px;
2734         font-style: bold;
2735         color: #efefef;
2736         text-align: center;
2737 }
2738
2739 #notification-show-hide-wrapper:hover {
2740         color: #efefef;
2741         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2742         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2743         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2744         background-color: #1873a2;
2745 }
2746
2747 #notification-show-hide-wrapper:active {
2748         background-color: #1873a2;
2749         position: relative;
2750         top: 1px;
2751 }
2752
2753 #notification-show-hide-wrapper a {
2754         color: #efefef;
2755 }
2756
2757 /* ============ */
2758 /* = Contacts = */
2759 /* ============ */
2760
2761 #contacts-main {
2762         margin-bottom: 10px;
2763 }
2764
2765 .contact-wrapper {
2766         float: left;
2767         width: 150px;
2768         height: 150px;
2769         overflow: auto;
2770 }
2771
2772 .view-contact-wrapper,
2773 .contact-entry-wrapper {
2774         float: left;
2775         margin-right: 30px;
2776         margin-bottom: 20px;
2777         width: 88px;
2778         height: 120px;
2779         position: relative;
2780 }
2781
2782 #view-contact-end {
2783         clear: both;
2784 }
2785
2786 #viewcontacts {
2787         margin-top: 15px;
2788 }
2789
2790 .contact-entry-direction-wrapper {
2791         position: absolute;
2792         top: 20px;
2793 }
2794
2795 .contact-entry-edit-links {
2796         position: absolute;
2797         top: 60px;
2798 }
2799
2800 #contacts-show-hide-link {
2801         margin-bottom: 20px;
2802         margin-top: 10px;
2803         font-weight: bold;
2804 }
2805
2806 .contact-entry-name {
2807         width: 100px;
2808         overflow: hidden;
2809         font: #999;
2810         font-size: 12px;
2811         text-align: center;
2812         font-weight: bold;
2813         margin-top: 5px;
2814 }
2815
2816 .contact-entry-photo {
2817         position: relative;
2818         /*border: 1px solid #7C7D7B;
2819         border-radius: 3px;
2820                 -moz-border-radius: 3px;
2821                 -webkit-border-radius: 3px;
2822         box-shadow: 0 0 8px #BDBDBD;
2823                 -moz-box-shadow: 0 0 8px #BDBDBD;
2824                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
2825 }
2826
2827 .contact-entry-edit-links .icon {
2828         border: 1px solid #babdb6;
2829         border-radius: 3px;
2830                 -webkit-border-radius: 3px;
2831                 -moz-border-radius: 3px;
2832         background-color: #ffffff;
2833 }
2834
2835 #contact-edit-banner-name {
2836         font-size: 1.5em;
2837         margin-left: 30px;
2838 }
2839
2840 #contact-edit-update-now {
2841         padding: 7px;
2842         width: 165px;
2843         margin: auto;
2844         margin-left: 40px;
2845         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2846                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2847                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2848         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2849         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2850         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2851         background-color: #bdbdbd;
2852         border-radius: 5px;
2853                 -moz-border-radius: 5px;
2854                 -webkit-border-radius: 5px;
2855         display: inline-block;
2856         color: #efefef;
2857         text-decoration: none;
2858         text-align: center;
2859 }
2860
2861 #contact-edit-update-now:hover {
2862         color: #efefef;
2863         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2864         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2865         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2866         background-color: #1873a2;
2867         border: 1px solid #7C7D7B;
2868         box-shadow: 0 0 8px #BDBDBD;
2869                 -moz-box-shadow: 0 0 8px #BDBDBD;
2870                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2871         border-radius: 5px;
2872                 -moz-border-radius: 5px;
2873                 -webkit-border-radius: 5px;
2874 }
2875
2876 #contact-edit-update-now:active {
2877         position: relative;
2878         top: 1px;
2879 }
2880
2881 #contact-edit-update-now a {
2882         color: #efefef;
2883         font-size: 14px;
2884         text-align: center;
2885         margin: auto;
2886 }
2887
2888 #contact-edit-info-wrapper,
2889 #contact-edit-info-end,
2890 #contact-edit-profile-select-text,
2891 #contact-edit-profile-select-end,
2892 #contact-edit-poll-wrapper,
2893 #contact-edit-end {
2894 }
2895
2896 .contact-edit-submit {
2897 }
2898
2899 #contact-profile-selector {
2900 }
2901
2902 .contact-photo-menu-button {
2903         position: absolute;
2904         background-image: url("images/photo-menu.jpg");
2905         background-position: top left;
2906         background-repeat: no-repeat;
2907         margin: 10px 0 0 0;
2908         padding: 0px;
2909         width: 16px;
2910         height: 16px;
2911         top: 64px; left:0px;
2912         overflow: hidden;
2913         text-indent: 40px;
2914         display: none;
2915 }
2916
2917 .contact-photo-menu {
2918         width: auto;
2919         border: 1px solid #ddd;
2920         background: #f1f1f1;
2921         position: absolute;
2922         left: 0px;
2923         top: 90px;
2924         display: none;
2925         z-index: 10000;
2926         box-shadow: 3px 3px 5px #888;
2927                 -moz-box-shadow: 3px 3px 5px #888;
2928                 -webkit-box-shadow: 3px 3px 5px #888;
2929 }
2930
2931 .contact-photo-menu ul {
2932         margin: 0px;
2933         padding: 0px;
2934         list-style: none;
2935 }
2936
2937 .contact-photo-menu li a {
2938         display: block;
2939         padding: 3px;
2940         color: #626262;
2941         font-size: 1em;
2942 }
2943
2944 .contact-photo-menu li a:hover {
2945         color: #FFFFFF;
2946         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2947         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2948         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2949         background-color: #1873a2;
2950         text-decoration: none;
2951 }
2952
2953 .view-contact-name {}
2954
2955 #div.side-link {
2956         background-color: #efefef;
2957         padding: 10px;
2958         margin-top: 20px;
2959 }
2960
2961 #follow-sidebar {
2962         margin-bottom: 10px;
2963 }
2964
2965 #follow-sidebar h3:before {
2966         content: url("images/user.png");
2967         padding-right: 10px;
2968         vertical-align: middle;
2969 }
2970
2971 #follow-sidebar input[type="text"] {
2972         margin-left: 3px;
2973         margin-bottom: 10px;
2974 }
2975
2976 #side-follow-submit {
2977         width: 178px;
2978         margin: 10px;
2979         text-align: center;
2980 }
2981
2982 #side-invite-link,
2983 #side-random-profile-link,
2984 #side-suggest-link,
2985 #side-match-link {
2986         width: 80%;
2987         padding: 10px;
2988         margin: auto;
2989         margin-bottom: 20px;
2990         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2991         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2992         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2993         background-color: #bdbdbd;
2994         padding: 5px 10px 5px 10px;
2995         color: #efefef;
2996         font-size: 1.1em;
2997         text-align: center;
2998         border: 1px solid #7C7D7B;
2999         border-radius: 5px;
3000                 -moz-border-radius: 5px;
3001                 -webkit-border-radius: 5px;
3002 }
3003
3004 #side-invite-link:hover,
3005 #side-random-profile-link:hover,
3006 #side-suggest-link:hover,
3007 #side-match-link:hover {
3008         color: #efefef;
3009         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3010         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3011         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3012         background-color: #1873a2;
3013         border: 1px solid #7C7D7B;
3014         box-shadow: 0 0 8px #BDBDBD;
3015                 -moz-box-shadow: 0 0 8px #BDBDBD;
3016                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3017         border-radius: 5px;
3018                 -moz-border-radius: 5px;
3019                 -webkit-border-radius: 5px;
3020 }
3021
3022
3023 #side-invite-link:active,
3024 #side-random-profile-link:active,
3025 #side-suggest-link:active,
3026 #side-match-link:active {
3027         background-color: #1873a2;
3028         position: relative;
3029         top: 1px;
3030 }
3031
3032 #side-invite-link a,
3033 #side-random-profile-link a,
3034 #side-suggest-link a,
3035 #side-match-link a {
3036         color: #efefef;
3037 }
3038
3039
3040 #invite-message,
3041 #invite-recipients,
3042 #invite-recipient-text {
3043         padding: 10px;
3044 }
3045
3046 #side-follow-wrapper {
3047         font-size: 1em;
3048         font-weight: bold;
3049         font-stretch: semi-expanded;
3050         background-color: #f3f3f3;
3051         border: 1px solid #7C7D7B;
3052         padding: 10px;
3053         margin-top: 20px;
3054         border-radius: 5px;
3055                 -moz-border-radius: 5px;
3056                 -webkit-border-radius: 5px;
3057 }
3058
3059 #side-follow-wrapper label{
3060         font-size: 1.1em;
3061         font-variant: normal;
3062 }
3063
3064 #contact-suggest {
3065         float: left;
3066         margin-left: 10px;
3067         width: 120px;
3068         padding: 10px;
3069         margin-bottom: 20px;
3070         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3071                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3072                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3073         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3074         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3075         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3076         background-color: #bdbdbd;
3077         border-radius: 5px;
3078                 -moz-border-radius: 5px;
3079                 -webkit-border-radius: 5px;
3080         padding: 5px 10px 5px 10px;
3081         color: #efefef;
3082         font-size: 1.2em;
3083         text-align: center;
3084 }
3085
3086 #contact-suggest:hover {
3087         color: #efefef;
3088         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3089         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3090         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3091         background-color: #1873a2;
3092 }
3093
3094 #contact-suggest:active {
3095         background-color: #1873a2;
3096         position: relative;
3097         top: 1px;
3098 }
3099
3100 #contact-suggest a {
3101         color: #efefef;
3102 }
3103
3104 .crepair-label {
3105         margin-top: 10px;
3106         float: left;
3107         width: 250px;
3108 }
3109
3110 .crepair-input {
3111         margin-top: 10px;
3112         float: left;
3113         width: 200px;
3114 }
3115
3116 /* ===================================== */
3117 /* = Register, Settings, Profile Forms = */
3118 /* ===================================== */
3119
3120 #id_openid_url,
3121 .openid input {
3122         background: url(images/login-bg.gif) no-repeat;
3123         background-position: 0 50%;
3124         padding-left: 18px;
3125         width: 250px!important;
3126 }
3127
3128 .openid:hover {
3129 }
3130
3131 #profile-tabs-wrapper {
3132         padding-top: 10px;
3133 }
3134
3135 #profile-tab-status-link {
3136         border: 0px;
3137         padding: 5px 10px 5px 10px;
3138         font-style: bold;
3139 }
3140
3141 #uexport-link a {
3142         color: #efefef;
3143 }
3144
3145 #profile-tab-profile-link {
3146         border: 0px;
3147         padding: 5px 10px 5px 10px;
3148 }
3149
3150 #uexport-link {
3151         width: 140px;
3152         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3153                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3154                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3155         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
3156         background: -moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
3157         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
3158         background-color: #7c7d7b;
3159         border-radius: 5px;
3160                 -moz-border-radius: 5px;
3161                 -webkit-border-radius: 5px;
3162         padding: 5px 10px 5px 10px;
3163         margin-bottom: 10px;
3164 }
3165
3166 #uexport-link:hover {
3167         color: #efefef;
3168         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
3169         background: -moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
3170         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
3171         background-color: #555753;
3172 }
3173
3174 #uexport-link:active {
3175         color: #efefef;
3176         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3177         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3178         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3179         background-color: #1873a2;
3180         position: relative;
3181         top: 1px;
3182 }
3183
3184 #settings-default-perms .fakelink {
3185         color: #efefef;
3186 }
3187
3188 #settings-default-perms {
3189         width: 260px;
3190         text-align: center;
3191         color: #EFEFEF;
3192         padding: 5px 10px 5px 10px;
3193         margin-bottom: 10px;
3194         background-color: #BDBDBD;
3195         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
3196         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3197         border: 1px solid #7C7D7B;
3198         border-radius: 5px;
3199                 -moz-border-radius: 5px;
3200                 -webkit-border-radius: 5px;
3201 }
3202
3203 #settings-default-perms:hover {
3204         color: #efefef;
3205         background-color: #555753;
3206         border: 1px solid #7C7D7B;
3207         box-shadow: 0 0 8px #BDBDBD;
3208                 -moz-box-shadow: 0 0 8px #BDBDBD;
3209                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3210         border-radius: 5px;
3211                 -moz-border-radius: 5px;
3212                 -webkit-border-radius: 5px;
3213 }
3214
3215 #settings-default-perms:active {
3216         color: #efefef;
3217         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3218         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3219         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3220         background-color: #1873a2;
3221         position: relative;
3222         top: 1px;
3223 }
3224
3225 #settings-nickname-desc {
3226         width: 80%;
3227         background-color: #efefef;
3228         margin-top: 10px;
3229         margin-bottom: 10px;
3230         border-radius: 5px;
3231                 -webkit-border-radius: 5px;
3232                 -moz-border-radius: 5px;
3233         padding: 10px;
3234 }
3235
3236 #register-form div {
3237         clear: both;
3238 }
3239
3240 #profile-edit-form div {
3241         margin-bottom: 5px;
3242 }
3243
3244 #profile-edit-form div[id$='desc'] {
3245         font-size: 0.8em;
3246         margin-left: 2%;
3247 }
3248
3249 #register-form label,
3250 #profile-edit-form label {
3251         width: 575px;
3252         float: right;
3253         margin-right: 155px;
3254 }
3255
3256 #register-form span {
3257         color: #555753;
3258         display: block;
3259         margin-bottom: 20px;
3260 }
3261
3262 .settings-submit,
3263 .settings-submit-wrapper,
3264 .profile-edit-submit-wrapper {
3265         margin: 30px 0px;
3266 }
3267
3268 .profile-listing,
3269 .profile-listing-end {
3270         float: left;
3271         clear: both;
3272         margin: 20px 20px 0px 0px;
3273 }
3274
3275
3276 #register-sitename {
3277         display: inline;
3278         font-weight: bold;
3279 }
3280
3281 #register-submit-button {
3282         margin-top: 10px;
3283 }
3284
3285 #label-register-name,
3286 #label-register-email,
3287 #label-register-nickname,
3288 #label-register-openid {
3289         float: left;
3290         width: 350px;
3291         margin-top: 10px;
3292 }
3293
3294 #register-name,
3295 #register-email,
3296 #register-nickname {
3297         float: left;
3298         margin-top: 10px;
3299         width: 150px;
3300 }
3301
3302 #register-openid {
3303         float: left;
3304         margin-top: 10px;
3305         width: 130px;
3306 }
3307
3308 #register-fill-ext {
3309         margin-bottom: 25px;
3310 }
3311
3312 #register-name-end,
3313 #register-email-end,
3314 #register-nickname-end,
3315 #register-submit-end,
3316 #register-openid-end {
3317         clear: both;
3318 }
3319
3320 #register-nickname-desc {
3321         margin-top: 30px;
3322         width: 650px;
3323 }
3324
3325 /* ===================== */
3326 /* = Contacts Selector = */
3327 /* ===================== */
3328
3329 #group-edit-wrapper {
3330         margin-bottom: 10px;
3331 }
3332
3333 #group-edit-name-wrapper {
3334         margin-bottom: 0px;
3335         display: inline;
3336 }
3337 #group-edit-submit-wrapper {
3338         margin-bottom: 10px;
3339         margin-right: 400px;
3340         float: right;
3341         display: inline;
3342 }
3343
3344 .group-delete-wrapper {
3345         width: 90px;
3346         display: inline;
3347         padding: 5px;
3348         margin-bottom: 10px;
3349         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3350                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3351                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3352         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3353         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3354         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3355         background-color: #bdbdbd;
3356         border-radius: 5px;
3357                 -moz-border-radius: 5px;
3358                 -webkit-border-radius: 5px;
3359 }
3360
3361 .group-delete-wrapper:hover {
3362         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3363         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3364         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3365         background-color: #1873a2;
3366 }
3367
3368 .group-delete-wrapper:active {
3369         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3370         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3371         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3372         background-color: #1873a2;
3373 }
3374
3375 .group-delete-wrapper a {
3376         color: #efefef;
3377         font-size: 0.9em;
3378 }
3379
3380 #group-edit-desc {
3381         margin: 10px 0xp;
3382 }
3383
3384 #group-new-text {
3385         font-size: 1.1em;
3386 }
3387
3388 #group-members,
3389 #prof-members {
3390         width: 83%;
3391         height: 200px;
3392         overflow: auto;
3393         border: none;
3394         background-color: #f0edf0;
3395         color: #555753;
3396         border: 1px solid #ccc;
3397         margin-bottom: 10px;
3398         padding: 10px;
3399 }
3400
3401 #group-all-contacts,
3402 #prof-all-contacts {
3403         width: 83%;
3404         height: 200px;
3405         overflow: auto;
3406         border: 1px solid #ccc;
3407         background-color: #f0edf0;
3408         padding: 10px;
3409 }
3410
3411 #group-members h3,
3412 #group-all-contacts h3,
3413 #prof-members h3,
3414 #prof-all-contacts h3 {
3415         color: #555753;
3416         margin: 0px;
3417         padding: 5px;
3418 }
3419
3420 #group-separator,
3421 #prof-separator {
3422         display: none;
3423 }
3424
3425 /* ========== */
3426 /* = Events = */
3427 /* ========== */
3428
3429 #events-reminder {}
3430
3431 .clear {
3432         clear: both;
3433         margin-top: 10px;
3434 }
3435
3436 .eventcal {
3437         float: left;
3438         font-size: 20px;
3439         padding: 20px;
3440 }
3441
3442 .vevent {
3443         position: relative;
3444         width: 400px;
3445         padding: 20px;
3446         padding-top: 10px;
3447         margin: 0 0px;
3448         margin-bottom: 10px;
3449         background-color: #fff;
3450         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3451                 -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3452                 -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3453 }
3454
3455 .vevent:before,
3456 .vevent:after {
3457         position: absolute;
3458         width: 40%;
3459         height: 10px;
3460         content: ' ';
3461         left: 12px;
3462         bottom: 12px;
3463         background: transparent;
3464         transform: skew(-5deg) rotate(-5deg);
3465                 -webkit-transform: skew(-5deg) rotate(-5deg);
3466                 -moz-transform: skew(-5deg) rotate(-5deg);
3467                 -ms-transform: skew(-5deg) rotate(-5deg);
3468                 -o-transform: skew(-5deg) rotate(-5deg);
3469         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3470                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3471                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3472         z-index: -1;
3473 }
3474
3475 .vevent:after {
3476         left: auto;
3477         right: 12px;
3478         transform: skew(5deg) rotate(5deg);
3479                 -webkit-transform: skew(5deg) rotate(5deg);
3480                 -moz-transform: skew(5deg) rotate(5deg);
3481                 -ms-transform: skew(5deg) rotate(5deg);
3482                 -o-transform: skew(5deg) rotate(5deg);
3483 }
3484
3485 .vevent .event-description {
3486         margin-left: 10px;
3487         margin-right: 10px;
3488         text-align: center;
3489         font-size: 1.2em;
3490         font-weight: bolder;
3491 }
3492
3493 .vevent .event-location {
3494         margin-left: 10px;
3495         margin-right: 10px;
3496         font-size: 1em;
3497         font-style: oblique;
3498         text-align: center;
3499 }
3500
3501 .vevent .event-start,
3502 .vevent .event-end  {
3503         margin-left: 20px;
3504         margin-right: 20px;
3505         margin-bottom: 2px;
3506         margin-top: 2px;
3507         font-size: 0.9em;
3508         text-align: left;
3509 }
3510
3511 #new-event-link {
3512         width: 130px;
3513         padding: 7px;
3514         margin-bottom: 10px;
3515         margin-left: 170px;
3516         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3517                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3518                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3519         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3520         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3521         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3522         background-color: #bdbdbd;
3523         border-radius: 5px;
3524                 -moz-border-radius: 5px;
3525                 -webkit-border-radius: 5px;
3526         color: #efefef;
3527 }
3528
3529 #new-event-link:hover {
3530         color: #efefef;
3531         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3532         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3533         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3534         background-color: #1873a2;
3535 }
3536
3537 #new-event-link:active {
3538         background-color: #1873a2;
3539         position: relative;
3540         top: 1px;
3541 }
3542
3543 #new-event-link a {
3544         color: #efefef;
3545         text-align: center;
3546 }
3547
3548 .edit-event-link, .plink-event-link {
3549         float: left;
3550         margin-top: 4px;
3551         margin-right: 4px;
3552         margin-bottom: 15px;
3553 }
3554
3555 .event-description:before {
3556         content: url('images/calendar.png');
3557         margin-right: 15px;
3558         vertical-align: middle;
3559 }
3560
3561 .event-start,
3562 .event-end {
3563         margin-left: 10px;
3564         width: 330px;
3565 }
3566
3567 .event-start .dtstart,
3568 .event-end .dtend {
3569         float: right;
3570 }
3571
3572 .event-list-date {
3573         color: #626262;
3574         margin-bottom: 10px;
3575         font-stretch: condensed;
3576 }
3577
3578 .prevcal,
3579 .nextcal {
3580         float: left;
3581         margin-left: 32px;
3582         margin-right: 32px;
3583         margin-top: 64px;
3584 }
3585
3586 .event-calendar-end {
3587         clear: both;
3588 }
3589
3590 .calendar {
3591         width: 300px;
3592         font-family: Helvetica, Arial, sans-serif;
3593         background-color: #f1f1f1;
3594         border: 1px solid #dedede;
3595         margin-bottom: 10px;
3596         box-shadow: 5px 5px 8px #959494;
3597                 -moz-box-shadow: 5px 5px 8px #959494;
3598                 -webkit-box-shadow: 5px 5px 8px #959494;
3599 }
3600
3601 .calendar caption {
3602         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
3603         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
3604         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
3605         background-color: #1873a2;
3606         padding: 10px 0px 10px 0px;
3607         width: 300px;
3608         color: #ffffff;
3609         font-weight: bold;
3610         text-align: center;
3611         box-shadow: 5px 2px 8px #959494;
3612                 -moz-box-shadow: 5px 2px 8px #959494;
3613                 -webkit-box-shadow: 5px 2px 8px #959494;
3614 }
3615
3616 .calendar td {
3617         font-size: 14px;
3618         text-align: center;
3619         padding: 3px 0px;
3620 }
3621
3622 .calendar td > a {
3623         background-color: #cdcdcd;
3624         padding: 2px;
3625         color: #000000;
3626 }
3627
3628 .calendar th {
3629         font-size: 16px;
3630 }
3631
3632 .today {
3633         font-weight: bold;
3634         text-align: center;
3635         background-color: #1873a2;
3636         color: #ffffff;
3637 }
3638
3639 #event-start-text,
3640 #event-finish-text {
3641         margin-top: 10px;
3642         margin-bottom: 5px;
3643 }
3644
3645 #event-nofinish-checkbox,
3646 #event-nofinish-text,
3647 #event-adjust-checkbox,
3648 #event-adjust-text,
3649 #event-share-checkbox {
3650         float: left;
3651 }
3652
3653 #event-datetime-break {
3654         margin-bottom: 10px;
3655 }
3656
3657 #event-nofinish-break,
3658 #event-adjust-break,
3659 #event-share-break {
3660         clear: both;
3661 }
3662
3663 #event-desc-text,
3664 #event-location-text {
3665         margin-top: 10px;
3666         margin-bottom: 5px;
3667 }
3668
3669 #event-submit {
3670         margin-top: 10px;
3671 }
3672
3673 /* ============= */
3674 /* = Directory = */
3675 /* ============= */
3676
3677 .directory-item {
3678         float: left;
3679         margin: 50px 50px 0px 0px;
3680 }
3681
3682 .directory-details {
3683         font-size: 0.9em;
3684         width: 160px;
3685 }
3686
3687 .directory-name {
3688         font-size: 1em;
3689         width: 150px;
3690 }
3691
3692 /* ========= */
3693 /* = Admin = */
3694 /* ========= */
3695
3696 #adminpage {
3697         width: 90%;
3698 }
3699
3700 #pending-update {
3701         float:right;
3702         color: #ffffff;
3703         font-weight: bold;
3704         background-color: #FF0000;
3705         padding: 0em 0.3em;
3706 }
3707
3708 .admin.linklist {
3709         border: 0px; padding: 0px;
3710 }
3711
3712 .admin.link {
3713         list-style-position: inside;
3714         font-size: 1em;
3715         padding: 5px;
3716         width: auto;
3717         margin: 5px;
3718 }
3719
3720 #adminpage dl {
3721         clear: left;
3722         margin-bottom: 2px;
3723         padding-bottom: 2px;
3724         border-bottom: 1px solid black;
3725 }
3726
3727 #adminpage dt {
3728         width: 200px;
3729         float: left;
3730         font-weight: bold;
3731 }
3732
3733 #adminpage dd {
3734         margin-left: 200px;
3735 }
3736 #adminpage h3 {
3737         border-bottom: 1px solid #898989;
3738         margin-bottom: 5px;
3739         padding-bottom: 5px;
3740         margin-top: 10px;
3741 }
3742
3743 #adminpage .submit {
3744         clear:left;
3745 }
3746
3747 #adminpage
3748 #pluginslist {
3749         margin: 0px;
3750         padding: 0px;
3751 }
3752
3753 #adminpage .plugin {
3754         list-style: none;
3755         display: block;
3756         clear: left;
3757         border: 1px solid #7C7D7B;
3758         box-shadow: 0 0 8px #BDBDBD;
3759                 -moz-box-shadow: 0 0 8px #BDBDBD;
3760                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3761         border-radius: 5px;
3762                 -moz-border-radius: 5px;
3763                 -webkit-border-radius: 5px;
3764         padding:10px;
3765         margin:10px 10px 10px 0;
3766 }
3767
3768 #adminpage .toggleplugin {
3769         float: left;
3770         margin-right: 1em;
3771 }
3772
3773 #adminpage table {
3774         width: 100%;
3775         border-bottom: 1p solid #000000;
3776         margin: 5px 0px;
3777 }
3778
3779 #adminpage table th {
3780         text-align: left;
3781 }
3782
3783 #adminpage td .icon {
3784         float: left;
3785 }
3786
3787 #adminpage table#users img {
3788         width: 16px;
3789         height: 16px;
3790 }
3791
3792 #adminpage table tr:hover {
3793         background-color: #eeeeee;
3794 }
3795
3796 #adminpage .selectall {
3797         text-align: right;
3798 }
3799
3800 /* =============== */
3801 /* = Form Fields = */
3802 /* =============== */
3803
3804 .field {
3805     /*margin-bottom: 10px;*/
3806     overflow: auto;
3807     padding-bottom: 10px;
3808     width: 100%;
3809 }
3810
3811 .field.radio .field_help {
3812     margin-left: 255px;
3813 }
3814
3815 .field .field_help {
3816     color: #666666;
3817     display: block;
3818     margin-left: 225px;
3819 }
3820
3821 .field label {
3822     float: left;
3823     width: 230px;
3824 }
3825
3826 .field checkbox {
3827         float: left;
3828         width: 480px;
3829 }
3830
3831 .field input,
3832 .field textarea {
3833         /*width: 400px;*/
3834         float: left;
3835         border: 1px solid #7C7D7B;
3836         border-radius: 5px;
3837                 -moz-border-radius: 5px;
3838                 -webkit-border-radius: 5px;
3839 }
3840
3841 .field password {
3842         height: 100px;
3843         margin-left: 150px;
3844 }
3845
3846 .field_help {
3847         display: block;
3848         margin-left: 0px;
3849         margin-bottom: 10px;
3850         color: #666666;
3851 }
3852
3853 .field .onoff {
3854         float: left;
3855         width: 80px;
3856 }
3857 .field .onoff a {
3858         display: block;
3859         border: 1px solid #c1c1c1;
3860         background-image: url("../../../images/onoff.jpg");
3861         background-repeat: no-repeat;
3862         padding: 4px 2px 2px 2px;
3863         height: 16px;
3864         text-decoration: none;
3865 }
3866 .field .onoff .off {
3867         border-color: #c1c1c1;
3868         padding-left: 40px;
3869         background-position: left center;
3870         background-color: #cccccc;
3871         color: #666666;
3872         text-align: right;
3873 }
3874
3875 .field .onoff .on {
3876         border-color: #c1c1c1;
3877         padding-right: 40px;
3878         background-position: right center;
3879         background-color: #1873a2;
3880         color: #FFFFFF;
3881         text-align: left;
3882 }
3883
3884 .field .radio .field_help {
3885         margin-left: 0px;
3886 }
3887
3888 /* ========= */
3889 /* = Icons = */
3890 /* ========= */
3891
3892 .sparkle {
3893         cursor: url('lock.cur'), pointer;
3894         width: 100%;
3895         height: auto;
3896         /*border: 1px solid #7C7D7B;
3897         border-radius: 3px;
3898                 -moz-border-radius: 3px;
3899                 -webkit-border-radius: 3px;
3900         box-shadow: 0 0 8px #BDBDBD;
3901                 -moz-box-shadow: 0 0 8px #BDBDBD;
3902                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
3903 }
3904
3905 .label {
3906         border: 0px;
3907         border-radius: 0px;
3908         box-shadow: none;
3909 }
3910
3911 .icon {
3912         margin-left: 5px;
3913         margin-right: 5px;
3914         display: block;
3915         width: 20px;
3916         height: 20px;
3917         background-image: url("images/icons.png");
3918 }
3919 .starred {
3920         background-image: url("images/star.png");
3921         repeat: no-repeat;
3922 }
3923 .unstarred {
3924         background-image: url("images/premium.png");
3925         repeat: no-repeat;
3926 }
3927
3928 .notify {
3929         background-image: url("images/notifications.png");
3930         repeat: no-repeat;
3931 }
3932
3933 .border {
3934         border: 1px solid #c1c1c1;
3935         border-radius: 3px;
3936                 -webkit-border-radius: 3px;
3937                 -moz-border-radius: 3px;
3938 }
3939
3940 .article        { background-position: -50px  0px;}
3941 .audio          { background-position: -70px  0px;}
3942 .block          { background-position: -90px  0px;}
3943 .drop           { background-position: -110px 0px;}
3944 .drophide       { background-position: -130px 0px;}
3945 .edit           { background-position: -150px 0px;}
3946 .camera         { background-position: -170px 0px;}
3947 .dislike        { background-position: -190px 0px;}
3948 .like           { background-position: -210px 0px;}
3949 .link           { background-position: -230px 0px;}
3950 .globe          { background-position: -50px  -20px;}
3951 .noglobe        { background-position: -70px  -20px;}
3952 .no             { background-position: -90px  -20px;}
3953 .pause          { background-position: -110px -20px;}
3954 .play           { background-position: -130px -20px;}
3955 .pencil         { background-position: -150px -20px; margin-right: 12px;}
3956 .small-pencil   { background-position: -170px -20px;}
3957 .recycle        { background-position: -190px -20px;}
3958 .remote-link    { background-position: -210px -20px; margin-right: 10px;}
3959 .share          { background-position: -230px -20px;}
3960 .tools          { background-position: -50px  -40px;}
3961 .lock           { background-position: -70px  -40px;}
3962 .unlock         {
3963         background-position: -90px  -40px;
3964         background-image: none;
3965         width: 70px;
3966         height: 20px;
3967 }
3968
3969 .sharePerms {
3970         background-image: url("images/icons.png");
3971         width: 20px;
3972         height: 20px;
3973         margin: 2px 0px 2px 3px;
3974         display: block;
3975 }
3976
3977 .video          { background-position: -110px -40px;}
3978 .youtube        { background-position: -130px -40px;}
3979 .attach         { background-position: -190px -40px;}
3980 .language       { background-position: -210px -40px;}
3981 .on             { background-position: -50px  -60px;}
3982 .off            { background-position: -70px  -60px;}
3983 .prev           { background-position: -90px  -60px;}
3984 .next           { background-position: -110px -60px;}
3985 .tagged         { background-position: -130px -60px; margin-right: 10px;}
3986 .icon.dim       { opacity: 0.3;filter:alpha(opacity=30);}
3987
3988 .attachtype {
3989         display: block; width: 20px; height: 23px;
3990         background-image: url("../../../images/content-types.png");
3991         background-position: -80px 0px;
3992 }
3993
3994 .type-video { background-position: 0px 0px; }
3995 .type-image { background-position: -20px 0px; }
3996 .type-audio { background-position: -40px 0px; }
3997 .type-text  { background-position: -60px 0px; }
3998 .type-unkn  { background-position: -80px 0px; }
3999
4000 /* ========== */
4001 /* = Footer = */
4002 /* ========== */
4003
4004 .cc-license {
4005         margin-top: 100px;
4006         font-size: 0.7em;
4007 }
4008
4009 footer { display: block; margin: 50px 20%; clear: both; }
4010
4011 /* ========== */
4012 /* = Tools = */
4013 /* ========== */
4014
4015 tools {
4016         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0edf0), color-stop(1, #e2e2e2) );
4017         background: -moz-linear-gradient( center top, #f0edf0 5%, #e2e2e2 100% );
4018         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0edf0', endColorstr='#e2e2e2');
4019         background-color: #f0edf0;
4020         border-radius: 5px 5px 0px 0px;
4021                 -moz-border-radius: 5px 5px 0px 0px;
4022                 -webkit-border-radius: 5px 5px 0px 0px;
4023         border: 1px solid #7C7D7B;
4024         border-bottom: none;
4025         box-shadow: 1px 2px 6px 0px #959494;
4026                 -moz-box-shadow: 1px 2px 6px 0px #959494;
4027                 -webkit-box-shadow: 1px 2px 6px 0px #959494;
4028         color: #EFEFEF;
4029         display: block;
4030         float: right;
4031         font-size: 15px;
4032         height: 38px;
4033         list-style: none outside none;
4034         margin: 0 0 0 755px;
4035         padding: 0;
4036         position: fixed;
4037         bottom: 0;
4038         width: 203px;
4039         z-index: 10;
4040         clear:both;
4041 }
4042
4043 /* ======= */
4044 /* = ACL = */
4045 /* ======= */
4046
4047 #photo-edit-perms-select,
4048 #photos-upload-permissions-wrapper,
4049 #profile-jot-acl-wrapper{
4050         display: block!important;
4051 }
4052
4053 #acl-wrapper {
4054         width: 690px;
4055         float:left;
4056 }
4057 #acl-search {
4058         float:right;
4059         background: #ffffff url("../../../images/search_18.png") no-repeat right center;
4060         padding-right: 20px;
4061 }
4062
4063 #acl-showall {
4064         float: left;
4065         display: block;
4066         font-size: 1em;
4067         font-style: bold;
4068         text-align: center;
4069         padding: 3px;
4070         margin-bottom: 5px;
4071         background-color: #cccccc;
4072         background-position: 7px 7px;
4073         background-repeat: no-repeat;
4074         padding: 5px;
4075         border-radius: 5px;
4076                 -webkit-border-radius: 5px ;
4077                 -moz-border-radius: 5px;
4078         color: #999999;
4079 }
4080
4081 #acl-showall.selected {
4082         color: #ffffff;
4083         background-color: #1873a2;
4084 }
4085
4086 #acl-list {
4087         height: 400px;
4088         border: 1px solid #cccccc;
4089         background-color: #efefef;
4090         clear: both;
4091         margin-top: 30px;
4092         overflow: auto;
4093 }
4094
4095 #acl-list-content {
4096 }
4097
4098 .acl-list-item {
4099         display: block;
4100         width: 155px;
4101         height: 50px;
4102         border: 1px solid #cccccc;
4103         background-color: #fff;
4104         margin: 5px;
4105         float: left;
4106         box-shadow: 2px 2px 3px #c1c1c1;
4107                 -moz-box-shadow: 2px 2px 3px #c1c1c1;
4108                 -webkit-box-shadow: 2px 2px 3px #c1c1c1;
4109 }
4110 .acl-list-item img {
4111         width: 30px;
4112         height: 30px;
4113         float: left;
4114         margin: 5px;
4115 }
4116
4117 .acl-list-item p {
4118         color: #999999;
4119         height: 12px;
4120         font-size: 0.7em;
4121         margin: 0px;
4122         padding: 2px 0px 1px;
4123         overflow: hidden;
4124 }
4125
4126 .acl-list-item a {
4127         font-size: 10px;
4128         display: block;
4129         float: left;
4130         color: #efefef;
4131         background-color: #898989;
4132         background-position: 3px 3px;
4133         background-repeat: no-repeat;
4134         margin: 10px 0 0 5px;
4135         border-radius: 2px;
4136                 -webkit-border-radius: 2px ;
4137                 -moz-border-radius: 2px;
4138         padding: 3px;
4139 }
4140
4141 #acl-wrapper a:hover {
4142         text-decoration: none;
4143         background-color:#1873a2;
4144 }
4145
4146 .acl-button-show.selected {
4147         color: #efefef;
4148         background-color: #1873a2;
4149 }
4150
4151 .acl-button-hide .selected {
4152         color: #efefef;
4153         background-color: #a2a2a2;
4154 }
4155
4156 .acl-list-item.groupshow { border-color: #1873a2; }
4157 .acl-list-item.grouphide { border-color: #a2a2a2; }
4158
4159 /* ========================= */
4160 /* = Global Directory Link = */
4161 /* ========================= */
4162
4163 #global-directory-link {
4164         width: 150px;
4165         padding: 4px;
4166         /*margin-bottom: 10px;*/
4167         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
4168         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
4169         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
4170         background-color: #bdbdbd;
4171         color: #efefef;
4172         text-align: center;
4173         -webkit-padding-start: 0px;
4174         border: 1px solid #7C7D7B;
4175         border-radius: 5px;
4176                 -moz-border-radius: 5px;
4177                 -webkit-border-radius: 5px;
4178 }
4179
4180 #global-directory-link:hover {
4181         color: #efefef;
4182         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4183         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4184         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4185         background-color: #1873a2;
4186         border: 1px solid #7C7D7B;
4187         box-shadow: 0 0 8px #BDBDBD;
4188                 -moz-box-shadow: 0 0 8px #BDBDBD;
4189                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4190         border-radius: 5px;
4191                 -moz-border-radius: 5px;
4192                 -webkit-border-radius: 5px;
4193 }
4194
4195 #global-directory-link:active {
4196         background-color: #1873a2;
4197         position: relative;
4198         top: 1px;
4199 }
4200
4201 #global-directory-link a {
4202         color: #efefef;
4203 }
4204
4205 a.active {
4206         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4207         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4208         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4209         background-color: #1873a2;
4210         color: #fec01d;
4211         padding: 5px 10px 5px 10px;
4212         margin-right: 5px;
4213 }
4214
4215 /* notifications popup menu */
4216 .nav-notify {
4217         display: none;
4218         position: absolute;
4219         font-size: 10px;
4220         padding: 1px 3px;
4221         top: 0px;
4222         right: -10px;
4223         min-width: 15px;
4224         text-align: right;
4225 }
4226 .nav-notify.show {
4227         display: block;
4228 }
4229 ul.menu-popup {
4230         position: absolute;
4231         display: none;
4232         width: 10em;
4233         margin: 0px;
4234         padding: 0px;
4235         list-style: none;
4236         z-index: 100000;
4237         top: 40px;
4238 }
4239 #nav-notifications-menu {
4240         width: 320px;
4241         max-height: 400px;
4242         overflow-y: scroll;
4243         overflow-style: scrollbar;
4244         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
4245         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
4246         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
4247         background-color: #a2a2a2;
4248         border-radius: 0px 0px 5px 5px;
4249                 -moz-border-radius: 0px 0px 5px 5px;
4250                 -webkit-border-radius: 0px 0px 5px 5px;
4251         border: 1px solid #9A9A9A;
4252         border-top: none;
4253         box-shadow: 5px 5px 10px #242424;
4254                 -moz-box-shadow: 5px 5px 10px #242424;
4255                 -webkit-box-shadow: 5px 5px 10px #242424;
4256 }
4257
4258 #nav-notifications-menu .contactname {
4259         font-weight: bold;
4260         font-size: 0.9em;
4261 }
4262
4263 #nav-notifications-menu img {
4264         float: left;
4265         margin-right: 5px;
4266 }
4267
4268 #nav-notifications-menu .notif-when {
4269         font-size: 0.8em;
4270         display: block;
4271 }
4272
4273 #nav-notifications-menu li {
4274         padding: 7px 0px 7px 10px;
4275         word-wrap: normal;
4276         border-bottom: 1px solid #626262;
4277 }
4278
4279 #nav-notifications-menu li:hover {
4280         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4281         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4282         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4283         background-color: #1873a2;
4284 }
4285
4286 #nav-notifications-menu a:hover {
4287         text-decoration: underline;
4288 }
4289
4290 .notif-item a {
4291         vertical-align: middle;
4292         color: #626262;
4293         padding-bottom: 7px;
4294 }
4295
4296 .notif-item a:hover {
4297         color: #1873a2;
4298 }
4299
4300 .notif-image {
4301         width: 32px;
4302         height: 32px;
4303         padding: 7px 7px 0px 0px;
4304 }
4305
4306 #jGrowl {
4307         z-index: 20000;
4308 }
4309
4310 /* autocomplete popup */
4311 .acpopup {
4312         max-height: 150px;
4313         overflow: auto;
4314         z-index: 100000;
4315         color: #2e3436;
4316         border-top: 0px;
4317         background: #eeeeee;
4318         border-right: 1px solid #7C7D7B;
4319         border-left: 1px solid #7C7D7B;
4320         border-bottom: 1px solid #7C7D7B;
4321         border-radius: 0px 5px 5px 5px;
4322                 -webkit-border-radius: 0px 5px 5px 5px;
4323                 -moz-border-radius: 0px 5px 5px 5px;
4324         box-shadow: 0 0 8px #BDBDBD;
4325                 -moz-box-shadow: 0 0 8px #BDBDBD;
4326                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4327 }
4328
4329 .acpopupitem {
4330         color: #2e3436;
4331         padding: 4px;
4332         clear:left;
4333 }
4334 .acpopupitem img {
4335         float: left;
4336         margin-right: 4px;
4337 }
4338
4339 .acpopupitem.selected {
4340         color: #efefef;
4341         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4342         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4343         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4344         background-color: #1873a2;
4345         order-bottom: none;
4346 }
4347
4348 .qcomment {
4349         opacity: 0.8;
4350         filter: alpha(opacity=0);
4351         position: relative;
4352         left: 30px;
4353 }
4354
4355 .qcomment:hover {
4356         opacity: 1.0;
4357         filter: alpha(opacity=100);
4358 }
4359
4360 .notify-seen {
4361         background: #000000;
4362 }
4363
4364 /* Pages profile widget ----------------------------------------------------------- */
4365
4366 #page-profile,
4367 #profile-page-list {
4368         margin-left: 45px;
4369 }
4370
4371 #page-profile .title {
4372         font-weight: bold;
4373 }
4374
4375 #profile-vcard-break {
4376         clear: both;
4377 }
4378
4379 #profile-extra-links {
4380         clear: both;
4381         margin-top: 10px;
4382 }
4383
4384 #profile-extra-links ul {
4385         list-style-type: none;
4386         padding: 0px;
4387 }
4388
4389
4390 #profile-extra-links li {
4391         margin-top: 5px;
4392 }
4393
4394 .profile-edit-side-div {
4395         float: right;
4396 }
4397
4398 .profile-edit-side-link {
4399         opacity: 0.3;
4400         filter:alpha(opacity=30);
4401 }
4402 .profile-edit-side-link:hover {
4403         opacity: 1.0;
4404         filter:alpha(opacity=100);
4405 }
4406
4407 /* SCROLL TO TOP
4408 ----------------------------------------------------------- */
4409 #scrollup {
4410         position: absolute;
4411         right: 0px;
4412         bottom: -1px;
4413         z-index: 100;
4414 padding-right: 10px;
4415 }
4416
4417 #scrollup a:hover {
4418         text-decoration: none;
4419         border: 0;
4420 }
4421
4422 .item-scrollup {
4423         margin-left: 5px;
4424 }
4425
4426 /* New posts and comments => background color
4427 ----------------------------------------------------------- */
4428 .shiny {
4429         background: #fbfde9;
4430 }
4431
4432 div.wall-item-content-wrapper.shiny {
4433         background-image: url("images/shiny.png");
4434         background-repeat: repeat-x;
4435 }
4436
4437 /* from default */
4438 #jot-perms-icon,
4439 #profile-location,
4440 #profile-nolocation,
4441 #profile-youtube,
4442 #profile-video,
4443 #profile-audio,
4444 #profile-link,
4445 #profile-title,
4446 #wall-image-upload,
4447 #wall-file-upload,
4448 #profile-upload-wrapper,
4449 #wall-image-upload-div,
4450 #wall-file-upload-div,
4451 .hover,
4452 .focus {
4453         cursor: pointer;
4454 }
4455
4456 hr.line-dots {
4457     background: url("images/dot.png") repeat-x scroll left center transparent;
4458     border: medium none;
4459 }
4460
4461 .body-tag,
4462 .filesavetags,
4463 .categorytags {
4464         opacity: 0.5;
4465         filter:alpha(opacity=50);
4466 }
4467
4468 .body-tag:hover,
4469 .filesavetags:hover,
4470 .categorytags:hover {
4471         opacity: 1.0 !important;
4472         filter:alpha(opacity=100) !important;
4473 }
4474
4475 .item-select {
4476         opacity: 0.5;
4477         filter:alpha(opacity=10);
4478         float: right;
4479         margin-right: 10px;
4480
4481 }
4482 .item-select:hover,
4483 .checkeditem {
4484         opacity: 1;
4485         filter:alpha(opacity=100);
4486 }
4487
4488 .filer-icon {
4489         display: block; width: 16px; height: 16px;
4490         background-image: url('images/file.gif');
4491         margin-left: 5px;
4492         float: left;
4493 }
4494
4495 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
4496 [class^="comment-edit-bb"] {
4497         list-style: none;
4498         display: none;
4499         margin: 0px 0 -5px 0px;
4500         padding: 0px;
4501         width: 75%;
4502 }
4503
4504 .body-attach {
4505         margin-top: 10px;
4506 }
4507
4508 .grey {
4509         color: #888888;
4510 }
4511
4512 .location,
4513 .location-label,
4514 .gender-label,
4515 .marital-label,
4516 .homepage-label {
4517         float: left;
4518         text-align: left;
4519         display: block;
4520         line-height: 0.6em;
4521 }
4522
4523 .adr,
4524 .x-gender,
4525 .marital-text,
4526 .homepage-url {
4527         float: left;
4528         display: block;
4529         margin-left: 8px;
4530         line-height: 1em;
4531         text-align: left;
4532 }
4533
4534 #birthday-notice {}
4535 #nav-notifications-template {}
4536 #categories-sidebar {}
4537 #nets-desc {}
4538 #status-tab {}
4539 #page-footer {}
4540 #live-profile {}
4541
4542 .city-state-zip {}
4543 .country-name {}
4544 .locality {}
4545 .region {}
4546 .postal-code {}
4547 .mpfriend {}
4548 .toplevel_item {}
4549
4550 .fc-header,
4551 .fc-view,
4552 .fc-view-basicWeek,
4553 .fc-grid,
4554 .fc-border-separate,
4555 .fc-content {}
4556
4557 div #datebrowse-sidebar.widget {
4558         text-align:center;
4559 }
4560
4561 /* Fakelink */
4562
4563 .fakelink,
4564 .fakelink:visited,
4565 .fakelink:link {
4566         color: #1873a2;
4567         cursor: pointer;
4568         margin-bottom: 10px;
4569         /*background: url("images/down.png") no-repeat scroll left center transparent;*/
4570 }
4571
4572 .fakelink:hover {
4573         color: #6da6c4;
4574 }
4575
4576 #id_theme {
4577         margin:10px 10px 0 0;
4578 }
4579
4580 #id_maxreq,
4581 #id_cntunkmail,
4582 #id_expire {
4583         width: 75px;
4584 }
4585
4586 #id_post_newfriend,
4587 #id_post_joingroup,
4588 #id_post_profilechange,
4589 #id_notify1,
4590 #id_notify2,
4591 #id_notify3,
4592 #id_notify4,
4593 #id_notify5,
4594 #id_notify6,
4595 #id_notify7,
4596 #id_notify8,
4597 #id_allow_location {
4598         margin: 6px 0 0 10px;
4599 }
4600
4601 #settings-form {}
4602 .select {}
4603 .field_help {
4604         margin: 5px 0 10px;
4605 }
4606
4607 #settings-activity-desc,
4608 #settings-notify-desc {
4609         margin: 10px 10px 10px 0;
4610         font-weight: bold;
4611 }
4612
4613 #settings-notifications {
4614         width: 410px;
4615         border: 1px solid #7C7D7B;
4616         box-shadow: 0 0 8px #BDBDBD;
4617                 -moz-box-shadow: 0 0 8px #BDBDBD;
4618                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4619         border-radius: 5px;
4620                 -moz-border-radius: 5px;
4621                 -webkit-border-radius: 5px;
4622         padding: 10px;
4623         margin: 10px 10px 10px 0;
4624 }
4625
4626 #id_npassword {}
4627
4628 #hide-comments-page-widget {
4629         margin-left: 40px;
4630 }
4631
4632 #collapsed-comments-page-widget {}
4633
4634 .tool {
4635     list-style-type: disc;
4636 }
4637
4638 #logo-text {
4639 }
4640
4641 #logo-img {
4642         margin: 3px 0 0 0;
4643 }
4644
4645 .bigwidget {}
4646
4647 #remote-friends-in-common  {}
4648
4649 .settings-block {
4650         border: 1px solid #7C7D7B;
4651         box-shadow: 0 0 8px #BDBDBD;
4652                 -moz-box-shadow: 0 0 8px #BDBDBD;
4653                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4654         border-radius: 5px;
4655                 -moz-border-radius: 5px;
4656                 -webkit-border-radius: 5px;
4657         padding:10px;
4658         margin:10px 10px 10px 0;
4659 }
4660
4661 #page-settings-label{
4662         width: auto !important;
4663         margin-bottom: 5px !important;
4664 }
4665
4666 .onoff {
4667         margin-right: 10px;
4668 }
4669
4670 .settings-heading {
4671         margin: 25px 0 25px 0;
4672 }
4673
4674 #id_itemcache,
4675 #id_basepath,
4676 #id_temppath,
4677 #id_lockpath,
4678 #id_proxyuser,
4679 #id_proxy,
4680 #id_allowed_email,
4681 #id_allowed_sites,
4682 #id_directory_submit_url,
4683 #id_register_text {
4684         width: 440px;
4685 }
4686
4687 #id_itemcache_duration,
4688 #id_abandon_days,
4689 #id_maxloadavg,
4690 #id_poll_interval,
4691 #id_delivery_interval,
4692 #id_timeout,
4693 #id_jpegimagequality,
4694 #id_maximagelength,
4695 #id_maximagesize,
4696 #id_max_daily_registrations {
4697         width: 75px;
4698 }
4699
4700 #id_remember {
4701         width: auto;
4702         float: right;
4703 }
4704
4705 .field.input.openid {
4706 }