/*** Mise en forme du formulaire ***/



#formulaire_ami {

	border: none;

	margin: 0;

	padding: 0;

	width: 350px;	/*** Largeur du formulaire ***/

}



#corpform_ami {	/*** Mise en fome du corp du formulaire (bordure, couleur du fond...) ***/

	/*border: 1px solid black;*/

	color: black;

	/*background: #efefef;*/

	margin: 0;

	padding: 5px;; /*bord du fildset et le cadre*/

}

#corpform_ami fieldset {	/*** Mise en forme des cadres ***/

	margin: 0;

	font-style: normal;

	padding: 0 5px 5px; /*decalage entre le txt (email) et le bord du fielset*/

}

#corpform_ami legend {	/*** Mise en forme des titres des cadres ***/

	font-weight: bold;

	color: black;

	background: transparent;

}

#corpform_ami p {	/*** Mise en forme des lignes du formulaire ***/

	padding: 5px 0;

	margin: 0 0 0 0;

}

#corpform_ami fieldset.form label {	/*** Mise en forme des intitulés de champs ***/

	float: left;	/*** Très important, ne pas suprimer ! ***/

	width: 100%;	/*** Les intitulés prennent 1/3 de la largeur totale du formulaire... ***/

	text-align: right;	/*** ... et ils sont alignés à droite... ***/

	margin: 0;

	padding: 0 .5em 0 0;

	line-height: 1.8;	/*** ... et centrés verticalement. ***/

}



#corpform_ami fieldset.form label.mini {	/*** Mise en forme des intitulés de champs ***/

	float: left;	/*** Très important, ne pas suprimer ! ***/

	width: 50%;	/*** Les intitulés prennent 1/3 de la largeur totale du formulaire... ***/

	text-align: right;	/*** ... et ils sont alignés à droite... ***/

	margin: 0;

	padding: 0 .5em 0 0;

	line-height: 1.8;	/*** ... et centrés verticalement. ***/

}



#corpform_ami label:hover, #piedForm_ami input {

	cursor: pointer;	/*** Petite astuce pour apprendre aux utilisateurs à cliquer sur les intitulés ***/

}

#corpform_ami label.oblig {

	font-weight: bold;	/*** Mise en évidence des champs obligatoires ***/

}



#corpform_ami .legende {	/*** Mise en forme des aides contextuelles ***/

	font-style: italic;

	color: #666;

	background: transparent;

	margin: 0;

	padding: 0;

}



#corpform_ami a.aide {	/*** Mise en forme des bulles d'aide ***/

	text-decoration: none;

}



#corpform_ami a.aide img {	/*** Mise en forme de l'image des bulles d'aide ***/

	margin: 0;

	padding: 0;

	border: 0;

}



#corpform_ami a.aide:hover {	/*** Le curseur de la souris change d'aspect quand il passe au-dessus d'une bulle d'aide ***/

	cursor: help;

}



#corpform_ami .focus {	/*** Mise en avant des champs en cours d'utilisation ***/

	background: beige;

	color: black;

}



#corpform_ami .normal {	/*** Retour à l'état normal après l'utilisation ***/

	background: white;

	color: black;

}



/*** Mise en forme des messages d'erreur ***/



#corpform_ami .alerte {	/*** Mis en évidence des champs mal renseignés ***/

	border: 1px solid red;

}



#corpform_ami .messageAlerte {	/*** Mise en forme des message d'alerte ***/

	display: block;

	margin: 0 0 .3em .3em;

	padding-left: 2em;

	color: red;

	font-weight: bold;

	background: url('icon_alert.gif') no-repeat left center;

}



div.groupe_form_ami{

	position:relative;

	/*background-color:blue;*/

	margin:0;

	padding:0;

	width:320px;

}



p.form_intitule_ami{

	float:left;

	width:70px;

	/*background-color:green;*/

	margin:0;

	padding:0;

}



p.form_ami_nom{

	float:left;

	width:120px;

	/*background-color:red;*/

	margin:0;

	padding:0;

	text-align:center;

}



p.form_ami_mail{

	float:left;

	width:120px;

	/*background-color:yellow;*/

	margin:0;

	padding:0;

	text-align:center;

}



p.form_ami_commun{

	float:left;

	width:220px;

	margin:0;

	padding:0;

	/*background-color:purple;*/

}



p.form_ami_commun textarea{

	float:left;

	width:230px;

	margin-left:4px;

	padding:0;

	font-size:12px;

	/*background-color:yellow;*/

	

}



#piedform_ami {

	text-align: right; /*** Les boutons sont alignés à droite ***/



}

#piedform_ami input {

	font-weight: bold; /*** Pour améliorer la lisibilité des boutons ***/

	margin-left: 1em;

}