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