.light-button button.bt {
    position: absolute;
    left: 40%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
  }
  @media (max-width: 1000px) {
    .light-button button.bt {
      position: absolute;
      left: 35%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  @media (max-width: 768px) {
    .light-button button.bt {
      position: absolute;
      left: 25%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  
  
  
  .light-button button.bt .button-holder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100px;
    background-color: #0a0a0a;
    border-radius: 5px;
    color: #0f0f0f;
    font-weight: 700;
    transition: 300ms;
    outline: #0f0f0f 2px solid;
    outline-offset: 20;
  }
  
  .light-button button.bt .button-holder svg {
    height: 50px;
    fill: #0f0f0f;
    transition: 300ms;
  }
  
  .light-button button.bt .light-holder {
    position: absolute;
    height: 200px;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .light-button button.bt .light-holder .dot {
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    background-color: #0a0a0a;
    border-radius: 10px;
    z-index: 2;
  }
  
  .light-button button.bt .light-holder .light {
    position: absolute;
    top: 0;
    width: 200px;
    height: 200px;
    clip-path: polygon(50% 0%, 25% 100%, 75% 100%);
    background: transparent;
  }
  
  .light-button button.bt:hover .button-holder svg {
    fill: rgba(88, 101, 242, 1);
  }
  
  .light-button button.bt:hover .button-holder {
    color: rgba(88, 101, 242, 1);
    outline: rgba(88, 101, 242, 1) 2px solid;
    outline-offset: 2px;
  }
  
  .light-button button.bt:hover .light-holder .light {
    background: rgb(255, 255, 255);
    background: linear-gradient(
      180deg,
      rgba(88, 101, 242, 1) 0%,
      rgba(255, 255, 255, 0) 75%,
      rgba(255, 255, 255, 0) 100%
    );
  }


  .light-button2 button.bt2 {
    position: absolute;
    left: 30%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
}
@media (max-width: 1000px) {
  .light-button2 button.bt2 {
    position: absolute;
    left: 20%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
}
}
@media (max-width: 768px) {
  .light-button2 button.bt2 {
    position: absolute;
    left: 1%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
}
}



  
.light-button2 button.bt2 .button-holder2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100px;
    background-color: #0a0a0a;
    border-radius: 5px;
    color: #0f0f0f;
    font-weight: 700;
    transition: 300ms;
    outline: #0f0f0f 2px solid;
    outline-offset: 20;
  }
  
  .light-button2 button.bt2 .button-holder2 svg {
    height: 50px;
    fill: #0f0f0f;
    transition: 300ms;
  }
  
  .light-button2 button.bt2 .light-holder2 {
    position: absolute;
    height: 200px;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .light-button2 button.bt2 .light-holder2 .dot2 {
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    background-color: #0a0a0a;
    border-radius: 10px;
    z-index: 2;
  }
  
  .light-button2 button.bt2 .light-holder2 .light2 {
    position: absolute;
    top: 0;
    width: 200px;
    height: 200px;
    clip-path: polygon(50% 0%, 25% 100%, 75% 100%);
    background: transparent;
  }
  
  .light-button2 button.bt2:hover .button-holder2 svg {
    fill: rgba(246 , 28, 13, 1);
  }
  
  .light-button2 button.bt2:hover .button-holder2 {
    color: rgba(246 , 28, 13, 1);
    outline: rgba(246 , 28, 13, 1) 2px solid;
    outline-offset: 2px;
  }
  
  .light-button2 button.bt2:hover .light-holder2 .light2 {
    background: rgb(255, 255, 255);
    background: linear-gradient(
      180deg,
      rgba(246 , 28, 13, 1) 0%,
      rgba(255, 255, 255, 0) 75%,
      rgba(255, 255, 255, 0) 100%
    );
  }

  .light-button3 button.bt3 {
    position: absolute;
    left: 50%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
  }
  @media (max-width: 1000px) {
    .light-button3 button.bt3 {
      position: absolute;
      left: 50%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  @media (max-width: 768px) {
    .light-button3 button.bt3 {
      position: absolute;
      left: 50%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  
  
  .light-button3 button.bt3 .button-holder3 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100px;
    background-color: #0a0a0a;
    border-radius: 5px;
    color: #0f0f0f;
    font-weight: 700;
    transition: 300ms;
    outline: #0f0f0f 2px solid;
    outline-offset: 20;
  }
  
  .light-button3 button.bt3 .button-holder3 svg {
    height: 50px;
    fill: #0f0f0f;
    transition: 300ms;
  }
  
  .light-button3 button.bt3 .light-holder3 {
    position: absolute;
    height: 200px;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .light-button3 button.bt3 .light-holder3 .dot3 {
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    background-color: #0a0a0a;
    border-radius: 10px;
    z-index: 2;
  }
  
  .light-button3 button.bt3 .light-holder3 .light3 {
    position: absolute;
    top: 0;
    width: 200px;
    height: 200px;
    clip-path: polygon(50% 0%, 25% 100%, 75% 100%);
    background: transparent;
  }
  
  .light-button3 button.bt3:hover .button-holder3 svg {
    fill: rgb(255, 255, 255);
  }
  
  .light-button3 button.bt3:hover .button-holder3 {
    color: rgb(255, 255, 255);
    outline: rgb(255, 255, 255) 2px solid;
    outline-offset: 2px;
  }
  
  .light-button3 button.bt3:hover .light-holder3 .light3 {
    background: rgb(255, 255, 255);
    background: linear-gradient(
      180deg,
      rgb(255, 255, 255) 0%,
      rgba(255, 255, 255, 0) 75%,
      rgba(255, 255, 255, 0) 100%
    );
  }

  .light-button4 button.bt4 {
    position: absolute;
    left: 60%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
    top: 15%; /* Place le bouton en haut de l'élément parent */
    height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
    display: flex;
    align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
    outline: none;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
  }
  @media (max-width: 1000px) {
    .light-button4 button.bt4 {
      position: absolute;
      left: 65%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  @media (max-width: 768px) {
    .light-button4 button.bt4 {
      position: absolute;
      left: 75%; /* Ajustez selon le besoin pour aligner le bouton horizontalement */
      top: 15%; /* Place le bouton en haut de l'élément parent */
      height: auto; /* Remplacez 0px par auto pour s'assurer que le bouton ait une hauteur naturelle */
      display: flex;
      align-items: center; /* Alignez le contenu du bouton au centre, si nécessaire */
      outline: none;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 2;
  }
  }
  
  
  .light-button4 button.bt4 .button-holder4 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100px;
    background-color: #0a0a0a;
    border-radius: 5px;
    color: #0f0f0f;
    font-weight: 700;
    transition: 300ms;
    outline: #0f0f0f 2px solid;
    outline-offset: 20;
  }
  
  .light-button4 button.bt4 .button-holder4 svg {
    height: 50px;
    fill: #0f0f0f;
    transition: 300ms;
  }
  
  .light-button4 button.bt4 .light-holder4 {
    position: absolute;
    height: 200px;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .light-button4 button.bt4 .light-holder4 .dot4 {
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    background-color: #0a0a0a;
    border-radius: 10px;
    z-index: 2;
  }
  
  .light-button4 button.bt4 .light-holder4 .light4 {
    position: absolute;
    top: 0;
    width: 200px;
    height: 200px;
    clip-path: polygon(50% 0%, 25% 100%, 75% 100%);
    background: transparent;
  }
  
  .light-button4 button.bt4:hover .button-holder4 svg {
    fill: rgb(255, 9, 33);
  }
  
  .light-button4 button.bt4:hover .button-holder4 {
    color: rgb(255, 9, 33);
    outline: rgb(255, 9, 33) 2px solid;
    outline-offset: 2px;
  }
  
  .light-button4 button.bt4:hover .light-holder4 .light4 {
    background: rgb(255, 255, 255);
    background: linear-gradient(
      180deg,
      rgb(255, 9, 33) 0%,
      rgba(255, 255, 255, 0) 75%,
      rgba(255, 255, 255, 0) 100%
    );
  }