view/theme/smoothly/style.css

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