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