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