/* en CSS les commentaires s'écrivent ainsi (pour la peite histoire, c'est hérité du langage C */

/* un fichier CSS est un texte ASCII avec l'extension .css */

/* comme en HTML les éléments du langage sont de l'ASCII basique, c-à-d jeux caractères US non étendu, sans accents ni signes français. Les commentaires étant ignorés par la machine, tu peux y mettre des accents */


/* attaquons le CSS */


			/* Début des styles d'éléments généraux */

/* Définissons le style de BODY (en CSS, le nom de l'Attribut HTML — 
qui s'appelle Sélecteur — est en CAPITALES background-image: url(fond.jpg); ou background-color: #000000;
URL de l'image sous la forme (nom.gif)
si dans le même répertoire que le css
ou (http://monsite/monimage.gif) si absolue
ou avec le chemin relatif, par ex. (../mongif.gif) si c'est dans le 
répertoire du dessus dans la hiérarchie
*/

BODY
{
	background-image: url(fond2.jpg);
	font-family: Century Gothic, sans-serif;
	font-size: 0.9em;	
	color: #f6f6f6;
	
} 

/* les { } sont l'équiv. de < > en HTML */
/* chaque instruction CSS se finit par ; */
/* l'espace après le nom de l'instruction est obligatoire,
ainsi color:black; est une erreur il faut color: black; 
*/


/* maintenant tu décides que tout tes titres H1 seront en graisse normal et non en gras et alignés en center */


H1
{
	font-family: Century Gothic, sans-serif;
	font-size: 1.6em;
	font-weight: bold;
	text-align: center;
	
	
}


H2
{
	font-family: Comic sans MS;
	font-size: 1.4em;
	font-weight: bold;
	text-align: left;
	color: #000000;	
	
}

B { color: #ffffff; } 
 
p {
margin: 10px 20px;
padding: 0;

}
 
.important {
margin-left: auto;
margin-right: auto;
width: 350px;
}

H3
{
	font-family: Century Gothic, sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	
	
}

/* tu aurais pu aussi l'appliquer ˆ H2 en saisisant
H1,H2 au lieu de H1 tout seul, essaie et regarde le rŽsultat dans
ton navigateur.

*/

			/* Fin des styles d'éléments généraux */	
	
	
	
	/* liste des classes utilisées*/
	
/* ancres, c'est une pseudo-classe, retient juste que cela se déclare ainsi */



A:link { text-decoration: none; color: #f6f6f6;}   	
A:visited { text-decoration: none; color: #000000; } 	
A:active { text-decoration: none; color: #000000; }	
A:hover { text-shadow: 1px 1px 4px; text-decoration: underline; color: #000000; } 

	/* autres: 006600 289C0E (2F901B ou 0A890D)  FF0000*/


/* CSS autorise les liens non soulignés, c'est une connerie, 
puisqu'on identifie les liens par leur soulignement */
	
	
	/* classes générales */

/* nous voulons des élements avec un style différent : couleur rouge 
je vais donc définir une classe générique qui recevra le style rouge 
voir comment elle s'applique dans essai.html 
un nom de classe commence par un point */

.red			/* les noms de classe sont courts et évocateurs, j'aurais mettre 2, mais c'est vague */
{
	color: red;

}

	/* classe qui s'appliquent à seulement un sélecteur */

/* on peut aussi utiliser une division au sein desquels les éléments définis dans un ici vont s'appliquer */
DIV.note
{
	color: yellow;
	font-size: 80%;	/* les % sont bien compris */
	font-weight: bold;
	font-style: italic;
}

DIV.intro { color: #993333; }


/* n'importe quelle balise HTML ou presque peut servir de sélecteur de classe */

P.cpr
{
	font-size: 50%;
	text-align: center;
}