/* --- déclaration des polices spéciales utilisées et présentes dans le répertoire "fonts" --- */
/* --- ceci permet d'afficher des polices sans qu'elles soient disponibles sur l'ordi de l'internaute --- */
@font-face {
	font-family: "BadScript-Regular"; src: url('BadScript-Regular.ttf');
}
/* --- ici on détermine la forme globale de la page: taille, police de caractères, les marges, la couleur du fond... --- */
body{
	font-family : BadScript-Regular, sans-serif;
	height : auto;
	width : 1150px;
	margin-right : auto;
	margin-left : auto;
	background-color: #d9d9d9;
	color: #000;
}
/* --- fin du body --- */




/* --- caractéristiques d'affichage des liens --- */
a {
	text-decoration: none;  
	color: #FFF100; 
	font-weight: bold;
}
a:hover {	/* paramètres au survol de la souris */
	text-decoration: underline;
	font-weight: bold;
	color: #EF1D26;
	background-color: #115884; 
}


/* --- caractéristiques d'affichage du bandeau que l'on met dans l'en-tête en créant --- */
/* --- un identifiant que l'on peut rappeler dans la page html avec la balise 'id' --- */
#bandeau {
	height : 250px;
	width : 1150px;
	margin-right : auto;
	margin-left : auto;
}
#bandeau ul {		/* style d'affichage de la liste */
	font-size : 14px;
	list-style-type : none;
	text-align : left;
	padding-top : 10px;
}
#bandeau ul li { 	/* style d'affichage des éléments de la liste */
	display : inline;	/* !important, positionne les éléments de la liste en ligne plutôt qu'en colonne */
	margin-top : 15px;
	padding-bottom : 1px;
	float : left;
	width : 120px;
	text-align : center;
	text-transform : uppercase;	/* même si on écrit en minuscule, le texte apparaitra en capitales */
	opacity : 0.85;	/* légère transparence du texte pour tenir compte de la photo en arrière-plan */
}
/* --- fin du bandeau de l'en-tête --- */

/* --- caractéristiques d'affichage du corps de page --- */
#corps {
	text-align: left;
	list-style : none;
	width : 1150px;
}

/* --- caractéristiques d'affichage des paragraphes du corps de page --- */
#corps p {
	font-size:1.6em; /* il est préférable d'utiliser cette unité pour le côté "responsive". 1em correspond à 12pt*/
	text-align: center;
	padding-left: 10px;
}

/* --- caractéristiques d'affichage des tableaux du corps de page --- */
#corps table {
	font: 1.1em BadScript-Regular, sans-serif; /* toujours ajouter "sans-serif" au cas où la police n'est pas présente sur l'ordi de l'internaute */
	font-style : italic;
}

/* --- caractéristiques d'affichage des titres du corps de page --- */
#corps h1 {
	font: 1.2em Verdana, sans-serif; 
	color:#EF1D26; 
	font-weight: bold; 
	text-align: center;
}

#corps h2 {
	font-family : Verdana, sans-serif; 
	font-size: 1.5em; 
	text-align: center; 
	color: #000099;
}

#corps h3 {
	font: italic 1.7em "BadScript-Regular", sans-serif; 
	font-weight: bold; 
	color:#003F6B; 
	padding-left: 50px; 	/* décale le titre sur la droite */
	text-align: left; 
	text-shadow: 1px 1px 10px #fff100;	/* ajoute une lueur ou une ombre */
}

/* --- fin du corps de page --- */

/* --- caractéristiques d'affichage du bas de page --- */
#pied {
	background-color: #949599;
	height: 25px;
	font-size: 12px;
	width : 1150px;
	/*vertical-align: center;*/
}
#pied ul {	/* style d'affichage de la liste */
	font-size : 1em;
	list-style-type : none;
	text-align : left;
	vertical-align: bottom;
}
#pied ul li { 	/* style d'affichage des éléments de la liste */
	display : inline; /* !important, positionne les éléments de la liste en ligne plutôt qu'en colonne */
	padding-top : 5px;
	float : left;
	width : 210px;	/* adapter la largeur au texte le plus long */
	text-align : left;
	opacity : 0.85;
}
/* --- fin du bas de page --- */


/* --- caractéristiques d'affichage des photos insérées dans le corps de page en créant --- */
/* --- une classe que l'on peut rappeler dans la page html avec la balise 'class' --- */
.photo {
	margin: 15px; 
	border: 2px solid #4169e1;
}