.pharcie {
     border: 3px solid #33A02C;
     }
/* Version mobile */
 @media screen and (max-width: 767px){
.pharcie {
     border: 3px solid #33A02C;
  width:50%;
     }

}


/* Styles pour le titre */
.header-title {
    background-color: GreenYellow;
    text-align: center;
    color: black;
    font-weight: bold;
    font-size: 24px;
    padding: 20px 0;
    margin-bottom: 20px;
}
/* Styles pour les cadres */
.info-boxouaga3 {
    border-radius: 15px;
    box-shadow: 5px 5px 10px lightgreen;
    border: 2px solid #D2FFD2;
    padding: 20px;
    background-color: white;
    transition: all 0.3s ease;
    max-width: 250px;
    margin: 10px auto;
    height:255px;
    margin-left:20px;
}
/* Ajustement pour l'icône */
.info-iconouaga3 {
  max-width: 8%;
  margin-bottom: 15px; margin-left:40%;
}
/* Titre du cadre */
.info-titleouaga3{
  line-height: 1.2;
  font-size:20px;
  color: #4A4A4A;
  margin: 10px 0;
}
/* Description du cadre */
.info-descriptionouaga3, .info-contactouaga3 {
  font-size: 14px;
  color: #666666;
 
}
/* Effet de hover */
.info-boxouaga3:hover {
  box-shadow: 5px 5px 15px limegreen;
  transform: translateY(-5px);
}
@media (max-width: 767.98px) {
  /* Pour les petits écrans */
  .info-boxouaga3 {
    max-width: 300px;margin-left:15px;margin-right:15px;
  }
}

    .cadre-custom {
            background-color: #fff;
            border-radius: 8px;
            /* Ombre verte */
            box-shadow:4px 4px 4px 4px #EFEFEF; 
            /**box-shadow:4px 4px 4px 4px black !important;*/
            padding: 20px;
            height: auto;
            margin-left: 35px;
            margin-right: 35px;
        }
        .cadre-custom:hover {
            /*background-color:rgba(0, 255, 0, 0.5);*/
            background-color:#EFEFEF;
            border-radius: 8px;
            box-shadow:10px 10px 4px 4px rgba(0, 255, 0, 0.5);
            padding: 20px;
            height: auto;
            margin-left: 35px;
            margin-right: 35px;
        }
        
        .titre{
           font-size:20px;
           background-color: rgba(251, 251, 87, 0.8);
           text-align: center !important;
        }
        .date-container {
            background-color: rgba(251, 251, 87, 0.8);
            border-radius: 10px;
            padding: 10px;
            margin-bottom: 10px;
            /*text-align: center !important;*/
        }
        .download-link {
            color: #007bff;
            text-decoration: none;
            font-weight: bold;
        }
        .download-link:hover {
            text-decoration: underline;
        }

@media (max-width: 767px) { /* Ajustement pour les téléphones */
    .cadre-custom {
        margin-left: 40px; /* Ajustez cette valeur selon vos besoins */
        margin-top: -31px;
    }
 .titre{
    font-size:20px;
   }
}
.containeurre{
    align-items: center;
    justify-content: center;
}
.cardee {
    width: 300px;margin-bottom:60px;
    height: 200px;
    border-radius: 15px;
    box-shadow: 5px 5px 5px 5px lightgreen;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px;margin-left:64px;
    box-sizing: border-box;
    transition: transform 0.3s ease, background-color 0.3s ease; /* Ajout de la transition de couleur */
}

/* Effet lors du survol de la carte */
.cardee:hover {
    transform: scale(1.05); /* Agrandit la carte */
    background-color: #f0fff0; /* Change la couleur de fond lors du survol */
}

/* Styles pour l'image et le titre */
.cardee img {
    max-width: 60px; /* Taille de l'icône */
    margin-bottom: 10px;
}

.cardee h2 {
    font-size: 20px;
    color: #333;
    margin: 0;
}

/* Version mobile */
 @media screen and (max-width: 767px){
    .containeurre{
        flex-direction: column;
        align-items: center;
        margin-left: -22px;
       }
    cardee {
        width: 78%; /* Largeur ajustée sur mobile */
        margin-bottom: 15px;
        margin-left:62px;
    }
}
  .entete { 
        background-color: #33A02C;
        padding-bottom: 20px;
    }

    .containeur1 {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 80px;
        margin-top: 20px;
    }

    .item {
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 250px;
        text-align: center;
    }

    .texte1 {
        color: #33A02C;
        margin: 10px 0;
        font-size: 22px;
        font-weight: bold;
    }

    .image {
        display: flex;
        justify-content: center;
        margin-bottom: 10px;width: 35%;
    }

    .img1{
        max-width: 65%;
        height: auto;
        border-radius: 10px;
    }

    .boxcadre1{
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        border-radius: 15px;
        box-shadow: 0 4px 6px rgba(0, 255, 0, 0.5);
        margin-top: -54px;
    }

         .boxcadr1{
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        border-radius: 15px;
        box-shadow: 0 4px 6px rgba(0, 255, 0, 0.5);
        margin-top: -44px;
    }


    p {
        margin: 10px 0;
    }

    a {
        color: #33A02C;
        text-decoration: none;
        font-weight: bold;
        display: inline-block; /* Assure que l'élément est cliquable */
    }

    @media (max-width: 767px) {
     .boxcadre1{
          width: 88%;
          margin-left:11px;
      }
      .boxcadr1{
          width: 88%;
          margin-left:11px;
           margin-top:-69px;
      }
        .item {
            max-width: 100%;
        }
        .texte1 {
            margin-top: 2px;font-size:20px;
        }
      .containeur1 {
         gap: 18px;
      }
    }