MobileCydia.app/menes/style.css

   1 /* iPhone.css - iPhone Interface Cascading Style Sheet
   2  * Copyright (C) 2007-2008  Jay Freeman (saurik)
   3 */
   4
   5 /*
   6  *        Redistribution and use in source and binary
   7  * forms, with or without modification, are permitted
   8  * provided that the following conditions are met:
   9  *
  10  * 1. Redistributions of source code must retain the
  11  *    above copyright notice, this list of conditions
  12  *    and the following disclaimer.
  13  * 2. Redistributions in binary form must reproduce the
  14  *    above copyright notice, this list of conditions
  15  *    and the following disclaimer in the documentation
  16  *    and/or other materials provided with the
  17  *    distribution.
  18  * 3. The name of the author may not be used to endorse
  19  *    or promote products derived from this software
  20  *    without specific prior written permission.
  21  *
  22  * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS''
  23  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING,
  24  * BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
  25  * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
  26  * ARE DISCLAIMED. IN NO EVENT SHALL THE AUTHOR BE
  27  * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
  28  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT
  29  * NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
  30  * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
  31  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
  32  * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
  33  * TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN
  34  * ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
  35  * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  36 */
  37
  38 /* .clearfix {{{ */
  39 .clearfix:after {
  40     content: ".";
  41     display: block;
  42     clear: both;
  43     visibility: hidden;
  44     line-height: 0;
  45     height: 0;
  46 }
  47
  48 .clearfix {
  49     display: block;
  50 }
  51 /* }}} */
  52
  53 * {
  54     border: 0;
  55     -moz-border-radius: 0;
  56     -webkit-border-radius: 0;
  57     box-sizing: border-box;
  58     -moz-box-sizing: border-box;
  59     -ms-box-sizing: border-box;
  60     -webkit-box-sizing: border-box;
  61     /*font-family: inherit;*/
  62     font-size: 100%;
  63     font-style: inherit;
  64     font-weight: inherit;
  65     margin: 0;
  66     outline: 0;
  67     padding: 0;
  68     text-decoration: none;
  69     vertical-align: baseline;
  70 }
  71
  72 a {
  73     color: inherit;
  74 }
  75
  76 sup {
  77     font-size: smaller;
  78     margin-top: -6px;
  79     position: relative;
  80     top: -6px;
  81 }
  82
  83 select {
  84     border: 1px solid #999999;
  85 }
  86
  87 panel {
  88     display: block;
  89     width: 320px;
  90 }
  91
  92 body {
  93     font-family: Helvetica, Arial;
  94     -webkit-text-size-adjust: none;
  95     -webkit-user-select: none;
  96     margin: 0 auto;
  97     width: 320px;
  98 }
  99
 100 body.white {
 101     background-color: #ffffff;
 102 }
 103
 104 body.pinstripe {
 105     background: #c7ced5 url(cydia://uikit-image/UIPinstripe.png);
 106     background-size: 7px 1px;
 107 }
 108
 109 dialog {
 110     display: block;
 111     position: absolute;
 112     width: 100%;
 113 }
 114
 115 dialog > panel {
 116     display: block;
 117 }
 118
 119 a {
 120     color: blue;
 121     text-underline-style: dotted;
 122 }
 123
 124 strong {
 125     font-weight: bold
 126 }
 127
 128 pre, tt {
 129     font-family: monospace;
 130 }
 131
 132 pre {
 133     letter-spacing: -2px;
 134 }
 135
 136 em {
 137     font-style: italic;
 138 }
 139
 140 .default {
 141     color: #aaaabb;
 142 }
 143
 144 .deleted {
 145     display: none;
 146 }
 147
 148 /* #toolbar {{{ */
 149 dialog > toolbar {
 150     background: url(toolbar.png) #6d84a2 repeat-x;
 151     border-bottom: 1px solid #2d3642;
 152     height: 45px;
 153     padding: 10px;
 154 }
 155
 156 dialog > toolbar > h1 {
 157     color: #ffffff;
 158     font-size: 20px;
 159     font-weight: bold;
 160     height: 100%;
 161     margin: 1px auto 0 auto;
 162     text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
 163     text-align: center;
 164     white-space: nowrap;
 165 }
 166 /* }}} */
 167 /* (back|forward)-button {{{ */
 168 dialog > toolbar > a.back-button,
 169 dialog > toolbar > a.forward-button {
 170     color: #ffffff;
 171     font-size: 12px;
 172     font-weight: bold;
 173     height: 30px;
 174     line-height: 30px;
 175     margin-top: -28px;
 176     padding: 0 3px;
 177     text-decoration: none;
 178     text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
 179     white-space: nowrap;
 180 }
 181
 182 dialog > toolbar > a.back-button {
 183     -webkit-border-image: url(backButton.png) 0 8 0 14;
 184     border-width: 0 8px 0 14px;
 185     float: left;
 186 }
 187
 188 dialog > toolbar > a.forward-button {
 189     -webkit-border-image: url(toolButton.png) 0 5 0 5;
 190     border-width: 0 5px;
 191     float: right;
 192 }
 193 /* }}} */
 194
 195 panel > block {
 196     /*background-color: #ccd1d5;*/
 197     /*background-color: white;*/
 198     /*background-color: #c7ced5;*/
 199     background-color: transparent;
 200     //background-color: #ffffff;
 201     border-bottom: 1px solid #999999;
 202     border-top: 1px solid #999999;
 203     border-left: 1px dotted #999999;
 204     border-right: 1px dotted #999999;
 205     -moz-border-radius: 9px;
 206     -webkit-border-radius: 9px;
 207     //border: 1px solid #999999;
 208     display: block;
 209     font-size: 16px;
 210     margin: 9px;
 211     padding: 0 10px;
 212 }
 213
 214 panel > fieldset > div > hr,
 215 panel > block > hr {
 216     border-top: 1px dashed #999999;
 217 }
 218
 219 panel > fieldset {
 220     background-color: #ffffff;
 221     border: 1px solid #999999;
 222     -moz-border-radius: 9px;
 223     -webkit-border-radius: 9px;
 224     font-size: 16px;
 225     margin: 9px;
 226 }
 227
 228 panel > input[type="submit"] {
 229     /*-webkit-border-image: url(whiteButton.png) 0 12 0 12;
 230     -moz-border-radius: 0;
 231     -webkit-border-radius: 0;
 232     border-width: 0px 12px;*/
 233     border: none;
 234     color: #000000;
 235     display: block;
 236     font-size: 20px;
 237     font-weight: bold;
 238     margin: 9px;
 239     height: 44px;
 240     padding: 10px;
 241     text-align: center;
 242     width: 302px;
 243 }
 244
 245 list > label {
 246     background: #a7b3bc url(cydia://uikit-image/UISectionListHeaderBackground.png);
 247     background-repeat: repeat-x no-repeat-y;
 248     margin-bottom: 0px;
 249     padding: 4px 15px 1px 15px;
 250     display: block;
 251     color: white;
 252     font-size: inherit;
 253     font-weight: bold;
 254     text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 0;
 255 }
 256
 257 panel > label {
 258     display: block;
 259     margin: 13px 0 -4px 24px;
 260     line-height: 24px;
 261     font-size: inherit;
 262     font-weight: bold;
 263     color: #4d4d70;
 264     text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
 265 }
 266
 267 panel > fieldset > a,
 268 panel > fieldset > div,
 269 panel > fieldset > textarea {
 270     border-top: 1px solid #999999;
 271 }
 272
 273 /* XXX: should be a.left:nth-last-child(2) */
 274 panel > fieldset > a.left,
 275 panel > fieldset > a.middle,
 276 panel > fieldset > a:first-child,
 277 panel > fieldset > div:first-child,
 278 panel > fieldset > textarea:first-child {
 279     border-top: 0;
 280 }
 281
 282 list > fieldset > a,
 283 list > fieldset > div,
 284 list > fieldset > textarea {
 285     border-bottom: 1px solid #e0e0e0;
 286 }
 287
 288 fieldset > a:not([type="ad"]),
 289 fieldset > div,
 290 fieldset > textarea {
 291     /* XXX: small differences due to font bugs */
 292     padding: 12px 14px 10px 14px;
 293 }
 294
 295 /*fieldset > a:not([type="ad"]):last-child,
 296 fieldset > div:last-child {
 297     padding-bottom: 10px;
 298 }*/
 299
 300 fieldset > a[type="ad"] {
 301     /* XXX: small differences due to font bugs */
 302     padding: 4px 4px 2px 5px;
 303 }
 304
 305 panel > fieldset > a[type="ad"]:first-child > div:first-child,
 306 panel > fieldset > a[type="comment"]:first-child > div:first-child,
 307 panel > fieldset > a[type="profile"]:first-child > div:first-child,
 308 panel > fieldset > a[type="thumb"]:first-child > div:first-child {
 309     -moz-border-radius-topleft: 9px;
 310     -webkit-border-top-left-radius: 9px;
 311 }
 312
 313 panel > fieldset > a[type="ad"]:last-child > div:first-child,
 314 panel > fieldset > a[type="comment"]:last-child > div:first-child,
 315 panel > fieldset > a[type="profile"]:last-child > div:first-child,
 316 panel > fieldset > a[type="thumb"]:last-child > div:first-child {
 317     -moz-border-radius-bottomleft: 9px;
 318     -webkit-border-bottom-left-radius: 9px;
 319 }
 320
 321 fieldset > a[type="ad"] > div:first-child {
 322     border: 1px solid #999999;
 323 }
 324
 325 list > fieldset > a[type="comment"] > div:first-child,
 326 list > fieldset > a[type="profile"] > div:first-child,
 327 list > fieldset > a[type="thumb"] > div:first-child {
 328     border: 1px solid #e0e0e0;
 329 }
 330
 331 panel > fieldset > a[type="comment"] > div:first-child {
 332     border: 1px solid #999999;
 333     border-bottom-style: dashed;
 334 }
 335
 336 panel > fieldset > a[type="profile"] > div:first-child,
 337 panel > fieldset:not(.header) > a[type="thumb"] > div:first-child {
 338     border: 1px solid #999999;
 339 }
 340
 341 div[tile] {
 342     float: right;
 343     height: 30px;
 344     width: 30px;
 345 }
 346
 347 div[tile="app"]   { background-image: url(http://cache.saurik.com/cydia/tile/app.png);   }
 348 div[tile="call"]  { background-image: url(http://cache.saurik.com/cydia/tile/call.png);  }
 349 div[tile="map"]   { background-image: url(http://cache.saurik.com/cydia/tile/map.png);   }
 350 div[tile="media"] { background-image: url(http://cache.saurik.com/cydia/tile/media.png); }
 351 div[tile="music"] { background-image: url(http://cache.saurik.com/cydia/tile/video.png); }
 352 div[tile="site"]  { background-image: url(http://cache.saurik.com/cydia/tile/site.png);  }
 353
 354 fieldset > a[type="ad"] > div:first-child {
 355     background-repeat: no-repeat;
 356     background-position: center center;
 357     border-right: none;
 358     display: inline-block;
 359     height: 40px;
 360     line-height: 38px;
 361     /* XXX: small differences due to font bugs */
 362     /* XXX: 1px difference due to border stupidity */
 363     margin: -5px 5px -3px -6px;
 364     width: 40px;
 365 }
 366
 367 panel > fieldset > a[type="comment"] {
 368     border-bottom-style: dashed;
 369 }
 370
 371 fieldset > a[type="comment"] > div:first-child {
 372     -webkit-background-size: 44px;
 373     height: 44px;
 374     width: 44px;
 375 }
 376
 377 fieldset > a[type="header"] > div:first-child {
 378     height: 64px;
 379     width: 64px;
 380 }
 381
 382 fieldset > a[type="profile"] > div:first-child {
 383     -webkit-background-size: 50px;
 384     height: 50px;
 385     width: 50px;
 386 }
 387
 388 fieldset > a[type="thumb"] > div:first-child  {
 389     height: 64px;
 390     width: 64px;
 391 }
 392
 393 fieldset > a[type="comment"] > div:first-child,
 394 fieldset > a[type="header"] > div:first-child,
 395 fieldset > a[type="profile"] > div:first-child,
 396 fieldset > a[type="thumb"] > div:first-child {
 397     background-repeat: no-repeat;
 398     background-position: center center;
 399     display: inline-block;
 400     /* XXX: small differences due to font bugs */
 401     /* XXX: 1px difference due to border stupidity */
 402     margin: -13px 7px -11px -15px;
 403 }
 404
 405 fieldset > a > img.icon,
 406 fieldset > div > img.icon {
 407     height: auto;
 408     /* XXX: small differences due to font bugs */
 409     margin: -7px 6px -9px -8px;
 410     max-height: 30px;
 411     min-width: 30px;
 412     width: 30px;
 413 }
 414
 415 fieldset > a.sixth > img.icon {
 416     position: relative;
 417     left: 7px;
 418 }
 419
 420 panel > block > p,
 421 fieldset > div > p,
 422 panel > block > ul,
 423 fieldset > div > ul {
 424     margin: 10px 0;
 425 }
 426
 427 panel > block > ul,
 428 fieldset > div > ul {
 429     margin-left: 13px;
 430 }
 431
 432 panel > block > p,
 433 fieldset > div > p {
 434     text-align: center;
 435 }
 436
 437 fieldset > div > p:first-child,
 438 fieldset > div > ul:first-child {
 439     margin-top: 0;
 440 }
 441
 442 fieldset > div > p:last-child,
 443 fieldset > div > ul:last-child {
 444     margin-bottom: 0;
 445 }
 446
 447 fieldset > a {
 448     color: inherit;
 449     display: block;
 450 }
 451
 452 fieldset > textarea,
 453 fieldset > div > input:not([type="checkbox"]),
 454 fieldset > div > select,
 455 fieldset > div > div > select {
 456     background: none;
 457     -webkit-box-shadow: none;
 458     -webkit-appearance: none;
 459 }
 460
 461 /* Chevrons {{{ */
 462
 463 fieldset > a[href]:not([type="ad"]),
 464 fieldset > div > select,
 465 fieldset > div > div > select {
 466     background-repeat: no-repeat;
 467     background-image: url(chevron.png);
 468 }
 469
 470 @media screen and (-webkit-min-device-pixel-ratio: 2) {
 471 fieldset > a[href]:not([type="ad"]),
 472 fieldset > div > select,
 473 fieldset > div > div > select {
 474     background-image: url(chevron@2x.png);
 475     background-size: 10px 13px;
 476 } }
 477
 478 /* Horizontal */
 479
 480 list > fieldset > a[href] {
 481     background-position: 295px center;
 482 }
 483
 484 panel > fieldset > a[href] {
 485     background-position: 275px center;
 486 }
 487
 488 panel > fieldset > a[href].half {
 489     background-position: 125px center;
 490 }
 491
 492 panel > fieldset > a[href].third {
 493     background-position: 75px center;
 494 }
 495
 496 panel > fieldset > a[href].sixth {
 497     background: none;
 498 }
 499
 500 list > fieldset > a:not([href]) > select,
 501 list > fieldset > div > select,
 502 list > fieldset > div > div > select {
 503     background-position: 183px center;
 504 }
 505
 506 panel > fieldset > a:not([href]) > select,
 507 panel > fieldset > div > select,
 508 panel > fieldset > div > div > select {
 509     background-position: 163px center;
 510 }
 511
 512 /* }}} */
 513
 514 fieldset > textarea,
 515 fieldset > div > input,
 516 fieldset > div > select,
 517 fieldset > div > div > select,
 518 fieldset > a > div > label + label,
 519 fieldset > div > div > label + label {
 520     color: #193250;
 521 }
 522
 523 fieldset > textarea,
 524 fieldset > div > input,
 525 fieldset > div > select,
 526 fieldset > div > div > select {
 527     font-size: 16px;
 528 }
 529
 530 fieldset > div > input {
 531     padding-left: 7px;
 532     padding-right: 14px;
 533 }
 534
 535 fieldset > div > input[type="checkbox"] {
 536     border: 1px solid #999999;
 537     -moz-border-radius: 7px;
 538     -webkit-border-radius: 7px;
 539     float: right;
 540     margin: -7px -8px;
 541     height: 30px;
 542     width: 30px;
 543 }
 544
 545 fieldset > div > select,
 546 fieldset > div > div > select,
 547 fieldset > div > input:not([type="checkbox"]) {
 548     border: none;
 549     float: right;
 550     height: 40px;
 551     margin: -11px -13px -11px -14px;
 552 }
 553
 554 panel > fieldset > div > select,
 555 panel > fieldset > div > div > select,
 556 panel > fieldset > div > input:not([type="checkbox"]) {
 557     width: 187px;
 558 }
 559
 560 list > fieldset > div > select,
 561 list > fieldset > div > div > select,
 562 list > fieldset > div > input:not([type="checkbox"]) {
 563     width: 207px;
 564 }
 565
 566 fieldset > textarea {
 567     padding: 10px;
 568     width: 320px;
 569 }
 570
 571 fieldset > div > div,
 572 fieldset > a > div {
 573     display: inline-block;
 574 }
 575
 576 fieldset > div > div {
 577     width: 273px;
 578 }
 579
 580 fieldset > a[type="ad"] > div:nth-child(2) {
 581     width: 218px;
 582 }
 583
 584 fieldset > a:not([type]) > div {
 585     width: 250px;
 586 }
 587
 588 fieldset > a:not([href]) > img.icon + div,
 589 fieldset > div > img.icon + div {
 590     width: 244px;
 591 }
 592
 593 fieldset > a[href] > img.icon + div {
 594     width: 221px;
 595 }
 596
 597 fieldset > a[type="profile"] > div:nth-child(2) > label:nth-child(1).unknown {
 598     color: #aaaabb;
 599 }
 600
 601 fieldset > a[type="profile"] > div:nth-child(2) > label:only-child {
 602     left: 4px;
 603     position: relative;
 604     top: 3px;
 605 }
 606
 607 fieldset > a[type="thumb"] > div:nth-child(2) > label:only-child {
 608     position: relative;
 609     top: 10px;
 610 }
 611
 612 fieldset > a[type="profile"] > div:nth-child(2) > label + label {
 613     display: block;
 614     font-size: 13px;
 615     margin-top: 2px;
 616 }
 617
 618 fieldset > a[type="thumb"] > div:nth-child(2) > label + label {
 619     display: block;
 620     margin-top: 2px;
 621 }
 622
 623 fieldset > a[type="profile"] > div:nth-child(2) {
 624     width: 207px;
 625 }
 626
 627 fieldset > a[type="thumb"] > div:nth-child(2) {
 628     width: 193px;
 629 }
 630
 631 fieldset > a[type="profile"] > div:nth-child(2) {
 632     margin: -5px 0;
 633 }
 634
 635 fieldset > a[type="profile"] > div:nth-child(2),
 636 fieldset > a[type="thumb"] > div:nth-child(2) {
 637     vertical-align: top;
 638 }
 639
 640 fieldset > a > label:first-child,
 641 fieldset > a > div > label:first-child,
 642 fieldset > div > label:first-child,
 643 fieldset > div > div > label:first-child {
 644     font-weight: bold;
 645 }
 646
 647 /* XXX: this doesn't handle icon offsets */
 648 list > fieldset > a:not([type]) > div > label + label,
 649 list > fieldset > div > div > label + label {
 650     margin-left: 94px;
 651 }
 652
 653 panel > fieldset > a:not([type]) > div > label + label,
 654 panel > fieldset > div > div > label + label {
 655     float: right;
 656     text-align: right;
 657 }
 658
 659 panel > img {
 660     display: block;
 661     margin: 9px auto 4px auto;
 662     height: auto;
 663     width: 300px;
 664 }
 665
 666 fieldset > a[type="ad"] {
 667 }
 668
 669 fieldset > a[type="ad"] > div:nth-child(2) {
 670     position: relative;
 671     vertical-align: top;
 672 }
 673
 674 fieldset > a[type="ad"] > div > label:first-child {
 675     color: #2d2d50;
 676     font-size: 13px;
 677     font-weight: bold;
 678     line-height: 15px;
 679 }
 680
 681 fieldset > a[type="ad"] > div > label + label {
 682     position: absolute;
 683     top: 17px;
 684     left: 156px;
 685     font-size: 9.5px;
 686     font-weight: normal;
 687 }
 688
 689 panel > fieldset > a.middle,
 690 panel > fieldset > a.right {
 691     border-left: 1px solid #999999;
 692 }
 693
 694 panel > fieldset > a.half {
 695     display: inline-block;
 696     width: 150px;
 697 }
 698
 699 panel > fieldset > a.third {
 700     display: inline-block;
 701     width: 100px;
 702 }
 703
 704 panel > fieldset > a.sixth {
 705     display: inline-block;
 706     width: 50px;
 707 }
 708
 709 fieldset.half > a {
 710     background: none;
 711     background-position: 120px center;
 712 }
 713
 714 fieldset.half > a > img.icon + div {
 715     width: 65px;
 716 }
 717
 718 fieldset.right {
 719     float: right;
 720     margin-left: 10px;
 721 }
 722
 723 block + fieldset.right,
 724 fieldset + fieldset.right {
 725     margin-top: 0;
 726 }
 727
 728 fieldset.half {
 729     width: 146px;
 730 }
 731
 732 panel > fieldset.dashed > a,
 733 panel > fieldset.dashed > div,
 734 panel > fieldset.dashed > textarea,
 735 list > fieldset.dashed > a,
 736 list > fieldset.dashed > div,
 737 list > fieldset.dashed > textarea {
 738     border-style: dashed;
 739 }
 740
 741 fieldset > a[type="thumb"]:first-child > back {
 742     -moz-border-radius-topright: 9px;
 743     -webkit-border-top-right-radius: 9px;
 744 }
 745
 746 fieldset > a[type="thumb"]:last-child > back {
 747     -moz-border-radius-bottomright: 9px;
 748     -webkit-border-bottom-right-radius: 9px;
 749 }
 750
 751 fieldset > a[type="thumb"] > back {
 752     background-repeat: no-repeat;
 753     border: 1px solid #999999;
 754     display: block;
 755     height: 64px;
 756     left: 62px;
 757     position: absolute;
 758     opacity: 0.2;
 759     top: -1px;
 760     width: 237px;
 761 }
 762
 763 .mm {
 764     border: 1px solid #999999;
 765     -moz-border-radius: 9px;
 766     -webkit-border-radius: 9px;
 767 }
 768
 769 a.mm {
 770     display: block;
 771     margin: 9px;
 772 }
 773
 774 div.mm img {
 775     height: auto;
 776     width: 300px;
 777 }
 778
 779 fieldset > a.small {
 780     font-size: 12px;
 781     padding-top: 9px;
 782 }
 783
 784 fieldset > a.small label {
 785     display: inline-block;
 786     position: relative;
 787     top: 1px;
 788 }
 789
 790 fieldset > a.small > img.icon {
 791     max-height: 22px;
 792     min-width: 22px;
 793     width: 22px;
 794 }
 795
 796 fieldset > a.small.half > img.icon + div {
 797     width: 79px;
 798 }
 799
 800 fieldset > a.small.third > img.icon + div {
 801     width: 50px;
 802 }
 803
 804 fieldset > a.small.sixth > img.icon + div {
 805     width: 0px;
 806 }
 807
 808 panel.centered > label {
 809     margin-left: 0px;
 810     margin-right: 0px;
 811     text-align: center;
 812 }
 813
 814 panel > iframe {
 815     margin: -9px 0;
 816 }
 817
 818 panel > iframe:first-child,
 819 panel > iframe + iframe {
 820     margin-top: 0;
 821 }
 822
 823 /* Rating Stars {{{ */
 824 .ratings {
 825     margin: -2px 0;
 826     text-align: center;
 827 }
 828
 829 .rated {
 830     display: inline-block;
 831 }
 832
 833 .rated.left {
 834     margin-right: 9px;
 835 }
 836
 837 .rated label {
 838     font-weight: bold;
 839     margin-right: 3px;
 840     position: relative;
 841     top: -3px;
 842 }
 843
 844 .rating {
 845     display: inline-block;
 846     width: 80px;
 847 }
 848
 849 .rating .back,
 850 .rating .fore,
 851 .rating .star {
 852     background: url(http://cache.saurik.com/crystal/16x16/actions/knewstuff.png);
 853     height: 16px;
 854 }
 855
 856 .rating .back,
 857 .rating .fore {
 858     width: 80px;
 859 }
 860
 861 .rating .star {
 862     display: inline-block;
 863     width: 16px;
 864 }
 865
 866 .rating .back {
 867     opacity: 0.2;
 868 }
 869
 870 .rating .fore {
 871     /*border-right: 1px solid #999999;*/
 872     position: absolute;
 873 }
 874 /* }}} */
 875
 876 panel > fieldset.header {
 877     background-color: transparent;
 878     border: none;
 879     margin: -5px 9px -11px 9px;
 880 }
 881
 882 panel > fieldset.header > a > div > label {
 883     color: #4d4d70;
 884     text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
 885 }