*{
    margin: 0;
    padding: 0;
}

body{

  font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background: #f9f9f9;
}
header{
  float: left;
  width: 100%;
  box-sizing: border-box;
}
.line-one{
  width: 100%;
  box-sizing: border-box;
  height: 50px;
  background: #008000;
  color: white;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 10px;
  font-weight: 300;
}
.line-one img{
  width: 15px;
}
.line-one table tr td{
  padding-right: 20px;
}
.line-two{
  width: 100%;
  box-sizing: border-box;
  height: 60px;
  background: white;
  padding-top: 10px;
}
.line-two .logo{
  width: 25%;
  box-sizing: border-box;
  float: left;
}
.line-two .menu{
  width: 75%;
  box-sizing: border-box;
  float: left;
position: relative;
}
.line-two .logo img{
  width: 100%;
  float: left;
  display: block;
}
.line-two .logo h1{
  float: left;
  font-size: 20px;
  padding: 10px;
}
.line-two .logo h1 span{
  color: red;
}
.centrer{
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  box-sizing: border-box;
}
.line-two .menu ul{
  list-style: none;
  float: right;
box-sizing:border-box;
width:100%;
position:absolute;

}
.line-two .menu ul li{
  display: block;
  float: left;
  box-sizing: border-box;
  width: 16.6%;
}
.line-two .menu ul li a{
  text-align: center;
  display: block;
  box-sizing: border-box;
  padding: 10px;
  padding-top: 12px;
  width: 100%;
  font-size: 15px;
  color: black;
  font-weight: bold;
  text-decoration: none;
}
/*sous menus */
.line-two .menu ul li ul{
    display: none;
    z-index:1;
    background: white;

    width: 25%;
      box-shadow: 0 0 3px gray;
      border-radius: 0 0 4px 4px;
      overflow: hidden;
}
.line-two .menu ul li ul li{
  float: none;
  text-align: center;
  width: 100%;
  box-sizing: border-box;

  border-top: 0.5px solid gray;
  font-size: 14px;
}
.line-two .menu ul li ul li a{
  padding: 4%;
transition: 0.2S ease-out;
}
.line-two .menu ul li ul li a:hover{
  background: #47c67e;
  color: white;

}


.line-two .menu ul li:hover ul{
  display: block;
  transition: 0.5s ease-out;
}
/*fin*/
.slider{
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;

margin-top: 100px;
z-index: 1;
}
.sky-blue{
  width: 100%;
  height: 100%;
  background: rgba(67, 158, 228, 0.9);
  position: relative;
  box-sizing: border-box;
}
.slider .texte-slide{
  width: 50%;
  box-sizing: border-box;
  margin-left: 70px;
padding-top: 130px;
}
.slider .texte-slide h1{
  display: block;

  color:white;
  font-size: 45px;
  font-weight:600;

}
.slider .texte-slide h2{
  color: white;
  font-weight: 600;
  margin-top: 30px;
}
.slider .texte-slide a{
  text-decoration: none;
  display: block;
  background: #008000;
  color: white;
  font-weight: bold;
  width: 230px;
  padding: 6px;
  border-radius: 5px;
  text-align: center;
  margin-top: 30px;
}
.sky-blue img{
  width: 20%;
  display: block;

position: absolute;
  top: 40px;
    width: 40%;
    right: 5%;
 transition: 0.5s ease-out;
}
.sky-blue img:hover{
  transform: scale(1.1);
}


.principal{
  width: 100%;
  box-sizing: border-box;
  background-image:url(../images/bg-sevice.jpg);

  float: left;
  background-size: cover;
  padding: 30px;
  padding-left: 5%;
  padding-right: 5%;

}
.principal h1{
text-align: center;
margin-bottom: 10px;
font-size: 40px;
}

.principal .p1{

    text-align: left;



    font-size: 18px;
    font-weight: 300;

}
.about{
  width: 100%;
  box-sizing: border-box;
  background: none;
}
.principal .about aside{
  width: 25%;
  box-sizing: border-box;
  padding: 1%;
float: left;
text-align: center;
}
.principal .about aside p{
  color: #676767;
  margin-top: 10px;
}
.principal .about aside a{
  color: #47c67e;
  font-weight: bold;
  text-decoration: none;
}
.principal .about aside img{
  display: block;
  width: 25%;
  margin: auto;
}
.directeur{
  box-sizing: border-box;
  width: 100%;
  padding-top: 100px;
  margin-bottom: 30px;
  float:left;
}
.directeur .gauche{
  box-sizing: border-box;
  width: 50%;
  float: left;
}
.directeur .gauche img{
  width: 100%;
}
.directeur .droite{
  box-sizing: border-box;
  width: 50%;
  float: left;
  padding-left: 2%;
}
.directeur .droite h3{
  color:  #47c67e;
  margin: 20px;
  margin-top: 0;
}
.directeur .droite h2{
  font-size: 25px;
  margin: 20px;
  margin-bottom: 10px;
}
.directeur .droite p{
  text-align: left;
  color: #676767;
}
.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: #47c67e;
  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: #47c67e;
}
.actualite .posts aside .texte h3{
  margin-top: 15px;
}
.actualite .posts aside .texte p{
  text-align: left;
  padding: 0;
  margin-top: 20px;
  margin-bottom: 20px;
}
.actualite .posts aside .texte a{
  color: #47c67e;
  text-decoration: none;
  font-size: 15px;
}
.actualite .posts aside .cadre img{
  width: 100%;
}
.partenaire{
  width: 100%;

  box-sizing: border-box;
  background: white;
  float: left;
  padding-left:5%;
  padding-right:5%;
  padding-top:20px;
  padding-bottom:20px;
}
.partenaire h1{
text-align:center;
margin-bottom:20px;}
.partenaire img{
height:80px;}
.don{
  width: 100%;
  height: 80px;
  box-sizing: border-box;
  background: #008000;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
}
.don-gauche{
  box-sizing: border-box;
  width: 70%;
  float: left;
}
.don-gauche h2{
  color: white;
  padding-top: 10px;
  color: white;
  font-size: 35px;
}
.don-droite{
  box-sizing: border-box;
  width: 30%;
  float: left;
}
.don-droite a{
  display: block;
  float:right;
  width: 60%;
  box-sizing: border-box;
  padding: 7px;
  font-size: 17px;
  border-radius: 3px;
  background: #ffff00;
  color: #008000;
  text-decoration: none;
  text-align: center;
  margin-top: 25px;
}
.actualite .more{
  display: block;

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

}
.f1{
  width: 100%;
  float: left;
  box-sizing: border-box;
  height: 400px;
  background-image: url(../images/background.jpeg);

  background-size: cover;
}
.dark-blue{
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  padding-left: 5%;
  padding-right:5%;
  padding-top: 20px;
}
.apropos{
  width: 100%;
  box-sizing: border-box;
  padding-bottom: 100px;
  float: left;
}
.apropos aside{
  box-sizing: border-box;
  width: 25%;
  height: 200px;
  float: left;

}
.apropos .a1{
  background: #008000;

}
.apropos .a2{
  background: white;
}
.apropos .a3{
  background: #ffff00;
}
.apropos .a4{
  background: #419ce2;
}
.fondateur{
  width: 100%;
  box-sizing: border-box;
  padding-bottom: 100px;
  float: left;
}
.fondateur .gauche{
  width: 50%;
  float: left;
  box-sizing: border-box;
  background-image: url(../images/team.jpeg);
  background-size: cover;
  height: 400px;
}
.fondateur .gauche .blue{
  background:rgba(0, 128, 0, 0.8);
  width: 100%;
  box-sizing: border-box;
  height: 100%;
  padding: 5%;
}
.fondateur .gauche .blue h3{
  text-align: center;
  color: #ffff00;
  margin-bottom: 10px;
}
.fondateur .gauche .blue h2{
  color: white;
  font-size: 45px;
  line-height: 1;
}
.fondateur .gauche .blue p{
  color: white;
  margin-top: 10px;
}
.fondateur .gauche .blue a{
  display: block;
  width: 30%;
  background: #ffff00;
  color: #008000;
  font-weight: bold;
  border-radius: 5px;
  text-decoration: none;
  padding: 7px;
  box-sizing: border-box;
  text-align: center;
  margin-top: 15px;
}
.fondateur .droite{
  width: 50%;
  float: left;
  box-sizing: border-box;
  position: relative;
}
.fondateur .droite h2{
  position: absolute;
  bottom: 50px;
  background: rgba(0, 0, 0, 0.5);
  color: white;
  display: block;
  left: 30%;
  width: 40%;
  text-align: center;
  font-weight: normal;
  padding: 7px;
  line-height: 1;
  box-sizing: border-box;
}
.fondateur .droite h2 span{
  font-size: 17px;
  color: #47c67e;
}
.fondateur .droite img{
  width: 100%;
}
.activite{
  box-sizing: border-box;
  width: 100%;
  float: left;

}

.f1 aside{
  box-sizing: border-box;

  float: left;
  color: white;
  padding: 1%;
  padding-top: 0;
}
.f1 .a1{
  width: 35%;
}
.f1 .a2{
  width: 15%;
}

.zdt{
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 50px;
  border-radius: 3px;
  text-align: center;
}
.btn{
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 50px;
  border-radius: 3px;
  text-align: center;
  background: #47c67e;
  margin-top: 10px;
  color: white;
}


.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;

  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;
}
.f2 p{
  text-align: center;
  color: white;
  font-weight: 300;
  padding-top: 10px;
  font-size: 13px;
}
.f2 p a{
  color: #47c67e;
}


/*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;}

        .slider1{
          box-sizing: border-box;
          width: 100%;
          height: 250px;
          background-image: url(../images/bg-secondaire.jpg);
          position: relative;
          background-size: cover;
          margin-top: 100px;
        }
        .image-team{
          width: 70%;
          box-sizing: border-box;
          margin: auto;
          padding-top: 50px;
        }
        .image-team img{
          display: block;
          width: 100%;
        }
        .slider1 h1{
          position: absolute;
          left: 25%;
          right: 25%;

          color: white;
          text-align: center;padding: 2%;
          border: 1px solid white;
          box-sizing: border-box;
          width: 50%;
          top: 20%;
          font-size: 70px;
          float: left;
          line-height: 35px;

        }
          .slider1 h1 span{
            font-size: 15px;
            font-weight: 400;
            color: #47c67e;
          }
          .slider1 h1 span img{
            width: 15px;
          }
        .about{
          box-sizing: border-box;
          float: left;


          padding-left: 5%;
          padding-right: 5%;
          padding-top: 50px;
        }
        .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 .droite .liste{
            box-sizing: border-box;
            width: 100%;
            padding: 2%;
            background: #47c67e;
            color: white;
            border-radius: 3px;
            margin-top: 120Px;
          }
          .about .droite .liste ul{
            margin-left: 20px;
          }
          .about .valeur,.about .valeur1{
            width: 100%;
            box-sizing: border-box;

          }
          .about .valeur img{
          width:95%;
          display:block;
          margin:auto;
          }

          .about .valeur aside{
            width: 33.3%;
            float: left;
            padding: 2%;

          }
          .about .valeur .a1{
            width: 50%;
            height: 350px;
          }
          .about .valeur .a3{
            width: 50%;
            height: 600px;
          }
          .about .valeur .a4{
            width: 50%;
            height: 400px;
          }
          .about .valeur .a3 .cadre,
          .about .valeur .a4 .cadre{
            height: 100%;
          }
          .about .valeur .a3 .cadre span,
          .about .valeur .a4 .cadre span{
           display: block;
           box-sizing: border-box;
           float: left;
           background: white;
           color: #47c67e;
           width: 25px;
           height: 25px;
           border-radius: 25px;
           text-align:center;

           }

            .about .valeur aside .cadre{
              box-sizing: border-box;
              background: white;

              box-sizing: border-box;
              box-shadow: 0 0 8px #ebe7e7;
              border-radius: 3px;
            }
              .about .valeur .a1 .cadre{
                height: 100%;
              }
              .about .valeur aside .cadre h3{
                text-align: center;
                background: #47c67e;
                color: white;
                font-weight: normal;
                box-sizing: border-box;
                padding: 5px;
              }
              .about .valeur aside .cadre p{
                text-align: left;
                color: black;
                font-weight: 300;
                padding: 3%;
                width: 100%;
                box-sizing: border-box;
              }
              .about .valeur1 p{
                text-align: left;
                color: black;
                font-weight: 300;
                padding: 1.5%;
                width: 100%;
                box-sizing: border-box;
                padding-left:0;
              }
              .about .p2{
                text-align: center;
                font-size: 17px;
              }
        .about .gauche h1,.about .droite h1{
          font-size: 40px;
          font-weight: normal;
          margin-bottom: 10px;
          margin-top: 0px;
        }
        .about .gauche p,.about .droite p{
          font-weight: 350;
        }
            .about .gauche ul,.about .droite ul{
              font-weight: 350;
            }

            .about .gauche a,.about .droite a{
              display: block;
              box-sizing: border-box;
              width: 45%;
              float: left;
              margin-right: 3%;
              background: #47c67e;
              padding: 6px;
              border-radius: 5px;
              color: white;
              text-align: center;
              text-decoration: none;
              margin-top: 30px;
              height: 55px;
              margin-bottom: 30px;
            }
            .about .gauche fieldset{
              margin-top: 20px;
              box-sizing: border-box;
              width: 100%;
              padding-left: 10%;
            }

            .btn1{
              display: block;
              box-sizing: border-box;
              width: 240px;
              float: left;
              margin-right: 3%;
              background: #47c67e;
              padding: 6px;
              border-radius: 5px;
              color: white;
              text-align: center;

              margin-top: 10px;

            }
            .about .gauche h2{
              margin-bottom: 10px;
            }
            .about table{
              width: 100%;
              box-sizing: border-box;


              margin-bottom: 30px;
              padding-top: 20px;

            }
            .about table td{

              padding: 3px;



            }
            .zdt1{
              width: 240px;
              height: 30px;
              padding-left: 10px;
              box-sizing: border-box;
            }


              .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: 30px;
                box-sizing: border-box;
                padding-top: 10%;
                 line-height: 1;
                 transition: 0.5s ease-out;
              }
                .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{
                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;
              }
              .line-one .phone-email{
                box-sizing: border-box;
                float: left;
                width: 50%;
              }
              .line-one .phone-email span a{
              color:white;
              text-decoration:none;}
              .line-one .reseaux_sociaux{
                box-sizing: border-box;
                float: left;
                width: 50%;
              }
              .line-one .reseaux_sociaux a{
                color: white;
                text-decoration: none;
              }
              .line-one .reseaux_sociaux a img{
                width: 20px;
              }
                .line-one .reseaux_sociaux table{
                  float: right;
                }
                .about .colonne-gauche .activite{
                  width:100%;
                  box-sizing: border-box;
                  background: white;
                    box-shadow: 0 0 8px #ebe7e7;
                    padding: 3%;
                    margin-bottom: 20px;

                }
                .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: 35px;
                  line-height: 1;
                  margin-top: 15px;
                  margin-bottom: 15px;
                }
                .about .colonne-gauche .activite p{
                  color: gray;
                  margin-bottom: 20px;
                }
                .about .colonne-gauche .activite a{
                  display: block;
                  box-sizing: border-box;
                  width: 200px;
                  background: #47c67e;
                  padding: 6px;
                  border-radius: 5px;
                  color: white;
                  text-align: center;
                  text-decoration: none;
                  margin-top: 20px;
                  margin-bottom: 20px;
                }
                .dp{
                  color: #47c67e;
                }
                .menu-mobile{
                  display: none;
                }
                .fixe{
                  position: fixed;
                  width: 100%;
                  box-sizing: border-box;
                  z-index: 10;
                }
                .about .flottant{
                  width:50%;
                  float:left;
                  padding:2%;
                  box-sizing:border-box;

                }
                .about .flottant aside{
                width:100%;
                box-sizing:border-box;
                background:white;
                padding:2%;
                box-shadow:0 0 6px gray;
                height:260px;

                }
                   .about .flottant aside .image{
                   width:100%;
                box-sizing:border-box;
                height:160px;
                overflow:hidden;
                   }
                   .about .flottant aside .g{

                    width:40%;
                box-sizing:border-box;
                float:left;
                padding:5px;

                   }
                   .about .flottant aside .d{

                    width:60%;
                box-sizing:border-box;
                float:left;
                padding-left:2%;
                padding-top:0;
                height:240px;
                overflow-y:scroll;
                   }
                   .about .flottant aside .image img{
                   width:100%;
                   display:block;}
                    .about .flottant aside .texte{
                      color:white;
                      background:#47c67e;
                      height:100%;
                    }
                    .about .flottant aside .texte h3{
                    padding:0;}
                    .about .flottant aside .texte p{
                    margin:0;
                    padding:0;
                    color:white;
                    font-weight:300;
                    padding-bottom:10px;
                    }
                     .about .flottant aside .d p{
                     text-align:left;
                     font-weight:300;
                     color:black;
                     font-size:13px;
                     margin-top:0;
                     padding-top:0;
                     }
                    .about .emploi{
                     box-sizing:border-box;
                     width:70%;
                     margin:auto;
                     background:#47c67e;
                     margin-bottom:10px;
                     border-radius:4px;
                    }
                    .about .emploi a{
                     padding:10px;
                     text-decoration:none;
                     display:block;
                     text-align:center;
                     color:yellow;
                     font-weight:bold;
                    }
                      .line-one .reseaux_sociaux table .faire-dons{
                display: block;
                width: 180px;
                background: #ffff00;
                color: #008000;
                font-weight: bold;
                border-radius: 5px;
                text-decoration: none;
                padding: 4px;
                box-sizing: border-box;
                text-align: center;

              }
                  /* mises à jour du 04 mai 2020*/
                .rapport{
                  width: 20%;
                  box-sizing: border-box;
                  float: left;
                }
                .rapport img{
                  width: 60%;
                  display: block;
                  margin: auto;
                  box-sizing: border-box;
                }
                .rapport a{
                  text-decoration: none;
                  display: block;
                  color: black;
                }
                .rapport h4{
                  color: black;
                  text-align: center;
                }
                .rapport p{
                  text-align: center;
                  color: gray;
                  font-size: 13px;
                  font-style: italic;
                }
                .about1{
                  width: 100%;
                  float: left;
                  padding-left: 5%;
                  padding-right: 5%;
                  box-sizing: border-box;
                }
                .about1 .posts1 aside{
                  width: 33.3%;
                  float: left;
                  box-sizing: border-box;
                  padding: 1%;
                }
                .about1 .posts1 .a1
              {
                width: 100%;
              }
                  .about1 .posts1{
                    width: 100%;
                    float: left;

                    box-sizing: border-box;
                  }
                  .about1 .posts1 aside .cadre1{
                    height: 150px;
                    overflow: hidden;
                    border-radius: 7px 7px 0 0;
                  }

                .about1 .posts1 aside .cadre2{
                  height: 350px;
                  overflow: hidden;
                  margin-top: 20px;
                }
                  .about1 .posts1 aside .texte{
              box-sizing: border-box;
               padding: 2%;
                box-shadow: 0px 0px 4px gray;

                  }
                      .about1 .posts1 aside .texte1{
                        box-sizing: border-box;
                        padding: 3%;
                        border-radius: 0 0 7px 7px;
                        border: 0.5px dotted #47c67e;

                      }
                      .about1 .posts1 aside .texte3{
                        box-sizing: border-box;
                        padding: 3%;
                        border-radius: 7px;
                        border: 0.5px dotted #47c67e;
                        background: white;

                      }
                      .about1 .posts1 aside .texte3 p{
                        margin-top: 15px;
                      }
                      .about1 .posts1 aside .texte3 h3{
                        text-align: center;
                        font-size: 30px;
                      }
                  .about1 .posts1 aside .texte a,
                  .about1 .posts1 aside .texte3 a,
                  .about1 .posts1 aside .texte1 a{
                    display: block;
                    text-decoration: none;
                    text-align: center;
                    background:#47c67e;
                    color: white;
                    font-weight: bold;
                    padding: 5px;
                    width: 60%;
                  border-radius: 5px;
                  margin: auto;
                  margin-top: 10px;
                  margin-bottom: 10px;
                  }
                    .about1 .posts1 aside .texte h5,
                    .about1 .posts1 aside .texte3 h5,
                    .about1 .posts1 aside .texte1 h5{
                      font-size: 13px;
                      font-style: italic;
                      color: gray;
                      margin-top: 5px;
                      font-weight: normal;
                      text-align:center;
                    }
                    .about1 h1{
                      font-weight: normal;
                      margin-bottom: 20px;
                    }
                    .about1 h2,.about h2{
                      text-align: center;
                      font-weight: normal;
                      margin-top: 20px;
                    }
                  .about1 .posts1 aside img{
                    width: 100%;
                  }
                  .contact .gauche{
                    width: 50%;
                    box-sizing: border-box;
                    padding: 2%;
                    background: white;
                    float: left;
                  }
                  .contact .gauche p{
                    margin-bottom: 15px;
                    font-size: 16px;
                    color: #606061;
                  }
                  .contact .gauche h4{

                    color: #008000;
                  }
                  .contact .gauche hr{
                    display: block;
                    border: 4px solid #008000;
                    width: 50px;
                    margin-top: 7px;
                  }
                  .contact .droite{
                    width: 50%;
                    box-sizing: border-box;
                    padding: 2%;
                    background: white;
                    float: left;
                  }
                  .produit{
                    width: 100%;
                    box-sizing: border-box;

                  }
                  .produit aside{
                    width: 25%;
                    box-sizing: border-box;
                    padding: 1%;
                    float: left;

                  }
                  .produit aside .prod{
                    box-sizing: border-box;
                    border: 2px solid #d9d9d9;
                    padding: 3%;
                    height: 280px;
                  }
                  .produit aside .prod .cadre1{
                    height: 150px;
                    overflow: hidden;
                  }
                  .produit aside .prod img{
                    width: 100%;
                  }
                  .produit aside .prod p{
                    color: gray;
                  }
                  .produit aside .prod h3{
                    margin-top: 10px;
                  }
                  .about5{
                    width: 100%;
                    box-sizing:border-box;
                    background: #f1f1f1;
                    padding: 3%;
                    border-radius: 7px;
                  }
                    .about5 h2{
                      text-align: center;
                      margin: 20px;
                    }
                      .about5 hr{
                        display: block;
                        border: 5px solid #47c67e;
                        width: 5%;
                        margin: auto;
                        margin-top: 15px;
                        margin-bottom: 15px;
                      }
                      .about5 p{
                        text-align: center;
                        font-size: 17px;
                        margin-bottom: 10px;
                      }
                      .about5 #paragraphe li p{
                        text-align: left;
                        padding-top: 15px;
                        padding-bottom: 15px;
                      }
                  #paragraphe{list-style:none;margin:0 auto; padding:0;width:100%;
                   background: white;
                   padding: 5%;
                   box-sizing: border-box;
                   border-radius: 7px;
                  }
                  #paragraphe li{background:#f1f1f1;
                     position:relative;width:100%;cursor:pointer;
                   padding: 15px; border-radius: 5px; margin-bottom: 3px;}
                  #paragraphe h3{}
                  #paragraphe p{ display:none;}
                  #paragraphe span{position:absolute;right:15px; top:0px;
                  font-weight: bold; font-size: 30px; color: gray;}
                  
                   .btn6{
                       display: block;
                       text-align: center;
                       text-decoration: none;
                       background: #47c67e;
                       width: 30%;
                       color: white;
                       font-weight: bold;
                       font-size: 25px;
                       margin: auto;
                       margin-top: 20px;
                       padding: 7px;
                     }

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

                   .reseaux_sociaux,.line-one,header,.line-two,.centrer,.logo,.reseaux_sociaux table{
                     box-sizing: border-box;
                     width: 100%;

                   }
                   .line-one{
                     height: 70px;
                   }

                   .line-one table tr td{
                     padding-right: 10px;
                   }
                   .line-two{
                     height: auto;
                     padding: 0;
                   }
                   .centrer{
                     padding: 0;
                   }

                   .line-two .logo{
                     width: 100%;
                     box-sizing: border-box;

                     background: white;
                     padding: 3%;
                   }


                   .menu{
                     display: none;
                   }
                   .menu-mobile{
  display: block;
}
.con1{
  display: none;
}
    .menu-icon{
      width: 100%;
      height: 40px;
      background: #333;
      float: left;
      box-sizing: border-box;
    }
    nav{
      margin: 0;
      padding: 0;
    }
    .menu-icon .g{
     width: 85%;
     float: left;
     background: #008000;
     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: #484948;
    }
    .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 silver;

    }
    .menu-mobile{
      display: block;
    }
    .about aside{
      width: 100%;
      margin-bottom: 20px;
      height: auto;
    }
    .slider{
      height: auto;
    }
    .slider .texte-slide h1{
      font-size: 20px;
    }
    .slider .texte-slide{
      padding: 10px;
      padding-top: 10px;
      margin-left: 10px;
      width: 60%;
    }
    .slider .texte-slide h2{
      font-size: 15px;
    }
    .slider .texte-slide a{
      box-sizing: border-box;
      width: auto;
    }
    .sky-blue img{
      right: 2%;
      top: 10px;
    }
    .principal{
      padding: 2%;
    }
    .principal h1{
      font-size: 20px;
    }
    .principal .p1{
      text-align: center;

    }
    .principal .about aside{
      width: 100%;
    }

    .principal .about aside img{
      width: 40%;
    }

    .directeur{
      margin-bottom: 15px;
    }
    .directeur .gauche{
      width: 100%;
    }
    .directeur .droite{
      width: 100%;
    }
    .fondateur{
      padding-bottom: 20px;
    }
    .fondateur .gauche{
      width: 100%;
    }
    .fondateur .gauche .blue h2{
      font-size: 20px;
    }
    .fondateur .droite{
      width: 100%;
    }
    .fondateur .droite h2{
      left: 10px;
      top: 10px;
      bottom: auto;
    }
    .actualite{
      padding-bottom: 20px;
    }
    .actualite h1{
      font-size: 20px;
    }
    .actualite p{
      font-size: 15px;
    }
    .actualite .posts{
      padding: 2%;
    }
    .actualite .posts aside{
      width: 100%;
    }
    .actualite .posts aside .texte{
      height: auto;
    }
    .don{
      padding: 2%;
    }
    .don-gauche h2{
      font-size: 15px;
    }
    .don-droite a{
      width: 100%;
      font-size: 14px;
      padding: 4px;
      margin-top: 5px;
    }
    .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 .gauche p,.about .droite p{
       font-size: 18px;
     }
     .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;
     }
     .principal .p1{
       text-align: left;
       padding: 2%;
     }
       .about .valeur .a1,.about .valeur .a2,.about .valeur .a3,
       .about .valeur .a4{
         width: 100%;
         height: auto;
       }
         .about .droite .liste{
           margin-top: 20px;
         }
         .slider{
         margin-top:150px;}
         .actualite .more{
         width:60%;}
         .fixe{
         position:inherit;
         }
         .slider,.slider1{
         margin-top:0;}
         .about .
         {
         width:100%;}
         .line-one .reseaux_sociaux{
           width: 100%;
         }
         .line-one .reseaux_sociaux table{
           width: 100%;
         }
         .about aside{
         width: 100%;
         }
         .about aside .image{
         height:auto;
         }
         .about aside .g{

                    width:100%;

                   }
                   .about aside .d{

                    width:100%;

                   }
                        /* mises à jour du 04 mai 2020*/
         .rapport{
           width: 50%;

         }



         .rapport p{

           font-size: 11px;

         }
         .about1{

           padding-left: 2%;
           padding-right: 2%;

         }
         .about1 .posts1 aside{
           width: 100%;

         }

           .about1 .posts1 aside .cadre1{
             height: auto;

           }

         .about1 .posts1 aside .cadre2{
           height: auto;

         }



           .about1 .posts1 aside .texte a,
           .about1 .posts1 aside .texte3 a,
           .about1 .posts1 aside .texte1 a{

             width: 80%;

           }


           .about .flottant{
             width:100%;
             float:left;
             padding:2%;
             box-sizing:border-box;

           }
           .about .flottant aside{

           height:auto;

           }
              .about .flottant aside .image{

           height:auto;

              }
              .about .flottant aside .g{

               width:100%;

           padding:5px;

              }
              .about .flottant aside .d{

               width:100%;

           padding-left:2%;
           padding-top:7px;
           height:auto;
           overflow-y:inherit;
              }
              .produit aside{
                width: 50%;
              }
              .produit aside .prod{

              }

                 }