/* For the minign EDS package*/

/* Transparent scrollbar for Chrome, Edge, Safari, Opera */
/* .transparent-scroll::-webkit-scrollbar {
  width: 0.5vw;
  height: 1%;
}
.transparent-scroll::-webkit-scrollbar-thumb {
  background: black; 
} */
/* .transparent-scroll::-webkit-scrollbar-track {
  background: black; 
  height: 1vw;
} */

/* Firefox */
.transparent-scroll {
  scrollbar-width: thin;
  scrollbar-color: white transparent;
}

/* Internet Explorer & Edge (old versions) */
/* .transparent-scroll {
  -ms-overflow-style: none;
} */

#arrowIcon {
  transition: transform 1s ease-in-out;
}

#arrowIcon1 {
  transition: transform 1s ease-in-out;
}

/*  Slider 1 */

.slidecontainer {
  display: flex;
  height: 0.5vw;
  width: 100%;
  border: 0.13vw solid #e3e8fc4d;
  border-radius: 1vw;
}

.slider1 {
  -webkit-appearance: none;
  width: 100%;
  height: 0.3vw;
  border-radius: 1vw;
  background: linear-gradient(to right,
      #121212 0%,
      #121212 var(--progress-start, 20%),
      #fdcb0a var(--progress-start, 20%),
      #fdcb0a var(--progress, 50%),
      #121212 var(--progress, 50%),
      #121212 100%);
  outline: none;
  opacity: 0.7;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}

.slider1::-moz-range-progress {
  background: #fdcb0a;
  height: 0.3vw;
  border-radius: 1vw;
  border: none;
}

.slider1::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

.slider1::-moz-range-thumb {
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

/* Slider 2 */

.slider2 {
  -webkit-appearance: none;
  width: 100%;
  height: 0.3vw;
  border-radius: 1vw;
  background: linear-gradient(to right,
      #121212 0%,
      #121212 var(--progress-start, 20%),
      #fdcb0a var(--progress-start, 20%),
      #fdcb0a var(--progress, 50%),
      #121212 var(--progress, 50%),
      #121212 100%);
  outline: none;
  opacity: 0.7;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}

.slider2::-moz-range-progress {
  background: #fdcb0a;
  height: 0.3vw;
  border-radius: 1vw;
  border: none;
}

.slider2::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

.slider2::-moz-range-thumb {
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

/* Slider 3 */

.slider3 {
  -webkit-appearance: none;
  width: 100%;
  height: 0.3vw;
  border-radius: 1vw;
  background: linear-gradient(to right,
      #121212 0%,
      #121212 var(--progress-start, 20%),
      #fdcb0a var(--progress-start, 20%),
      #fdcb0a var(--progress, 50%),
      #121212 var(--progress, 50%),
      #121212 100%);
  outline: none;
  opacity: 0.7;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}

.slider3::-moz-range-progress {
  background: #fdcb0a;
  height: 0.3vw;
  border-radius: 1vw;
  border: none;
}

.slider3::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

.slider3::-moz-range-thumb {
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

/* Slider 4 */

.slider4 {
  -webkit-appearance: none;
  width: 100%;
  height: 0.3vw;
  border-radius: 1vw;
  background: linear-gradient(to right,
      #121212 0%,
      #121212 var(--progress-start, 20%),
      #fdcb0a var(--progress-start, 20%),
      #fdcb0a var(--progress, 50%),
      #121212 var(--progress, 50%),
      #121212 100%);
  outline: none;
  opacity: 0.7;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}

.slider4::-moz-range-progress {
  background: #fdcb0a;
  height: 0.3vw;
  border-radius: 1vw;
  border: none;
}

.slider4::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

.slider4::-moz-range-thumb {
  width: 1vw;
  height: 1vw;
    background: url('../assets/sliderCircle.svg');
    cursor: pointer;
    z-index: 1;
    filter: none;
}

#investButton.opacity-0 {
  opacity: 0 !important;
}

#capital {
  text-transform: capitalize;
}

#maxPayoutTime {
  text-transform: capitalize;
}


/* Mobile View*/

.runningBorderReleaseMobile {
  width: 85.5vw;
  height: 9.7vw;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #121212;
  margin-top: 1.5%;
  margin-left: 6.5%;
  white-space: nowrap;
  border-radius: 8vw;
}

.runningBorderReleaseMobile::before {
  content: '';
  background-image: conic-gradient(#fdcb0a 80deg, transparent 120deg);
  width: 2000%;
  height: 2000%;
  position: absolute;
  animation: rotate 8s linear infinite;
  border-radius: 6vw;
}

.runningBorderReleaseMobile::after {
  content: '';
  width: 85vw;
  height: 8.85vw;
  background: #121212;
  position: absolute;
  border-radius: 8vw;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ff0052;
}



.runningBorderBoxMobileStage1 {
  width: 11.5vw;
  height: 10.9vw;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #121212;
  white-space: nowrap;
  border-radius: 0.7vw;
  z-index: 50;
}

.runningBorderBoxMobileStage1::before {
  content: '';
  background-image: conic-gradient(#fdcb0a 80deg, transparent 120deg);
  width: 500%;
  height: 500%;
  position: absolute;
  animation: rotate 8s linear infinite;

}

.runningBorderBoxMobileStage1::after {
  content: '';
  width: 10.8vw;
  height: 10.4vw;
  background: black;
  position: absolute;
  border-radius: 0.5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ff0052;
}

.runningBorderMobileStage1 {
  width: 30vw;
  height: 85vw;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 6vw;
  background: black;
  margin-top: 1.5%;
}

.runningBorderMobileStage1::before {
  content: '';
  background-image: conic-gradient(#fdcb0a 20deg, transparent 120deg);
  width: 350%;
  height: 350%;
  position: absolute;
  animation: rotate 8s linear infinite;
  border-radius: 2.2vw;
}

.runningBorderMobileStage1::after {
  content: '';
  width: 28.5vw;
  height: 83.7vw;
  background: #1C1C1C;
  position: absolute;
  border-radius: 5.5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ff0052;
}


.pulse-box1 {
  width: 90%;
  height: 6.5%;
  margin: 0 auto;
  background-color: #FDCB0A;
  box-shadow: 0px 0px 25.9483px #FDCB0A;
  border-radius: 1.4vw;
  animation: pulseOpacity1 3s infinite ease-in-out;
}

@keyframes pulseOpacity1 {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.8;
  }

  50% {
    opacity: 0.6;
  }

  75% {
    opacity: 0.3;
  }

  100% {
    opacity: 0.1;
  }
}

.custom-text-color {
  background: linear-gradient(
    90deg,
    #FDCB0A 0%,
    #FDCB0A 40%,
    #FFFFFF 50%,
    #FDCB0A 60%,
    #FDCB0A 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}