/*	svp, prendre une copie du mod�le 00 et cr�er le v�tre � la fin en incr�mentant 00 merci */
div.m00 {
  padding: 1rem; /*	padding par d�faut */
}
div.m00-overflow /*	div sp�ciale pour scroller en x */ {
  padding: 1rem;
  overflow-x: auto;
}

.m00 img {
}
/*	la div h00 sert au titre si on a besoin de plusieurs balises dans la partie titre, sinon la h seule*/

div.h00 {
}
div.h00 h1 {
  font-size: ;
  line-height: ; /*	<= font-size + padding */
}
div.h00 h2 {
}
div.h00 hr {
  width: 50%;
  margin: 0 auto;
  color: pink;
}
/************************************************************************************************************/
div.grille00 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
div.grille00 figure {
  margin: 0.5rem; /*	margin des colonnes, donne donc 1rem MINIMUM (0.5rem + 0.5rem) entre 2 colonnes*/
  text-align: center; /* pour centrer l'image et le texte dans la colonne */
  width: 140px; /* 	la largeur minimum est de 100px mais cela d�pend de l'icone ou de l'image,
					du texte � afficher, un titre simple en petit font size, va entrer dans 100px
					on fonctionne en px fixe ici, PAS DE POURCENTAGE*/
  /*width: 270px;	/*	la largeur MAXIMUM pour les cellulaires est de 320px en comptant les marges
					ce qui donne donc un grand maximum de 270px par colonne (1rem = +/- 10px)
					car il faut compter les marges des conteneurs de la grille fix�e au minimum � 1rem
					il est d�sagr�able de refaire tout le style quand il ne r�pond pas aux limites...*/
}
div.grille00 img	/* 	il n'est d'usage d'utiliser une image plus grande que 270px dans le flex pour
					avoir un responsive convenable, il faut utiliser un autre mod�le si nous avons
					des images plus larges que 270px, on fonctionne en px fixe ici, PAS DE POURCENTAGE*/ {
}
div.grille00 figcaption	/* 	figcaption h�rite de son parent figure. En remettant ici le texte � gauche
						il n'y aura que l'image centr�e dans la colonne
						on fonctionne en px fixe ici, PAS DE POURCENTAGE*/ {
  text-align: left;
}
/************************************************************************************************************/
div.float00 {
}
div.float00 div.float-left {
  float: left;
  padding-right: 0.5rem;
  width: 49%; /* laisser 1% aux marges*/
}
/*					le responsive assigne les 2 div enfants float-left et float-right 
					on n'a donc pas besoin de rajouter du code dans responsive.css */
div.float00 div.float-right {
  float: right;
  padding-left: 0.5rem;
  width: 49%;
}
div.float-left img,
div.float-right img {
  width: 100%;
}
div.float-stop {
  clear: both;
}
/************************************************************************************************************/
div.m00-overflow /*	div sp�ciale pour scroller en x, remplacez m00 par m00-overflow */ {
  padding: 1rem;
  overflow-x: auto;
}

table.table00 {
  border: 1px solid black;
  /*border-collapse: collapse;*/
  /*border-collapse: separate;*/
  /*border-spacing: 10px 50px;*/
  /*empty-cells: hide;*/
  /*table-layout: fixed;*/
  width: 100%;
}
table.table00 tr /*	row, ligne */ {
}
table.table00 tr:nth-child(even) /* OU odd */ {
  /*background-color: yellow*/
}
table.table00 tr:hover {
  /*background-color: green;*/
}
table.table00 tr.ligne00 /*	si nous avons une ligne particuli�re que nous d�sirons styliser */ {
}
table.table00 th /* header, titre */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 50px;*/
  text-align: left;
  vertical-align: middle;
  padding: 8px 15px;
  /*background-color: blue;*/
  /*color: white;*/
}
table.table00 td /* data, cellule */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 30px;*/
  /*text-align: center;*/
  /*vertical-align: bottom;*/
  padding: 8px 15px;
}
table.table00 td img/* image dans le cellule, on ne d�passe pas 270px pour le responsive */ {
  width: 100%;
  max-width: 270px;
  max-height: 200px;
}
table.table00 td.cell00 /*	si nous avons une cellule particuli�re que nous d�sirons styliser */ {
  padding: 0;
  width: 270px;
  max-width: 270px;
}
/************************************************************************************************************/
div.xtableau00 {
  border-top: 1px solid black; /*	cadre autour du tableau sauf pour le bottom */
  border-right: 1px solid black;
  border-left: 1px solid black;
  /*border-bottom: 1px solid black;*/
  /*	si on ne met pas de border-bottom aux lignes mais qu'on veut tout de m�me
	le bas du cadre pour le tableau, il faut enlever le commentaire ci-haut*/
}
div.xtableau00 div.xt {
  display: flex;
  border-bottom: 1px solid black; /*	si on veut une barre sous la ligne titre*/
}
div.xtableau00 div.xl {
  display: flex;
  border-bottom: 1px solid black; /*	si on veut une barre sous la ligne du tableau*/
}
/*	2colonnes 49%, 3colonnes 33%, 4colonnes 24%, 5colonnes 19% */
div.xtableau00 div.xc1,
div.xtableau00 div.xc2,
div.xtableau00 div.xc3 {
  width: 33%;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-right: 1px solid black;
}
div.xtableau00 div.xc3 /*		voici la derni�re cellule � la droite du tableau 
							cette derni�re cellule annule le border 
							si vous avez plus que 3 colonnes,
							changer xc3 pour le nom de la derni�re cellule*/ {
  border-right: 0px solid black;
}
div.xtableau00 div.xt div.xc1
, div.xtableau00 div.xt div.xc2
, div.xtableau00 div.xt div.xc3 /*	cellules de la ligne titre xtitle xt */ {
  font-weight: bold;
}
div.xtableau00 div.xc1 {
}
div.xtableau00 div.xc2 {
}
div.xtableau00 div.xc3 {
}
/************************************************************************************************************/
div.ftableau00 {
  visibility: hidden; /* le ftableau sera visible sous les 765px*/
  height: 0px;
}
div.ftableau00 {
  border-top: 1px solid black; /*	cadre autour du tableau sauf pour le bottom */
  border-right: 1px solid black;
  border-left: 1px solid black;
  /*border-bottom: 1px solid black;*/
  /*	si on ne met pas de border-bottom aux lignes mais qu'on veut tout de m�me
	le bas du cadre pour le tableau, il faut enlever le commentaire ci-haut*/
}
div.ftableau00 div.xt {
  display: flex;
  border-bottom: 1px solid black; /*	si on veut une barre sous la ligne titre*/
}
div.ftableau00 div.xl {
  display: flex;
  border-bottom: 1px solid black; /*	si on veut une barre sous la ligne du tableau*/
}
div.ftableau00 div.xc1,
div.ftableau00 div.xc2,
div.ftableau00 div.xc3 {
  width: 99%;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
div.ftableau00 div.xt div.xc1
, div.ftableau00 div.xt div.xc2
, div.ftableau00 div.xt div.xc3 /*	cellules de la ligne titre xtitle xt */ {
  font-weight: bold;
}
div.ftableau00 div.xc1 {
}
div.ftableau00 div.xc2 {
}
div.ftableau00 div.xc3 {
}
/************************************************************************************************************/
/*			V o t r e		c o d e		v a		�	p a r t i r		d ' i c i			*/
/** module ucesif intitul� *****/
div.m01 {
  color: white;
  padding: 1rem;
}
/*********** module recherche **********/
div.asearch {
  padding: 0.5rem;
}
#offlajn-ajax-search310 {
  width: 180px;
}
/******* module bouton contact ***********/
.m03 {
  text-align: right;
  padding: 14px;
}
div.m03 a {
  padding: 3px 8px;
  background-color: white;
  color: #243d83;
  /*display: block;*/
}

/*************** home *************/
.m10,
.m11,
.m12,
.m13,
.m14 {
  padding: 3rem 1rem;
}
div.h10 {
}
div.h10 h1 {
  color: black;
}
div.h10 hr {
  width: 10%;
  height: 4px;
  border: 0;
  background-color: #b90606;
}

div.float10 p,
.float13 p,
.m12 p {
  font-family: 'open_sanslight';
  font-size: 20px;
}
div.float10 a {
  background-color: #b90606;
  border: 1px solid #b90606;
  color: #fff;
  padding: 5px 15px;
  white-space: no-wrap;
  line-height: 4rem;
}

div.float10 a:hover {
  background: #fff;
  color: #b90606;
}

div.float10 div.float-right {
  float: left;
  padding-right: 0.5rem;
  width: 49%; /* laisser 1% aux marges*/
}
/*					le responsive assigne les 2 div enfants float-left et float-right 
					on n'a donc pas besoin de rajouter du code dans responsive.css */
div.float10 div.float-left {
  float: right;
  padding-left: 0.5rem;
  width: 49%;
}
div.m11 {
  text-align: center;
  /*padding: 1rem*/
}
div.h11 {
}
div.h11 h1 {
  color: black;
}
div.h11 hr {
  margin: 0 auto;
  width: 10%;
  height: 4px;
  background-color: #72bde9;
  border: 0;
}
div.m12 {
  /*padding: 1rem*/
  text-align: center;
}
div.h12 {
  text-align: center;
}

div.m13 {
  /*padding: 1rem*/
}
div.m13 img {
  max-width: 100%;
  height: auto;
}
div.h13 {
}
div.h13 h1 {
  color: black;
}
div.h13 hr {
  width: 20%;
  height: 4px;
  background-color: #b90606;
  border: 0;
}
div.float13 {
}
div.float13 a {
  background-color: #b90606;
  border: 1px solid #b90606;
  color: white;
  padding: 5px 15px;
  white-space: no-wrap;
  line-height: 3rem;
}

div.float13 a:hover {
  background: #fff;
  color: #b90606;
}

div.float13 div.float-left {
  float: left;
  padding-right: 0.5rem;
  width: 49%; /* laisser 1% aux marges*/
}
/*					le responsive assigne les 2 div enfants float-left et float-right 
					on n'a donc pas besoin de rajouter du code dans responsive.css */
div.float13 div.float-right {
  float: right;
  padding-left: 0.5rem;
  width: 49%;
}

div.m14 {
  text-align: center;
  /*padding: 1rem*/
}
div.h14 {
}
div.h14 h1 {
  color: black;
}
div.h14 hr {
  margin: 0 auto;
  width: 10%;
  background-color: #72bde9;
  border: 0;
  height: 4px;
}

div.m21 {
  padding: 1rem;
  text-align: center;
}
div.m21 a {
  color: black;
}
div.m21 span {
  color: #72bde9;
}
div.m22 {
  padding: 1rem;
  text-align: right;
}
div.m22 a {
  color: #009fe3;
}
div.m23 {
  padding: 1rem;
}

a {
  transition-duration: 0.3s;
}

/* page histoire */

div.m30 {
}
div.h30 {
  font-weight: bold;
  font-size: 2rem;
  line-height: 2.5rem;
}
div.float30 {
}
div.float30 div.float-left {
  float: left;
  padding-right: 0.5rem;
  width: 49%; /* laisser 1% aux marges*/
}
/*					le responsive assigne les 2 div enfants float-left et float-right 
					on n'a donc pas besoin de rajouter du code dans responsive.css */
div.float30 div.float-right {
  float: right;
  padding-left: 0.5rem;
  width: 49%;
}
div.float-left img,
div.float-right img {
  width: 100%;
}
div.float-stop {
  clear: both;
}
table.table30 {
  /*border: 1px solid black;*/
  /*border-collapse: collapse;*/
  /*border-collapse: separate;*/
  /*border-spacing: 10px 50px;*/
  /*empty-cells: hide;*/
  /*table-layout: fixed;*/
  width: 100%;
}
table.table30 tr /*	row, ligne */ {
}
table.table30 tr:nth-child(even) /* OU odd */ {
  /*background-color: yellow*/
}
table.table30 tr:hover {
  /*background-color: green;*/
}
table.table30 tr.ligne00 /*	si nous avons une ligne particuli�re que nous d�sirons styliser */ {
}
table.table30 th /* header, titre */ {
  /*border-bottom: 1px solid grey;*/
  /*border: 1px solid black;*/
  /*height: 50px;*/
  text-align: left;
  vertical-align: middle;
  padding: 8px 15px;
  /*background-color: blue;*/
  /*color: white;*/
}
table.table30 td /* data, cellule */ {
  /*border-bottom: 1px solid grey;*/
  /*border: 1px solid black;*/
  /*height: 30px;*/
  /*text-align: center;*/
  /*vertical-align: bottom;*/
  padding: 8px 3rem;
}
table.table30 td img/* image dans le cellule, on ne d�passe pas 270px pour le responsive */ {
  width: 100%;
  max-width: 270px;
  max-height: 270px;
}
table.table30 td.cell30 /*	si nous avons une cellule particuli�re que nous d�sirons styliser */ {
  padding: 0px;
  min-width: 100px;
  max-width: 200px;
}
ul.ul30 {
  padding-left: 2rem;
}

.m31,
.m32 {
  padding: 2rem;
  box-sizing: border-box;
  background: #f4f4f4;
  margin-bottom: 5rem;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
  border-radius: 3px;
}

.m31 h2 {
  font-size: 22px;
  margin-bottom: 15px;
  padding-left: 20px;
  position: relative;
  border-left: solid 4px #ef7c00;
}

.m31 {
  text-align: justify;
}

.banner-organisation h1,
.banner-partenaires h1,
.banner-champ h1,
.banner-contact h1,
.banner-membres h1 {
  font-family: 'open_sanslight';
}

.bg-bloc {
  background: #f4f4f4;
  padding: 2rem;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 5rem;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
  border-radius: 3px;
}

.bg-bloc hr {
  margin: 20px 0;
  border: 0;
  background: #ccc;
}

.title-footer {
  font-size: 2rem;
}

/* page partenaires */

.m32 {
  text-align: center;
  margin: 5rem 0;
}

.m32 h2 {
  font-family: 'open_sanssemibold';
  text-transform: uppercase;
  margin-bottom: 2rem;
  margin-bottom: 2rem;
}

.m32 p {
  padding: 0 10rem;
}

.m32 h2:after {
  content: '';
  width: 50px;
  height: 4px;
  background: #009fe3;
  display: block;
  margin: 15px auto;
}

.logo-menu {
  position: absolute;
  top: 30px;
}
div.m50 {
  background-image: url('../../../images/tmpl/acces-agenda.jpg');
  background-repeat: no-repeat;
  text-align: center;
  background-size: cover;
  color: white;
  padding: 5rem 0px 6.6rem 0px;
}
div.m50 a {
  color: #72bde9;
  background-color: white;
  padding: 5px 15px;
  border: solid 1px #72bde9;
  display: block;
  width: 150px;
  margin: auto;
  margin-top: 3rem;
  transition-duration: 0.3s;
  border-radius: 3px;
}

div.m50 a:hover {
  background: #72bde9;
  color: #fff;
}
div.moduletable.m51 {
  background-image: url('../../../images/tmpl/newsletter.jpg');
  background-repeat: no-repeat;
  text-align: center;
  background-size: cover;
  color: white;
  padding: 3.4rem 0;
  font-size: 2rem;
}
div.m51 input.button {
  padding: 0.5rem 10px;
  color: #009fe3;
  background-color: white;
  border: solid 1px #009fe3;
  cursor: pointer;
  padding: 5px 15px;
  border-radius: 3px;
  transition-duration: 0.3s;
}

div.m51 input.button:hover {
  background: #009fe3;
  color: #fff;
}

div.m52 {
  padding: 1rem;
}
div.m52 h1 {
}
div.m52 h2 {
}
div.m52 span {
  font-style: italic;
  font-size: 1rem;
}
span#cloakd59251152fd238ecdbfa9e7f31afdc2b {
  display: none;
}
div.m52 a {
  color: #009fe3;
  font-style: normal;
  font-size: 1.3rem;
  line-height: 1.8rem;
  padding: 0px 8px;
  border: 1px solid #009fe3;
}
div.m52 a:hover {
  color: white;
  background-color: #009fe3;
}

div.m60 {
  background-image: url('../../../images/tmpl/sunrise.jpg');
  background-repeat: no-repeat;
  text-align: center;
  background-size: cover;
  color: white;
  padding: 5rem 0px 6.6rem 0px;
  overflow-x: auto;
}

div.m60 a {
  color: #72bde9;
  background-color: white;
  padding: 5px 15px;
  border: solid 1px #72bde9;
  display: block;
  width: 150px;
  margin: auto;
  margin-top: 3rem;
  transition-duration: 0.3s;
  border-radius: 3px;
}

div.m60 a:hover {
  background: #72bde9;
  color: #fff;
}
table.table60 {
  border: 0px solid black;
  /*border-collapse: collapse;*/
  /*border-collapse: separate;*/
  /*border-spacing: 10px 50px;*/
  /*empty-cells: hide;*/
  /*table-layout: fixed;*/
  width: 100%;
  margin: 0px auto;
  padding: 2rem;
}
table.table60 tr /*	row, ligne */ {
  background-color: rgba(150, 150, 150, 0.6);
}
table.table60 tr:nth-child(even) /* OU odd */ {
  /*background-color: yellow*/
}
table.table60 tr:hover {
  /*background-color: green;*/
}
table.table60 tr.ligne00 /*	si nous avons une ligne particuli�re que nous d�sirons styliser */ {
}
table.table60 th /* header, titre */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 50px;*/
  text-align: center;
  vertical-align: middle;
  padding: 5px 8px;
  /*background-color: blue;*/
  /*color: white;*/
}
table.table60 th.vide /* header, titre */ {
  border-bottom: 0px solid grey;
}
table.table60 td /* data, cellule */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 30px;*/
  /*text-align: center;*/
  /*vertical-align: bottom;*/
  padding: 5px 8px;
}
table.table60 td.vide/* data, cellule */ {
  border-bottom: 0px solid grey;
}
table.table60 td.total/* data, cellule */ {
  font-weight: bold;
}
table.table60 td img/* image dans le cellule, on ne d�passe pas 270px pour le responsive */ {
  width: 100%;
  max-width: 270px;
  max-height: 200px;
}
table.table60 td.cell00 /*	si nous avons une cellule particuli�re que nous d�sirons styliser */ {
  padding: 0;
  width: 270px;
  max-width: 270px;
}

div.m61 {
  background-image: url('../../../images/tmpl/earth.jpg');
  background-repeat: no-repeat;
  text-align: center;
  background-size: cover;
  color: white;
  padding: 5rem 0px 6.6rem 0px;
  overflow-x: auto;
}

div.m61 a {
  color: #72bde9;
  background-color: white;
  padding: 5px 15px;
  border: solid 1px #72bde9;
  display: block;
  width: 150px;
  margin: auto;
  margin-top: 3rem;
  transition-duration: 0.3s;
  border-radius: 3px;
}

div.m61 a:hover {
  background: #72bde9;
  color: #fff;
}
table.table61 {
  border: 0px solid black;
  /*border-collapse: collapse;*/
  /*border-collapse: separate;*/
  /*border-spacing: 10px 50px;*/
  /*empty-cells: hide;*/
  /*table-layout: fixed;*/
  width: 100%;
  margin: 0px auto;
  padding: 2rem;
}
table.table61 tr /*	row, ligne */ {
  background-color: rgba(150, 150, 150, 0.6);
}
table.table61 tr:nth-child(even) /* OU odd */ {
  /*background-color: yellow*/
}
table.table61 tr:hover {
  /*background-color: green;*/
}
table.table61 tr.ligne00 /*	si nous avons une ligne particuli�re que nous d�sirons styliser */ {
}
table.table61 th /* header, titre */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 50px;*/
  text-align: center;
  vertical-align: middle;
  padding: 5px 8px;
  /*background-color: blue;*/
  /*color: white;*/
}
table.table61 th.vide /* header, titre */ {
  border-bottom: 0px solid grey;
}
table.table61 th.gris /* header, titre */ {
  font-weight: normal;
}
table.table61 th.jaune /* header, titre */ {
  /*color: yellow;*/
}
/*table.table61 th.plein 
{
max-width: 270px;
}
table.table61 th.demie 
{
max-width: 50px;
}*/
table.table61 td /* data, cellule */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 30px;*/
  /*text-align: center;*/
  /*vertical-align: bottom;*/
  padding: 5px 8px;
}
table.table61 td.vide/* data, cellule */ {
  border-bottom: 0px solid grey;
}
/*
table.table61 td.plein
{
max-width: 270px;
}
table.table61 td.demie
{
max-width: 50px;
}*/
table.table61 td.total/* data, cellule */ {
  font-weight: bold;
}
table.table61 td img/* image dans le cellule, on ne d�passe pas 270px pour le responsive */ {
  width: 100%;
  max-width: 270px;
  max-height: 200px;
}
table.table61 td.cell00 /*	si nous avons une cellule particuli�re que nous d�sirons styliser */ {
  padding: 0;
  width: 270px;
  max-width: 270px;
}

/****************************************************************************************************/
table.table71 {
  border: 0px solid black;
  /*border-collapse: collapse;*/
  /*border-collapse: separate;*/
  /*border-spacing: 10px 50px;*/
  /*empty-cells: hide;*/
  /*table-layout: fixed;*/
  width: 100%;
  margin: 0px auto;
  padding: 2rem;
}
table.table71 tr /*	row, ligne */ {
  background-color: rgba(150, 150, 150, 0.6);
}
table.table71 tr:nth-child(even) /* OU odd */ {
  /*background-color: yellow*/
}
table.table71 tr:hover {
  /*background-color: green;*/
}
table.table71 tr.ligne00 /*	si nous avons une ligne particuli�re que nous d�sirons styliser */ {
}
table.table71 th /* header, titre */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 50px;*/
  text-align: center;
  vertical-align: middle;
  padding: 5px 8px;
  /*background-color: blue;*/
  /*color: white;*/
}
table.table71 th.vide /* header, titre */ {
  border-bottom: 0px solid grey;
}
table.table71 th.gris /* header, titre */ {
  font-weight: normal;
}
table.table71 th.jaune /* header, titre */ {
  /*color: yellow;*/
}
/*table.table61 th.plein 
{
max-width: 270px;
}
table.table61 th.demie 
{
max-width: 50px;
}*/
table.table71 td /* data, cellule */ {
  border-bottom: 1px solid grey;
  /*border: 1px solid black;*/
  /*height: 30px;*/
  /*text-align: center;*/
  /*vertical-align: bottom;*/
  padding: 5px 8px;
}
table.table71 td.vide/* data, cellule */ {
  border-bottom: 0px solid grey;
}
/*
table.table61 td.plein
{
max-width: 270px;
}
table.table61 td.demie
{
max-width: 50px;
}*/
table.table71 td.total/* data, cellule */ {
  font-weight: bold;
}
table.table71 td img/* image dans le cellule, on ne d�passe pas 270px pour le responsive */ {
  width: 100%;
  max-width: 270px;
  max-height: 200px;
}
table.table71 td.cell00 /*	si nous avons une cellule particuli�re que nous d�sirons styliser */ {
  padding: 0;
  width: 270px;
  max-width: 270px;
}