view/theme/smoothly/style.css

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