view/theme/smoothly/style.css

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