@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@800&display=swap");
/*
body {
  font-family: "Montserrat", sans-serif;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  display: flex;
  min-height: 100vh;
  color: #100c0d;
  background-color: #adea74;
}*/
.main-container {
  display: flex;
  width: 100%;
}
.scroll-container {
  flex-grow: 1;
  overflow: hidden;
}
.text-row {
  white-space: nowrap;
  padding: 10px 0;
  display: flex;
  align-items: center;
  background-color: #fef5ee;
  border-top: 1px solid rgb(230, 230, 230);  
}
.infinite-scroll {
  display: flex;
  animation: scroll 40s linear infinite;
}
.text-scroll {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.text-item {
  font-size: 11px;
  font-weight: 600;
  color: var(--color-base-Negro);
}
.star {
  font-size: 16px;
  margin: 0px 30px;
  color: var(--color-base-Negro);
}


/*********************************************************/
/*   SLIDER OFERTAS                                      */
/*********************************************************/


.main-container-ofertas {
  display: flex;
  justify-content: center;
  width: 96.5%;
  margin: 0px 20px;
  overflow: hidden;
	mask-image: linear-gradient(to right,
			rgba(0, 0, 0, 0),
			rgba(0, 0, 0, 1) 10%,
			rgba(0, 0, 0, 1) 95%,
			rgba(0, 0, 0, 0));
	-webkit-mask-size: contain;
	mask-size: contain;
	mask-repeat: no-repeat;
}


.scroll-container-ofertas {
  flex-grow: 1;
  overflow: hidden;
}
.text-row-ofertas {
  white-space: nowrap;
  padding: 10px 0;
  display: flex;
  align-items: center;
  /* background: linear-gradient(135deg, #FF0080, #FF8C00, #F9F871); /* Atardecer electrico */
  /* background: linear-gradient(to right, #00C6FF, #0072FF, #8E2DE2); /* Aurora Neon */
  /* background: linear-gradient(45deg, #11998e, #38ef7d); /* Esmeralda Vibrante */
  /* background: linear-gradient(to bottom, #CC2B5E, #753A88); /* Ocaso Frio */

  /* background: -webkit-linear-gradient(90deg,#ffc800,#d60303); /* Chrome 10-25, Safari 5.1-6 */ 
  /* background: linear-gradient(90deg,#ffc800,#d60303); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

  /* background: linear-gradient(135deg, #ff007f 0%, #ff758c 50%, #ffc371 100%); /* Amanecer Neon */
  /* background: linear-gradient(to right, #0575e6, #00f260); /* Oceano Profundo */
  /* background: linear-gradient(to bottom right, #b92b27, #1565c0); /*Atardecer Ácido */
  /* background: linear-gradient(to top left, #3a1c71, #d76d77, #ffaf7b); /* Cristal Galáctico */

  
  /*background: -webkit-linear-gradient(90deg,#4a0194,#992fc4,#e75af4);*/ /* Chrome 10-25, Safari 5.1-6 */ 
  /*background: linear-gradient(90deg,#4a0194,#992fc4,#e75af4);*/ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  /*border-top: 1px solid rgb(230, 230, 230);  */
  border-bottom: 1px solid rgb(from var(--color-base-Negro) r g b / 10%);
  box-shadow: 0px 0px 10px 1px rgb(from var(--color-base-Negro) r g b / 90%);
  animation: animation-text-ofertas 60s ease-in-out infinite;
}
@keyframes animation-text-ofertas {
  0% {
    background: #EDE9E6;   
    color: var(--color-base-Negro);
  }
  20% {
    background: #E5EEE4;   
    color: var(--color-base-Negro);
  }
  30% {
    background: #FFF8DE;
    color: var(--color-base-Negro);   
  }
  40% {
    background: #E8F9FF;    
    color: var(--color-base-Negro);   
  }
  50% {
    background: #F6FFDC;
    color: var(--color-base-Negro);    
  }
  60% {
    background: #F3E4C9;
    color: var(--color-base-Negro);    
  }
  70% {
    background: #FBEFEF;
    color: var(--color-base-Negro);
  }
  80% {
    background: #F1F3E0;
    color: var(--color-base-Negro);
  }
  90% {
    background: #E8F9FF;
    color: var(--color-base-Negro);
  }
  100% {
    background: #FFFBF1;
    color: var(--color-base-Negro);
  }

} 


.infinite-scroll-ofertas {
  display: flex;
  animation: scroll-ofertas 60s linear infinite;
}
.text-scroll-ofertas {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.text-item-ofertas{
  font-size: 11px;
  font-weight: 600; 
  /*color: var(--color-base-Negro);*/
}
.star-ofertas {
  font-size: 16px;
  margin: 0px 30px;
  /*color: var(--color-base-Negro);*/
}
@keyframes scroll-ofertas {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}














/*********************************************************/

.main-container-li-intro {
  display: flex;
  width: 100%;
}
.scroll-container-li-intro {
  flex-grow: 1;
  overflow: hidden;
}
.text-row-li-intro {
  white-space: nowrap;
  padding: 10px 0;
  display: flex;
  align-items: center;
  background-color: #ffe5e5;
  border-top: 1px solid rgb(230, 230, 230);  
}
.infinite-scroll-li-intro {
  display: flex;
  animation: scrollliintro 40s linear infinite;
}
.text-scroll-li-intro {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.text-item-li-intro {
  font-size: 11px;
  font-weight: 600;
  color: var(--color-base-Negro);
}
.star-li-intro {
  font-size: 16px;
  margin: 0px 30px;
  color: var(--color-base-Negro);
}
@keyframes scrollliintro {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}







.vertical-scroll-container {
  width: 200px;
  background-color: #fef5ee;
}

.vertical-infinite-scroll {
  display: flex;
  flex-direction: column;
  animation: scrollVertical 25s linear infinite;
}

.vertical-text-scroll {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

.vertical-text-item {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 1rem;
  font-weight: 800;
  margin: 30px 0;
}

@keyframes scrollVertical {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}