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     margin-bottom: 2em;
 229     width: 100%;
 230 }
 231
 232 table.list tr {
 233     border: 1px solid white;
 234 }
 235
 236 table.list tr:nth-child(even) td {
 237     background-color: #f7f7f7;
 238 }
 239
 240 table.list tr:nth-child(odd) td {
 241     background-color: #f0f0f0;
 242 }
 243
 244 table.list tr:nth-child(even):hover td {
 245     background-color: #e7e7e7;
 246 }
 247
 248 table.list tr:nth-child(odd):hover td {
 249     background-color: #e0e0e0;
 250 }
 251
 252 table.list th
 253 {
 254     text-align: left;
 255     padding: 5px;
 256 }
 257
 258 table.list th,
 259 table.list td
 260 {
 261     padding-right: 1em;
 262 }
 263
 264 table td.numeric,
 265 table th.numeric
 266 {
 267     text-align: right;
 268 }
 269
 270 table.list tr.group
 271 {
 272     font-weight: bold;
 273     height: 3em;
 274     vertical-align: bottom;
 275 }
 276
 277 table.list tr.group:hover td
 278 {
 279     /* don't show hover effect for group rows */
 280     background-color: inherit;
 281 }
 282
 283 .episode_list .title
 284 {
 285 }
 286
 287 .podcast_list p, .episode_list p
 288 {
 289     margin: 2px 0px 2px 0px;
 290     padding: 0px;
 291 }
 292
 293 .podcast_list p.description, .episode_list p.description
 294 {
 295     font-size: x-small;
 296 }
 297
 298 .description
 299 {
 300     color: #666;
 301 }
 302
 303 .URL
 304 {
 305     text-decoration: none;
 306     color: black;
 307 }
 308
 309 .URL:hover
 310 {
 311     text-decoration: underline;
 312 }
 313
 314 h1, h2
 315 {
 316     padding: 5px 0px 2px 0px;
 317     margin: 0px;
 318 }
 319
 320 h1 {
 321     font-size: 14pt;
 322 }
 323
 324 h2 {
 325     font-size: 12pt;
 326 }
 327
 328 img.device_icon
 329 {
 330     padding: 3px;
 331     vertical-align: middle;
 332 }
 333
 334 ul.devices li.desktop
 335 {
 336     list-style-image: url('16x16/computer.png');
 337 }
 338
 339 ul.devices li.laptop
 340 {
 341     list-style-image: url('16x16/stock_notebook.png');
 342 }
 343
 344 ul.devices li.mobile
 345 {
 346     list-style-image: url('16x16/stock_cell-phone.png');
 347 }
 348
 349 ul.devices li.server
 350 {
 351     list-style-image: url('16x16/server.png');
 352 }
 353
 354 ul.devices li.other
 355 {
 356     list-style-image: url('16x16/audio-x-generic.png');
 357 }
 358
 359 div.rate
 360 {
 361     padding-top: 2em;
 362     padding-bottom: 3em;
 363 }
 364
 365 div.devicesLeft
 366 {
 367     float:left;
 368         width: 10em;
 369 }
 370
 371 div.devicesRight
 372 {
 373     float:left;
 374     margin-top:-5px;
 375         width: 26px;
 376         height: 26px;
 377 }
 378
 379 div.devicesClear
 380 {
 381     clear:left;
 382 }
 383
 384
 385 form.search input[type="text"]
 386 {
 387     width: 300px;
 388     display: inline;
 389 }
 390
 391 form.search ul
 392 {
 393     display: inline;
 394     margin: 0px;
 395     padding: 0px;
 396 }
 397
 398 form.search ul li
 399 {
 400     list-style: none;
 401     display: inline;
 402 }
 403
 404 form.search input[type="submit"]
 405 {
 406     margin-top: 20px;
 407     display: inline;
 408 }
 409
 410 div.result img
 411 {
 412     float: left;
 413 }
 414
 415 div.result a.podcast
 416 {
 417     font-size: 1.2em;
 418     color: black;
 419     padding-top: 2em;
 420     font-weight: bold;
 421     display: block;
 422 }
 423
 424 div.result span.episode
 425 {
 426     display: list-item;
 427     margin-left: 2em;
 428 }
 429
 430 div.result span.episode a
 431 {
 432     color: black;
 433 }
 434
 435 div.result
 436 {
 437 }
 438
 439 div#podcastlogo
 440 {
 441     float: right;
 442     padding-left: 20px;
 443     padding-bottom: 10px;
 444 }
 445
 446 table.form
 447 {
 448 }
 449
 450 table.form th
 451 {
 452     font-weight: normal;
 453     text-align: right;
 454 }
 455
 456 input.url
 457 {
 458     width: 80%;
 459 }
 460
 461 .bar
 462 {
 463     background-color: #333;
 464     color: white;
 465     float: left;
 466     text-align: left;
 467 }
 468
 469 .bar span, .barbg span
 470 {
 471     padding-left: 5px;
 472     padding-right: 5px;
 473 }
 474
 475 .barbg
 476 {
 477     background-color: #aaa;
 478     text-align: right;
 479     color: black;
 480     float: left;
 481     width: 100%;
 482 }
 483
 484 td.position
 485 {
 486     font-size: 1.3em;
 487     font-weight: bold;
 488     padding-right: 0;
 489     margin-right: 0;
 490 }
 491
 492 td.oldposition
 493 {
 494     font-size: .8em;
 495 }
 496
 497 .pos
 498 {
 499     color: green;
 500 }
 501
 502 .neg
 503 {
 504     color: red;
 505 }
 506
 507 .new
 508 {
 509     color: #555;
 510 }
 511
 512 span.from_podcast, span.latest_episode {
 513     font-size: x-small;
 514     color: #666;
 515 }
 516
 517 span.from_podcast a, span.latest_episode a {
 518     color: #333;
 519 }
 520
 521 .time
 522 {
 523     width: 5em;
 524 }
 525
 526 .watermark
 527 {
 528     color: #aaa;
 529 }
 530
 531 ul.square-menu
 532 {
 533     padding: 20px;
 534 }
 535
 536 ul.square-menu li
 537 {
 538     display: block;
 539     float: left;
 540     width: 100px;
 541     height: 100px;
 542     margin: 10px;
 543     background-color: #aaa;
 544     text-align: center;
 545 }
 546
 547 ul.square-menu li a
 548 {
 549     position: relative;
 550     bottom: -40px;
 551 }
 552
 553 address
 554 {
 555     clear: both;
 556     text-align: center;
 557     padding: 5px;
 558     font-style: normal;
 559     color: #999;
 560 }
 561
 562 .own-chapter
 563 {
 564     font-weight: bold;
 565 }
 566
 567 div.related-podcasts
 568 {
 569     float: right;
 570 }
 571
 572 div.intro-box
 573 {
 574     text-align: justify;
 575     float: left;
 576     width: 40%;
 577     padding-top: 1em;
 578     padding-left: 5%;
 579     padding-bottom: 1em;
 580 }
 581
 582 div.wide-box
 583 {
 584     float: left;
 585     width: 90%;
 586     padding-top: 1em;
 587     padding-left: 5%;
 588     padding-bottom: 1em;
 589 }
 590
 591 div.intro-box ul
 592 {
 593     text-align: left;
 594 }
 595
 596 div.come-in-box
 597 {
 598     padding-top: 1em;
 599     padding-bottom: 1em;
 600     clear: both;
 601     font-size: 2em;
 602     text-align: center;
 603 }
 604
 605 .toplist-pos
 606 {
 607     padding-left: 1em;
 608 }
 609
 610 #tagcloud
 611 {
 612     text-align: justify;
 613 }
 614
 615 #feature-list h3
 616 {
 617     cursor: pointer;
 618 }
 619
 620 .sponsoring-podcast
 621 {
 622     padding-top: 1em;
 623     padding-bottom: 1em;
 624 }
 625
 626 .sponsoring-podcast img
 627 {
 628     float: left;
 629 }
 630
 631 .buttons
 632 {
 633 }
 634
 635 .action-button
 636 {
 637     vertical-align: middle;
 638     padding-bottom: .5em;
 639 }
 640
 641 .pagination
 642 {
 643     text-align: center;
 644 }
 645
 646 .pagination
 647 {
 648     font-size: 1.5em;
 649 }
 650
 651 .pagination span
 652 {
 653     padding: .5em .3em .5em .3em;
 654 }
 655
 656 .deactivated,
 657 .activated:hover
 658 {
 659     text-decoration: line-through;
 660 }
 661
 662 .config-toplist
 663 {
 664     float: left;
 665     padding-right: 2em;
 666 }
 667
 668 #subscribed-devices-list
 669 {
 670     float: left;
 671     width: 45%;
 672     margin-right: 3%;
 673 }
 674
 675 #tag-list
 676 {
 677     padding-left: 2%;
 678     float: left;
 679     background-color: #f7f7f7;
 680     width: 45%;
 681 }
 682
 683 #tag-list span.other
 684 {
 685     color: #888;
 686 }
 687
 688 #tag-list span.own a.remove
 689 {
 690     font-size: .7em;
 691     font-weight: bold;
 692 }
 693
 694 #tag-list span.own
 695 {
 696     color: black;
 697 }