/*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~
* CSS pour les styles utilisables par le client *
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~/
/*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~/
Exemple de definition typographique des textes
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*/
.nomDuStyle {
background-color:#cccccc; /* couleur de fond */
font-family:Helvetica, sans-serif; /* nom de la police de caractère */
font-size:12px; /* taille de la police de caractère en pixel*/
font-weight:bold; /* épaisseur des caractères : bold/normal*/
font-style:italic; /* style applicable : italic ou normal */
text-decoration:underline; /* soulignement de texte */
text-transform:uppercase; /* texte en lettre capital */
}
/*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~/
Exemple de definition de la couleur de fond de bloc
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*/
.couleurDeFond {
background-color:#444444;
}
/**~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~/
/** Bloc conteneur du coeur de la page*/
#contenu {
padding: 10px; /* Marge interieure de "10px" */
color: #000; /* couleur du texte "noir" */
text-align: left; /* Alignement du texte a "gauche" */
background-color:#fff; /* couleur de fond */
}
/** Titre de la page cadre tout en haut */
#header {
font-size: 1.4em; /* taille de la police */
font-weight: bold; /* corps gras de la police */
color:#000; /* couleur du texte */
}
/** Taille des liens en bas de page */
#footer a {
font-size: 1em; /* taille de la police */
}
#footerRight {
font-size: 1em; /* taille de la police "Page mise a jour le" */
}
/** Taille du titre du site (texte sous logo) */
h1 #name {
font-size: 1.2em; /* taille de la police */
color: #0033cc; /* couleur du texte */
font-family: "Times New Roman",Times,serif; /* style de caractères */
text-align: center; /* alignement du texte */
}
/** Mise en forme du menu et des liens du menu*/
/** mise en forme du menu */
#nav {
border:1px solid #000; /* bordure du menu */
background-color: #fafafd;/* couleur de fond */
}
/** les liens du menu */
#nav a {
color: #0033cc; /* couleur du texte */
text-decoration: none; /* souligne ou non */
}
/** lien du menu quand on est dans la section*/
#nav li a.active {
font-weight:bold; /* texte en gras */
}
/** les liens du menu au survol de la souris*/
#nav a:hover {
background-color: none;/* couleur de fond */
text-decoration: none; /* souligne ou non */
color: #0033cc; /* couleur du texte */
}
/** Titre de niveau 1 (le plus grand) Grand titre
*/
#contenu h1 {
padding: 0; /* Pas de marge interieure */
margin: 1% 0 3% 0; /* Marge exterieure : superieure de 1%, inferieure de 3%, droite et gauche pas de marge*/
text-align: center; /* Alignement du titre au centre */
clear: both; /* Annule les blocs flottant */
}
/** Image */
#contenu img {
margin: 0; /* Marge exterieure 0 */
padding : 0 1%; /* Marge interieure superieure et inferieure nulle, droite et gauche de 1% */
}
/** Image alignee a droite par rapport au texte (mettre l'image avant le texte coulant autour de l'image) : 
*/
img.droite { display:block;float: right; }
/** Image alignee a gauche par rapport au texte (mettre l'image avant le texte coulant autour de l'image) : */
img.gauche { display:block;float: left; }
/** Annule les flottants mettre une balise du type a la longueur de texte desire incluant une image "flottante" :
*/
#contenu .stop {
display: block;
clear: both;
}
/** exemple de texte coulant
Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple- Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple
Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple- Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple
Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple - Texte d'exemple- Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple -Texte d'exemple - Texte d'exemple - Texte d'exemple
*/
/** Couleurs de fonds des titres possibles (titre de niveau 1)* Titre avec un fond sable
*/
.titre_fd_sable {background-color : #EEEEB5;} /* couleur de fond sable */
.titre_fd_bleu {background-color : #C4FFFF; } /* couleur de fond bleu */
.titre_fd_jaune {background-color : #FFFFA4;} /* couleur de fond jaune */
.titre_fd_gris { background-color : #DBDBDB;} /* couleur de fond gris */
/** mises en forme possibles sur la page avec la balise span : texte en rouge et en gras*/
/** Types */
.gras, .rougeGras, .italiqueGras, .grandGras {font-weight: bold;} /* texte en gras */
.italique, n.grandItalique, .italiqueGras {font-style: italic;} /* texte en italique */
/** Taille */
h1, .grand, .grandItalique, .rougeGrand, .grandGras {font-size: 1.3em;} /* texte plus grand */
/** Couleur */
.rougeGrand, .rougeGras, .rouge {color: #ff0000;} /* texte en rouge */
.marron {color: #804000;} /* texte en marron */
/* ELEMENTS SPECIFIQUES A LA STRUCTURE DES PAGES INTERIEURES */
/* Titre site internet pages interieures*/
#name {
font-size:1em;
color:#0033CC;
font-family:"Times New Roman",Times,serif;
text-align: center;
}
/* Header (titre de la page) pages interieures*/
#header {
border: 1px solid #556677;
font-size: 12pt;
padding: 10px 0;
text-align: center;
margin-bottom: 20px;
line-height: 30px;
font-weight: bold;
font-family: Calibri;
}