view/theme/smoothly/style.css

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