.bronze {
  color: #95782A;
}

.silver {
  color: #C0C0C0;
}

.gold {
  color: #ffd700;
}

.laurel-in-table {
  height: 25px;
  width: auto;
  margin-right: 5px;
}



/* Modal */
.custom-modal-podium {
  color: black;
  border-radius: 15px;
  overflow: hidden;
}

.custom-modal-podium.bronze {
  border: 4px solid #95782A;
}

.custom-modal-podium.silver {
  border: 4px solid #C0C0C0;
}

.custom-modal-podium.gold {
  border: 4px solid #ffd700;
}

.laurel-in-title-modal {
  height: 50px;
  width: auto;
}


/* Btn de la navbar */
.button-laurel {
  border: none;
  background: none;
  border-radius: 50%;
  padding: 5px;
  margin-left: 20px;
}

.button-laurel img {
  width: 50px;
}

/*.effect-button:hover {
  box-shadow: 0 4px 3px 1px #FCFCFC,
    0 6px 8px #D6D7D9,
    0 -4px 4px #CECFD1,
    0 -6px 4px #FEFEFE,
    inset 0 0 3px 3px #CECFD1;
}*/

.effect-button {
  box-shadow: 0 4px 3px 1px #FCFCFC,
    0 6px 8px #D6D7D9,
    0 -4px 4px #CECFD1,
    0 -6px 4px #FEFEFE,
    inset 0 0 3px 0 #CECFD1;
}

.button-laurel {
  position: relative;
  display: inline-block;
  /* Pour contenir l'image et le pseudo-élément ensemble */
  overflow: hidden;
  /* Empêcher le débordement de l'effet */
}

.shiny-image {
  display: block;
  width: 100%;
  /* Ajuste la taille selon tes besoins */
  height: auto;
  position: relative;
}

.button-laurel::before {
  content: "";
  position: absolute;
  top: -50%;
  /* Positionnement pour commencer hors de l'image */
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(120deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5));
  transform: rotate(30deg);
  /* Angle de la brillance */
  animation: shine 5s infinite;
}

@keyframes shine {
  0% {
    transform: translate(-100%, -100%) rotate(30deg);
    /* Commence hors de l'image */
  }

  50% {
    transform: translate(100%, 100%) rotate(30deg);
    /* Traverse l'image */
  }

  100% {
    transform: translate(300%, 300%) rotate(30deg);
    /* Sort de l'image */
  }
}

/* option {
  position: relative;
} */


/* Ajouter un cercle rouge simulé à gauche avec ::before */
/* option::before {
  content: "●";
  font-size: 16px;
  position: absolute;
  left: 5px;
  top: 5px;
  color: #ffd700;
} */


/* option .laurel.bronze::before {
  color: #95782A;
}

option .laurel.silver::before {
  color: #C0C0C0;
}

option .laurel.gold::before {
  color: #ffd700;
} */

#left-menu-laurel {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.486);
  margin-top: 40px;
}

#left-menu-laurel > div{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.laurel-in-menu-left {
  width: 20px;
  height: auto;
  margin: 5px;
}