body {
font-size:13px;
font-family:  Verdana,Arial,Helvetica,sans-serif;
background: RGB(255,255,255);
color: #000;
}
#conteneur {
  position : relative;
  margin : 0 auto;          
    padding : 0;
  text-align : left;

    width : 1008px; 
  }

h1{font-family:trebuchet ms;color:#990000;font-size: 22px;margin-top:2px;margin-bottom:4px;text-align:center}
h3{font-family: Arial,Helvetica,sans-serif;font-weight:normal}

h2{font-family:trebuchet ms;color:RGB(103,51,51);font-size: 18px;font-weight:normal;margin-top:2px;margin-bottom:4px}
h3{font-size: 16px;margin-top:2px;margin-left:2px;margin-bottom:4px}

hr{height:1px; background: RGB(103,51,51) }

a{font-family: Verdana,Arial,sans-serif;font-size:13px;font-weight:normal;border-style:none;color:#673333}
a:link{color:RGB(0,0,255);text-decoration:none;background:transparent;color:#673333}
a:visited{color:RGB(44,37,139);text-decoration:none;background:tranparent;border-style:none;}
a:active{color:RGB(70,67,107);text-decoration:none;background:transparent}
a:hover{color:RGB(0,0,255);text-decoration:underline;background:transparent;}

.circle{list-style-type:circle;padding-left:30px}
.disc{list-style-type:disc;padding-left:30px}
.pucecarre{list-style-image:url(/images/icones/pucecarre.png);padding-left:30px}


/*  Responsive Design */ 

@media screen and (min-width: 961px)
{
div.droite{position:absolute;top:140px;left:820px;width:162px;height:220%;margin : 0.5em;text-align:center}
div.gauche{position:absolute;top:140px;left:0px;width:225px;height:220%;text-align:center}
div.texte{position:absolute;top:140px;left:230px;width:550px;background:#e6e6e6;color:black;margin : 0.5em;padding:10px;text-align:left}
div.ribbon{ position:absolute;top:80px;left:00px;width:990px;height:23px;  text-align: center;background:#990000; padding: 5px;} /* Le menu principal */
div.sous-menu{ position:absolute;top:115px;left:0px;width:1000px;height:22px;background:#ccc} /* Le sous-menu */
div.enseigne{position:absolute;top:0px;left:5px;width:874px;height:40px;}
div.enseigne a:link, div.enseigne a:visited, div.enseigne a:active, div.enseigne a:hover {font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size: 32px;color:#444;line-height:24px;color:#444;text-decoration:none}
}



@media screen and (max-width:960px){

.sous-menu,.gauche,.droite{display:none}
div.texte{position:absolute;top:140px;left:5px;width:550px;background:#e6e6e6;color:black;margin : 0.5em;padding:10px;text-align:left}
div.ribbon{ position:absolute;top:80px;left:00px;width:550px;height:23px;  text-align: center;background:#990000; padding: 5px;} 
div.enseigne a:link, div.enseigne a:visited, div.enseigne a:active, div.enseigne a:hover {font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size: 32px;color:#444;line-height:24px;color:#444;text-decoration:none}
 }

 
 @media screen and  (max-width:550px){
div.texte{position:absolute;top:140px;left:5px;width:380px;background:#e6e6e6;color:black;margin : 0.5em;padding:10px;text-align:left}
div.ribbon{ position:absolute;top:80px;left:00px;width:380px;height:23px;  text-align: center;background:#990000; padding: 5px;} 
div.ribbon a:link{font-size:16px}

 }



 @media screen and (max-width:380px){
 div.enseigne{width:320px}
 div.texte{position:absolute;top:140px;left:5px;width:320px;background:#e6e6e6;color:black;margin : 0.5em;padding:10px;text-align:left}
div.ribbon{ position:absolute;top:80px;left:00px;width:320px;height:21px;line-height:25px;  text-align: center;background:#990000; padding: 5px;} 
div.ribbon a:link{font-size:13px}
div.enseigne a:link{font-size:20px}
 
}


/* Fin Responsive Design */ 
/* Division enseigne  en haut de l'écran */

div.pubhaut{position:absolute;top:42px;left:5px;width:874px;height:90px;}

div.droite td{padding : 3px 3px; background:RGB(255,255,255)}
a{font-family: Arial,sans-serif;font-weight:normal;border-style:none;,sans-serif;font-size:14px;}
a:link{color:#004A6B;text-decoration:none;background:transparent}
a:visited{color:#004A6B;text-decoration:none;background:tranparent;border-style:none;}
a:active{color:RGB(70,67,107);text-decoration:none;background:transparent}
a:hover{color:#990000;text-decoration:underline;background:transparent;}

/* division menu de gauche */
 RGB(255,255,255);color:black;margin : 0.5em;text-align:left;color:#555;}
div.gauche table{border:0px; border-spacing:0px; width:95%;margin-left:0px;margin-right:0px;
font-family: Verdana,Arial,helvetica,sans-serif;}
div.gauche p{margin-top:0px;margin-bottom:0px}
div.gauche h1{font-family:trebuchet ms;color:black;font-size: 18px;margin-top:2px;margin-bottom:4px}

div.gauche table{border:solid 1px  gray; border-spacing:2px; width:95%;margin-left:0px;margin-right:5px;font-size:12px;
font-family: Verdana,Arial,helvetica,sans-serif;}
div.gauche th{padding : 3px 3px; }
div.gauche td{padding : 3px 3px; }

div.exerg1{font-family:comic sans ms;font-size: 17px;font-weight:normal;margin-top:2px;margin-bottom:4px;color:brown}
div.encadre{font-family:13px;color:black;background:RGB(255,255,255);border:ridge;padding:0.7em}

div.petitexerg{font-family:comic sans ms;font-size: 15px;font-weight:normal;margin-top:2px;margin-bottom:4px;color:brown}
div.petitexergblack{font-size: 15px;font-weight:normal;margin-top:2px;margin-bottom:4px;color:black}



div.ribbon p {margin :1px; text-align: center;font-weight:;}
div.ribbon a {font-family:Arial,sans-serif;font-size:18px;font-weight:bold;margin :0px;text-decoration:none;text-align:center }
div.ribbon span {padding : 0 3px; margin : 0}
div.ribbon a:link, div.ribbon a:visited, div.ribbon a:active {padding: 6px ; margin-top: 5px; margin-bottom: 5px;  display: inline;   border: 0px solid; color:white; background:#990000;}
div.ribbon a:hover {color: #444; background:#fff;border:0px solid  #2d4368;}

/* End box model hack */


.btn-group .button1 {
    background-color: #FF8000; /* orange */
    border: none;
    color: black;
    padding: 6px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    width: 150px;
    display: block;
    border-radius: 12px;
    margin:4px;
    outline: 0;
}
.btn-group .button1:not(:last-child) {
    border-bottom: none; /* Prevent double borders */
}
.btn-group .button1:hover {
    background-color: #DF7401;
}
.btn-group .button2 {
    background-color: #FF8000; /* orange */
    border: none;
    color: black;
    padding: 4px 6px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    cursor: pointer;
    width: 120px;
    display: block;
    border-radius: 12px;
    margin:3px;
    outline: 0;
}
.btn-group .button2:not(:last-child) {
    border-bottom: none; /* Prevent double borders */
}
.btn-group .button2:hover {
    background-color: #DF7401;
}


/* Zone des boutons animés du menu principal */
div.side { 
  position: absolute; top: 130px; left: 75px; z-index; 1; 
  width: 840px; height: 60px; 
  color: white; bRGB(103,51,51); 
  padding-bottom: 10px; 
}

/* Nested padding for side, main, and right column divisions. */
div.sidepad { 
  padding-top: 10px; 
}

/* Settings for the side division. */

div.side p { 
  margin: 0 0px; 
}

div.side a, div.side a:link, div.side a:visited, div.side a:active { 

  padding: 5px; 
  margin-top: 16px; margin-bottom: 16px; 
 
  color: white; background: RGB(103,51,51); 
  font-weight: bold; text-decoration: none; 
  font-family: Arial, sans-serif;font-size:14px }

div.side a, div.side a:link, div.side a:visited, div.side a:active { 
/* Start box model hack */
  width: 106px; voice-family: "\"}\""; voice-family: inherit; width: 90px; 
}
html>body div.side a { 
  width: 90px 
}
/* End box model hack */



div.side a:hover { 
  color: RGB(103,51,51); background: RGB(0,0,255); 
 
  margin-bottom: 16px; margin-top: 16px; 
}





