html, body {
  margin: 0;
  background-color: #f48224;
  height: 100%;
  width: 100%;
  font-family: Verdana,Arial,Helvetica,sans-serif;
  color: #000066;
}
p {
text-align:justify;
}
hr {
color:#ffd700;
}
acronym {
 color: #006400;
 font-variant: normal;
}
dt {
color:white;
 font-weight:bold;
 margin-bottom:2px;
 margin-top:2px;
}

/* ------------------------------------ Partie tête (haut de page droite) et menu principal déroulant ----- */
#ci_tete{
  border-width: 1px;
  border-bottom: 1px groove #ffcc00;
/*  background-image: url(Images/LogoTete.png);
  background-repeat: no-repeat;
  background-position: right top;*/
  background-color: #f48224;
  position: absolute;
  top: 10px;
  left: 190px;
  width: 83%;
  height: 95px;
  z-index: 30;
}
/* .../ ... titre */
#ci_tete h1 {
  color: white;
  font-weight: bold;
  font-size: 20px;
  text-align: left;
}
/* .../... menu déroulant */
#menuDeroulant
{
  border-top: thin solid #FFD700;
  margin: 0px;
  padding: 1px;
  position: absolute;
  left: 0px;
  top: 70px;
list-style-type: none;
text-align : center;
}
#menuDeroulant li
{
float: left;
  font-size: 12px;
  padding-left: 5px;
  padding-right: 5px;
width:auto;
}
#menuDeroulant .sousmenu
{
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
text-align : left;
border-left: 1px solid #FFD700;
}
#menuDeroulant .sousmenu li
{
float: none;
margin: 0;
padding: 0;
border: 0;
width:auto;
}
#menuderoulant li,li ul li
{
list-style-type: none;
float: left;
width: auto;
margin: 0;
padding: 0;
border: 0;
}
#menuderoulant li a:link, #menuderoulant li a:visited
{
display: block;
height: auto;
color: blue;
background: orange;
margin: 0;
padding: 4px 8px;
text-decoration: none;
}
#menuderoulant li a:hover { background-color: #FFD700; }
/*#menuderoulant li a:active { background-color: green; }*/
#menuderoulant .sousmenu li a:link,
#menuderoulant .sousmenu li a:visited{
display: block;
color: white;
margin: 0;
border: 0;
text-decoration: none;
}
#menuDeroulant .sousmenu li a:hover{
background-color: #FFD700;
}
#menuderoulant li:hover > .sousmenu { display: block;}
/* .../... sous-sous menu dans menu déroulant */
/* attention : le soussous menu sera visible en même temps que le sous menu (sinon trop complexe) */
#menuDeroulant .sousmenu .soussousmenu
{
/* si on retire padding: 0; l'effet est d'avoir les lignes du sousousmenu dans des rectangles décalés à droite */
padding: 0;
text-align : left;
font-style:italic;
color:blue;
}
#menuderoulant .sousmenu  .soussousmenu li a:link,
#menuderoulant .sousmenu  .soussousmenu li a:visited{
color: blue;
}
/* fin pour sous sous menu  */
/* ------------------------------------ Partie Gauche ------------------------------------- */
#ci_gauche {
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-position: left center;
  background-image: url(Images/ImageMenu.gif);
  position: absolute;
  top: 0px;
  left: 0px;
  width: 205px;
  padding-right: 5px;
  height: 100%;
  z-index: 20;
	font-size: 12px;
}
/* .../... Titre Gauche */
#ci_gauche h1 {
  color: #FFD700;
  font-weight: bold;
  font-style: italic;
  font-size: 20px;
  text-align: center;
  padding-top: 10px;
  padding-right: 30px;
  margin-bottom: 85px;
}
#ci_gauche ul{
  text-decoration: none;
  text-align: right;
}
#ci_gauche ul li {
	border-right: 1px solid #FFD700;
	list-style-type: none;
	margin-top: 5px;
	padding-right: 5px;
	float:none;
width:auto;
}
#ci_gauche > ul > li {
	font-size: 12px;
	font-weight: bold;
}
#ci_gauche ul li ul {
}
#ci_gauche > ul > li > ul > li {
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
}
#ci_gauche a {
  text-decoration: none;
}
#ci_gauche ul li ul li a {
	color: white;
}
#ci_gauche a:hover {
  background-color: #FFD700;
}
/* ------------------------------------ zone de contenu ------------------------------------- */
#ci_contenu {
  border-width: 1px;
  border-left: 1px double #ffcc00;
  padding: 15px;
  position: absolute;
  top: 110px;
  left: 210px;
  width: 78%;
  background-color: #a6bec6;
  background-image: url(Images/LogoGrisForme.gif);
  background-position:  center center;
  background-repeat: no-repeat;
  font-size: 12px;
  text-align: justify;
  height: auto;
  z-index: 10;
}

div#ci_contenu h1 {
  font-size: 20px;
  font-weight: bold;
  color: #FFD700;
  margin-bottom: 5px;
}
div#ci_contenu h2 {
  font-size: 16px;
  font-weight: bold;
  color: white;
  margin-bottom: 5px;
}
div#ci_contenu ul {
  font-size: 16px;
  font-weight: bold;
}
div#ci_contenu ul li {
  font-size: 12px;
  font-weight: normal;
  list-style-type: disc;
}
div#ci_contenu .menucontenu {
float:left;
margin:0px;
padding:0px;
list-style-type: none;
  text-align: center;
/*width:auto;*/
width:100%;
}
div#ci_contenu .menucontenu li {
float:left;
border: 1px solid #FFD700;
margin:3px;
padding:3px;
list-style-type: none;
width:auto;
}

div#ci_contenu .menucontenu  a {
text-decoration: none;
}
div#ci_contenu .menucontenu  a:hover {
  background-color: #FFD700;
}
/* ------------------------------------ bonus ------------------------------------- */
.news3 {
  border-left: 1px groove #FFD700;
  padding: 5px;
  float: left;
  width: 32%;
  font-size: 10px;
  text-align: justify;
}
.encartDroite30 {
  border: 1px solid #FFD700;
  padding: 5px;
  margin: 5px;
  float: right;
  width: 30%;
  font-size: 10px;
  text-align: justify;
}
.encartGauche30 {
  border: 1px solid #FFD700;
  padding: 5px;
  margin: 5px;
  float: left;
  width: 30%;
  font-size: 10px;
  text-align: justify;
}

.sstitreOr {
  font-size: 16px;
  color: #ffcc00;
  font-weight: bold;
}
.GrosTitreOr {
  font-size: 20px;
  font-weight: bold;
  color: #ffcc00;
}
.ssTitreBlanc {
  font-size: 16px;
  color: #ffffff;
  font-weight: bold;
}
.ADroite {
	width:auto;
	float: right;
	padding-left: 10px;
}