body
{
	margin-top:2px;
	padding: 0 ;
	margin-left:auto;
	margin-right:auto;
	text-align: center ;
	font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
	background-color:#fff;
	width:1024px;
	height:768px;
}

div#conteneur
{
	width: 800px ;
	margin: 0;
	text-align: left ;
	color:#fff;
	border: 1px solid #663333 ;
}

h1#header
{
	height: 220px ;
	width:800px;
	margin: 0 ;
}

h1#header a
{
	width: 400px ;
	height: 70px ;
	display: block ;
	background: url(title.gif) no-repeat ;
	position: relative ;
	left: 300px ;
	top: 15px ;
	text-indent: -5000px ;
}/* On donne les mêmes dimensions au lien, chose
 possible grâce à la propriété display: block ; qui transforme le lien
  en élément de type block, auquel on peut donner des propriétés de taille.
   On met aussi l'image de fond qui a les mêmes dimensions que le cadre ainsi créé */
/* Le text-indent négatif est fait pour pouvoir ne
 cacher le texte hors de la page, ce que nous voulons. Ainsi il reste
  exploitable pour les syntèses vocales */
/*
  #menu{
  position:relative;
  }
#menuDeroulant
{
 width: 100%;
 list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
 position: absolute;
 top: 0;
 left: 0;
}

#menuDeroulant li
{
 float: left;
 width:150px;
 margin: 0;
 padding: 0;
 border: 0;
}
#menuDeroulant .sousMenu
{
 display: none;
 list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
}

#menuDeroulant .sousMenu li
{
 float: none;
 margin: 0;
 padding: 0;
border:0;
 width: 149px;
 border-top: 1px solid transparent;
 border-right: 1px solid transparent;
}

}
#menuDeroulant li a:link, #menuDeroulant li a:visited
{
 display: block;
 height: 1%;
 color: #FFF;
 background: #3B4E77;
 margin: 0;
 padding: 4px 8px;
 border-right: 1px solid #fff;
 text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited
{
 display: block;
 color: #FFF;
 margin: 0;
 border: 0;
 text-decoration: none;
 background: transparent url("fondTR.png") repeat;
}
#menuDeroulant .sousMenu li a:hover
{
 background-image: none;
 background-color: #F2462E;
}

#menuDeroulant li:hover > .sousMenu { display: block; }
*/




dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
/* POUR IE : margin: 5px 20px 0px -373px; */ 
z-index:100;
width: 100%;
}


#menu dl {
float: left;
width: 12em;
margin: 0 1px;
}




#menu dt {
cursor: pointer;
text-align: center;
BACKGROUND-IMAGE:url("images/bouton2.jpg");
font-weight: bold;
border: 1px solid gray;


}
#menu dd {

border: 1px solid gray;

}


#menu li {
text-align: left;
background: #fff;

}



#menu li a, #menu dt a {
padding-left:5px;
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;

}
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
background: #CC9966;

}
div#contenu h2
{
	padding-left: 8px ;
	line-height: 25px ;
	font-size: 1.4em ;
	background: url(little_apple.gif) no-repeat left bottom ;
	color: #663333;
	border-bottom: 1px solid #663333 ;
}

div#contenu
{
	padding: 10px 18px 0 20px ;
	color:black;
}

div#bloc-contenu h2
{
	padding-left: 8px ;
	line-height: 25px ;
	font-size: 1.4em ;
	background: url(little_apple.gif) no-repeat left bottom ;
	color: #663333;
	border-bottom: 1px solid #663333 ;
}

div#contenu h3
{
	margin-left: 15px ;
	padding-left: 5px ;
	border-bottom: 1px solid #9b2 ;
	border-left: 3px solid #9b2 ;
	color: #9b2 ;
}

div#contenu p
{
	text-align: justify ;
	text-indent: 2em ;
	line-height: 1.7em ;
	
}

div#contenu a
{
	color: #CC9966
}

div#contenu a:hover
{
	color: #CC9966 ;
}

div#footer
{
	margin: 0 ;
	padding-right: 10px ;
	line-height: 30px ;
	text-align: right ;
	color:#663333;
}

pre
{
	overflow: auto ;
	background: #dea ;
	border: 2px solid #9b2 ;
	padding: 5px 0 0 5px ;
	font-size: 1.2em ;
}


pre span
{
	color: #560 ;
}

pre span.comment
{
	color: #b30000 ;
}

.violet {
font-size: 1.1em ;
font-weight:bold;
color: #663333;
}