view/theme/smoothly/style.css

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