/*** Global Settings ****/
body {font : normal 12px/1.6em Arial, Helvetica, sans-serif;color : #2a3845;margin : 0;padding : 0;background:#FFFFFF;}
p { margin : 0;padding : 0;}
a:visited, a:link {color : #a43b55;text-decoration : underline;background:none;}
a:hover {color : #a43b55;text-decoration : none;background:none;}
h1 { color : #7a2e40;margin: 0px 0px 10px 0px;padding-bottom : 10px;font : normal 17px Georgia, serif;border-bottom : 1px solid #efece7;}
h2 {color : #7a2e40;margin : 20px 0 10px;padding-bottom : 10px;font : normal 17px Georgia, serif;border-bottom : 1px solid #efece7;}
h3 {color : #7a2e40;margin : 10px 0;padding-bottom : 10px;font : bold 14px Arial, Helvetica, sans-serif;border-bottom : 1px solid #efece7;}
ul {padding:0;margin:0 0 0 17px;list-style: square url(images/bullet.gif);}
.box {background : #f7f7f7;border : 1px solid #f0e9eb;padding : 15px;}

/*** Layout ****/
#wrapper {margin : 0 auto;width : 776px;border-left : 1px solid #f0e9eb;border-right : 1px solid #f0e9eb;}
#header {margin : 0 1px;}
#bg {height : 36px;background : url(images/bg.gif) repeat-x;}
#nav {background : #7a2e40;padding : 10px 20px;text-align : right;color : #f6dde3;}
#nav a:visited, #nav a:link {text-decoration : none;color : #f6dde3;}
#nav a:hover {text-decoration : underline;color : #f6dde3;}
#main-content {margin : 0 auto;}
#logo {margin-bottom : 45px;}
.logotxt1 {font : normal 18px Georgia, serif;color : #fa7393;margin : 10px 0 0 15px;}
.logotxt2 {font : normal 18px Georgia, serif;color : #7a2e40; }
#left-column {width : 440px;padding : 0 30px 30px;float : left;}
#right-column {width : 270px;float : right;}
.crd a:visited, .crd a:link, .crd a:hover{text-decoration : none;color : #2a3845;cursor: text;}
#footer {background : #f7f7f7;border-top : 1px solid #f0e9eb;padding : 10px 15px;clear : both;}

/*** SideBAR ***/
#main-image {text-align : center;}
.sidebar {width : 218px;margin : 0 auto;padding : 10px 25px;background : url(images/shadow.jpg) no-repeat top;}


/* ==================================================================
   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;
}
.pied-col {
	flex: 1 1 240px;
	min-width: 0;
}
.pied-col > *:first-child { margin-top: 0; }

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

/* les conteneurs gardent leur largeur, sans la subir */
#left-column {
	width: auto;
	max-width: 440px;
}
#wrapper {
	width: auto;
	max-width: 776px;
}

/* le pied ajoute aux pages qui n'en avaient pas */
.pied-ajoute {
	width: auto;
	max-width: 776px;
	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: 776px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}


/* ------------------------------------------------------------------
   corps de texte lisible

   Le gabarit posait un corps de 12px, trop petit pour une lecture sur
   telephone, ou 16 px est la valeur attendue. Le texte courant est
   remonte a 16 px avec un interligne de 1,55.

   Les titres, les menus et les pieds de page ne sont pas touches : ils
   sont dimensionnes en pourcentage dans des blocs a hauteur fixe, les
   agrandir deplacerait la mise en page.
   ------------------------------------------------------------------ */

p, li, dd, dt, blockquote, label {
	font-size: 16px;
	line-height: 1.55;
}

nav p, nav li, .menu p, .menu li, #menu p, #menu li, #mnu p, #mnu li,
.nav p, .nav li, #nav p, #nav li, .navigation p, .navigation li,
#navigation p, #navigation li, .header p, .header li, #header p,
#header li, #hdr p, #hdr li, .footer p, .footer li, #footer p,
#footer li, #ftr p, #ftr li, .breadcrumb p, .breadcrumb li {
	font-size: inherit;
	line-height: inherit;
}


/* ==================================================================
   LARGEUR DE LA COLONNE DE TEXTE, 28/09/2026

   La colonne de droite, large de 270 px, est passee dans le pied de
   page. La colonne de texte est restee plafonnee a 440 px et l'espace
   libere n'etait plus utilise. Elle reprend donc toute la largeur du
   cadre, et le cadre lui-meme passe de 776 a 1000 px pour une ligne de
   texte confortable.
   ================================================================== */

#wrapper {
	width: auto;
	max-width: 1000px;
}

#left-column {
	float: none;
	width: auto;
	max-width: none;
	padding: 0 34px 30px 34px;
}

#main-content {
	overflow: hidden;
}

.pied-3col,
.pied-ajoute {
	width: auto;
	max-width: 1000px;
}

@media screen and (max-width: 640px) {
	#left-column { padding: 0 16px 24px 16px; }
}