*{
    margin: 0;
    padding: 0;
}

body{

  font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  background: #fefefe;
}
header{
  float: left;
  width: 100%;
  box-sizing: border-box;
}

.bande1{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 50px;
  background: #6abe52;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 10px;
}
.bande2{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 80px;
  background: white;
  padding-left: 5%;
  padding-right: 5%;
}
.bande2  .logo img{
  height: 80px;
}
.bande2  .logo{
  box-sizing: border-box;
  width: 30%;
  float: left;
}
.bande2 .adresse{
  width: 70%;
  float: left;
  box-sizing: border-box;
  padding-top: 4px;

}
.bande2 .adresse table{
  box-sizing: border-box;
  float: right;
  width: 100%;
}
.bande2 .adresse table img{
  height: 70px;
}
.bande3{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 60px;
  background: #21212d;
  padding-left: 5%;
  padding-right: 5%;
}
.bande3 .menu{
  box-sizing: border-box;
  width: 80%;
  float:left;


}
.bande3 .connect{
  box-sizing: border-box;
  width: 15%;
  float:left;
  height: 100%;

}
.bande3 .connect a{
  height: 100%;
  width: 85%;
  background: #6abe52;
  text-align: center;
  display: block;
  font-weight: bold;
  color: white;
  float: right;
  text-align: center;
padding-top: 15px;
text-decoration: none;
font-size: 18px;
}
.bande3 .menu ul{
list-style: none;
width: 100%;
box-sizing: border-box;

}
.bande3 .menu ul li{
  display: block;
  float: left;
  box-sizing: border-box;
    width: 11%;
    height: 60px;
    text-align:center;
}
.bande3 .menu ul .opp{
     width: 11.99%;
}
.bande3 .menu ul li a{
  display: block;
  box-sizing: border-box;
width: 100%;
 
  height: 100%;
  padding-top: 15%;
text-align:center;
font-weight: bold;
color: white;
text-decoration: none;
font-size:15px;

}
.bande3 .menu ul .opp a{
  padding-top: 14.6%;  
}

.slider{
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  z-index: 1;

  height: 470px;
  float: left;

}

.about{
  width: 100%;
  box-sizing: border-box;

  padding-left: 5%;
  padding-right: 5%;
  float: left;
  background: #f3f3f3;
  position: relative;
  height: 400px;
}
.about aside{
  width: 33.3%;
  float: left;
  height: 330px;
  background: white;
}
.about .a2{
  background:#6abe52;
  position: relative;
  top: -15px;
  border-radius: 7px;
  height: 360px;
  color: white;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;



}
.about .a2 img,.about .a1 img,.about .a1 img{
  width: 60px;
  display: block;
  margin: auto;
  margin-top: 30px;
}
.about .a1{

  box-shadow: 0 0 6px #e9e6e6;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
}
.about .a1 p{
  color: gray;

}
.about .a3{

  box-shadow: 0 0 6px #e9e6e6;


}
.about .vmo{
  position: absolute;
  top: -40px;
  float: left;
  width: 90%;
  box-sizing: border-box;
}
.s3{
  width: 100%;
  box-sizing: border-box;
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 60px;
  float: left;
}
.s3 .gauche,.s3 .droite{
  width: 50%;
  float: left;
  box-sizing: border-box;


}
.s3 .gauche{
  position: relative;
  padding-right: 2%;
}
.s3 .gauche h2
{
  background:#6abe52;
  color: white;
  position: absolute;
  top: 50px;
  right:4% ;
  padding: 20px;
  border-radius: 50px 0px 0px 50px;

}
.s3 .gauche img{
  width: 100%;
  border-radius: 20px;
}

.s3 .droite{
  padding: 40px;
  padding-top: 0px;
}
.s3 .droite h4{
  color: #6abe52;
}
.s3 .droite h1{
  font-size: 30px;
  line-height: 1;
  margin-bottom: 20px;
}
.s3 .droite hr{
  display: block;
  border: 4px solid #6abe52;
  width: 50px;
  margin-bottom: 10px;
}
.s3 .droite p{
  color: gray;
}
.s3 .opportunite{
  background: #6abe52;
  color: white;
  float: left;
  box-sizing: border-box;
  padding: 3%;
  margin-bottom:20px;
}
.s3 .opportunite h1{
margin-bottom: 20px;
font-size: 30px;
text-align: center;


}
.s3 .opportunite p{
  font-size: 20px;
  font-weight: 300;
}
.s3 .opportunite a{
  text-decoration: none;
  color: #6abe52;
  display: block;
  background: white;
  padding: 10px;
  border-radius: 10px;
  text-align: center;
  width: 25%;
  margin: auto;
  margin-top: 20px;
   font-weight: bold;
   font-size: 25px;
}
.s4{
  width: 100%;

  float: left;
  box-sizing: border-box;
  background: #f5f5f5;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 5%;
  padding-bottom: 5%;
}
.s4 h1{
  font-size: 45px;
  text-align: center;
}
.s4 p{
  width: 100%;
  margin: auto;
  text-align: left;
  color: gray;
  margin-bottom: 30px;
  margin-top:30px;
  font-size: 17px;
  background:white;
  box-sizing:border-box;
  border-left:solid 10px #008647;
   border-right:solid 10px #008647;
   border-top:solid 1px #008647;
   border-bottom:solid 1px #008647;
   padding:10px;
   
}
.s4 hr{
  display: block;
  border: 4px solid #6abe52;
  width: 50px;
  margin: auto;
  margin-bottom: 10px;
}
.s4 aside{
  width: 33.3%;
  box-sizing: border-box;
  padding: 1%;
  float: left;

}
.s4 a{
    color:black;
}
.s4 aside .cadre{
  background: white;
  width: 100%;
  height: 150px;
  border-radius: 10px;
  box-sizing: border-box;
  padding: 3%;
  position: relative;
  overflow: hidden;
  transition: 0.4s ease-out;
}
.s4 aside .cadre:hover{
  transform: scale(1.1);
  box-shadow: 0 0 6px gray;
  cursor: pointer;
}
.s4 aside .cadre .rond{
  width: 150px;
  height: 150px;
  position: absolute;
  top:-80px;
  background: #6abe52;
  border-radius: 80px;
  right: -130px;

}

.s4 aside .cadre .g{
  box-sizing: border-box;
  width: 30%;
  float: left;
  padding-top: 20px;
  padding-left: 20px;

}
.s4 aside .cadre .d{
  box-sizing: border-box;
  width: 70%;
  float: left;
  text-align: left;
  padding-top: 0px;
}
.s4 aside .cadre .d p{
  text-align: left;
  width: 100%;
  margin-top: 5px;
}
.news{
  width: 100%;
 box-sizing: border-box;
 padding:5%;
 float: left;
}
.news1{
  width: 100%;
 box-sizing: border-box;
 padding:10%;
 padding-top: 5%;
 float: left;
}

.news1 h2{
  margin-bottom: 10px;
  margin-top: 10px;

}
.news1 p{
  margin-bottom: 10px;
  margin-top: 10px;
font-weight: 300;
}
.news1 strong{
  font-weight: bold;

}
.news1 ul, .news1 ol{
  box-sizing: border-box;
  width: 100%;
  padding-left: 5%;
  margin-bottom: 10px;
  margin-top: 10px;
  font-weight: 300;

}
.actu{
  padding-left: 5%;
  padding-right: 5%;
  width: 100%;
  float: left;
  box-sizing:border-box;

}
.actu .news{
  width: 70%;
  box-sizing: border-box;
  float: left;
  padding-left: 0%;
  padding-right: 5%;
}
.actu .plus-pub{
  width: 30%;
  float: left;
  box-sizing: border-box;
  padding-top: 5%;
}
.news aside{
  width: 33.3%;
  float: left;
  padding: 1%;
  box-sizing: border-box;
}
.actu .news aside{
  width: 50%;
  float: left;
  padding: 1%;
  box-sizing: border-box;

}
.news aside .post{
  width: 100%;
  box-sizing: border-box;
  border: 0.5px solid #b4b4b4;
  border-radius: 5px;
  overflow: hidden;
}
.news aside .post .cadre{
  width: 100%;
  box-sizing:border-box;
   margin: 0;
   padding: 0;
   height: 170px;
   overflow: hidden;
}
.news aside .post .cadre img{
  width: 100%;
display: block;
}
.news aside .post .dates{
  background: #6abe52;
  color: white;
  font-weight: bold;
  padding: 10px;
}
.news aside .post .titre{
  padding: 20px;
  height: 150px;
  padding-top: 10px;

}
.news aside .post .titre a{
  display: block;
  color: #6abe52;
  text-decoration:none;
  margin-top: 7px;
  font-weight: bold;
}
.news aside .post .titre h2{
  font-size: 15px;

}
.news h1,.partenaire h1{
  font-size: 45px;
  text-align: center;
  margin-bottom: 10px;
}
.cat h3{
  font-size: 45px;
  margin-bottom: 10px;
}
.news hr,.partenaire hr,.news1 hr{
  display: block;
  border: 4px solid #6abe52;
  width: 50px;
  margin: auto;
  margin-bottom: 20px;
}
.cat hr{
  display: block;
  border: 4px solid #6abe52;
  width: 50px;

  margin-bottom: 20px;
  box-sizing: border-box;
}
.liste-cat{
  width: 100%;
  box-sizing: border-box;
  border: 0.5px dotted gray;
  border-radius: 7px;
  padding: 5%;

}
.liste-cat h5{
  padding: 8px;
  text-align: center;
  border: 0.5px solid gray;
  margin-bottom: 7px;
  font-weight: normal;
}
.liste-cat a{
  text-decoration:none;
  color: black;
}
.actu .news img{
  width: 100%;
  display: block;
  margin-bottom: 30px;
}
.actu .news p{
  margin-bottom: 10px;
  margin-top: 10px;
  color: gray;
}
.actu .news h4{
  font-weight: normal;
  margin-top: 20px;
  margin-bottom: 20px;
  color: #689e00;
  font-style: italic;
}
.postuler{
  width: 100%;
  float: left;
  box-sizing: border-box;
  background: #f0f1f0;
  padding: 5%;
}
.postuler a{
  display: block;
  text-align: center;
  width: 30%;
  text-decoration: none;
  margin: auto;
  box-sizing: border-box;
  background:#6abe52;
  color: white;
  border-radius: 5px;
  padding: 10px;
  font-size: 25px;
  font-weight: bold;
}
.news1 .connexion{
  width: 42%;
  box-sizing: border-box;
  margin: auto;
  background: #f0f1f0;
  padding: 3%;
  border-radius: 7px;
  margin-top: 20px;

}
.news1 .connexion2{
  width: 49%;
  box-sizing: border-box;
  float: left;
  background: #f0f1f0;
  padding: 3%;
  border-radius: 7px;
  margin-top: 20px;
  margin-right: 1%;

}
.news1 .connexion2 h3{
  text-align: center;
  margin-bottom: 10px;
}
.news1 .connexion1{
  width: 60%;
  box-sizing: border-box;
  margin: auto;
  background: #f0f1f0;
  padding: 3%;
  border-radius: 7px;
  margin-top: 20px;

}
.news1 .connexion .sous-table,.news1 .connexion1 .sous-table{
  box-sizing: border-box;
  width: 100%;
}
.news1 .connexion table td,
.news1 .connexion1 table td{
  padding: 3px;
  padding-top: 0;
  padding-bottom: 0;
}
.news1 .connexion label,
.news1 .connexion1 label{
  font-size: 14px;


}
.notification p{
  text-align: center;
  color: red;
  font-weight: bold;
}
.news1 .connexion .zdt2,
.news1 .connexion1 .zdt2,
.news1 .connexion2 .zdt2
{
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 40px;
  border-radius: 3px;
  text-align: center;
  margin-top: 5px;

}

.news1 .connexion .ta,
.news1 .connexion1 .ta{
  box-sizing: border-box;
  width: 100%;
  border: none;
  margin-top: 5px;
  border-radius: 3px;
  margin-bottom: 5px;
  padding: 10px;
  text-align: left;
}
.news1 .connexion .btn,.news1 .connexion1 .btn{
  background: #6abe52;
}
.news1 .connexion2 table,.news1 .connexion1 table,.news1 .connexion table{
  width: 100%;
}
.connexion2 p{
  text-align: center;
}
.connexion2 img{
  height: 20px;
}
.connexion2 table a{
  display: block;
  color: gray;
  text-align: center;
  text-decoration: none;
  border: 0.3px dashed gray;
  margin-bottom: 7px;
  padding: 4px;
}
.news1 .titre-formulaire{
  text-align: center;
}
.news1 .connexion a{
  color: #6abe52;
  font-weight: bold;
}
.news1 .connexion .p2{
  font-size: 11px;
}

.news1 .connexion .zdt2{
  box-sizing: border-box;
  display: block;
}
.partenaire{
  width: 100%;
  float: left;
}

.about aside h2{
  text-align: center;
}
.about aside p{
  text-align: center;

}
.activite-ressents{
  width: 100%;
  float: left;

  background: white;
  box-sizing: border-box;
  padding-top: 4%;
  padding-right: 5%;
  padding-left: 5%;
  padding-bottom: 5%;
}
.activite-ressents p{
  text-align: center;
  box-sizing: border-box;
  width: 50%;
  margin: auto;

}
.activite-ressents h1{
  text-align: center;
  font-size: 35px;
}
.activite-ressents .gris{
  color: gray;
}
.activite-ressents .posts{
  width: 100%;
  box-sizing: border-box;
}
.activite-ressents .posts aside,
.events aside{
  width: 30%;
   margin: 1.5%;
   box-sizing: border-box;
   float: left;
   margin-top: 50px;

}
.activite-ressents .posts-video aside{
  width: 47%;
   margin: 1.5%;
   box-sizing: border-box;
   float: left;
   margin-top: 50px;
}
.activite-ressents .posts-video iframe{
  width: 100%;
}
.activite-ressents .posts aside .cadre,
.events .cadre{
  box-sizing: border-box;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: #689e00;
}
.activite-ressents .posts aside .cadre img,
.events aside img
{ display: block;
  width: 100%;
  box-sizing: border-box;
}
.activite-ressents .posts aside .textes,
.events aside .textes{
  box-sizing: border-box;
  width: 100%;
  background: white;
  padding: 2%;
 padding-bottom: 4%;
 box-shadow: 0 0 8px #ebe7e7;
 height: 320px;
}
.activite-ressents .posts aside .textes a{
  display: block;
  box-sizing: border-box;
  width: 70%;
  margin: auto;
  text-decoration: none;
  background:#689e00;
  border-radius: 3px;
  color: white;
  text-align: center;
  padding: 3px;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-bottom: 5px;
}
.activite-ressents .posts aside .textes h3{
  text-align: center;
  margin: 5px;
}
.activite-ressents .posts aside .textes p{
  width: 100%;
  padding-bottom: 20px;
}
.activite-ressents .posts aside .textes .suite{
  background: none;
  color: #689e00;
  width: 40%;
  font-size: 14px;
  font-weight: 500;
  transition: 0.5s ease-out;
}
.activite-ressents .posts aside .textes .suite:hover{
  transform: scale(1.1);
  color: #f79393;

}
.histoire-tambour{
  width: 100%;
  float: left;
  box-sizing: border-box;
  padding-left: 5%;
  padding-right: 5%;
}
.histoire-tambour .image-tambour{
  box-sizing: border-box;
  width: 50%;
  float: left;
}
.histoire-tambour .histoire{
  box-sizing: border-box;
  width: 50%;
  height: 200px;
  float: left;
}
.histoire-tambour .histoire p {
  padding: 20px;
  font-size: 18px;
  padding-bottom: 0;
}
.histoire-tambour .histoire h1 {
  padding: 20px;
    padding-bottom: 0;
}
.histoire-tambour .image-tambour img{
width: 100%;
}
.events{
  width: 100%;
  float: left;
  background: #444444;
  box-sizing: border-box;
  padding-left: 5%;
  padding-right: 5%;
}
.events aside .textes a{
  text-align: center;
  color: black;
  font-size: 19px;
  font-weight: bold;
  display: block;
  margin-top: 30px;
  margin-bottom: 10px;
}
.events aside .textes p{
  text-align: center;
  color: gray;
}
.events aside .textes{
  padding-bottom: 40px;
  margin-bottom: 40px;
}
.membre{
  float: left;
  width: 100%;
  height: 500px;
  background-image: url(../images/Batimbo.jpeg);
  background-attachment: fixed;
  box-sizing: border-box;
  position: relative;
}
.membre .new-member{
  width: 60%;
  margin: auto;
  height: 400px;
  background: white;
  position: absolute;
  bottom: -300px;
  left: 20%;

}
.membre .new-member aside{

box-sizing: border-box;
width: 30%;
margin: 1.5%;
float: left;
box-sizing: border-box;
}
.membre .new-member aside .cadres{
  height: 200px;
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
}
.membre .new-member aside img{
  width: 100%;
  display: block;
}
.membre .new-member .enregistrement{
  box-sizing: border-box;
  width: 100%;
  float: left;
  text-align: center;
  padding: 5%;
}
.membre .new-member .enregistrement h1,
.histoire-tambour .histoire h1{
  font-size: 30px;
}
.membre .new-member .enregistrement h1 span,
.histoire-tambour .histoire h1 span{
  font-weight: 300;
  font-style: italic;
}
.membre .new-member .enregistrement a{
  display: block;
  text-decoration: none;
  width: 20%;
  margin: auto;
  color: white;
  background:#ff675b;
  padding: 7px;
  border-radius: 4px;
  text-align: center;
  margin-top: 20px;
}
.blanc{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 400px;
  background: white;
}

.f1 aside{
  box-sizing: border-box;
  width: 25%;
  float: left;
  color: white;
  padding: 1%;
  padding-top: 0;
}
.f1 aside h2{

  text-align: center;
  margin: 0;
  padding: 0;
  font-weight: 300;

}
.f1 aside img{
  display: block;
  width: 60%;
  margin: auto;
  margin-top: 10px;
}
.f1 aside p{
  font-weight: 300;
  font-size: 14px;
  text-align: left;
  box-sizing: border-box;
}
.f1 aside table{
  box-sizing: border-box;
  width: 100%;
  color: red;
  margin-top: 20px;

}
.f1 aside table tr td img{

  display: block;
  width: 80px;
  margin-right: 4px;
}
.f1 aside table tr td span{
  color: white;
  font-size: 12px;
}
.f1 aside ul{
  list-style: none;
  margin-top: 20px;
}
.f1 aside ul li a{
  text-decoration: none;
  color: white;
  display: inline;
  background: none;
  margin: 0;
  margin-bottom: 10px;
  display: block;
  text-align: left;
  margin-left: 20px;
  font-weight: 300;
font-size: 15px;
}
.f1 aside ul li a span{
  color: red;
  font-weight: bold;
  font-size: 20px;
}
.f1 aside a{
  display: block;
  box-sizing: border-box;
  width: 60%;
  background: #e64248;
  padding: 6px;
  border-radius: 5px;
  color: white;
  text-align: center;

  text-decoration: none;
  margin-top: 25px;
}
.f2{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 60px;
  background: #282828;
}

/*jssor slider bullet skin 032 css*/
        .jssorb032 {position:absolute;}
        .jssorb032 .i {position:absolute;cursor:pointer;}
        .jssorb032 .i .b {fill:#fff;fill-opacity:0.7;stroke:#000;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.25;}
        .jssorb032 .i:hover .b {fill:#000;fill-opacity:.6;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .iav .b {fill:#000;fill-opacity:1;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .i.idn {opacity:.3;}

        /*jssor slider arrow skin 051 css*/
        .jssora051 {display:block;position:absolute;cursor:pointer;}
        .jssora051 .a {fill:none;stroke:#fff;stroke-width:360;stroke-miterlimit:10;}
        .jssora051:hover {opacity:.8;}
        .jssora051.jssora051dn {opacity:.5;}
        .jssora051.jssora051ds {opacity:.3;pointer-events:none;}
        .texte-slide{display: block;
          background: red;
          color: white;
          font-size: 25px;
          text-align: center;
          padding: 10px;
          width: 45%;
          box-sizing: border-box;
        }

          .slider1 h1 span{
            font-size: 17px;
            font-weight: 400;
          }
        .about{
          box-sizing: border-box;
          float: left;
          background: white;

          padding-left: 5%;
          padding-right: 5%;
          padding-top: 20px;
        }

        .about .gauche{
          box-sizing: border-box;
          width: 50%;
          float: left;
          padding: 2%;
        }
        .about .gauche img,.about .droite img{
          width: 100%;
        }
        .about .droite{
          box-sizing: border-box;
          width: 50%;
          float: right;
          padding: 2%;
        }
        .about .gauche h1,.about .droite h1{
          font-size: 40px;
          font-weight: normal;
          margin-bottom: 20px;
          margin-top: 80px;
        }
        .about .gauche p,.about .droite p{
          font-weight: 350;
        }
        .liste-membre{
          width: 100%;
          box-sizing: border-box;
          background-image: url(../images/bg3.jpg);
          background-size: cover;
          height: 600px;
          float: left;
          padding-left: 5%;
          padding-right: 5%;
        }
        .liste-membre .floattant{
          width: 33.3%;
          float: left;
          padding: 2%;
          position: relative;
          box-sizing: border-box;
          color: white;
          height: 500px;


        }
        .liste-membre .floattant .texte{
          width: 100%;
          float: left;
           text-align: center;
           box-sizing: border-box;
           padding-left: 5%;
           padding-right: 5%;
        }
        .liste-membre .floattant .texte h1{
          font-size: 15px;
        }
          .liste-membre .floattant .texte p{
            color: gray;
            font-size: 13px;
          }
        .liste-membre aside{
          width: 100%;
          float: left;
          padding: 2%;
          position: relative;
          box-sizing: border-box;
          color: white;

          height: 270px;

        }
        .liste-membre aside h1{
          color: white;
          position: absolute;
          bottom: 0;
        }

        .liste-membre aside .image{
          width: 70%;

          margin: auto;
          z-index: 32;
          height: 450px;
          overflow: hidden;
          position: absolute;
          float: left;

        }
        .liste-membre aside img{
          width: 100%;

          z-index: 3;
        }
        .liste-membre aside .green-box{
          width: 60%;
          height: 140px;
          background: #689e00;
          box-sizing: border-box;
          position: absolute;
          z-index: 1;
          top: 120px;
          left: 60px;
          float: left;
        }
        .liste-membre .entete{
          width: 100%;
          box-sizing: border-box;
          padding-top: 30px;
        }
          .liste-membre .entete img{
            width: 4%;
            display: block;
            margin: auto;
          }
          .liste-membre .entete h1{
            color: white;
            text-align: center;
            font-size: 35px;
          }
          .liste-membre .entete span{
            color: #689e00;
          }
          .liste-membre .entete p{
            color: white;
            text-align: center;
          }

          .actualite{
  width: 100%;
  box-sizing: border-box;
  float: left;
  padding-bottom: 60px;


}
.actualite h1{
  text-align: center;
  font-size: 50px;
}
.actualite p{
  text-align: center;
  color: gray;
  padding: 20px;
  padding-top: 0px;
  padding-bottom: 10px;
  font-size: 18px;
}
.actualite .souligne{
  display: block;
  width: 120px;
  margin: auto;
}
.actualite .posts{
  box-sizing: border-box;
  width: 100%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
}

.actualite .posts aside{
  box-sizing: border-box;
  width: 33.3%;
  float: left;
  padding: 1%;
  position: relative;
}
.actualite .posts aside .cadre{
  width: 100%;
  box-sizing: border-box;
  height: 150px;
  overflow: hidden;

}
.actualite .posts aside h5{
  position: absolute;
  box-sizing: border-box;
  top:140px;
  right: 30px;
  background: #689e00;
  color: white;
  font-weight: normal;
  text-align: center;
line-height: 12px;
padding: 5px;
border-radius: 3px;
padding-top: 15px;
padding-bottom: 15px;
}
.actualite .posts aside h5 span{
  font-size: 30px;
  display: block;
  text-align: center;

}
.actualite .posts aside .texte{
  background: white;
  width: 100%;
  padding: 3%;
  box-sizing: border-box;
  box-shadow: 0 0 8px #ebe7e7;
  border-radius: 3px;
  height: 300px;
}
.actualite .posts aside .texte h4{
  font-weight: normal;
  color: #689e00;
}
.actualite .posts aside .texte h3{
  margin-top: 15px;
  font-size: 15px;

}
.actualite .posts aside .texte p{
  text-align: left;
  padding: 0;
  margin-top: 20px;
  margin-bottom: 20px;
}
.actualite .posts aside .texte a{
  color: #689e00;
  text-decoration: none;
  font-size: 15px;
}
.actualite .posts aside .cadre img{
  width: 100%;
}
.actualite .more{
  display: block;

  width: 20%;
  box-sizing: border-box;
  padding: 7px;
  font-size: 17px;
  border-radius: 3px;
  background: #6abe52;
  color: white;
  text-decoration: none;
  text-align: center;
margin: auto;

}
.partenaire{
  width: 100%;

  box-sizing: border-box;
  background: white;
  float: left;
  padding: 3%;
}
.f1{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 400px;


  background-size: cover;
}
.dark-blue{
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  background: #21212d;
  padding-left: 5%;
  padding-right:5%;
  padding-top: 20px;
}
.f1 aside{
  box-sizing: border-box;

  float: left;
  color: white;
  padding: 1%;
  padding-top: 0;
}
.f1 .a1{
  width: 35%;
}
.f1 .a1 img{
  display: block;
  float: left;
  width: 180px;
}
.f1 .a1 h2{
  width: 100%;
  float: left;
  font-weight: normal;
  margin-top: 20px;
  font-size: 16px;
  text-align: left;
}
.f1 .a1 p{
  width: 100%;
  float: left;
  margin-top: 10px;
}
.f1 .a2{
  width: 15%;
}
.f1 aside hr{
  display: block;
  border: 2px solid #6abe52;
  width: 30px;
  margin-bottom: 10px;
  margin-top: 5px;
}

.zdt{
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 40px;
  border-radius: 3px;
  text-align: center;
  margin-top: 5px;
}
.btn{

  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 50px;
  border-radius: 3px;
  text-align: center;
  background: #689e00;
  margin-top: 10px;
  color: white;
}
.news1 .connexion2 .btn{
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 40px;
  border-radius: 3px;
  text-align: center;
  background: #689e00;
  margin-top: 10px;
  color: white;
  display: block;
  text-decoration: none;
  padding-top: 10px;
}
.f2{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 60px;
  background: #21212d;
  border-top: 0.5px solid #e7fde0;
}
.f2 p{
  text-align: center;
  color: white;
  font-weight: 300;
  padding-top: 10px;
  font-size: 13px;
}
.f2 p a{
  color: #689e00;
}

.partenaire img{
  height: 90px;
  float: left;
  margin: 10px;
}
.apropos .news{
  padding-top: 0;
}



            .about .gauche ul,.about .droite ul{
              font-weight: 350;
            }

            .about .gauche a,.about .droite a{
              display: block;
              box-sizing: border-box;
              width: 200px;
              background: #e64248;
              padding: 6px;
              border-radius: 5px;
              color: white;
              text-align: center;
              text-decoration: none;
              margin-top: 50px;
            }
            .about table{
              width: 100%;
              box-sizing: border-box;
              border-collapse: collapse;
              border: 0.5px solid red;
              margin-bottom: 30px;
            }
            .about table td{
              border: 0.5px solid red;
              padding: 3px;
              text-align: center;
            }
            .about table th{
              background: red;
              color: white;
              padding: 7px;
            }
              .about table img{
                width: 100px;
                display: block;
                box-sizing: border-box;
                margin: auto;
              }
              .about h1{
                font-weight: normal;
                font-size: 40px;
                margin-bottom: 20px;
              }
              .about .album{
                box-sizing: border-box;
                float: left;
                width: 100%;

              }
              .about .album .album1{
                box-sizing: border-box;
                width: 33.3%;
                float: left;
                padding: 1%;
              }
              .about .album .al{
                box-sizing: border-box;
                width: 100%;
                text-align: center;
                box-shadow: 0 0 5px black;
              position: relative;
              }
              .about .album .al p{
                position: absolute;
                top: 0px;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.5);
                color: white;
                font-weight:bold;
                font-size: 20px;
                box-sizing: border-box;
                padding: 3%;
                padding-top: 10%;
                 line-height: 1;
                 transition: 0.5s ease-out;
                 width: 100%;
              }
                .about .album .al p:hover{
                  background: none;
                }
                .about .album .al p span{
                  font-size: 14px;
                }
              .about .album .al img{
                width: 100%;
              }
              .about .liste-album{
                box-sizing: border-box;
                float: left;
                width: 30%;
              }
              .about .colonne-gauche,.about .colonne-gauches{
                width: 70%;
                float: left;
                box-sizing: border-box;
              }
                .about .colonne-gauche .pictures{
                  box-sizing: border-box;
                  width: 25%;
                  float: left;
                  padding: 1%;
                }
                .about .colonne-gauche .pictures img{
                  width: 100%;
                  padding: 3px;
                  box-shadow: 0 0 4px gray;
                  transition: 0.5s ease-out;
                }
                .about .colonne-gauche .pictures img:hover{
                  filter: grayscale(5);
                  transform: scale(1.2);
                }
              .about .colonne-droite{
                width: 30%;
                float: left;
                box-sizing: border-box;
                padding-left: 3%;
              }
              .about .colonne-droite .recent-posts{
                box-sizing: border-box;
                background: #444444;
                padding: 5%;
                text-align: center;
              }
              .about .colonne-droite .recent-posts a{
                font-weight: 300;
                text-decoration: none;
                color: white;
                padding: 7px;
                border-bottom: 0.5px solid gray;
                display: block;

              }
              .about .colonne-droite .recent-posts h3{
                font-size: 30px;
                font-weight: normal;
                color: white;
              }
              .about .colonne-droite .recent-posts .a1{
                font-weight: 300;
              }
              .bande1 .phone-email{
                box-sizing: border-box;
                float: left;
                width: 50%;
              }
              .bande1 .phone-email{
                padding-top: 5px;
                font-weight: bold;
                color: white;
              }
              .bande1 .reseaux_sociaux{
                box-sizing: border-box;
                float: left;
                width: 50%;
              }
              .bande1 .reseaux_sociaux a{
                color: white;
                text-decoration: none;
              }
              .bande1 .reseaux_sociaux a img{
                width: 20px;

              }
                .bande1 .reseaux_sociaux table{
                  float: right;
                  width: 95%;
                  box-sizing: border-box;
                }
                .bande1 .reseaux_sociaux table p{
                  color: white;
                  font-weight:bolder;
                }
                .about .colonne .activite{
                  width:100%;
                  box-sizing: border-box;
                }
                .about .colonne-gauche .activite img{
                width: 100%;}
                .about .colonne-droite .recent-posts img{
                  width: 40%;
                }
                .about .colonne-droite .recent-posts .a1 h2{
                  font-size: 15px;
                  font-weight: 300;
                }
                .about .colonne-gauche .activite h2{
                  font-weight: normal;
                  font-size: 40px;
                }
                .about .colonne-gauche .activite p{
                  color: gray;
                  margin-bottom: 20px;
                }
                .about .colonne-gauche .activite a{
                  display: block;
                  box-sizing: border-box;
                  width: 200px;
                  background: #e64248;
                  padding: 6px;
                  border-radius: 5px;
                  color: white;
                  text-align: center;
                  text-decoration: none;
                  margin-top: 20px;
                  margin-bottom: 20px;
                }
                .dp{
                  color: #e64248;
                }
                .menu-mobile{
                  display: none;
                }
                .about2{
                  width: 100%;
                  box-sizing: border-box;
                  padding-left: 5%;
                  padding-right: 5%;
                  float: left;
                  padding-top: 50px;
                }
                .about2 .colonne-gauches{
                  box-sizing: border-box;
                  float: left;
                  width: 50%;
                  padding: 20px;

                }

                .about2 .colonne-gauches .zdt{
                  height: 27px;
                  width: 100%;
                }

                .slider1 h1{
          position: absolute;
          left: 25%;
          right: 25%;

          color: white;
          text-align: center;padding: 5%;

          box-sizing: border-box;
          width: 50%;
          top: 13%;
          font-size: 70px;
          float: left;
          line-height: 35px;

        }
        .slider1{
          box-sizing: border-box;
          width: 100%;
          height: 280px;
          background-image: url(../images/7.jpg);
          position: relative;
          background-size: cover;
          float: left;
        }
        .slider1 .black-transparent{
          width: 100%;
          box-sizing: border-box;
          background: rgba(0, 0, 0, 0.7);
          height: 100%;
        }
          .slider1 h1 span{
            font-size: 17px;
            font-weight: 400;
            color: white;
          }
          .slider1 h1 span .verte{
            color: #6abe52;
          }
          .slider1 h1 span img{
            width: 15px;
          }
          .apropos{
            width: 100%;
            box-sizing: border-box;
            float: left;
            padding-left: 5%;
            padding-right: 5%;
            padding-top: 8%;
          }
          .apropos .g{
            width: 50%;
            float: left;
            box-sizing: border-box;

          }
          .apropos .g h3{
            color: #6abe52;
          }
          .apropos .g h1{
            line-height: 1.1;
            margin-top: 15px;
            margin-bottom: 15px;
          }
          .apropos .g hr{
            display: block;
            border: 4px solid #6abe52;
            width: 50px;
            margin-bottom: 10px;
          }
          .apropos .g p{
            color: gray;
          }
          .apropos .g a{
            background: #6abe52;
            padding: 10px;
            display: block;
            border-radius: 25px;
            color: white;
            text-decoration: none;
            text-align: center;
            width: 25%;
            margin-top: 15px;
            font-weight: bold;
          }
          .apropos .g ul{
            list-style: none;
            box-sizing: border-box;
            padding-right: 40px;
          }
          .apropos .g ul li img{
            width: 10px;
          }
          .apropos .g ul li {
            margin-bottom: 10px;
            font-weight: 300;
          }
          .apropos .d{
            width: 50%;
            float: left;
            box-sizing: border-box;
            padding-left: 3%;
          }
          .apropos .d img{
            width: 100%;
            display: block;

          }
          .news .g{
            box-sizing: border-box;
            width: 50%;
            float: left;
            padding: 3%;
            text-align: justify;

          }
          .mvr{
            width: 100%;
            float: left;
            box-sizing: border-box;

            background-image: url(../images/secheresse5.jpg);


            height: 400px;
          }
          .mvr .black-transparent{
            width: 100%;
            box-sizing: border-box;
            padding-left: 5%;
            padding-right: 5%;
            background: rgba(0, 0, 0, 0.8);
            height: 100%;
            float: left;
          }
          .mvr .black-transparent aside{
            width: 33.3%;
            box-sizing: border-box;
            color: white;
            font-weight:300;
            float: left;
            padding: 3%;
          }
          .mvr .black-transparent aside img{
            display: block;
            width: 15%;
            margin: auto;
          }
          .mvr .black-transparent aside h1{
            margin: 15px;
            text-align: center;
          }
          .intro1 .a1{
            width: 33.3%;
            box-sizing: border-box;
            padding: 2%;
            float: left;
            font-size: 13px;

            background: #689e00;
            color: white;
            height: 500px;

          }
          .domaine-intervention{
            width: 49%;
            margin-right: 1%;
            box-sizing: border-box;
            padding: 3%;
            border: 0.5px dotted gray;
            border-radius: 5px;
            height: 350px;
            float: left;
            margin-bottom: 20px;
          }
            .domaine-intervention h2,.domaine-image h2{
              background: #6abe52;
              color: white;
              font-weight: normal;
              text-align: center;
              padding: 7px;
            }
            .domaine-image{
              width: 49%;
              margin-left: 1%;
              box-sizing: border-box;
              padding: 3%;
              border: 0.5px dotted gray;
              border-radius: 5px;
              height: 350px;
              float: left;
              margin-bottom: 20px;
            }
            .domaine-intervention p, .domaine-image p{
              margin-top: 15px;
            }
          .intro1 .a1 h1{
            font-size: 18px;
            text-align: center;
            color: white;
            text-align: left;
          }
            .intro1 .a1 ul{
              list-style:none;
            }
              .tiret{
                font-weight: bold;
                margin-right: 5px;
                font-size: 15px;
              }
              .intro1 .g{
                box-sizing: border-box;
                width: 70%;
                float: left;

              }
              .intro1 .d{
                box-sizing: border-box;
                width: 30%;

                float: left;
                padding-left: 4%;
              }

              .intro1 .g .activite{
                box-sizing: border-box;
                width: 100%;
                float: left;
                position: relative;
                margin-bottom: 20px;
              }
              .intro1 .g .activite .image-post{
                box-sizing: border-box;
                width: 50%;
                float: left;
                position: relative;
              }

                .intro1 .g .activite img{
                  width: 100%;
                  display:block;
                }
                    .intro1 .g .activite .image-post h5{
                      background: #689e00;
                      color: white;
                      width: 80px;
                      position: absolute;
                      right: -30px;
                      top: 0;
                      padding: 3%;
                      text-align: center;
                      font-size: 20px;
                      line-height: 1;
                    }
                    .intro1 .g .activite .image-post h5 span{
                      font-size: 13px;
                    }
                .intro1 .g .activite .textes-post{
                  box-sizing: border-box;
                  width: 50%;
                  float: left;
                  border-top: 3px solid #689e00;
                padding: 2%;
                padding-left: 6%;
                }
                .intro1 .g .activite .textes-post a{
                  display: block;
                  color: white;
                  background: black;
                  padding: 4px;
                  border-radius: 4px;
                  text-decoration: none;
                  width: 30%;
                  text-align: center;
                  margin-top: 20px;
                }
                .intro1 .g .activite .textes-post h2{
                  font-size: 15px;
                }
             .intro1 .d .recent-posts{
               width: 100%;
               border: 0.5px solid #689e00;
               box-sizing:border-box;
               float: left;
               padding: 10px;
             }
             .intro1 .d .recent-posts h3{
               background: #689e00;
               color: white;
               text-align: center;
             }
             .intro1 .d .recent-posts a{
               display: block;
               box-sizing: border-box;
               text-align: center;
               color: black;
               text-decoration: none;
               padding: 7px;
             }
             .intro1 .d .recent-posts a span{
               color: #689e00;

               padding: 5px;

             }
             .intro1 .g .pictures{
               width: 33.3%;
               box-sizing: border-box;
               padding: 2%;
               float: left;
               height: 120px;
               overflow: hidden;
             }
             .intro1 .g .pictures img{
               width: 100%;
               display: block;
               padding: 2%;
               box-shadow: 0 0 4px gray;
               box-sizing: border-box;

             }
             .colonne-gauche .activite p{
               margin-bottom: 7px;
             }
             .colonne-gauche .activite .dp{
                color: #689e00;
             }
             .colonne-gauche .activite h2{
               line-height: 1.4;
             }
             .colonne-gauche .activite img{
               margin-bottom: 20px;
             }
             .faire-don{
               position: fixed;
               top: 25%;
               bottom: 25%;
               left: 25%;
               right: 25%;
               width: 50%;
               background: white;
               border-radius: 10px;
               box-sizing: border-box;
               box-shadow: 0 0 7px black;
               z-index: 40;
                border: 3px solid #689e00;
             }
             .faire-don h2{
                  background: #689e00;
                  color: white;
                  text-align: center;
             }
              .faire-don table{
                width: 70%;
                background: white;
                text-align: left;
                margin: auto;
                padding-top: 20px;

              }
              .overlay{
                width: 100%;
                position: fixed;
                top: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.7);
                z-index: 39;

              }
                .faire-don a{
                  display: block;
                  width: 20%;
                  box-sizing: border-box;
                  margin: auto;
                  padding: 5px;
                  border-radius: 7px;
                  background:#689e00;
                  color: white;
                  font-weight: bold;
                  text-decoration: none;
                  text-align: center;
                  padding-top: 2px;
                  padding-bottom: 2px;
                  margin-top: 20px;
                }
                .line-two .menu ul li .green-bouton{
                  background:#689e00;
                  color: white;
                  font-size: 15px;
                  text-align: center;
                  border-radius: 30px;
                  padding-top: 10px;
                  margin-top: 10px;
                }
                .apropos .news .floattant{
                  box-sizing: border-box;
                  width: 33.3%;
                  float: left;
                  padding: 2%;
                }

                .apropos .news .floattant aside{
                  width: 100%;
                  box-sizing: border-box;

                  border-radius: 10px;
                  overflow: hidden;
                  padding: 0;
                  margin: 0;
                  box-shadow: 0 0 6px #bec0be;
                  padding: 1%;
                }
                .apropos .news .floattant aside img{
                  width: 100%;
                  display: block;
                  padding: 0;
                  margin: 0;
                    border-radius: 10px 10px 0 0;
                }
                .apropos .news .floattant aside .image{
                  height: 270px;
                  overflow: hidden;
                  box-sizing: border-box;
                  padding: 0;
                  margin: 0;

                }
                  .apropos .news .strategie{
                    width: 100%;
                    border: 0.5px dotted #6abe52;
                    border-left: 15px solid #6abe52;
                      background: white;
                      color:black;
                      font-size: 17px;
                      margin-bottom: 15px;
                      padding: 2%;
                      font-weight: 300;
                  }
                .apropos .news .floattant aside .texte{
                  background: #6abe52;
                  box-sizing: border-box;
                  border-radius:0 0 10px 10px;
                  color: white;
                  padding-bottom: 10px;

                }
                .apropos .news .floattant aside .texte h1{
                  font-size: 18px;
                  text-align: center;
                  padding: 0;
                  margin: 0;
                }
                .apropos .news .floattant aside .texte p{
                  text-align: center;
                }
                    .news .evenement{
                  width: 100%;
                  float: left;
                  box-sizing: border-box;
 margin-bottom: 20px;
                }
                .news .evenement .ga{
                  width: 30%;
                  box-sizing: border-box;
                  color: white;
                  background: #6abe52;
                  float: left;
                  padding: 2%;
                  height: 120px;
                }
                .news .evenement .ga h2{
                  text-align: center;
                  font-size: 40px;
                }
                .news .evenement .dr{
                  width: 70%;
                  box-sizing: border-box;
    height: 120px;
                  border: 4px solid #6abe52;
                  float: left;
                  padding: 2%;
                }
                  .news .evenement .dr h2{
                    font-weight: normal;
                    color: gray;
                  }
    .stat{
                    width: 100%;
                    float: left;
                    box-sizing: border-box;


                    background-image: url(../images/savoirdddde.jpg);
                    background-size: cover;
                  }
                  .stat .transparences{
                    background: rgba(0, 0, 0, 0.7);
                    width: 100%;
                    box-sizing: border-box;
                    padding: 5%;
                     padding-left: 5%;
                     padding-right: 5%;
                     float: left;
                     color: white;
                  }
                  .stat .element{
                    width: 20%;
                    box-sizing: border-box;
                    float: left;
                    text-align: center;
                    height: 120px;

                  }
                  .stat .element h1{
                    font-size: 40px;
                    color: #6abe52;
                  }
            .programme{
                    width: 100%;
                    box-sizing:border-box;

                  }
                  .programme img{
                    width: 30px;
                    display: block;
                    float: left;
                  }
                  .programme ul{
                    list-style: none;
                    box-sizing: border-box;
                    width: 100%;
                    margin: auto;
                  }
                  .programme ul li{
                    display: block;
                    float: left;
                    width: 50%;
                    margin-bottom: 10px;
                    font-weight: bold;
                    color: gray;
                    box-sizing: border-box;
                    padding: 20px;
                    padding-bottom: 0;
                    text-align: center;
                  }
                  .programme ul li .pro{
                    background: #6abe52;
                    color: white;
                    width: 100%;
                    box-sizing: border-box;
                    height: 100px;
                    padding: 3%;
                    font-size: 20px;

                  }

  /* mises à jours du 22 juin 2020*/
                  .prixvert{
                    box-sizing: border-box;
                    width: 100%;

                  }
                  .prixvert h2{
                    margin-bottom: 15px;
                  }
                  .prixvert p{
                    color: #636e72;
                    border-left: 3px solid #2ecc71;
                    padding-left: 15px;
                    margin-bottom: 15px;
                    padding-top: 0;
                  }
                  .edition{
                    background: #dfe6e9;
                    box-sizing: border-box;
                    width: 100%;

                    padding-top: 0;
                    margin-bottom: 20px;
                    float: left;

                  }
                  .edition h3{
                    background: #6abe52;
                    color: white;
                    box-sizing: border-box;
                    width: 40%;
                    padding: 1%;
                    border-radius: 0 0 20px 0 ;
                  }
                  .edition p{
                    border: none;
                    padding: 20px;
                    color: black;

                  }
                  .edition a{
                    color: #6abe52;
                    font-weight: bold;

                  }
                  .edition aside{
                    width: 33.33%;
                    box-sizing: border-box;


                      float: left;
                     padding: 2%;
                  }
                    .edition .laureat{
                      width: 100%;
                      box-sizing: border-box;
                    background: white;
                    position: relative;
                    float: left;
                    height: 130px;
                    }
                    .edition .laureat h3{
                      width: 100%;
                      text-align: right;
                      border-radius: 0;
                      padding-right: 10px;
                    }
                    .edition .laureat .initiative img{
                      height: 70px;
                      display: block;
                      float: right;
                      margin-top: 10px;

                    }
                  .edition .laureat .photo img{
                    width: 120px;
                    height: 120px;
                    border-radius: 120px;
                    display: block;
                    background: white;
                    padding: 10px;
                    box-shadow: 0 0 4px #636e72;
                    position: absolute;
                    top: -30px;
                    left: -15px;
                  }
                  .ga{
                      float:left;
                      margin-top:25px;
                      box-sizing:border-box;
                      width:100%;
                      border: solid 3px #008647;
                  }
                  .ga .ga_image{
                       box-sizing:border-box;
                       width:65%;
                       float:left;
                       padding:10px;
                  }
                  .ga .ga_image img{
                      display:block;
                      width:100%;
                      margin:auto;
                  }
                   .ga .ga_texte{
                       box-sizing:border-box;
                       width:35%;
                       float:left;
                        padding:10px;
                  }
                  .ga .ga_texte p{
                      background: #008647;
                    color: white;
                    padding:10px;
                  }
                  .gp{
                      width:100%;
                       box-sizing:border-box;
                  }
                    .gp img{
                        display:block;
                        width:50%;
                        box-sizing:border-box;
                        padding:10px;
                        float:left;
                    }
                    
                     .cn{
                      width:100%;
                       box-sizing:border-box;
                  }
                   .cn p{
                      width:50%;
                       box-sizing:border-box;
                       float:left;
                  }
                    .cn img{
                        display:block;
                      width:50%;
                       box-sizing:border-box;
                       float:left;
                  }
                    



                 @media screen and (max-width:640px){
                   *{
                     margin: 0;
                     padding: 0;
                   }
                   .phone-email{
                     display: none;
                   }


                   .bande1{
                     height: 70px;
                   }
                   .bande1 table{
                     box-sizing: border-box;
                     width: 100%;
                   }
                   .bande1 table tr td{
                     padding-right: 10px;
                   }
                   .bande2{
                     height: auto;
                   }
                   .bande2 .logo{
                     width: 100%;
                     box-sizing: border-box;
                     padding-left: 5%;
                     padding-right: 10%;
                     background: white;
                   }


                   .menu,.adresse,.bande3,.tel{
                     display: none;
                   }
                   .menu-mobile{
  display: block;
}
.con1{
  display: none;
}
    .menu-icon{
      width: 100%;
      height: 40px;
      background: #6abe52;
      float: left;
      box-sizing: border-box;
    }
    nav{
      margin: 0;
      padding: 0;
    }
    .menu-icon .g{
     width: 85%;
     float: left;
     background: #21212d;
     height: 100%;
     box-sizing: border-box;
    }
    .menu-icon .d{
      width: 15%;
      float: left;
 box-sizing: border-box;
    }
    .menu-icon .d img{
      width: 60%;
      display: block;
      margin: auto;
      height: 26px;
      margin-top: 7px;
    }
    .con1{
      display: none;
      background: #6abe52;
    }
    .menu-icon .g p{
      color: white;
      padding: 7px;
      font-weight: bold;
      padding-left: 15px;
    }
    .con1 li a{
      text-decoration: none;
      color: white;
      padding: 15px;
      font-size: 14px;
      display: block;
      border-bottom: 0.1px solid white;
      font-weight: bold;

    }
    .menu-mobile{
      display: block;
    }
    .about aside{
      width: 100%;
      margin-bottom: 20px;
      height: auto;
    }
    .activite-ressents p{
      width: 100%;
    }
    .activite-ressents h1{
      font-size: 25px;
    }
    .activite-ressents .posts aside,.activite-ressents .posts-video aside,
    .events aside{
      width: 100%;
      padding-left: 0;
    padding-right: 0;
    margin-top: 10px;
    }
    .histoire-tambour .image-tambour{
      width: 100%;
        height:auto;
    }
    .histoire-tambour .histoire{
      width: 100%;
      height:auto;

    }
    .histoire-tambour .histoire p {
      font-size: 14px;
    }
    .membre .new-member .enregistrement a{
      width: 80%;
    }
        .f1 {
        display: none;
        }
    .f1 aside{
      width: 100%;
    }
    .membre{
      height: 300px;
    }
    .membre .new-member{
      width: 90%;
      margin: auto;
      height: auto;

      bottom: -300px;
      left: 5%;

    }
    /* mises à jour */
     .slider1{
       float: left;
       height: 200px;
     }
     .slider1 h1{
       left: 5%;
       right: 5%;
       font-size: 40px;
       width: 90%;
       top: 10%;

     }
     .about .gauche{
       width: 100%;
     }
     .about .droite{
       width: 100%;
     }
     .about .gauche h1,.about .droite h1{
       margin-top: 0px;
     }
     .about .gauche a,.about .droite a{
       margin-top: 10px;
       margin-bottom: 10px;
     }
     .about table{
       font-size: 12px;
     }
     .about h1{
       font-size: 25px;
     }
     .about{
       padding-top: 2%;
     }
     .about .album .album1{
       width: 100%;
       margin-bottom: 20px;
     }
     .about .colonne-gauche{
       width: 100%;
     }
     .about .colonne-gauche .pictures{
       width: 50%;
     }
     .about .colonne-droite{
       width: 100%;
       margin-bottom: 20px;
     }
     .about .colonne-gauche .activite h2{
       font-size: 25px;
     }
     .intro{
       width: 100%;
       box-sizing: border-box;
       height: auto;
       padding-bottom: 10px;
     }
     .intro h1{
       font-size: 20px;
       line-height: 1.4;
       margin-bottom: 10px;
     }
     .intro p{
        font-size: 15px;
        text-align: left;
     }
     .welcome{
       width: 100%;
       height: auto;
       background-image: none;
       background: #f9eae5;
     }
     .welcome .gauche,.welcome .droite{
       width: 100%;
       height: auto;
       float: left;
     }
     .welcome .gauche h1{
       font-size: 20px;
       text-align: center;
       line-height: 1.4;
     }
     .welcome .gauche h2,.welcome .gauche a{
       width: 80%;
       margin: auto;
       margin-top: 15px;
       margin-bottom: 15px;
     }
     .welcome .droite aside{
       height: auto;
       float: left;
        padding: 3%;
        box-sizing: border-box;
     }
     .welcome .droite aside .image{
       margin: auto;
       float: none;
     }
     .welcome .droite aside .image img{

     }
     .welcome .droite aside .texte{
       width: 100%;
     }
     .welcome .droite aside .texte h3{
       text-align: center;
     }
     .activite-ressents h1{
       font-size: 20px;
       line-height: 1.4;
     }
     .activite-ressents p{
       font-size: 15px;
     }
     .activite-ressents .posts aside .textes a{
       width: 80%;
     }
      .actualite {
        padding-top: 20px;
        padding-bottom: 20px;
      }
     .actualite .more{
       width: 60%;
     }
     .liste-membre .entete img{
       width: 30%;
     }
     .liste-membre .entete h1{
       font-size: 20px;
       line-height: 1.4;
     }
     .liste-membre .entete p{
       font-size: 15px;
       margin-bottom: 10px;
     }
       .liste-membre{
         height: auto;
         padding-bottom: 30px;
       }
       .liste-membre .floattant{
         width: 100%;
         height: auto;
         padding-left: 10%;
       }
       .liste-membre aside .green-box{
         height: 120px;
       }
       .actualite .posts aside h5{
         top: 120px;
       }

      .vmor .gauche,.vmor .droite{
        width: 100%;
      }
      .intro1 .g,.intro1 .d{
        width: 100%;
      }
      .intro1 .g .activite .image-post{
        width: 100%;
      }
      .intro1 .g .activite .textes-post{
        width: 100%;
      }
        .intro1 .g .activite .image-post h5{
          right: 0;
        }
        .intro1 .g .activite .textes-post h2{
          font-size: 13px;
        }
        .intro1 .g .activite .textes-post a{
          padding: 2px;
          width: 25%;
          font-size: 13px;
        }
        .intro1 .g .activite .textes-post h4{
          font-size: 12px;
          color: #689e00;
        }
        .intro1 h1{
          font-size: 20px;
          line-height: 1.4;
        }
        .intro1 .g .pictures{
          width: 100%;
          height: auto;
          overflow: auto;
        }
        .intro1 .a1{
          width: 100%;
          height: auto;
          padding: 4%;
        }
        .intro1 .a1 h1{
          text-align: center;
          margin-top: 10px;
          margin-bottom: 10px;
        }
        .activite-ressents .posts aside .textes,
        .events aside .textes{
          height: auto;
        }
        .faire-don{
          width: 100%;
          left: 0;
          right: 0;

        }
        .faire-don table{
          width: 100%;
          padding: 2%;

        }
        .overlay{
          padding: 1%;
        }
        .about{
          height: auto;
          float: left;
        }

        .about .vmo{
          width: 100%;
          padding: 2%;
          padding-top: 1%;
        }
        .about aside{
          width: 100%;
  height: auto;
  padding-bottom: 15px;
        }
      .about .vmo{
        position: inherit;
        top: 0;



      }
      .slider{
        height: auto;
      }
      .about .a2{
        position: inherit;
        margin-top: 15px;
      }
      .s3{
        width: 100%;
        padding: 3%;
        padding-top: 1%;

      }
      .s3 .gauche,.s3 .droite{
        width: 100%;
        padding: 0;
        padding-bottom: 15px;
      }
      .s3 .droite h1{
        font-size: 25px;
        margin-top: 15px;
      }
      .s3 .opportunite h1{
          font-size: 25px;
      }
      .s3 .opportunite a{
        width: 70%;
        font-size: 18px;
        padding: 5px;
      }
      .s3 .gauche h2
      {
        right:0;
        top: 40px;
      }
      .s3{
        padding: 3%;
        padding-top: 1%;
      }
      .s4 h1{
        font-size: 25px;
      }
      .s4 p{
        width: 100%;
      }

      .s4 aside{
        width: 100%;
        box-sizing: border-box;
        padding: 1%;
        float: left;

      }
      .s4 aside .cadre{
        background: white;
        width: 100%;
        height:auto;
        border-radius: 10px;
        box-sizing: border-box;
        padding: 2%;
        position: relative;
        overflow: hidden;
        transition: 0.4s ease-out;
        margin-bottom:10px;
      }
      .news aside{
        width: 100%;
        height: auto;
      }
          .news aside .post .titre{
            height: auto;
          }
          .news h1,.partenaire h1{
            font-size: 25px;
          }
          .partenaire img{
            height: 50px;
          }
          .f1{
            display: block;
            height: auto;
            float: left;
          }
          .f1 .dark-blue{
            width: 100%;
            float: left;
            height: auto;
          }
          .f1 .a1{
            width: 100%;
            padding-bottom: 10px;
          }
          .f1 .a2{
            display: none;
          }
          .news .g{
            width: 100%;
            box-sizing: border-box;
          }
          .news .g p{
            text-align: left;
          }
          .apropos .g,.apropos .d{
            box-sizing: border-box;
            width: 100%;
          }
          .apropos .g h3{
            text-align: center;
          }
          .apropos .g h1{
            font-size: 20px;
            text-align: center;

          }
            .apropos .g hr{
              margin: auto;
              margin-bottom: 10px;
            }
            .apropos .g a{
              width: 60%;
              margin: auto;

            margin-bottom: 15px;
            }
            .mvr{
              height: auto;
              width: 100%;

            }
            .black-transparent{
              height: auto;
              width: 100%;
            }
            .mvr .black-transparent aside{
              width: 100%;
            }
            .domaine-intervention,.domaine-image{
              width: 100%;
              height: auto;
            }
            .actu .news{
              width: 100%;
              padding: 0;

            }
            .actu .news aside{
              width: 100%;
            }
            .actu .plus-pub{
              width: 100%;
            }
            .actu .plus-pub h3{
              font-size: 25px;
              text-align: center;
            }
            .actu .plus-pub hr{
              margin: auto;
              margin-bottom: 15px;
            }
            .news1{
              padding: 5%;
              padding-top: 2%;
            }
            .news1 .connexion,.news1 .connexion1,
            .news1 .connexion2{
              width: 100%;
            }
            .postuler a{
              width: 80%;
              font-size: 18px;
            }
            .apropos .news .floattant{
              width: 100%;
            }
            .news .evenement .ga h2{
                  text-align: center;
                  font-size: 20px;
                }
                .news .evenement .dr h2{
                  text-align: center;
                  font-size: 17px;
                }
          .stat .element{
  width: 100%;
  height: auto;
}
  .programme ul{
    width: 100%;
  }
  .programme ul li{
      width:100%;
  }
 .programme ul li .pro{
     width:100%;
 }
   .edition aside{
      width: 100%;
      margin-bottom: 40px;
    }
    .edition h3{
        width:100%;
        border-radius:0;
        
    }
    .ga .ga_image{
                       box-sizing:border-box;
                       width:100%;
                       float:left;
                       padding:10px;
                  }
                  
                   .ga .ga_texte{
                       box-sizing:border-box;
                       width:100%;
                       float:left;
                        padding:10px;
                  }
                  .s3 .gauche h2
{
  background:#6abe52;
  color: white;
  position: absolute;
  top: 30px;
  right:0 ;
  padding: 10px;
  border-radius: 50px 0px 0px 50px;
  display:none;

}
 .gp img{
                        display:block;
                        width:100%;
                        box-sizing:border-box;
                        padding:10px;
                        float:left;
                    }
                    
                     .cn p{
                      width:100%;
                       box-sizing:border-box;
                       float:left;
                  }
                    .cn img{
                        display:block;
                      width:100%;
                       box-sizing:border-box;
                       float:left;
                       margin-bottom:20px;
                  }


                 }