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