view/theme/smoothly/style.css

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