body{
    margin: 0%;
    background-color: #000;
}
    .logo{
      display: flex;
      position: absolute;
      left: 100px;
  border-radius: 45px;
    }

    footer {
        text-align: center;
        justify-content: center;
        padding: 5px;
        background: linear-gradient(#000, #222);
      }
      
      footer p{
        color: #fff;
      }


      .img-hover-wrap {
        position: relative;
        overflow: hidden;
        border-radius: 8px;
      }
      
      .img-hover-wrap img {
        transition: transform 0.3s ease, filter 0.3s ease;
        display: block;
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
      }
      
      .img-hover-wrap:hover img {
        transform: scale(1.05);
        filter: blur(2px) brightness(0.8);
      }
      
      .hover-overlay {
        position: absolute;
        top: 0; left: 0;
        width: 100%; height: 100%;
        background: rgba(0, 0, 0, 0.6);
        backdrop-filter: blur(4px);
        opacity: 0;
        transition: opacity 0.3s ease;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 20px;
      }
      
      .img-hover-wrap:hover .hover-overlay {
        opacity: 1;
      }
      
      .hover-text h2, .hover-text p {
        color: white;
        margin-bottom: 10px;
      }
      
      .hover-text .btn {
        background-color: black;
        color: white;
        border: none;
        transition: background 0.2s ease;
      }
      
      .navbar-toggler-icon{
  filter: invert(1);
}
.dropdown-divider {
  filter: invert(1);
}

      .hover-text .btn:hover {
        background-color: #333;
      }
      
      .retour a{
        text-decoration: none;
        color: blue;
      }
      
      .retour a:hover {
        text-decoration: underline;
        color: #0000aa;
      }

      #feuille
      {
      width: 1080px;
      margin:0 auto;
      text-align: center;
      background-color: white;
      box-shadow: inset 10px 10px 12px #222,
                      inset -10px -10px 12px #222;
      }
      
      #milieu{
        width: 800px;
        margin: 0 auto;
      }

      /* From Uiverse.io by Allyhere */ 
.btn-donate {
    --clr-font-main: hsla(0 0% 20% / 100);
    --btn-bg-1: rgb(105, 105, 105);
    --btn-bg-2: rgb(12, 12, 12);
    --btn-bg-color: hsla(360 100% 100% / 1);
    --radii: 0.5em;
    cursor: pointer;
    padding: 0.9em 1.4em;
    min-width: 120px;
    min-height: 44px;
    font-size: var(--size, 1rem);
    font-weight: 500;
    transition: 0.8s;
    background-size: 280% auto;
    background-image: linear-gradient(
      325deg,
      var(--btn-bg-2) 0%,
      var(--btn-bg-1) 55%,
      var(--btn-bg-2) 90%
    );
    border: none;
    border-radius: var(--radii);
    color: var(--btn-bg-color);
    box-shadow:
      0px 0px 20px rgba(120, 120, 120, 0.5),
      0px 5px 5px -1px rgba(20, 20, 20, 0.25),
      inset 4px 4px 8px rgba(130, 130, 130, 0.5),
      inset -4px -4px 8px rgba(18, 18, 18, 0.35);
  }
  
  .btn-donate:hover {
    background-position: right top;
  }
  
  .btn-donate:is(:focus, :focus-visible, :active) {
    outline: none;
    box-shadow:
      0 0 0 3px var(--btn-bg-color),
      0 0 0 6px var(--btn-bg-2);
  }
  
  @media (prefers-reduced-motion: reduce) {
    .btn-donate {
      transition: linear;
    }
  }