view/theme/smoothly/style.css

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