/*defaults*/
body 	{background:#2765AF url('../images/body_bg.jpg') repeat-x 0 0; color:#000000; margin:20px 0; padding:0; font-family:"Trebuchet MS", verdana, arial, "Times New Roman", serif; font-size:90%; }
p		{margin:0; padding:0 0 15px 0; }
a		{color:#000000; text-decoration:underline; }
a:hover	{color:#225799; text-decoration:none;}


/*structural elements*/
#container	{margin:0px auto; text-align:center; width:760px; }
#holder		{width:100%; padding:20px 20px 5px 20px; background:#FFFFFF; text-align:left; }
#logo		{background:url('../images/logo.gif') no-repeat 180px 0; border-bottom:1px solid #DADADA; padding:5px 30px 20px 0px; }
#navigation	{padding:10px 0; }
#header		{background:#DADADA url('../images/header_home.jpg') no-repeat 10px 10px; padding:10px; height:200px; }
#content	{float:left; width:calc(100% - 280px); padding:20px 10px 0 0; line-height:160%; }
#news		{float:right; width:250px; padding:20px 0; line-height:140%; text-align:justify; }
.newsItem	{padding:20px 20px 5px 20px; background:#FEFFD5; border:1px solid #FFEB70; font-size:90%; margin-bottom:20px; }
#footer		{clear:both; width:100%; font-size:80%; background:#DADADA; padding:20px; text-align:left; border-top:2px solid #2765AF; }
#copyright	{float:right; }


/*headings*/
.newsItem h1	{color:#225799; margin:0 0 10px 0; padding:0; font-size:130%; font-weight:normal; }
#content h1		{font-size:130%; font-weight:normal; line-height:130%; margin:0; padding:0 0 20px 0; }
#logo h1		{font-weight:normal; font-size:130%; margin:0; padding:0; color:#225799; }


/*navigation*/
#navigation ul 		{margin:0; padding:0; }
#navigation li 		{margin:0; padding:0; list-style:none; display:inline; }
#navigation a		{color:#225799; padding:0 20px 0 0; text-decoration:none; }
#navigation a:hover	{color:#000000; }

#footer ul 		{margin:0; padding:0; }
#footer li 		{margin:0; padding:0; list-style:none; display:inline; }
#footer a		{color:#000000; font-weight:bold; padding:0 5px 0 0; text-decoration:underline; }
#footer a:hover	{color:#000000; text-decoration:none; }


/*shamelessly borrowed styles from http://www.positioniseverything.net/easyclearing.html*/
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix {display:inline-block; }
/* Hides from IE-mac \*/
* html .clearfix {height:1%; }
.clearfix {display:block; }
/* End hide from IE-mac */


/* Correctif mobile vieux template */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
iframe,
video,
object,
embed {
  max-width: 100% !important;
}

img {
  height: auto !important;
}

p,
li,
td,
th,
div,
a,
span,
h1,
h2,
h3 {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

@media screen and (max-width: 900px) {
  body {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
    text-align: left !important;
  }

  #container,
  #holder,
  #logo,
  #navigation,
  #header,
  #content,
  #news,
  #footer,
  .line,
  .margin,
  .padding-2x,
  .s-12,
  .m-12,
  .l-4,
  .l-6,
  .footer,
  .footer-column,
  .announce,
  .bottom-bar {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #holder,
  #footer {
    padding: 16px !important;
  }

  #content,
  #news {
    padding: 18px 0 0 0 !important;
    text-align: left !important;
  }

  #header {
    height: auto !important;
    min-height: 130px !important;
    background-size: cover !important;
    background-position: center center !important;
  }

  #navigation li {
    display: block !important;
  }

  #navigation a {
    display: inline-block !important;
    padding: 8px 16px 8px 0 !important;
    font-size: 18px !important;
  }

  p,
  li,
  td,
  th {
    font-size: 18px !important;
    line-height: 1.65 !important;
  }

  h1 {
    font-size: 28px !important;
    line-height: 1.25 !important;
  }

  h2 {
    font-size: 23px !important;
    line-height: 1.3 !important;
  }

  h3 {
    font-size: 20px !important;
    line-height: 1.35 !important;
  }

  .newsItem {
    font-size: 18px !important;
    line-height: 1.65 !important;
    padding: 16px !important;
  }

  table {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    overflow-x: auto !important;
  }

  iframe {
    width: 100% !important;
  }
}


/* ==================================================================
   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 */
#content {
	float: none;
	width: auto;
	margin-left: 0;
	margin-right: 0;
}

/* les conteneurs gardent leur largeur, sans la subir */
#container {
	width: auto;
	max-width: 760px;
}

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


/* les paragraphes ne sont plus colles.
   Le gabarit pose « p { margin: 0 } », ce qui convient a ses blocs
   d'accroche mais colle les paragraphes des pages de texte. On rend la
   marge basse, sauf dans l'en-tete, le menu et le pied, ou les
   paragraphes servent d'etiquettes. */
p {
	margin-bottom: 1.05em;
}
header p,
footer p,
nav p,
.header p,
.footer p,
.navbar p,
.menu p,
.header-menu p,
.footer-menu p,
.copyright p,
.breadcrumb p,
.card-body > p:last-child,
li > p:last-child {
	margin-bottom: 0;
}


/* ==================================================================
   TAILLE DU TEXTE

   Le corps de texte etait a 14.4 px : trop petit pour une lecture
   confortable, et en dessous des 16 px attendus sur telephone.
   On le remonte a 16 px. Les elements d'en-tete et de menu,
   dimensionnes en em et souvent places dans des blocs a hauteur
   fixe, sont figes a leur taille actuelle pour ne pas bouger.
   ================================================================== */

/* on fige ce qui ne doit pas grandir */
#logo h1 { font-size: 19px; }

body { font-size: 16px; line-height: 1.6; }
body, th, td, input, textarea, select { font-size: 16px; }
p, li, dd, blockquote { font-size: inherit; }
img, iframe, video, table { max-width: 100%; }
img { height: auto; }


/* ==================================================================
   TAILLE DU TEXTE DU PIED DE PAGE, 25/09/2026

   Le pied etait reduit par un pourcentage herite par tout son
   contenu, ce qui le faisait tomber sous le seuil de lisibilite,
   en particulier sur telephone. Il repasse a la taille du corps
   de texte, les liens compris.
   ================================================================== */

#footer {
	font-size: 100%;
}

#footer p,
#footer li,
#footer a,
#footer div,
#footer span,
#footer td,
.footer,
.footer p,
.footer li,
.footer a,
.footer-column,
.footer-column p,
.footer-column li,
.footer-column a,
.pied-3col,
.pied-col,
.pied-ajoute,
.pied-ajoute p,
.pied-ajoute a,
.announce,
.announce p {
	font-size: 16px;
	line-height: 1.55;
}

#footer h2,
#footer h3,
#footer h4,
.footer-column h2,
.footer-column h3,
.footer-column h4 {
	font-size: 18px;
}