view/theme/smoothly/style.css

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