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