.funnel {
  width: 500px;
  min-width: 500px;
  max-width: 500px;
  z-index: -1 !important;
}

.funnel-r {
  width: 250px;
  max-width: 250px;
}

.funnel-level {
  text-align: center;
  color: #fff;
  padding: 10px 0;
  font-weight: bold;
  margin: 0 auto;
  clip-path: polygon(18% 0%, 82% 0%, 78% 100%, 22% 100%);
  height: 70px;
}

.funnel-level-r {
  text-align: center;
  padding: 10px 0;
  font-weight: bold;
  margin: 0 auto;
  height: 70px;
}

.level-1 {
  background-color: #00308f;
  width: 100%;
}

.level-2 {
  background-color: #0643a5;
  width: 87%;
}

.level-3 {
  background-color: #0c56bc;
  width: 76%;
}

.level-4 {
  background-color: #126ad2;
  width: 66%;
}

.level-5 {
  background-color: #187de9;
  width: 57%;
}

/* New Levels */
.level-6 {
  background-color: #1e90ff;
  width: 50%;
}

.level-7 {
  background-color: #42a5ff;
  width: 44%;
}

.funnel-levels {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.funnel-level div {
  margin-top: 1px;
}

.funnel-title {
  margin-bottom: 5px;
}

.level-title {
  font-size: 14px;
  font-weight: 600;
}

.level-number {
  font-size: 28px;
  font-weight: 400;
}

.funnel-end {
  background-color: #42a5ff;
  width: 120%;
  text-align: center;
  padding: 7px 0;
  color: #fff;
  clip-path: polygon(40% 0%, 60% 0%, 50% 100%);
}

.funnel-end-yellow {
  background-color: #1e90ff;
  width: 140%;
  text-align: center;
  padding: 7px 0;
  color: #fff;
  clip-path: polygon(40% 0%, 60% 0%, 50% 100%);
}

.level-r {
  width: 100%;
}

.level-title-r {
  font-size: 14px;
  font-weight: 600;
}

.level-number-r {
  font-size: 18px;
  font-weight: 600;
}