.border-c-zo {
  border-color: var(--bs-c-zo) !important;
}


.bg-c-zo {
  background-color: var(--bs-c-zo) !important;
}

.bg-c-0 {
  background-color: var(--bs-c-0) !important;
}

.bg-c-1 {
  background-color: var(--bs-c-1) !important;
}

.bg-c-2 {
  background-color: var(--bs-c-2) !important;
}

.bg-c-3 {
  background-color: var(--bs-c-3) !important;
}

.bg-c-4 {
  background-color: var(--bs-c-4) !important;
}

.bg-c-5 {
  background-color: var(--bs-c-5) !important;
}

.bg-c-6 {
  background-color: var(--bs-c-6) !important;
}

.bg-c-7 {
  background-color: var(--bs-c-7) !important;
}

.bg-c-8 {
  background-color: var(--bs-c-8) !important;
}

.bg-c-9 {
  background-color: var(--bs-c-9) !important;
}




.hover-c-zo:hover {
  color: var(--bs-c-zo) !important;
}

.hover-c-0:hover {
  color: var(--bs-c-0) !important;
}

.hover-c-1:hover {
  color: var(--bs-c-1) !important;
}

.hover-c-2:hover {
  color: var(--bs-c-2) !important;
}

.hover-c-3:hover {
  color: var(--bs-c-3) !important;
}

.hover-c-4:hover {
  color: var(--bs-c-4) !important;
}

.hover-c-5:hover {
  color: var(--bs-c-5) !important;
}

.hover-c-6:hover {
  color: var(--bs-c-6) !important;
}

.hover-c-7:hover {
  color: var(--bs-c-7) !important;
}

.hover-c-8:hover {
  color: var(--bs-c-8) !important;
}

.hover-c-9:hover {
  color: var(--bs-c-9) !important;
}

.hover-border-c-zo:hover {
  border: 1px solid #09ae9b !important;
}

.a-none {
  text-decoration: none;
  color: #404040;
}

.text-overflow {
  width: 85%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.w-10 {
  width: 10% !important;
}

.w-15 {
  width: 15% !important;
}

.w-20 {
  width: 20% !important;
}

.w-30 {
  width: 30% !important;
}

.w-35 {
  width: 35% !important;
}

.w-40 {
  width: 40% !important;
}

.w-45 {
  width: 45% !important;
}

.w-55 {
  width: 55% !important;
}

.w-60 {
  width: 60% !important;
}

.w-65 {
  width: 65% !important;
}

.w-70 {
  width: 70% !important;
}

.w-80 {
  width: 80% !important;
}

.w-85 {
  width: 85% !important;
}

.w-90 {
  width: 90% !important;
}

/* 0.3rem---0.2++ */
.rounded-4 {
  border-radius: 0.5rem !important;
}

.rounded-5 {
  border-radius: 0.7rem !important;
}

.rounded-6 {
  border-radius: 0.9rem !important;
}

.rounded-7 {
  border-radius: 1.1rem !important;
}

.rounded-8 {
  border-radius: 1.3rem !important;
}

.rounded-9 {
  border-radius: 1.5rem !important;
}

.opacity-1 {
  opacity: 0.9 !important;
}

.opacity-2 {
  opacity: 0.8 !important;
}

.opacity-3 {
  opacity: 0.5 !important;
}

.opacity-4 {
  opacity: 0.2 !important;
}

.opacity-5 {
  opacity: 0.1 !important;
}

.top-0 {
  top: 0 !important;
}

.ul-none {
  list-style: none !important;
  padding: 0 !important;
}

.size-8 {
  font-size: 0.5em !important;
}

.size-9 {
  font-size: 0.563em !important;
}

.size-10 {
  font-size: 0.625em !important;
}

.size-11 {
  font-size: 0.688em !important;
}

.size-12 {
  font-size: 0.75em !important;
}

.size-13 {
  font-size: 0.813em !important;
}

.size-14 {
  font-size: 0.875em !important;
}

.size-15 {
  font-size: 0.938em !important;
}

.size-16 {
  font-size: 1em !important;
}

.size-17 {
  font-size: 1.063em !important;
}

.size-18 {
  font-size: 1.125em !important;
}

.size-19 {
  font-size: 1.188em !important;
}

.size-20 {
  font-size: 1.25em !important;
}

.size-21 {
  font-size: 1.313em !important;
}

.size-22 {
  font-size: 1.375em !important;
}

.size-23 {
  font-size: 1.438em !important;
}

.size-24 {
  font-size: 1.5em !important;
}

.container-xxl {
  max-width: 1660px;
}

.col-my-5 {
  width: 20%;
}

.btn-primary {
  color: #fff;
  background-color: var(--bs-c-zo);
  border-color: var(--bs-c-zo)
}

.btn-primary:hover {
  color: #fff;
  background-color: #09ae9b;
  border-color: #09ae9b;
}

.navbar-dark .navbar-nav .show>.nav-link,
.navbar-dark .navbar-nav .nav-link.active {
  color: var(--bs-c-zo) !important;
}