html,body {
      margin: 0;
      padding: 0;
      text-align: center;
      font-family: arial, Helvetica, sans-serif;
      font-size: 15px;
      background: #fff url(images/bkgd.jpg) center repeat-y;
}

#body-margin{
      text-align: center;
      background: #fff;
      padding: 0px 11px;
      margin: 0 auto;
      width: 920px;      
      voice-family: "\"}\""; 
      voice-family:inherit;
      width: 898px;
}
    
img { border: none; }
a { text-decoration: none; color: #828282; font-weight: bold;}
a:hover { text-decoration: underline; color: #fd7979; }

/*---------- Divs ----------*/
#header {
      background: url("images/header.jpg") no-repeat center;
      height: 120px;
      width: 890px;
      margin: 0 auto;
}

#logo{
      padding-top: 30px;
      margin: 0 auto;
      width: 890px;
}

#logo a:hover {
      text-decoration: none;
}

#logo a {
      float: left;
      width: 200px;
      height: 85px;
}

#container {
      width: 890px;
      overflow: hidden;
      text-align: left;
      font: 90% Tahoma, Helvetica, sans-serif;
      margin: 0px auto;
      background: #fff;
      padding-bottom: 30px;
}  
* html #container {
      overflow: visible;
}

#intro{
      min-height: 190px;
      margin: 10px auto;
}
* html #intro { height: 190px;}

#intro-image{
      float: left;
      width: 560px;
}

#intro-text{
      padding-top: 10px;
      float: right;
      width: 305px;
      text-align: justify;
}

#content{
      margin-top: 20px;
      min-height: 250px;
}
* html #content { height: 250px;}

#sidecontent{
      float: left;
      border: 2px solid #828282;
      margin-right: 20px;
      padding: 10px;
      text-align: center;
      width: 240px;
      voice-family: "\"}\""; 
      voice-family:inherit;
      width: 210px;
}
html>body #sidecontent { width: 210px }  /* for opera */

#sidecontent img{
      padding: 1px;
      border: 1px solid #828282;
}

#maincontent {
      float: right;
      width: 630px;
}

#mainleft {
      float: left;
      width: 425px;
}

#mainright {
      float: right;
      width: 180px;
}

#mainright a {
      color: #000;
}

#footer {
      width: 890px;
      margin: 0 auto;
      min-height: 70px;
      background: #c51010 url(images/gradient.gif) repeat-x;
      border-top: 4px solid #828282;
      font-size: 84%;
      color: #fff;

}
* html #footer {height: 100px;}

#footertextleft{
      margin-top: 10px;
      float: left;
      width: 450px;
      text-align:left;
      padding-left: 10px;  
}

#footertextright{
      margin-top: 10px;
      text-align: right;
      width: 350px;
      float: right;
      padding-right: 10px; 
}

/*------------------------- Navigation --------------------------*/

#navcontainer {
      width: 890px;
      height: 38px;
      background: #c20404 url(images/gradient.gif) repeat-x;
      margin: 10px auto 0 auto;
      border-bottom: 4px solid #828282;
      display: block;
      font-size: 140%;
}
* html #navcontainer { height: 43px;}

#navcontainer ul {
      position: relative;
      float: left;
      list-style-type: none;
      margin: 0px;
      padding: 0px 0px 0px 10px;
      font-size: 65%;
}

#navcontainer li {
      margin: 10px 3px 0px 3px;
      float: left;
      height: 28px;
      background: url("nevae.fr/images/nav.jpg") repeat-x;
}

#navcontainer a {
      float: left;
      display: block;
      padding: 7px 9px 6px 9px;
      color: #FFF;
      text-decoration: none;
}

#navcontainer a:hover {
      background: #828282;
      color: #fff;
      cursor: pointer;
}
/*---------- Headings ----------*/
h1 { 
      padding-top: 0;
      margin-top: 0;  
      font: 120% Arial;
      font-weight: bold;
      color: #c20404;
}

.mainheading{
      font-weight: bold;
      font-size: 123%;      
}

/*---------- Classes ----------*/
.heading{
      background: #c20404;
      border-bottom: 4px solid #828282;
      height: 25px;
}

.subheading-white{
      color: #fff;
      margin: 0px;
      padding: 5px 0 0 10px;
      font-size: 115%;
      font-weight: bold;
      
}

.p-indent{
      padding-top: 0px;
      padding-left: 10px;
}



/* ==================================================================
   PIED DE PAGE SUR TROIS COLONNES

   Ce site portait une ou plusieurs barres laterales a largeur fixe :
   sur telephone, elles poussaient le contenu hors de l'ecran. Leur
   contenu est desormais dans le pied de page, reparti sur trois
   colonnes qui se replient l'une sous l'autre quand la place manque.
   ================================================================== */

*, *::before, *::after { box-sizing: border-box; }
img, iframe, video, table { max-width: 100%; }
img { height: auto; }

.pied-3col {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0 28px;
	clear: both;
}
.pied-col {
	flex: 1 1 240px;
	min-width: 0;
}
.pied-col > *:first-child { margin-top: 0; }

/* la colonne de contenu reprend toute la largeur */
#mainleft {
	float: none;
	width: auto;
	margin-left: 0;
	margin-right: 0;
}

/* les conteneurs gardent leur largeur, sans la subir */
#mainleft {
	width: auto;
	max-width: 920px;
}
#maincontent {
	width: auto;
	max-width: 630px;
}
#container {
	width: auto;
	max-width: 890px;
}
#body-margin {
	width: auto;
	max-width: 920px;
}

/* le pied ajoute aux pages qui n'en avaient pas */
.pied-ajoute {
	width: auto;
	max-width: 920px;
	margin: 24px auto 0 auto;
	padding: 18px 10px;
	clear: both;
}

@media screen and (max-width: 760px) {
	.pied-col { flex: 1 1 100%; }
}

/* Les colonnes suivent le cadre du site.
   Posees dans le pied, elles en prenaient toute la largeur, jusqu'au
   bord de la fenetre, tandis que le reste de la page tient dans un
   cadre centre. On leur donne ce meme cadre. */
.pied-3col {
	width: 890px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Le pied avait une hauteur fixe, prevue pour une seule ligne de
   mention legale : les colonnes en debordaient, et leur texte clair
   se retrouvait sur le blanc de la page. */
#footer {
	height: auto;
	min-height: 100px;
}

/* Le texte respire sur les cotes.
   La barre laterale partie, la colonne prend toute la
   largeur : sans marge a elle, son texte bute contre le
   cadre. Elle n'avait ici que 11 px. */
#mainleft {
	padding-left: 28px;
	padding-right: 28px;
}

/* Les blocs restes larges de force.
   La passe responsive n'avait desserre que les conteneurs
   menant au texte. Ceux-ci gardaient leur largeur fixe, et
   un seul suffit a faire deborder la page sur telephone. */
#footer {
	max-width: 100%;
}
#header {
	max-width: 100%;
}
#logo {
	max-width: 100%;
}
#navcontainer {
	max-width: 100%;
}