[Sommaire] [Imprimer]

   1  /* $Id: style.css,v 1.22 2006/11/23 11:05:46 dries Exp $ */
   2  
   3  /*
   4  ** HTML elements
   5  */
   6  body  {
   7    color: #000;
   8    background-color: #fff;
   9    margin: 0;
  10    padding: 0;
  11  }
  12  body, p, td, li, ul, ol  {
  13    font-family: Verdana, Helvetica, Arial, sans-serif;
  14  }
  15  h1, h2, h3, h4, h5, h6 {
  16    font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, Verdana, sans-serif;
  17    margin: 0;
  18  }
  19  h1 {
  20    color: #369;
  21    font-size: 1.6em;
  22  }
  23  tr.odd td, tr.even td {
  24    padding: 0.3em;
  25  }
  26  a:link {
  27    text-decoration: none;
  28    font-weight: bold;
  29    color: #ff8c00;
  30  }
  31  a:visited {
  32    text-decoration: none;
  33    font-weight: bold;
  34    color: #c96;
  35  }
  36  a:hover, a:active {
  37    font-weight: bold;
  38    color: #ff4500;
  39    text-decoration: underline;
  40  }
  41  fieldset {
  42    border: 1px solid #ccc;
  43  }
  44  p {
  45    margin: 0 0 1.3em 0;
  46    padding: 0;
  47  }
  48  blockquote {
  49    border-left: 4px solid #69c;
  50    padding: 0 15px;
  51    margin: 25px 100px 25px 50px;
  52    color: #696969;
  53    text-align: left;
  54    font-size: 1.2em;
  55    line-height: 1.3em;
  56    font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, Verdana, sans-serif;
  57  }
  58  pre {
  59    background-color: #eee;
  60    padding: 0.75em 1.5em;
  61    font-size: 1.2em;
  62    border: 1px solid #ddd;
  63  }
  64  .form-item {
  65    margin-top: 1em;
  66  }
  67  .form-item label {
  68    color: #369;
  69  }
  70  .item-list .title {
  71    color: #369;
  72    font-size: 0.85em;
  73  }
  74  
  75  /*
  76  ** Page layout blocks / IDs
  77  */
  78  #primary-menu  {
  79    border-collapse: separate;
  80    background-color: #e0edfb;
  81    border-bottom: 3px solid #69c;
  82  }
  83  #primary-menu tr {
  84    background: transparent url(header-a.jpg) left bottom repeat;
  85  }
  86  td#home {
  87    background: transparent url(logo-background.jpg) left top repeat;
  88  }
  89  td#home a:link img, td#home a:visited img {
  90    background: transparent url(logo-active.jpg) repeat;
  91    width: 144px;
  92    height: 63px;
  93  }
  94  td#home a:hover img {
  95    background: transparent url(logo-hover.jpg) repeat;
  96    width: 144px;
  97    height: 63px;
  98  }
  99  .primary-links, .primary-links a:link, .primary-links a:visited {
 100    color: #369;
 101  }
 102  .primary-links a:hover {
 103    color: #000;
 104  }
 105  #primary-menu .primary-links   {
 106    background: transparent url(header-b.jpg) left top no-repeat;
 107    font-size: 0.79em;
 108  }
 109  #primary-menu .primary-links h1, #primary-menu .primary-links h2, #primary-menu .primary-links h3 {
 110    font-size: 2.3em;
 111    color: #369;
 112  }
 113  #secondary-menu {
 114    border-collapse: separate;
 115    background-color: #369;
 116    border-bottom: 3px solid #69c;
 117  }
 118  .secondary-links, .secondary-links a:link, .secondary-links a:visited  {
 119    color: #e4e9eb;
 120  }
 121  .secondary-links a:hover {
 122    color: #fff;
 123    text-decoration: underline;
 124  }
 125  #secondary-menu .secondary-links {
 126    font-size: 0.85em;
 127  }
 128  ul.links li {
 129    border-left: 1px solid #ff8c00;
 130  }
 131  #navlist li {
 132    border-left: 1px solid #369;
 133  }
 134  #subnavlist li, ul.primary-links li, ul.secondary-links li {
 135    border-left: 1px solid #fff;
 136  }
 137  #navlist li.first, #subnavlist li.first, ul.links li.first {
 138    border: none;
 139  }
 140  .tabs {
 141    margin: 15px 0;
 142  }
 143  .tabs ul.primary {
 144    border-collapse: collapse;
 145    padding: 0 0 3px 10px;
 146    white-space: nowrap;
 147    list-style: none;
 148    margin: 0;
 149    height: auto;
 150    line-height: normal;
 151    border-bottom: 2px solid #369;
 152  }
 153  .tabs ul.primary li {
 154    display: inline;
 155  }
 156  .tabs ul.primary li a {
 157    padding: 3px 10px;
 158    background: #fff url(tabs-off.png) left top no-repeat;
 159    border-color: #69C;
 160    border-width: 2px;
 161    border-style: none solid none none;
 162    height: auto;
 163    margin-right: 10px;
 164    text-decoration: none;
 165    text-transform: lowercase;
 166  }
 167  .tabs ul.primary li.active a {
 168    background: #369 url(tabs-on.png) left top no-repeat;
 169    border-right: 2px solid #369;
 170    color: #fff;
 171  }
 172  .tabs ul.primary li a:hover {
 173    background-color: #fffaf0;
 174    color: #ff4500;
 175  }
 176  .tabs ul.secondary {
 177    border-collapse: collapse;
 178    padding: 10px 0;
 179    margin: 0;
 180    white-space: nowrap;
 181    width: 100%;
 182    list-style: none;
 183    height: auto;
 184    line-height: normal;
 185    border-bottom: none;
 186  }
 187  .tabs ul.secondary li {
 188    display: inline;
 189    height: auto;
 190    padding: 0 0 0 10px;
 191    text-decoration: none;
 192    border-right: none;
 193  }
 194  .tabs ul.secondary li a {
 195    background: #fff url(tabs-option-off.png) left center no-repeat;
 196    padding: 10px 0 10px 25px;
 197    margin: 0;
 198  }
 199  .tabs ul.secondary li a.active {
 200    background: #fff url(tabs-option-on.png) left center no-repeat;
 201    color: #369;
 202    border-bottom: none;
 203  }
 204  .tabs ul.secondary li a:hover {
 205    background: #fff url(tabs-option-hover.png) left center no-repeat;
 206    color: #FF4500
 207  }
 208  #content {
 209    background-color: #fff;
 210  }
 211  #contentstart {
 212    background-color: #fff;
 213  }
 214  #menu {
 215    padding: 0.5em 0.5em 0 0.5em;
 216    text-align: right;
 217    vertical-align: middle;
 218  }
 219  #search .form-text, #search .form-submit {
 220    border: 1px solid #369;
 221    font-size: 0.85em;
 222    margin: 0.2em;
 223  }
 224  #search .form-text {
 225    width: 9em;
 226  }
 227  #search .form-submit {
 228    height: 1.5em;
 229  }
 230  #mission {
 231    background-color: #fff;
 232    color: #696969;
 233    border-top: 2px solid #dcdcdc;
 234    border-bottom: 2px solid #dcdcdc;
 235    padding: 10px;
 236    margin: 20px 35px 0 35px;
 237    font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, Verdana, sans-serif;
 238    font-size: 1.1em;
 239    font-weight: normal;
 240  }
 241  #site-info {
 242    background-color: #bdd3ea;
 243    background-image: url(header-c.png);
 244    font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, Verdana, sans-serif;
 245  }
 246  .site-name {
 247    font-size: 1.2em;
 248  }
 249  .site-name a:link, .site-name a:visited {
 250    color: #fff;
 251  }
 252  .site-name a:hover {
 253    color: #ff8c00;
 254    text-decoration: none;
 255  }
 256  .site-slogan {
 257    font-size: 0.8em;
 258    font-weight: bold;
 259  }
 260  #main {
 261    /* padding in px not ex because IE messes up 100% width tables otherwise */
 262    padding: 30px 35px 50px 35px;
 263    background: transparent url(background.png) center center no-repeat;
 264    /* fix background overlapping text in IE (aka Peekaboo Bug) */
 265    position: relative;
 266  }
 267  #mission, .node .content, .comment .content {
 268    line-height: 1.4;
 269  }
 270  #help {
 271    font-size: 0.9em;
 272    margin-bottom: 1em;
 273  }
 274  .breadcrumb {
 275    margin-bottom: .5em;
 276  }
 277  .messages {
 278    background-color: #eee;
 279    border: 1px solid #ccc;
 280    padding: 0.3em;
 281    margin-bottom: 1em;
 282  }
 283  .error {
 284    border-color: red;
 285  }
 286  .nav {
 287    padding: 0;
 288    margin: 0;
 289  }
 290  #sidebar-left, #sidebar-right {
 291    font-size: 0.75em;
 292    width: 175px;
 293    /* padding in px not ex because IE messes up 100% width tables otherwise */
 294    padding: 25px 10px 75px 10px;
 295    vertical-align: top;
 296    background: #FFFAF0;
 297  }
 298  #sidebar-left {
 299    border-right: 3px solid #f5f5f5;
 300  }
 301  #sidebar-right {
 302    border-left: 3px solid #f5f5f5;
 303  }
 304  #sidebar-left li, #sidebar-right li {
 305    font-size: 1em;
 306  }
 307  .node .content {
 308    text-align: left;
 309    font-size: 0.85em;
 310    line-height: 1.3;
 311  }
 312  .comment .content {
 313    text-align: left;
 314    font-size: 0.85em;
 315    line-height: 1.3;
 316  }
 317  #footer-message {
 318    padding: 15px 100px 30px 100px;
 319    font-size: 0.85em;
 320    text-align: center;
 321    color: #aaa;
 322  }
 323  table#footer-menu {
 324    border-top: 3px solid #69c;
 325    border-bottom: 3px solid #69c;
 326    background-color: #369;
 327    color: #e4e9eb;
 328  }
 329  #footer-menu td {
 330    padding: 5px;
 331    font-size: 0.75em;
 332  }
 333  #footer-menu .primary-links, #footer-menu a:link, #footer-menu a:visited  {
 334    color: #e4e9eb;
 335  }
 336  #footer-menu a:hover  {
 337    color: #fff;
 338    text-decoration: underline;
 339  }
 340  #footer-menu .primary-links h1, #footer-menu .primary-links h2, #footer-menu .primary-links h3 {
 341    font-size: 1.3em;
 342    color: #e4e9eb;
 343  }
 344  /*
 345  ** Common declarations for child classes of node, comment, block, box, etc.
 346  ** If you want any of them styled differently for a specific parent, add
 347  ** additional rules /with only the differing properties!/ to .parent .class.
 348  ** See .comment .title for an example.
 349  */
 350  #content .title, #content .title a {
 351    color: #369;
 352  }
 353  .content h1 {
 354    color: #369;
 355    font-size: 1.9em;
 356  }
 357  .content h2 {
 358    color: #58b;
 359    font-size: 1.7em;
 360  }
 361  .content h3 {
 362    color: #69c;
 363    font-size: 1.5em;
 364  }
 365  .content h4 {
 366    color: #8be;
 367    font-size: 1.3em;
 368  }
 369  .content h5 {
 370    color: #96c6f6;
 371    font-size: 1.15em;
 372  }
 373  .submitted {
 374    color: #999;
 375    font-size: 0.79em;
 376  }
 377  div.links {
 378    color: #ff8c00;
 379  }
 380  .links a {
 381    font-weight: bold;
 382  }
 383  .box {
 384    padding: 0 0 1.5em 0;
 385  }
 386  .box {
 387    padding: 0;
 388    margin: 0;
 389  }
 390  .box h2 {
 391    font-size: 9px;
 392  }
 393  .block .title h3 {
 394    border-bottom: 2px solid #69c;
 395    color: #369;
 396    font-size: 18px;
 397    font-weight: bold;
 398    padding: 10px 5px 10px 30px;
 399    margin-bottom: .25em;
 400    background: transparent url(icon-block.png) left center no-repeat;
 401  }
 402  .block .content {
 403    padding: 5px;
 404  }
 405  .block {
 406    margin-bottom: 1.5em;
 407  }
 408  .box .title {
 409    font-size: 1.1em;
 410  }
 411  .node {
 412    margin: .5em 0 2.5em 0;
 413  }
 414  .node .content, .comment .content {
 415    margin: .5em 0 .5em 0;
 416  }
 417  .node .taxonomy {
 418    color: #999;
 419    font-size: 0.83em;
 420    padding: 1.5em;
 421  }
 422  .node .picture {
 423    border: 1px solid #fff;
 424    float: right;
 425    margin: 0.5em;
 426  }
 427  .comment {
 428    border: 1px solid #abc;
 429    padding: .5em;
 430    margin-bottom: 1em;
 431  }
 432  .comment .title {
 433    font-size: 1em;
 434    padding: 10px 0 12px 19px;
 435    background: transparent url(icon-comment.png) left center no-repeat;
 436  }
 437  .comment .new {
 438    font-weight: bold;
 439    font-size: 1em;
 440    margin-left: 2px;
 441    color: red;
 442  }
 443  .comment .picture {
 444    border: 1px solid #fff;
 445    float: right;
 446    margin: 10px;
 447  }
 448  div.links {
 449    font-size: 0.75em;
 450  }
 451  div.links .prev, div.links .next, div.links .up {
 452    font-size: 1.15em;
 453  }
 454  .titles .prev, .titles .next  {
 455    font-size: 0.85em;
 456    font-weight: bold;
 457    color: #444;
 458  }
 459  .hide {
 460    display: none
 461  }
 462  .nav .links .next a:link {
 463    padding: 17px 17px 17px 0;
 464    background: transparent url(arrow-next.png) right center no-repeat;
 465  }
 466  .nav .links .next a:visited {
 467    padding: 17px 17px 17px 0;
 468    background: transparent url(arrow-next-visited.png) right center no-repeat;
 469  }
 470  .nav .links .next a:hover {
 471    padding: 17px 17px 17px 0;
 472    background: transparent url(arrow-next-hover.png) right center no-repeat;
 473  }
 474  .nav .links .prev a:link {
 475    padding: 17px 0 17px 17px;
 476    background: transparent url(arrow-prev.png) left center no-repeat;
 477  }
 478  .nav .links .prev a:visited {
 479    padding: 17px 0 17px 17px;
 480    background: transparent url(arrow-prev-visited.png) left center no-repeat;
 481  }
 482  .nav .links .prev a:hover {
 483    padding: 17px 0 17px 17px;
 484    background: transparent url(arrow-prev-hover.png) left center no-repeat;
 485  }
 486  .nav .links .up a:link {
 487    padding: 11px 0 17px 0;
 488    background: transparent url(arrow-up.png) center top no-repeat;
 489  }
 490  .nav .links .up a:visited {
 491    padding: 11px 0 17px 0;
 492    background: transparent url(arrow-up-visited.png) center top no-repeat;
 493  }
 494  .nav .links .up a:hover {
 495    padding: 11px 0 17px 0;
 496    background: transparent url(arrow-up-hover.png) center top no-repeat;
 497  }
 498  
 499  /*
 500  ** Administration page styles
 501  */
 502  div.admin-panel .description {
 503    color: #999;
 504  }
 505  div.admin-panel h3 {
 506    background-color: #369;
 507    color: #fff;
 508    padding: 5px 8px 5px;
 509    margin: 0;
 510  }
 511  div.admin-panel .body {
 512    background: #fffaf0;
 513  }
 514  
 515  /*
 516  ** Module specific styles
 517  */
 518  .content .active {
 519    color: #369;
 520  }
 521  #aggregator .feed-source {
 522    background-color: #eee;
 523    border: 1px solid #ccc;
 524    padding: 1em;
 525    margin: 1em 0 1em 0;
 526  }
 527  #aggregator .news-item .source {
 528    color: #999;
 529    font-style: italic;
 530    font-size: 0.85em;
 531  }
 532  #aggregator .title {
 533    font-size: 1em;
 534  }
 535  #aggregator h3 {
 536    margin-top: 1em;
 537  }
 538  #tracker th {
 539    text-align: center;
 540    background-color: #f5f5f5;
 541    border-bottom: 1px solid #ddd;
 542    border-right: 1px solid #ddd;
 543    border-left: 1px solid #fafafa;
 544  }
 545  #tracker th img {
 546    float: right;
 547  }
 548  #tracker tr.even, #tracker tr.odd {
 549    background-color: #fff;
 550  }
 551  #tracker td {
 552    vertical-align: top;
 553    padding: 1em 1em 1em 0;
 554    border-bottom: 1px solid #bbb;
 555  }
 556  #forum {
 557    margin: 15px 0 15px 0;
 558    background-color: #fff;
 559  }
 560  #forum table {
 561    width: 100%;
 562    border: 2px solid #69c;
 563  }
 564  #forum table tr th {
 565    text-align: center;
 566    background: #69c;
 567    color: #fff;
 568    font-size: 0.75em;
 569    border-bottom: 1px solid #aaa;
 570  }
 571  #forum table tr th a  {
 572    color: #fff;
 573    text-decoration: underline;
 574  }
 575  #forum table tr th img  {
 576    margin: 0;
 577  }
 578  #forum tr.odd {
 579    background: #e0edfb;
 580  }
 581  #forum tr.even {
 582    background: #fff;
 583  }
 584  #forum td {
 585    padding: 0.5em;
 586  }
 587  #forum td.container {
 588    color: #000;
 589    background: #369 url(forum-container.jpg) right top no-repeat;
 590    border: 2px solid #69c;
 591  }
 592  #forum td.container a {
 593    color: #e4e9eb;
 594    padding: 20px 0 20px 35px;
 595    background: transparent url(forum-link.png) left center no-repeat;
 596  }
 597  #forum td.container a:visited {
 598    color: #e4e9eb;
 599  }
 600  #forum td.statistics, #forum td.settings, #forum td.pager {
 601    height: 1.5em;
 602    border: 1px solid #bbb;
 603  }
 604  #forum td .name {
 605    color: #96c;
 606  }
 607  #forum td .links {
 608    padding-top: 0.7em;
 609    font-size: 0.9em;
 610  }
 611  .block-forum h3 {
 612    margin-bottom: .5em;
 613  }