htdocs/css/keynote.css

   1 /***************************************************************************
   2  *  Copyright (C) 2003-2006 Polytechnique.org                              *
   3  *  http://opensource.polytechnique.org/                                   *
   4  *                                                                         *
   5  *  This program is free software; you can redistribute it and/or modify   *
   6  *  it under the terms of the GNU General Public License as published by   *
   7  *  the Free Software Foundation; either version 2 of the License, or      *
   8  *  (at your option) any later version.                                    *
   9  *                                                                         *
  10  *  This program is distributed in the hope that it will be useful,        *
  11  *  but WITHOUT ANY WARRANTY; without even the implied warranty of         *
  12  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the          *
  13  *  GNU General Public License for more details.                           *
  14  *                                                                         *
  15  *  You should have received a copy of the GNU General Public License      *
  16  *  along with this program; if not, write to the Free Software            *
  17  *  Foundation, Inc.,                                                      *
  18  *  59 Temple Place, Suite 330, Boston, MA  02111-1307  USA                *
  19  ***************************************************************************/
  20
  21 /*******************************************************************************
  22     1   Styles par défauts
  23         [ balises sans attributs ou classes sans contexte ]
  24 *******************************************************************************/
  25
  26 body {
  27     font-family: "Arial", sans-serif;
  28     background: url('../images/skins/keynote_bg.png') top left repeat-x;
  29     background-attachment: fixed;
  30     background-color: #525168;
  31     color: #fff;
  32 }
  33
  34 a:link, a:visited, a:active, a:hover {
  35     color: #ddd;
  36     background: none;
  37 }
  38
  39 a:hover {
  40     color: #999;
  41 }
  42
  43 fieldset {
  44     border: 1px #336699 solid;
  45     background: #eeeeee;
  46     color: inherit;
  47
  48     margin-top: 1em;
  49     margin-bottom: 1em;
  50 }
  51
  52 legend {
  53     border: 1px #336699 solid;
  54     background: #f4d09c;
  55     color: inherit;
  56
  57     padding-left: 4px;
  58     padding-right: 4px;
  59 }
  60
  61 /*******************************************************************************
  62     2   Styles <p>, <div>, <span>, <li>
  63         [ styles classiques d'effets de texte ]
  64 *******************************************************************************/
  65
  66 p {
  67     margin-bottom: 0.5em;
  68     text-align: justify;
  69 }
  70
  71 .erreur {
  72     font-weight: bold;
  73     color: #ff0000;
  74     background: inherit;
  75     margin-top: 0.5em;
  76     margin-bottom: 0.5em;
  77 }
  78
  79 .erreur a:link, .erreur a:visited, .erreur a:active, .erreur a:hover {
  80     color: #ff3333;
  81     background: inherit;
  82 }
  83
  84 h1 {
  85     color: #fff;
  86     background: none;
  87 }
  88
  89 h2 {
  90     padding: 0.5em 0em 0em 0em;
  91     margin: 0em;
  92     font-size: 100%;
  93     font-weight: bold;
  94 }
  95
  96 h3 {
  97     margin: 0em;
  98     font-weight: bold;
  99     padding: 0.25em;
 100     font-size: 100%;
 101 }
 102
 103 p.explication, div.explication {
 104     font-style: italic;
 105     padding: 0em 1ex 1ex 1ex;
 106 }
 107
 108 li.spaced {
 109     padding-top: 0.5em;
 110     padding-bottom: 0.5em;
 111     text-align: justify;
 112 }
 113
 114 /*******************************************************************************
 115     3   Tableaux bicolores + classes utiles
 116         [ Tableaux à lignes alternées, en taille normale, ou tiny ]
 117 *******************************************************************************/
 118 table.bicol, table.tinybicol {
 119     background: url('../images/skins/keynote_bg_lighter.png') top left repeat-x;
 120     background-attachment: fixed;
 121     border: none;
 122     border-top: 1px solid #fff;
 123     border-left: 1px solid #fff;
 124 }
 125
 126 table.tinybicol tr.pair, table.bicol tr.pair {
 127     background: url('../images/skins/keynote_bg_verylighter.png') top left repeat-x;
 128     background-attachment: fixed;
 129 }
 130
 131 table.tinybicol th, table.bicol th {
 132     color: #fff;
 133     background: url('../images/skins/keynote_title.gif') top left repeat-x;
 134     background-color: #000;
 135 }
 136 table.tinybicol td, table.bicol td {
 137     color: #000000;
 138     background: inherit;
 139 }
 140
 141 table.tinybicol td, table.bicol td, table.tinybicol tr, table.bicol tr { padding: 4px; }
 142
 143 td.half { width: 50%; padding: 4px; }
 144 td.titre {
 145     color: #000000;
 146     background: inherit;
 147     font-weight: bold;
 148 }
 149 td.action {
 150     white-space: nowrap;
 151     text-align: right;
 152     font-weight: bold;
 153     vertical-align: middle;
 154 }
 155 td.action a { padding: 0px 2px 0px 2px; }
 156
 157 /*******************************************************************************
 158     4   Tableau de choix de skins
 159         [ Styles pour les tableaux de types de ceux des skins ]
 160 *******************************************************************************/
 161
 162 #skin {
 163     background: url('../images/skins/keynote_bg_lighter.png') top left repeat-x;
 164     background-attachment: fixed;
 165     color: #000;
 166     border-bottom: none;
 167     border-top: 1px solid #fff;
 168 }
 169 #skin td {
 170     border-bottom: 1px solid #fff;
 171     border-top: none;
 172     vertical-align: middle;
 173 }
 174 #skin td.skigauche {
 175     background: url('../images/skins/keynote_bg_verylighter.png') top left repeat-x;
 176     background-attachment: fixed;
 177 }
 178
 179 /*******************************************************************************
 180     5   Contacts
 181         [ Styles liés à l'affichage de contacts ]
 182 *******************************************************************************/
 183
 184 div.contact-list div.contact {
 185     border-top: 1px solid #fff;
 186     background: url('../images/skins/keynote_bg_verylighter.png') top left repeat-x;
 187     background-attachment: fixed;
 188     color: #000;
 189 }
 190
 191 div.grayed {
 192     color: #444444;
 193     font-style: italic;
 194 }
 195
 196 div.grayed div.contact {
 197     background: url('../images/skins/keynote_bg_verylighter.png') top left repeat-x;
 198     background-attachment: fixed;
 199 }
 200
 201 div.contact div.nom {
 202     font-weight: bold;
 203     width: 35%;
 204     float: left;
 205 }
 206
 207 div.contact div.appli {
 208     float: left;
 209 }
 210
 211 div.contact div.bits {
 212     text-align: right;
 213     float: right;
 214 }
 215
 216 div.contact div.long {
 217     background: url('../images/skins/keynote_bg_lighter.png') top left repeat-x;
 218     background-attachment: fixed;
 219 }
 220
 221 /*******************************************************************************
 222     6   Profil
 223         [ onglets des profils ]
 224 *******************************************************************************/
 225
 226 table.flags {
 227     margin: 1em 0em 0em 0em;
 228 }
 229 table.flags input { margin: 0px 2px; padding: 0px; }
 230
 231 table.flags td.texte, tr.flags td.texte {
 232     font-size: smaller;
 233     font-weight: bold;
 234     padding: 3px;
 235 }
 236 table.flags td.vert, tr.flags td.vert {
 237     background: green;
 238     padding: 3px;
 239     text-align: center;
 240 }
 241 table.flags td.orange, tr.flags td.orange {
 242     background: #ff9900;
 243     padding: 3px;
 244     text-align: center;
 245 }
 246 table.flags td.rouge, tr.flags td.rouge {
 247     background: red;
 248     padding: 3px;
 249     text-align: center;
 250 }
 251
 252 table.cadre_a_onglet{
 253     border-width: 0;
 254     padding : 0;
 255     margin: 0;
 256 }
 257
 258 td.conteneur_tab {
 259     border-width: 1px 1px 1px 1px;
 260     border-style: solid;
 261     border-color: #9c9c9c;
 262     border-left-color: #eee;
 263     padding: 8px 4px 4px 4px;
 264     background : url('../images/skins/keynote_topborder.png') top repeat-x;
 265 }
 266
 267 #onglet {
 268     display : block;
 269     margin : 0;
 270     padding : 0;
 271 }
 272
 273 #onglet li {
 274     display : block;
 275     float : left;
 276     padding : 0.4ex;
 277     margin : 0 0.3ex -1px 3px;
 278     background : #cecece;
 279     border: none;
 280     border-bottom: 1px solid #9C9C9C;
 281     width: auto;
 282     height: 5ex;
 283     text-align: center;
 284     color: #000;
 285 }
 286
 287 #onglet li:hover { background : #bdbdbd; }
 288
 289 #onglet li.actif {
 290     background : #dedede;
 291     border-bottom: 1px solid #dedede;
 292 }
 293
 294 /*******************************************************************************
 295     7   fiche.php & fiche_referent.php
 296         [ cas de la fiche ]
 297 *******************************************************************************/
 298
 299 #fiche {
 300     color: #000;
 301     border: none;
 302     border-top: 1px solid #fff;
 303     border-left: 1px solid #fff;
 304     background: url('../images/skins/keynote_bg_lighter.png') top left repeat-x;
 305     background-attachment: fixed;
 306 }
 307
 308 #fiche em {
 309     color: #777;
 310     font-weight: bolder;
 311 }
 312
 313 #fiche h2 {
 314     background: url('../images/skins/keynote_title.gif') bottom repeat-x;
 315     color: #fff;
 316     border: none;
 317     height: 17px;
 318     margin-right: 0;
 319 }
 320
 321 #photo { padding-left: 0em; }
 322
 323 #fiche_identite div.civilite {
 324     text-align: center;
 325     font-weight: bold;
 326     width: 80%;
 327     float: left;
 328     color: #fff;
 329 }
 330
 331 #fiche_identite div.contact {
 332     border: none;
 333     border-top: 1px dotted #fff;
 334     border-left: 1px dotted #fff;
 335     background: url('../images/skins/keynote_bg_verylighter.png') top left repeat-x;
 336     background-attachment: fixed;
 337 }
 338
 339 #fiche_identite div.contact em {
 340     color: #aaa;
 341 }
 342
 343 #fiche_identite div.email {
 344     clear: left;
 345     float: left;
 346 }
 347 #fiche_identite div.mob {
 348     float: right;
 349     clear: right;
 350     text-align: right;
 351 }
 352
 353 #fiche_identite div.formation {
 354     margin: 0em 1em;
 355     clear: both;
 356 }
 357
 358 div.adresse {
 359     float: left;
 360     width: 46%;
 361     padding: 0px;
 362     margin: 0px 1% 1ex 1%;
 363 }
 364
 365 /* only for fiche_referent.php*/
 366
 367 #fiche_referent em {
 368     color: #777;
 369     font-weight: bolder;
 370 }
 371
 372 /*******************************************************************************
 373     A   SKIN
 374         [ choix de classes faites par le skinneur
 375 *******************************************************************************/
 376
 377 #dev {
 378     width: 100%;
 379     text-align: center;
 380     padding: 1px;
 381
 382     color: #003399;
 383     background: #e0ffff;
 384
 385     font-family: 'Bauhaus Md BT','Bitstream Vera',sans-serif;
 386     font-size: 10pt;
 387     font-weight: bold;
 388 }
 389
 390 #dev a { text-decoration: underline; }
 391 #dev a:hover { color: #003399; background: #c0e0e0; }
 392
 393 #db-trace div.hide       { display: none; }
 394 #db-trace:hover div.hide { display: block }
 395
 396 #suid {
 397     color: red;
 398     background: #ffc0cb;
 399     width: 100%;
 400     font-weight: bold;
 401 }
 402 #suid td { padding: 2px; }
 403 #suid a { color: red; }
 404
 405 #body {
 406     width: 740px;
 407     margin-left: auto;
 408     margin-right: auto;
 409 }
 410
 411 #body-logo {
 412     width: 140px;
 413     border: none;
 414     padding-top: 0;
 415 }
 416
 417 #body-top {
 418     padding: 0;
 419     padding-bottom: 16px;
 420 }
 421
 422 #body-bottom {
 423     border-top: 1px solid #fff;
 424 }
 425
 426 #body-menu {
 427     border-right: 1px solid #fff;
 428 }
 429
 430 #body-menu a:link, #body-menu a:visited, #body-menu a:active, #body-meny a:hover {
 431     color: #fff;
 432     text-decoration: none;
 433 }
 434
 435 #body-menu .menu_item:hover {
 436     background-color: #556;
 437 }
 438
 439 #body-menu .menu_title {
 440     color: #fff;
 441     height: 17px;
 442     background: url('../images/skins/keynote_title.gif') top repeat-x;
 443     border: none;
 444     padding: 0;
 445     padding-top: 4px;
 446     text-align: center;
 447     vertical-align: middle;
 448 }
 449
 450 #content {
 451     padding-top: 0;
 452     vertical-align: top;
 453 }
 454
 455 #quick_search {
 456     color: gray;
 457     text-align: right;
 458 }
 459
 460 div#content {
 461     padding: 1em;
 462     margin: 0em;
 463 }
 464
 465 #content input {
 466     font-size: 95%;
 467 }
 468
 469 /* vim: set et ts=4 sts=4 sw=4: */