.promotion-box:hover .box-information {
  background-color: rgba(255, 255, 255, 0.8);
  transition: background-color 1s;

}

.promotion-box:hover .text-white {
  /*  color: black !important;*/
}

#padre_box_promo:hover {
  box-shadow: -10px 10px 20px rgba(0, 0, 0, 0.6) !important;
  transition: box-shadow 0.3s ease;
}


.promotion-box:hover .text-prize {
  color: #076633;
  transition: color 1s;
}

.promotion-box .text-shadow {
  text-shadow: 0px 0px 5px black;
}

.promotion-box .text-prize {
  text-shadow: 0px 0px 5px white;
}

.promotion-box .bg-white-st {
  background-color: rgba(255, 255, 255, 0.7);
}

.promotion-box .background-with-image {
  background-size: cover;
  background-position: right top;
}

@media (max-width: 1200px) {
  .promotion-box .box-information {
    background-color: rgba(255, 255, 255, 0.8);
  }

  .promotion-box .text-white {
    color: black !important;
    text-shadow: none !important;
  }

  .promotion-box .text-prize {
    color: #076633;
  }

  .promotion-box .text-category {
    background-color: white;
  }
}

.fondo-orion {
  background-color: #076633;
}

.nombre-categoria-promocion {
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 20px;
}

.promo-cats {
  height: 75px;
  overflow-y: auto;
}

.promo-cats::-webkit-scrollbar {
  width: 5px;
}

.promo-cats::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.158);
  border-radius: 2px;
}

.promo-cats::-webkit-scrollbar-thumb {
  background: rgb(202, 202, 202);
  border-radius: 3px;
}

.hoverable:hover {
  transform: scale(1.02);
}

.tarjeta-descuento .card-header {
  overflow: hidden;
  text-wrap: nowrap;
}

.bolt {
  transform: rotate(15deg);
  filter: drop-shadow(2px 2px 0px #a06000);
}

.reverse-bolt {
  transform: scale(-1, 1) rotate(15deg);
  filter: drop-shadow(2px 2px 0px #a06000);
}

.gradient-green {
  background-color: green;
  background-image: repeating-linear-gradient(
          45deg,
          #198754,
          #0f4d38 20px,
          #198754 20px,
          #0f4d38 100px
  );
}

.gradient-red {
  background-color: #bf1523;
  background-image: repeating-linear-gradient(
          45deg,
          darkred,
          #bf1523 20px,
          darkred 20px,
          #bf1523 100px
  );
}

.gradient-yellow {
  background-color: yellow;
  background-image: repeating-linear-gradient(
          45deg,
          orange,
          yellow 20px,
          orange 20px,
          yellow 100px
  );
}