view/theme/smoothly/style.css

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