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