.fullheight {
  min-height: 600px;
}

#__next {
  min-height: 100%;
  margin: 0; /* Ensure there's no margin */
  padding: 0; /* Ensure there's no padding */
}

[class^="number-slide"],
[class*=" number-slide"] {
  background: grey;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 50px;
  color: #fff;
  font-weight: 500;
  max-height: 647px;
  max-width: 647px;
  min-width: 647px;
  min-height: 647px;
}

.number-slide1 {
  background: rgb(64, 175, 255);
  background: linear-gradient(
    128deg,
    rgba(64, 175, 255, 1) 0%,
    rgba(63, 97, 255, 1) 100%
  );
  max-width: 647px;
}

.number-slide2 {
  background: rgb(255, 75, 64);
  background: linear-gradient(
    128deg,
    rgba(255, 154, 63, 1) 0%,
    rgba(255, 75, 64, 1) 100%
  );
  max-width: 647px;
}

.number-slide3 {
  background: rgb(182, 255, 64);
  background: linear-gradient(
    128deg,
    rgba(182, 255, 64, 1) 0%,
    rgba(63, 255, 71, 1) 100%
  );
  background: linear-gradient(
    128deg,
    rgba(189, 255, 83, 1) 0%,
    rgba(43, 250, 82, 1) 100%
  );
  max-width: 647px;
}

.number-slide4 {
  background: rgb(64, 255, 242);
  background: linear-gradient(
    128deg,
    rgba(64, 255, 242, 1) 0%,
    rgba(63, 188, 255, 1) 100%
  );
}

.number-slide5 {
  background: rgb(255, 64, 156);
  background: linear-gradient(
    128deg,
    rgba(255, 64, 156, 1) 0%,
    rgba(255, 63, 63, 1) 100%
  );
}

.number-slide6 {
  background: rgb(64, 76, 255);
  background: linear-gradient(
    128deg,
    rgba(64, 76, 255, 1) 0%,
    rgba(174, 63, 255, 1) 100%
  );
}

.is-coinbase {
  background: #0052ff url("");
  background-position: center;
  background-size: 90px;
  text-indent: -999px;
  overflow: hidden;
  min-width: 90px;
  border-color: transparent;
}

/* styles.css */

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
  color: #555;
  font-family: Arial, sans-serif;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 180px;
  background-color: rgba(0, 0, 0, 0.75);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  bottom: 125%; /* Position above the tooltip container */
  left: 50%;
  transform: translateX(-50%);

  /* Fade-in effect */
  opacity: 0;
  transition: opacity 0.3s;

  /* Arrow */
  pointer-events: none; /* Prevent tooltip from interfering with mouse events */
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%; /* At the bottom of tooltip */
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.75) transparent transparent transparent;
}

/* Show the tooltip text when hovering over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.avatar-group {
  position: relative; /* Needed for absolute positioning of .avatar-overlap */
  width: 70px; /* Just to illustrate the overlap; adjust as needed */
}

.avatar {
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}

/* Overlap the second avatar horizontally */
.avatar-overlap {
  position: absolute;
  top: 0;
  left: 45px; /* Adjust to control the overlap amount */
  z-index: 1; /* Ensure it appears on top if needed */
}