view/theme/smoothly/style.css

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