debwiki/css/debian.css.old

   1 /*
   2  *      www.debian.org stylesheet proposal
   3  *
   4  *      Kalle Soderman, 2008 debian.css
   5  *
   6  *      Copyleft : This work is free, you can copy, spread, and modify it under
   7  *      the terms of the Free Art License http://artlibre.org/licence/lal/en/
   8  *
   9  *
  10  *      Font size table
  11  *      ---------------
  12  *      Browser default 16px
  13  *              pixels  relative
  14  *              36px    2.25em
  15  *              31px    0.5161em
  16  *      24px    1.5em
  17  *      21px    1.3125em
  18  *      18px    1.125em
  19  *      16px    1em
  20  *              14px    0.875em
  21  *      12px    0.75em
  22  *      11px    0.6875em
  23  *      10px    0.625em
  24  *      9px             0.5625em
  25  */
  26 @media screen {
  27 /*
  28  * reset
  29  */
  30
  31 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
  32 blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
  33 font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl,
  34 dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
  35 tfoot, thead, tr, th, td {
  36         margin: 0;
  37         padding: 0;
  38         border: 0;
  39         outline: 0;
  40         font-weight: inherit;
  41         font-style: inherit;
  42         font-size: 100%;
  43         font-family: inherit;
  44         vertical-align: baseline;
  45 }
  46
  47 :focus {
  48         outline: 0;
  49 }
  50
  51 body {
  52         line-height: 1;
  53         color: black;
  54         background: white;
  55 }
  56
  57 ol, ul {
  58         list-style: none;
  59 }
  60
  61 table {
  62         border-collapse: separate;
  63         border-spacing: 0;
  64 }
  65
  66 caption, th, td {
  67         text-align: left;
  68         font-weight: normal;
  69 }
  70
  71 blockquote:before, blockquote:after,
  72 q:before, q:after {
  73         content: "";
  74 }
  75
  76 blockquote, q {
  77         quotes: "" "";
  78 }
  79
  80 html {
  81         background-color: transparent;
  82 }
  83
  84
  85 /*
  86  * start
  87  */
  88
  89 body {
  90         margin: 0;
  91         font: normal 100% sans-serif;
  92         line-height: 1.5;
  93         color: #222;
  94         background-color: white;
  95 }
  96
  97 #outer {
  98         margin: 0 10px 0 62px;
  99 }
 100
 101 #maincol {
 102         margin: 0 0 1.5em 0;
 103         }
 104
 105 /*
 106  *      Header
 107  */
 108
 109 #header {
 110         margin:0;
 111         padding:0 10px 0 62px;
 112         background-image:url('Pics/gradient.png');
 113         background-position: 0 0;
 114         background-repeat: repeat-x;
 115 }
 116
 117 #header a:link
 118 , #second-nav a:link {
 119         text-decoration: none;
 120 }
 121
 122 #header a:hover
 123 , #second-nav a:hover {
 124         text-decoration: underline;
 125 }
 126
 127 #breadcrumbs {
 128         font-size: 0.75em;
 129         background-color: transparent;
 130         background-color: #f5f6f7;
 131         margin:0;
 132         border-bottom: 1px solid #d2d3d7 ;
 133         text-transform:lowercase;
 134         line-height: 2;
 135 }
 136
 137 p.section {
 138         font-family:monospace;
 139         position:absolute;
 140         top: 0px;
 141         left:62px;
 142         text-transform: uppercase;
 143         letter-spacing: 0.08em;
 144         background-color: #c70036;
 145         line-height: 16px;
 146         color:white;
 147         padding: 0 5px 0 5px;
 148         margin:0;
 149 }
 150
 151 #navbar {
 152         background-color: transparent;
 153         list-style:none;
 154         display:block;
 155         border-bottom:1px solid #c70036;
 156         text-indent:0;
 157         padding: 0;
 158         margin-top:0;
 159         margin-bottom:0;
 160 }
 161
 162 #navbar ul {
 163         margin:0 ;
 164         padding:0 ;
 165         clear: both;
 166         overflow: hidden;
 167 }
 168
 169 #navbar li {
 170         list-style: none;
 171         float: left;
 172         padding: 0;
 173         margin: 0;
 174 }
 175
 176 #navbar a:link
 177 , #navbar a:visited {
 178         padding: 1.75em 1em 0.25em 1em;
 179         border-left: 1px solid transparent;
 180         border-right: 1px solid transparent;
 181         display: block;
 182         text-decoration: none;
 183 }
 184
 185 #navbar a:visited {
 186         color: #54638c;
 187 }
 188
 189 #navbar a:hover
 190 , #navbar a:visited:hover {
 191         background-color: #efefef;
 192         border-left: 1px solid  #d2d3d7;
 193         border-right: 1px solid #d2d3d7;
 194 }
 195
 196 #sitetools {
 197         text-align:left;
 198         margin: 0 10px 0 0;
 199         padding: 0px 0 1px 0;
 200         position: absolute;
 201         top:0;
 202         right:0;
 203         border-right: 1px solid white;
 204         border-left: 1px solid #d2d3d7;
 205         line-height: 1;
 206 }
 207
 208 #upperheader {
 209         margin:0;
 210         padding:0;
 211 }
 212
 213 #logo {
 214         position:absolute;
 215         top:0;
 216         left:0;
 217         padding: 0;
 218         background-color: transparent;
 219         border: 1px solid transparent;
 220         border-top: 0;
 221         width: 61px;
 222         height: 5.05em;
 223 }
 224
 225 #logo a {
 226         display: block;
 227         position: relative;
 228         padding: 0 5px 0 5px;
 229         height: 100%;
 230 }
 231
 232 #logo img {
 233         margin-top: 5px;
 234         position: absolute;
 235         bottom: 0.3em;
 236         overflow: auto;
 237 }
 238
 239 #logo:hover {
 240         border: 1px solid #d2d3d7 ;
 241         border-top: 0;
 242         background-color: #eee;
 243 }
 244
 245 /*
 246  *      Links
 247  */
 248
 249 a:link  {
 250         color: #0035c7;
 251         text-decoration: underline;
 252 }
 253
 254 a:visited {
 255         color: #54638c;
 256 }
 257
 258 a:hover {
 259         text-decoration: none;
 260         color: #00207a;
 261 }
 262
 263 a:active {
 264         color:#c2c3c7;
 265 }
 266
 267 a img {
 268         border:0;
 269 }
 270
 271 /*
 272  *      Secondnav
 273  */
 274
 275 #second-nav {
 276         width: 16em;
 277         float:right;
 278         padding:0 0 0 1.5em;
 279         margin: 2.41em 0 0 1.5em;
 280         border-left:1px solid #d3d6df;
 281         font-size: 0.75em;
 282         line-height: 1.5;
 283 }
 284
 285 #second-nav ul {
 286         padding:0;
 287         margin:0;
 288         list-style:none;
 289 }
 290
 291 #second-nav ul ul {
 292         margin-left: 1em;
 293 }
 294
 295 #second-nav li {
 296         font-weight: normal;
 297         margin:0;
 298         padding:0;
 299 }
 300
 301 #second-nav p {
 302         line-height: 2;
 303         font-weight: bold;
 304         margin: 0;
 305 }
 306
 307 #second-nav h2 {
 308         margin:0;
 309 }
 310
 311
 312 /*
 313  *      Typography
 314  */
 315
 316 p {
 317         margin: 1.5em 0 1.5em 0;
 318 }
 319
 320 strong {
 321         font-weight: bold;
 322 }
 323
 324 em {
 325         font-style: italic;
 326 }
 327
 328 h1
 329 , h2
 330 , h3
 331 , h4
 332 , h5
 333 , h6 {
 334         font-weight: 600;
 335         color: black;
 336 }
 337 small {
 338                 font-size: 0.75em;
 339 }
 340 sup {
 341                 font-size: 0.75em;
 342                 vertical-align:top;
 343 }
 344 h1 {
 345         line-height: 0.8;
 346         font-weight: normal;
 347         font-size: 1.875em;
 348         margin: 0.8em 0 0.8em 0;
 349 }
 350
 351 h2 {
 352         font-size: 1.5em;
 353         font-weight: normal;
 354         line-height: 1;
 355         margin: 1em 0 1em 0;
 356 }
 357
 358 h3 {
 359         font-size: 1.125em;
 360         line-height: 1.333em;
 361         margin: 1.333em 0 0 0;
 362 }
 363
 364
 365 h4 {
 366         font-weight: normal;
 367         font-style: italic;
 368         margin: 1.5em 0 1.5em 0;
 369 }
 370
 371 h5 {
 372         font-style: italic;
 373         font-size: 0.75em;
 374         margin: 2em 0 2em 0;
 375 }
 376
 377 ol,ul {
 378         padding-left: 1.5em;
 379         margin-left:0;
 380         margin: 1.5em 0 1.5em 0;
 381 }
 382
 383 ol {
 384                 list-style-type: decimal;
 385 }
 386
 387 ul {
 388         list-style-type: disc;
 389         }
 390
 391 th {
 392         font-weight: bold;
 393         margin: 1.5em 0 1.5em 0;
 394         }
 395
 396 hr {
 397         border: none;
 398         background-color: #bbb;
 399         height: 1px;
 400         margin: 1.4375em 0 1.5em 0;
 401 }
 402
 403 .hidecss {
 404         display: none;
 405 }
 406
 407 pre {
 408         overflow: auto;
 409 }
 410
 411 dd {
 412         margin:  0 0 0 1.5em;
 413 }
 414
 415 .toc {
 416         font-size: 0.75em;
 417         list-style:none;
 418         background-image: url('Pics/greydot.png');
 419         background-position: bottom left;
 420         background-repeat: repeat-x;
 421         line-height:1.833;
 422         padding: 0;
 423         max-width: 67%;
 424 }
 425
 426 .toc li {
 427         background-image: url('Pics/greydot.png');
 428         background-position: top left;
 429         background-repeat: repeat-x;
 430         padding: 0.0833em 0 0.0833em 0;
 431  }
 432
 433 .toc a {
 434         display:block;
 435         text-decoration: none;
 436 }
 437
 438 .toc a:hover {
 439         display:block;
 440         background-color: #f0f0f4;
 441         text-decoration: underline;
 442 }
 443
 444 input:focus {
 445         background-color:#FFFFCB;
 446
 447 }
 448 /*
 449  *      Sitemap
 450  */
 451
 452 .card {
 453         clear:both;
 454         margin:1.5em 0 1.5em 0;
 455         background-position: 0 -50px;
 456         background-repeat: repeat-x;
 457         padding:0;
 458 }
 459
 460 .card ul {
 461         margin:0.5em 0 1em 0;
 462 }
 463
 464 .card ul li {
 465         list-style:none;
 466 }
 467
 468 .card h2 {
 469 }
 470
 471 .lefthalf {
 472         float:left;
 473 }
 474
 475 .righthalf {
 476         margin-left:50%;
 477 }
 478
 479 .lefthalf ul {
 480         margin-top:0;
 481 }
 482
 483 /*
 484  *      Footer
 485  */
 486
 487 #footer {
 488         font-size: 0.75em;
 489         border: 1px solid #dfdfe0;
 490         border-bottom: 0;
 491         padding:1em;
 492         background-color: #f2f3f6;
 493         margin: 0 0 0 0;
 494         line-height: 1.5em;
 495 }
 496 #footer p {
 497         margin: 1em 0 1em 0;
 498         }
 499
 500
 501
 502 #footer hr {
 503         border-top: 1px solid #d2d3d7;
 504         border-bottom: 1px solid white;
 505         height: 0;
 506 }
 507
 508 #footer .editbar li {
 509         display: inline;
 510         margin-right: 2em;
 511 }
 512
 513 #footer .info {
 514 }
 515
 516 #fineprint {
 517         margin-bottom: 1em;
 518 }
 519
 520 #footermap {
 521         list-style:none;
 522         margin: 0 0 0 0;
 523         padding: 0;
 524         width:100%;
 525         overflow: hidden;
 526         border: 0;
 527 }
 528
 529 ul#footermap-cola a
 530 , ul#footermap-colb a
 531 , ul#footermap-colc a
 532 , ul#footermap-cold a
 533 , ul#footermap-cole a {
 534         padding-left: 0;
 535 }
 536
 537 ul#footermap-cola
 538 , ul#footermap-colb
 539 , ul#footermap-colc
 540 , ul#footermap-cold
 541 , ul#footermap-cole {
 542         float:left;
 543         width: 19%;
 544         min-width: 11em;
 545         height: 12em; /* Update when adding items */
 546         margin:0 1% 0 0;
 547         padding: 2em 0 0 0;
 548         list-style: none;
 549 }
 550
 551 ul#footermap-cole {
 552         width: 18.9%;
 553         margin-right:0;
 554 }
 555
 556 #footermap-wrap {
 557         padding:2em;
 558         border-top: 1px solid white;
 559 }
 560
 561 #footermap a {
 562         margin: 0;
 563 }
 564
 565 #footermap ul{
 566         list-style: none;
 567         padding:0;
 568 }
 569
 570 #footermap li {
 571         text-indent:0;
 572         background-color: transparent;
 573         font-weight:bold;
 574 }
 575
 576 #footermap li ul {
 577         margin: 0;
 578         padding: 0:
 579 }
 580
 581 #footermap li li {
 582         margin:0;
 583         text-indent:0;
 584         padding:0;
 585         font-weight:normal;
 586         border:0;
 587         background-image:none;
 588         background-color:transparent;
 589 }
 590
 591 #sitetools form {
 592         margin:0;
 593         padding:0;
 594 }
 595
 596 #sitetools input {
 597         margin: 0 0 0 0.25em;
 598         padding-left: 4px;
 599         padding-right: 4px;
 600 }
 601
 602 #sitetools select {
 603         margin-left: 0.5em;
 604 }
 605
 606 #sitetools form p {
 607         display: inline;
 608         line-height: 1;
 609         margin:0;
 610         padding:0;
 611 }
 612
 613 .sitetool a {
 614         margin: 0.5em 0 0.5em 1em;
 615         padding: 0 0 0 0;
 616         float: left;
 617 }
 618
 619 .sitetool {
 620         margin:0;
 621         padding: 2px 5px 2px 5px;
 622         border-left: 1px solid white;
 623         border-right: 1px solid #d2d3d7;
 624         display:block;
 625         float:left;
 626 }
 627
 628 #serverselect input
 629 , #serverselect option
 630 , #serverselect select {
 631 }
 632
 633 #serverselect ul {
 634         display: inline;
 635         margin-left: 2em;
 636 }
 637
 638 #serverselect li {
 639         list-style: none;
 640         display: inline;
 641         padding:0 1em 0 1em;
 642         margin:0;
 643 }
 644
 645 #serverselect form p {
 646         margin:0;
 647         padding:0;
 648         line-height: 1;
 649 }
 650
 651 .lcol50 {
 652         float: left;
 653         width: 49%;
 654         font-size:0.75em;
 655         margin:0 0 0 0;
 656         padding:0 0.5em 0 0;
 657 }
 658
 659 .lcol50 h2 {
 660         margin-top:0;
 661 }
 662
 663 .rcol50 {
 664         margin:0 0 0 51%;
 665         padding:0;
 666         font-size:0.75em;
 667 }
 668
 669 /*
 670  *      Extras
 671  */
 672
 673 .clear {
 674         clear:both
 675 }
 676
 677 #clear {
 678         clear:both;
 679         border:0;
 680         height:1px;
 681         display:block;
 682  }
 683
 684 .quicklist:before {
 685         content: "Quick Links: ";
 686         font-weight: bold;
 687 }
 688
 689 .quicklist {
 690         list-style: none;
 691         font-size: 0.75em;
 692         margin:0;
 693         padding:0;
 694         text-indent:0;
 695         line-height: 2em;
 696 }
 697
 698 .quicklist li  {
 699         display:inline;
 700 }
 701
 702 .item p{
 703         margin: 0;
 704 }
 705
 706 .item h2
 707 , .item p
 708 , .item ul{
 709         margin-right: 10px
 710 }
 711
 712 .item h2 {
 713         margin-top: 0;
 714         }
 715
 716 .col50 {
 717         width:50%;
 718         float: left;
 719 }
 720
 721 .lastcol {
 722         margin: auto;
 723         width: 50%;
 724         float:left;
 725 }
 726
 727 .lastcol h2
 728 , .lastcol p
 729 , .lastcol ul {
 730         margin-left:  10px;
 731         margin-right:0;
 732 }
 733
 734 .line {
 735 /*      clear: both;
 736         display: block;
 737         margin: 0 0 2em 0;
 738         */
 739         padding: 0;
 740         width: auto;
 741         overflow: hidden;
 742 }
 743
 744 .cardleft {
 745         width:49%;
 746         float: left;
 747 }
 748
 749 .cardright {
 750         margin: auto;
 751         width: 50%;
 752         float:left;
 753 }
 754
 755 .cardleft div {
 756         margin-right: 1.5em;
 757 }
 758 .cardleft h2 {
 759         margin-right: 1em;
 760 }
 761 .cardright div {
 762         margin-left: 1.5em;
 763 }
 764 .cardright h2 {
 765         margin-left: 1em;
 766 }
 767 .votemenu a {
 768         display:block;
 769 }
 770
 771 table.vote td, table.vote th {
 772         padding-right: 1.5em;
 773         }
 774 }