/* Mise en page du site des Bons-Enfants */

html,
body
{
	color: 				black;
	font-family:		"Trebuchet MS", Arial, sans-serif;
	background-color:	#CCC;
	
	height:		100%;
	
	margin:		auto;
	padding:	0px;
}
* html body
{
	text-align:	center;
}

#ie
{
	position:	relative;
	
	background-color:		#fffefc;
	background-image:		url(./images/footer7.jpg);
	background-repeat:		repeat-x;
	background-position:	bottom left;
	
	border-left:		3px solid #AAB;
	border-right:		3px solid #AAB;
	
	padding-bottom:		0px;
	margin:				0px auto;
	
	/*max-width:		900px;*/
	width:			750px; /* 775 px ? */
	min-height:		100%;
}
/* Hack IE */
* html #ie
{
	/*width:expression(document.body.clientWidth > 900 ? "900px" : "auto" );*/
	height:		100%;
	/*bottom:		0px;*/
	height: 1%;
	text-align:	left;
}

/* Bannière et logo du site */
#banniere
{
	padding:	0px;
	margin:		0px;
	height:		112px;
	
	background:	no-repeat url(./images/banniere_hoyoux.jpg);
}

/* Copyright */
#copyright
{
	position:		absolute;
	bottom:			5px;
	
	color: 			black;
	
	font-style:		italic;
	font-size:		0.7em;
	text-align:		center;
	
	width:			750px;
	margin:			auto 0px;
	padding:		0px;
	
	/*margin-bottom:	5px;*/
}
/* HACK IE */
* html #copyright
{
	position:		relative;
	bottom:			17px;
	
}

#copyright a
{
	color: 				darkblue;
	text-decoration:	none;
}

/****************************/
/* Menu principal du dessus */
/****************************/
#menu_principal
{
	font-family:	"Trebuchet MS", Arial, sans-serif;
	/*font-variant:	small-caps;*/
	font-size:		0.8em;
	font-weight:	bold;
	
	/*padding:		2px;*/
}

/*#menu_principal a.selected,
#menu_principal a.selected:visited*/
#menu_principal ul
{
	background-color:	#defccc;
	/*border:			green 2px solid;*/
	
	list-style:			none;
	
	height:				1.5em;
	line-height:		1.5em;
	
	width:				100%;
	margin:				0px;
	padding:			0.25em 0px;
	
	
	vertical-align:		middle;
	
	clear:				both;
}
/* HACK IE : barre blanche*/
* html #menu_principal ul
{
	position:	relative;
	bottom:		1px;
}

#menu_principal ul li
{
	margin:			0px 2px;
	float:			left;
}

#menu_principal a,
#menu_principal a:visited
{
	color:				green;
	
	text-decoration:	none;
	white-space:		nowrap;
	
	padding:		1px 10px;
	/*
	margin:			1px;
	padding:		0px 4px;
	*/
}
/* HACK IE */
/*
* html #menu_principal a
{
	display:		block;
	float:			left;
}
/* HACK IE */
/*
* html #menu_principal div
{
	float:	left;
	width:	3px;
}
*/
#menu_principal a:hover
{
	background-color:	#ffffcc;
	color:				green;
	border-radius:		10px;
	-moz-border-radius:	10px;
	
	/*padding:		1px 2px;*/
}



/*******************/
/* Cadre principal */
/*******************/
#main
{
	clear:			both;
	font-size:		0.8em;
	overflow:		auto;
	padding-bottom:	70px;
}
/* HACK IE */
* html #main
{
	overflow:		visible;
	height:			1%;
}


/* Sous-menu sur le côté */
#menu
{
	float:				left;
	
	background:			#dffecc no-repeat url(images/coin_ext.png);
	background-position:bottom right;
	/*
	border:				#CDEBBB 2px solid;
	border-radius:		15px;
	-moz-border-radius:	15px;
	*/
	font-size:		1em;
	
	width:			140px;
	margin:			0px;
	padding:		5px;
	height:			100%;
}
/* HACK IE */
* html #menu
{
	margin:			0px;
	padding-left:	0px;
	padding-right:	0px;
}

#menu ul
{
	margin:			15px 0px 0px 25px;
	padding:		0px;
	
	list-style-image:	url("./images/puce.gif");
	
	vertical-align:	middle;
}

#menu li
{
	margin:			0px;
	margin-bottom:	10px;
	padding:		0px;
}
#menu ul a,
#menu ul a:visited
{
	text-decoration:	none;
	
	color:			green;
	/*font-weight:	bold;*/
	padding:		1px;
}
#menu ul a:hover
{
	color:				white;
	background-color:	#BCDBAA;
	
	border-radius:		5px;
	-moz-border-radius:	5px;
}
#menu img
{
	display:		block;
	margin-left:	auto;
	margin-right:	auto;
}
/* HACK IE */
* html #menu img
{
	margin-left:	20px;
	margin-right:	20px;
}





/*******************************/
/* Formatage du corps de texte */
/*******************************/
#texte
{
	/*clear:			right;*/
	
	line-height:	1.5em;
	
	overflow:		auto;
	
	margin:			0px 1px 0px 0px;
	padding:		10px;
	background:				no-repeat url(images/coin_int.png);
	background-position:	top left;
}
/* HACK IE */
* html #texte
{
	/*clear:			both;*/
	overflow:		visible;
	height:			1%;
	
	position:		relative;
	right:			3px;
}
/* Balise corrigeant le défaut d'affichage du texte par rapport au menu dans IE */
* html #ie_float
{
	overflow:		visible;
	height:			1%;
}

#texte p
{
	padding-left:	30px;
	padding-right:	20px;
	
	text-align:		justify;
}


#texte p:first-letter,
#texte blockquote:first-letter,
#texte blockquote p:first-letter,
#texte .lettrine,
#texte p a:first-letter
{
	color:			#0060B0;
	
	/*font-family:	cursive, sans-serif;*/
	font-size:		1.2em;
	font-weight:	bold;
	text-transform:	uppercase;
}

#texte a
{
	color: darkblue;
}
#texte a:hover
{
	background-color:	#E0ECF8;
	
	border-radius:		5px;
	-moz-border-radius:	5px;
}
#texte a img
{
	border:		none;
	margin:		0px;
}

#texte ul
{
	text-align:		justify;
	/*
	margin-left:	40px;
	margin-right:	10px;*/
	
	list-style-image:	url("./images/puce_texte.gif");
}

/* Règles  gérérales */
#main .fin
{
	clear:		both;
}

#main .flotte_gauche
{
	display:	block;
	float:		left;
	
	margin:		5px 10px;
	padding:	3px;
	
	border:		solid 1px #CCC;
	background:	#FFF;
}

#main .flotte_droite
{
	display:	block;
	float:		right;
	
	margin:		5px 10px;
	padding:	3px;
	
	border:		solid 1px #CCC;
	background:	#FFF;
}

#main .flotte_centre
{
	display:	block;
	clear:		both;
	
	margin:		5px auto;
	padding:	3px;
	
	border:		solid 1px #CCC;
	background:	#FFF;
}

#main pre
{
	clear:			both;
	
	color:			black;
	font-size:		1.2em;
	
	margin-left:	40px;
	margin-right:	50px;
	padding:		10px;
	
	background-color:	#FCFCFC;
	border:				#DDDDDD 2px solid;
	border-radius:		15px;
	-moz-border-radius:	15px;
	
}
/* HACK IE */
* html #main pre
{
	height:			1%;
}

#main blockquote
{
	clear:			both;
	
	color:			black;
	font-size:		1em;
	
	width:	auto;
	
	margin:			15px;
	margin-left:	50px;
	margin-right:	50px;
	padding:		5px;
	
	background-color:	#FCFCFC;
	border:				#DDDDDD 2px solid;
	border-radius:		10px;
	-moz-border-radius:	10px;
}
#texte blockquote p
{
	padding:	10px;
}

#main h1
{
	clear: both;
	
	color: 			#004090;
	font-size:		2.2em;
	font-weight:	bold;
	
	margin:			0px;
	padding:		5px;
}
/* HACK IE */
* html #main h1
{
	/*margin-top:		20px;*/
}
#main h2
{
	clear:			both;
	
	background-color: 	#E0ECF8;
	color: 				#0060B0;
	
	font-family:	Verdana, Arial, sans-serif;
	font-size:		1.4em;
	font-weight:	bold;
	
	padding-left:	15px;
	margin-top:		40px;
}
#main h3
{
	color: 			#358FC0;
	
	font-family:	Arial, sans-serif;
	font-size:		1.1em;
	font-weight:	bold;
	font-style:		italic;
	
	padding-left:	15px;
	margin-top:		25px;
}
#main h4
{
	color:			green;
	
	font-size:		1.3em;
	line-height:	1.5em;
	font-weight:	bold;
	
	padding:		0px;
	margin:			8px;
}
#main table
{
	border-collapse:		separate;
	border-spacing:			5px;
	
	width:		100%;
}


#image img
{
	padding:	3px;
	background:	#FFF;
	border:		solid 1px #CCC;
}
#image .cadre
{
	clear:			right;
	
	color:			black;
	
	font-size:		1em;
	
	margin:			20px;
	margin-left:	50px;
	padding:		20px;
	
	background-color:	#FCFCFC;
	border:				#DDDDDD 2px solid;
	border-radius:		15px;
	-moz-border-radius:	15px;
}
/* HACK IE */
* html #image .cadre
{
	margin-top:		20px;
}



/* Admin */

#info
{
	font-size:			0.8em;
	
	background-color:	white;
	
	margin:			10px;
	margin-left:	10px;
	padding:		10px;
	
	border:			#CCCCCC 2px solid;
	border-radius:		15px;
	-moz-border-radius:	15px;
	
	overflow:			auto;
}
/* HACK IE */
* html #info
{
	overflow:		visible;
	margin-left:	220px;
	height:			1%;
}

#info p
{
	text-align:		justify;
	
	margin-left:	40px;
	margin-right:	10px;
}

#info h2
{
	clear:			both;
	
	background-color: 	#E0ECF8;
	color: 			#0060B0;
	
	font-family:	Verdana, Arial, sans-serif;
	font-size:		1.4em;
	font-weight:	bold;
	
	padding-left:	15px;
	margin-top:		40px;
}

#info h3
{
	color: 			#358FC0;
	
	font-family:	Arial, sans-serif;
	font-size:		1.1em;
	font-weight:	bold;
	font-style:		italic;
	
	padding-left:	30px;
	margin-top:		25px;
}

form
{
	margin:	10px;
}