htdocs/media/screen.css

   1 body
   2 {
   3     font-family: DeJaVu Sans, Bitstream Vera Sans, sans-serif;
   4     background-color: #333;
   5     padding: 0px;
   6     margin: 0px;
   7 }
   8
   9 body, table, td, th
  10 {
  11     font-size: 12px;
  12 }
  13
  14 hr
  15 {
  16     border-width: 0px;
  17     border-bottom: 1px #aaa dotted;
  18     clear: both;
  19 }
  20
  21 img
  22 {
  23     border-width: 0px;
  24 }
  25
  26 #body
  27 {
  28     width: 800px;
  29     margin-left: auto;
  30     margin-right: auto;
  31     background-color: white;
  32     min-height: 100%;
  33     padding: 0px;
  34 }
  35
  36 #logo
  37 {
  38         float: right;
  39         padding: 0px;
  40         margin: 7px 10px 0px 0px;
  41 }
  42
  43 #content-area
  44 {
  45     padding: 20px;
  46 }
  47
  48 #logininfo
  49 {
  50     float: right;
  51     margin-top: 1px;
  52     background-color: white;
  53     padding: 5px;
  54     text-align: right;
  55     background-image: url('logininfo-bottomleft.png');
  56     background-repeat: no-repeat;
  57     background-position: bottom left;
  58 }
  59
  60 #navigation
  61 {
  62     background-color: rgb(102, 102, 102);
  63 }
  64
  65 a {
  66     color: #10488B;
  67     text-decoration: none;
  68 }
  69
  70 a:hover {
  71     text-decoration: underline;
  72 }
  73
  74 div.error
  75 {
  76     border-radius: 4px;
  77     background-color: #fa7080;
  78     border: #f5001d thin solid;
  79     padding: 1em 1em 1em 45px;
  80     background-image: url('dialog-error.png');
  81     background-repeat: no-repeat;
  82     background-position: 3px 50%;
  83     margin: .5em;
  84 }
  85
  86 table.register th {
  87     font-weight:normal;
  88     width:150px;
  89     text-align:left;
  90 }
  91
  92 .success
  93 {
  94     background-color: #b7f46e;
  95     border: #539800 thin solid;
  96     border-radius: 4px;
  97     padding: 1em 1em 1em 45px;
  98     background-image: url('emblem-default.png');
  99     background-repeat: no-repeat;
 100     background-position: 3px 50%;
 101     margin: .5em;
 102 }
 103
 104 .info
 105 {
 106     border-radius: 4px;
 107     background-color: #eeeeee;
 108     border: #aaaaaa thin solid;
 109     padding: 1em 1em 1em 45px;
 110     background-image: url('info.png');
 111     background-repeat: no-repeat;
 112     background-position: 3px 50%;
 113     margin: .5em;
 114 }
 115
 116 .info a
 117 {
 118     color: black;
 119 }
 120
 121
 122 .menu a
 123 {
 124     color: #aaa;
 125 }
 126
 127 ul.menu
 128 {
 129     list-style-type: none;
 130     padding: 10px;
 131     margin: 0px;
 132     border-width: 0px;
 133 }
 134
 135 ul.menu.secondary
 136 {
 137     background-color: #777;
 138     padding-left: 40px;
 139     padding-top: 20px;
 140     border-top: 1px #666 solid;
 141 }
 142
 143 ul.menu.primary
 144 {
 145     padding-top: 20px;
 146 }
 147
 148 ul.menu li {
 149     display: inline;
 150     padding: 10px;
 151     padding-left: 10px;
 152     border-width: 0px;
 153     text-shadow: 0px 0px 3px #333;
 154     position: relative;
 155     top: 1px;
 156 }
 157
 158 ul.menu.primary li.selected {
 159     background-color: #777;
 160     background-image: url('navcaps/primary-top-left.png'),
 161                       url('navcaps/primary-top-right.png');
 162     background-position: top left, top right;
 163     background-repeat: no-repeat;
 164     text-shadow: 0px 0px 4px #333;
 165 }
 166
 167 ul.menu.primary li.selected:hover {
 168     background-color: #777;
 169 }
 170
 171 ul.menu.secondary li.selected a,
 172 ul.menu.secondary li.selected a:hover,
 173 ul.menu.secondary li.selected a:visited,
 174 ul.menu.secondary li.selected:hover a {
 175     color: black;
 176 }
 177
 178 ul.menu.secondary li.selected {
 179     position: relative;
 180     top: 1px;
 181     background-color: white;
 182     background-image: url('navcaps/secondary-top-left.png'),
 183                       url('navcaps/secondary-top-right.png'),
 184                       url('navcaps/secondary-bg-gradient.png');
 185     background-position: top left, top right, top left;
 186     background-repeat: no-repeat, no-repeat, repeat-x;
 187     text-shadow: 0px 0px 4px #777;
 188 }
 189
 190 ul.menu.secondary li.selected:hover {
 191     background-color: white;
 192 }
 193
 194 ul.menu li a:hover {
 195     text-shadow: 0px 0px 5px black;
 196 }
 197
 198 ul.menu.secondary li.selected a:hover {
 199     text-shadow: 0px 0px 5px #444;
 200 }
 201
 202 ul.menu li:hover a {
 203     text-decoration: none;
 204 }
 205
 206 ul.menu li.selected a, ul.menu li.selected:hover a {
 207     color: white;
 208 }
 209
 210 ul.menu li.heading {
 211     cursor: default;
 212 }
 213
 214 ul.menu li.heading:hover {
 215     background-color: #777;
 216 }
 217
 218 .menu strong {
 219     color: white;
 220     padding-left: 10px;
 221     padding-right: 10px;
 222 }
 223
 224 table.list
 225 {
 226     font-size: 1em;
 227     border-collapse: collapse;
 228     width: 100%;
 229 }
 230
 231 table.list tr {
 232     border: 1px solid white;
 233 }
 234
 235 table.list tr:nth-child(even) td {
 236     background-color: #f7f7f7;
 237 }
 238
 239 table.list tr:nth-child(odd) td {
 240     background-color: #f0f0f0;
 241 }
 242
 243 table.list tr:nth-child(even):hover td {
 244     background-color: #e7e7e7;
 245 }
 246
 247 table.list tr:nth-child(odd):hover td {
 248     background-color: #e0e0e0;
 249 }
 250
 251 table.list th
 252 {
 253     text-align: left;
 254     padding: 5px;
 255 }
 256
 257 table.list th,
 258 table.list td
 259 {
 260     padding-right: 1em;
 261 }
 262
 263 table td.numeric,
 264 table th.numeric
 265 {
 266     text-align: right;
 267 }
 268
 269 table.list tr.group
 270 {
 271     font-weight: bold;
 272     height: 3em;
 273     vertical-align: bottom;
 274 }
 275
 276 table.list tr.group:hover td
 277 {
 278     /* don't show hover effect for group rows */
 279     background-color: inherit;
 280 }
 281
 282 .episode_list .title
 283 {
 284 }
 285
 286 .podcast_list
 287 {
 288     margin-bottom: 1em;
 289 }
 290
 291 .podcast_list p, .episode_list p
 292 {
 293     margin: 2px 0px 2px 0px;
 294     padding: 0px;
 295 }
 296
 297 .podcast_list p.description, .episode_list p.description
 298 {
 299     font-size: x-small;
 300 }
 301
 302 .description
 303 {
 304     color: #666;
 305 }
 306
 307 .URL
 308 {
 309     text-decoration: none;
 310     color: black;
 311 }
 312
 313 .URL:hover
 314 {
 315     text-decoration: underline;
 316 }
 317
 318 h1, h2
 319 {
 320     padding: 5px 0px 2px 0px;
 321     margin: 0px;
 322 }
 323
 324 h1 {
 325     font-size: 14pt;
 326 }
 327
 328 h2 {
 329     font-size: 12pt;
 330 }
 331
 332 img.device_icon
 333 {
 334     padding: 3px;
 335     vertical-align: middle;
 336 }
 337
 338 ul.devices li.desktop
 339 {
 340     list-style-image: url('16x16/computer.png');
 341 }
 342
 343 ul.devices li.laptop
 344 {
 345     list-style-image: url('16x16/stock_notebook.png');
 346 }
 347
 348 ul.devices li.mobile
 349 {
 350     list-style-image: url('16x16/stock_cell-phone.png');
 351 }
 352
 353 ul.devices li.server
 354 {
 355     list-style-image: url('16x16/server.png');
 356 }
 357
 358 ul.devices li.other
 359 {
 360     list-style-image: url('16x16/audio-x-generic.png');
 361 }
 362
 363 div.rate
 364 {
 365     padding-top: 2em;
 366     padding-bottom: 3em;
 367 }
 368
 369 div.devicesLeft
 370 {
 371     float:left;
 372         width: 10em;
 373 }
 374
 375 div.devicesRight
 376 {
 377     float:left;
 378     margin-top:-5px;
 379         width: 26px;
 380         height: 26px;
 381 }
 382
 383 div.devicesClear
 384 {
 385     clear:left;
 386 }
 387
 388
 389 form.search input[type="text"]
 390 {
 391     width: 300px;
 392     display: inline;
 393 }
 394
 395 form.search ul
 396 {
 397     display: inline;
 398     margin: 0px;
 399     padding: 0px;
 400 }
 401
 402 form.search ul li
 403 {
 404     list-style: none;
 405     display: inline;
 406 }
 407
 408 form.search input[type="submit"]
 409 {
 410     margin-top: 20px;
 411     display: inline;
 412 }
 413
 414 div.result img
 415 {
 416     float: left;
 417 }
 418
 419 div.result a.podcast
 420 {
 421     font-size: 1.2em;
 422     color: black;
 423     padding-top: 2em;
 424     font-weight: bold;
 425     display: block;
 426 }
 427
 428 div.result span.episode
 429 {
 430     display: list-item;
 431     margin-left: 2em;
 432 }
 433
 434 div.result span.episode a
 435 {
 436     color: black;
 437 }
 438
 439 div.result
 440 {
 441 }
 442
 443 div#podcastlogo
 444 {
 445     float: right;
 446     padding-left: 20px;
 447     padding-bottom: 10px;
 448 }
 449
 450 table.form
 451 {
 452 }
 453
 454 table.form th
 455 {
 456     font-weight: normal;
 457     text-align: right;
 458 }
 459
 460 input.url
 461 {
 462     width: 80%;
 463 }
 464
 465 .bar
 466 {
 467     background-color: #333;
 468     color: white;
 469     float: left;
 470     text-align: left;
 471 }
 472
 473 .bar span, .barbg span
 474 {
 475     padding-left: 5px;
 476     padding-right: 5px;
 477 }
 478
 479 .barbg
 480 {
 481     background-color: #aaa;
 482     text-align: right;
 483     color: black;
 484     float: left;
 485     width: 100%;
 486 }
 487
 488 td.position
 489 {
 490     font-size: 1.3em;
 491     font-weight: bold;
 492     padding-right: 0;
 493     margin-right: 0;
 494 }
 495
 496 td.oldposition
 497 {
 498     font-size: .8em;
 499 }
 500
 501 .pos
 502 {
 503     color: green;
 504 }
 505
 506 .neg
 507 {
 508     color: red;
 509 }
 510
 511 .new
 512 {
 513     color: #555;
 514 }
 515
 516 span.from_podcast, span.latest_episode {
 517     font-size: x-small;
 518     color: #666;
 519 }
 520
 521 span.from_podcast a, span.latest_episode a {
 522     color: #333;
 523 }
 524
 525 .time
 526 {
 527     width: 5em;
 528 }
 529
 530 .watermark
 531 {
 532     color: #aaa;
 533 }
 534
 535 ul.square-menu
 536 {
 537     padding: 20px;
 538 }
 539
 540 ul.square-menu li
 541 {
 542     display: block;
 543     float: left;
 544     width: 100px;
 545     height: 100px;
 546     margin: 10px;
 547     background-color: #aaa;
 548     text-align: center;
 549 }
 550
 551 ul.square-menu li a
 552 {
 553     position: relative;
 554     bottom: -40px;
 555 }
 556
 557 address
 558 {
 559     clear: both;
 560     text-align: center;
 561     padding: 5px;
 562     font-style: normal;
 563     color: #999;
 564 }
 565
 566 .own-chapter
 567 {
 568     font-weight: bold;
 569 }
 570
 571 div.related-podcasts
 572 {
 573     float: right;
 574 }
 575
 576 div.intro-box
 577 {
 578     text-align: justify;
 579     float: left;
 580     width: 40%;
 581     padding-top: 1em;
 582     padding-left: 5%;
 583     padding-bottom: 1em;
 584 }
 585
 586 div.wide-box
 587 {
 588     float: left;
 589     width: 90%;
 590     padding-top: 1em;
 591     padding-left: 5%;
 592     padding-bottom: 1em;
 593 }
 594
 595 div.intro-box ul
 596 {
 597     text-align: left;
 598 }
 599
 600 div.come-in-box
 601 {
 602     padding-top: 1em;
 603     padding-bottom: 1em;
 604     clear: both;
 605     font-size: 2em;
 606     text-align: center;
 607 }
 608
 609 .toplist-pos
 610 {
 611     padding-left: 1em;
 612 }
 613
 614 #tagcloud
 615 {
 616     text-align: justify;
 617 }
 618
 619 #feature-list h3
 620 {
 621     cursor: pointer;
 622 }
 623
 624 .sponsoring-podcast
 625 {
 626     padding-top: 1em;
 627     padding-bottom: 1em;
 628 }
 629
 630 .sponsoring-podcast img
 631 {
 632     float: left;
 633 }
 634
 635 button img
 636 {
 637     margin: 0 3px -3px 0 !important;
 638     padding: 0;
 639     border: none;
 640     width: 16px;
 641     height: 16px;
 642 }
 643
 644 .action-button
 645 {
 646     vertical-align: middle;
 647     padding-bottom: .5em;
 648 }
 649
 650 .pagination
 651 {
 652     text-align: center;
 653 }
 654
 655 .pagination
 656 {
 657     font-size: 1.5em;
 658 }
 659
 660 .pagination span
 661 {
 662     padding: .5em .3em .5em .3em;
 663 }
 664
 665 .deactivated,
 666 .activated:hover
 667 {
 668     text-decoration: line-through;
 669 }
 670
 671 .config-toplist
 672 {
 673     float: left;
 674     padding-right: 2em;
 675 }
 676
 677 .podcast-state
 678 {
 679     clear: both;
 680     overflow: hidden;
 681     float: left;
 682     margin-bottom: 1em;
 683 }
 684
 685 .podcast-state > div
 686 {
 687     float: left;
 688     margin-right: 2%;
 689     margin-left: 1%;
 690     width: 30%;
 691 }
 692
 693 .podcast-state > div > div
 694 {
 695     background-color: #f7f7f7;
 696     width: 100%;
 697     margin-bottom: -2000px;
 698     padding-bottom: 2000px;
 699 }
 700
 701 .podcast-state > div.tags > div,
 702 .podcast-state > div.share > div
 703 {
 704     padding-top: .5em;
 705     padding-left: 2%;
 706     padding-right: 2%;
 707     width: 96% !important;
 708 }
 709
 710 .tag-list span.other
 711 {
 712     color: #888;
 713 }
 714
 715 .tag-list span.own a.remove
 716 {
 717     font-size: .7em;
 718     font-weight: bold;
 719 }
 720
 721 .tag-list span.own
 722 {
 723     color: black;
 724 }
 725
 726 .tag-list input[type="text"]
 727 {
 728     margin-top: .5em;
 729     width: 85%;
 730 }
 731
 732 input.subscribe
 733 {
 734     background: url('/media/subscribe.png') no-repeat;
 735     cursor: pointer;
 736     width: 22px;
 737     height: 22px;
 738     border: none;
 739 }
 740
 741 input.blacklist
 742 {
 743     margin: 11px 0 0 0;
 744     background: url('/media/unsubscribe.png') no-repeat;
 745     cursor: pointer;
 746     width: 22px;
 747     height: 22px;
 748     border: none;
 749 }
 750
 751 form.rate,
 752 input.rate
 753 {
 754     display: inline;
 755 }
 756
 757 div.navigation
 758 {
 759 clear: both;
 760 }
 761
 762 div.navigation div
 763 {
 764     padding-top: .5em;
 765     padding-bottom: .5em;
 766     display: block;
 767     width: 33%;
 768     float: left;
 769 }
 770
 771 div.navigation div.list
 772 {
 773     text-align: center;
 774 }
 775
 776 div.navigation div.next
 777 {
 778     text-align: right;
 779 }
 780
 781 hr
 782 {
 783 clear: both;
 784 }
 785
 786 #listcontent h2
 787 {
 788         cursor: pointer;
 789 }