body {
	margin:0;
	padding:0;
	background:#ffffff;
}

p,td { font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	margin-top: 0px;
}

a{
	color: #0F5A84;
	text-decoration: underline;
}

a:hover{
	color: #1377A8;
	text-decoration: underline;
}

a.hidden {
	text-decoration: none;
	color: #000000;
	cursor:default;
}

form {
     margin:0;
     padding:0;
}

ul {
	margin-left:20px;
	margin-top:0px;
	padding:1px;
	list-style-type: square;
	line-height: 16px;
	}
.title-bg {
	background-image: url(../images/title-bg.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}


h1 {
	font-size: 14px;
	font-weight: bold;
	color: #333333;
	margin: 0px;
	padding-left: 0px;
	padding-top: 14px;
	padding-bottom: 3px;
	text-transform: uppercase;
}

.bgy {
	background-repeat: repeat-y;
}

.bottom_addr {
	font-size: 10px;
	color: #FFFFFF;
	padding-top: 2px;
	padding-bottom: 3px;
	padding-left: 0px;
	text-align: left;
}

.bottom_addr_lnk {
	text-decoration: none;
}

.bottom_addr_lnk:hover {
	text-decoration: underline;
}


.bgx {
	background-repeat: repeat-x;
}


.norepeat {
	background-repeat: no-repeat;
}

.c_name {
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	color: #207dbc;
	text-align: left;
	vertical-align: middle;
	padding-left: 9px;
}


.bottom-menu {
	color: #000000;
	text-align: left;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 0px;
}

.bottom-menu-lnk {
	color: #000000;
	text-decoration: none;
}

.bottom-menu-lnk:hover {
	color: #000000;
	text-decoration: underline;
}

.menu {
	color: #FFFFFF;
	background-image: url(../images/menu-btn.gif);
	background-repeat: no-repeat;
	font-weight: bold;
	padding-right: 27px;
	white-space: nowrap;
	padding-top: 7px;
	padding-bottom: 7px;
	text-align: right;
	text-transform: uppercase;
}
.menu_lnk{
	text-decoration: none;
	color: #FFFFFF;
}

.menu_lnk:hover {
	color: #D3EAF2;
	text-decoration: none;
}

.c-name-bottom {
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	text-align: left;
	vertical-align: middle;
	padding-left: 10px;
	line-height: 14px;
}

.body_txt {
	color: #000000;
	text-align: justify;
	vertical-align: top;
	padding-top: 3px;
	padding-right: 15px;
	padding-bottom: 10px;
	padding-left: 0px;
}
/** rajouté par moi **/

.alignleft, img.alignleft {
display: inline;
float: left;
margin-right: 10px;
}

.alignright, img.alignright {
display: inline;
float: right;
margin-left: 10px;
}

.aligncenter, img.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignleft, img.alignright, img.aligncenter {
margin-bottom: 12px;
}




/* ==================================================================
   Mise en page fluide

   Le gabarit reposait sur des tableaux imbriques a largeurs fixes,
   avec une barre laterale de menu et une colonne de droite. La page
   est desormais une colonne unique, centree et fluide ; le contenu
   des barres laterales est passe dans le pied, sur trois colonnes.
   ================================================================== */
*, *::before, *::after { box-sizing: border-box; }
img, iframe, video, table { max-width: 100%; }
img { height: auto; }

#cadre { max-width: 960px; margin: 0 auto; background: #fff; padding: 0 24px; }

#tete { display: flex; align-items: center; gap: 14px; padding: 14px 0 10px 0; }
#tete .logo { flex: 0 0 auto; line-height: 0; }
#tete .c_name { margin: 0; color: #0F5A84; font-size: 26px; font-weight: bold;
	text-transform: uppercase; letter-spacing: .5px; }

#menu-h { border-top: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5;
	background: #E8F7FE; margin-bottom: 22px; }
#menu-h ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
#menu-h li { margin: 0; }
#menu-h a { display: block; padding: 10px 16px; color: #0F5A84; font-weight: bold;
	text-decoration: none; text-transform: uppercase; font-size: 13px; }
#menu-h a:hover { background: #4d96af; color: #fff; }

#contenu { padding-bottom: 24px; }
#contenu h1 { color: #0F5A84; font-size: 24px; margin: 0 0 14px 0; }
.body_txt { color: #000; text-align: left; padding: 0; }
.body_txt p { margin: 0 0 12px 0; line-height: 1.55; }

#pied { border-top: 3px solid #4d96af; padding: 20px 0 26px 0; }
.pied-3col { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0 30px; text-align: left; }
.pied-col { flex: 1 1 220px; min-width: 0; }
.pied-col h3 { color: #0F5A84; font-size: 15px; margin: 0 0 10px 0; }
.pied-col p { margin: 0 0 9px 0; font-size: 13px; }
.pied-col img { max-width: 100%; height: auto; }
#pied .bottom-menu { margin: 18px 0 4px 0; text-align: center; font-size: 13px; }
#pied .bottom_addr { margin: 0; text-align: center; font-size: 12px; color: #555; }

@media screen and (max-width: 760px) {
	#cadre { padding: 0 14px; }
	#tete { flex-wrap: wrap; }
	#tete .c_name { font-size: 20px; }
	.pied-col { flex: 1 1 100%; margin-bottom: 18px; }
}

/* Le pied de page etait blanc, comme le corps de la page, et ne s'en
   detachait pas. Il prend le bleu fonce du titre du site. */
#pied {
	background: #0F5A84;
	border-top: 3px solid #4d96af;
	color: #E8F7FE;
	padding: 24px 20px 22px 20px;
	margin-top: 26px;
}
#pied .pied-col h3 {
	color: #FFFFFF;
}
#pied .pied-col p,
#pied p {
	color: #E8F7FE;
}
#pied a,
#pied a:link,
#pied a:visited {
	color: #FFFFFF;
	text-decoration: underline;
}
#pied a:hover {
	text-decoration: none;
}
#pied .bottom_addr {
	color: #D3EAF2;
}