.contenu {
	font-family: "Trebuchet MS", Verdana;
	font-size: 14px;
	color: #000000;
	text-align:justify;
}
 .form {
	font-family: "Trebuchet MS", Verdana;
	font-size: 14px;
	color: #000000;
	
}
 
.menu, .menu:hover {
	font-family: "Berlin Sans FB Demi", "Trebuchet MS",  Verdana;
	font-size: 20px;
	color: #000000;
	letter-spacing: 1,5px;
}
.menuok, .menuok:hover {
	font-family: "Berlin Sans FB Demi", "Trebuchet MS",  Verdana;
	font-size: 20px;
	color: #993333;
	letter-spacing: 1,5px;
}
.titre {
	font-family: "Berlin Sans FB Demi", "Trebuchet MS",  Verdana;
	font-size: 18px;
	color: #000000;
	letter-spacing: 1px;
}
legend
{
	color: #993333;
	font-weight:bold
}

h1 {
	font-size: 12px;
	/*font-weight: lighter;
	text-align: center;
	font-variant: small-caps;*/
	color: #993333;

}
.footer
{
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 14px;
	text-align: center;
	color: #ffffff;
	letter-spacing: 2px;
}
.footerhome
{
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 14px;
	text-align: center;
	color: #993333;
	letter-spacing: 2px;
}
a
{
	font-family: "Berlin Sans FB Demi", "Trebuchet MS",  Verdana;
	color: #993333;
	letter-spacing: 1px;
	text-decoration: none;
}

a:hover
{
	color: #993333;
	letter-spacing: 1px;
	text-decoration: underline;
	
}
.livredor
{
	font-size: 12px;
   overflow:auto;
   padding:5px;
   height:280px;
   width:475px;
}
.bio
{
	font-size: 14px;
   overflow:auto;
   padding:5px;
   height:420px;
   width:455px;
}
.ital
{
	font-family:  Verdana;
	font-size: 12px;
}
li
{
	margin-left: -20px;
}

/* III.1. Fieldset
Ici, on va fixer la taille maximale du formulaire pour ne pas que les cadres des éléments fieldset soient trop grands. 
On les écarte aussi un peu entre eux pour bien séparer les groupes logiques. 
Ensuite on peut changer l'aspect de la bordure et la rendre plus discrète. 
Il y a moyen de mettre en forme l'élément legend, par exemple un texte plus grand, en gras, avec des bordures gauche 
et droite comme dans l'exemple ci-dessous. On applique un hover à l'élément fieldset pour faire joli.  */

#monForm
{
	/*width: 60%;*/
}

#monForm p
{
	/*margin: 2px 0;*/
}

/* fieldset , legend */
#monForm fieldset
{
	/*margin-bottom: 10px;*/
	border: #CCC 1px solid;
}

#monForm fieldset:hover
{
	background-color: #FFF;
}

#monForm fieldset legend
{
	padding: 0 10px;
	border-left: #CCC 1px solid;
	border-right: #CCC 1px solid;
	font-size: 1.2em;
	color: #999;
}

/* III.2. Label
Pour bien séparer les éléments label des champs, on va leur mettre une couleur de fond. 
Il ne faut pas oublier d'annuler cette couleur de fond pour le label correspondant aux boutons. 
On peut aussi mettre un hover sur les éléments label, toujours pour faire joli. 
Si on veut pouvoir spécifier une taille pour les éléments label, il faut mettre l'affichage avec display en block. 
Pour aligner les champs de texte avec leur label on met en float: left les éléments label.
On aligne ensuite le texte à droite et on applique au texte un letter-spacing pour une meilleure visibilité. */


/* Label */
#monForm label
{
	background-color: #EEEEEE;
	display: block;
	width: 250px;
	float: left;
	padding-right: 1%;
	text-align: right;
	letter-spacing: 1px;
}

#monForm label:hover
{
	font-weight: bold;
}

#monForm .form_label_nostyle
{
	background: none;
}
 

/*
III.3. Input
Naturellement, on va modifier la taille des champs pour les avoir tous à la même longueur. 
On met en couleur le fond des champs au survol de la souris grâce à un hover et on garde ce fond coloré 
quand on est dans le champ grâce à un focus. */


/* Input */
#monForm input, #monForm select
{
	/*margin-left: 1%;*/
	width: 250px;
	border: #000033 1px solid;
	background-color:#FFFFFF;
}

#monForm input:hover, #monForm select:hover, #monForm input:focus, #monForm select:focus
{
	border: #000033 1px solid;
	background-color: #D6D6D6;
}

#monForm .form_input_day_month
{
	width: 3%;
}

#monForm .form_input_year
{
	width: 6%;
}
 

/* III.4. Bouton submit et reset
On met en couleur verte et rouge respectivement le bouton submit et le bouton reset. 
Ensuite il y a moyen de changer le pointeur de forme au survol de la souris sur le bouton grâce à cursor. */


/* button submit */
#monForm input[type="submit"]
{
	border: #990033 1px solid;
	width: 150px;
	background-color:#D6D6D6;
	color:#000033;
}

#monForm input[type="submit"]:hover
{
	background-color:#000033;
	color:#FFFFFF;
	cursor: pointer;
}

#monForm input[type="reset"]
{
	border: #990033 1px solid;
	width: 150px;
	background-color:#D6D6D6;
	color:#000033;
}

#monForm input[type="reset"]:hover
{
	background-color: #E6484D;
	cursor: pointer;
}
 
 
 #monForm input[type="file"]
{
	width: 304px;
	color:#000033;
	border: #000033 1px solid;
	background-color:#FFFFFF;

}

#monForm input[type="file"]:hover
{
	border: #000033 1px solid;
	background-color: #D6D6D6;
	color:#FFFFFF;
	cursor: pointer;
}

 #monForm textarea
{
	width: 250px;
	color:#000033;
	border: #000033 1px solid;
	background-color:#FFFFFF;

}

 #monForm select
{
	width: 250px;
	color:#000033;
	border: #000033 1px solid;
	background-color:#FFFFFF;

}