i.fa-solid,
i.fa-light,
i.fa-regular {
  background-color: transparent !important;
}

i.fa-solid:hover,
i.fa-light:hover,
i.fa-regular:hover {
  background-color: transparent !important;
}

/* :root {
  font-family: "HKGP" !important;
  font-weight: 400;
}

body {
  background: #000 !important;
  font-family: "HKGP" !important;
  font-weight: 400;
} */

/* Font Weights */
.fw-light,
.fw-300 {
  font-weight: 300;
}

.fw-normal,
.fw-400 {
  font-weight: 400;
}

.fw-medium,
.fw-500 {
  font-weight: 500;
}

.fw-semibold,
.fw-600 {
  font-weight: 600;
}

.fw-bold,
.fw-700 {
  font-weight: 700;
}

.fw-bolder,
.fw-900 {
  font-weight: 900;
}

.btn span {
  font-family: "HKGP";
  font-weight: 700;
}
/* Letter Spacing Classes */
.ls-em-01 {
  letter-spacing: 0.1em !important;
}
.ls-em-006 {
  letter-spacing: 0.06em !important;
}
.ls-px-096 {
  letter-spacing: 0.96px !important;
}
.ls-px-12 {
  letter-spacing: 1.2px !important;
}
.ls-px-112 {
  letter-spacing: 1.12px !important;
}
/* End */
/*defaults fonts*/
.fs-1 {
  font-size: 2.8rem !important;
  line-height: 3.2rem !important;
}

.fs-2 {
  font-size: 2rem !important;
  line-height: 2.4rem !important;
}

.fs-3 {
  font-size: 1.6rem !important;
  line-height: 2rem !important;
}

.fs-4 {
  font-size: 1.2rem !important;
  line-height: 1.6rem !important;
}

.fs-5 {
  font-size: 1rem !important;
  line-height: 1.6rem !important;
}

.fs-6 {
  font-size: 0.8rem !important;
  line-height: 1.2rem !important;
}

.fs-7 {
  font-size: 0.7rem !important;
  line-height: 0.8rem !important;
}

.fs-8 {
  font-size: 0.6rem !important;
  line-height: 0.8rem !important;
}

.fs-9 {
  font-size: 0.5rem !important;
  line-height: 0.6rem !important;
}
ul {
  list-style: disc;
}
.footer-links ul,
ul.navbar-nav {
  list-style: none !important;
}
.list-unstyled {
  list-style: none !important;
}
/* @media (min-width: 2560px) {
  .container-pf-fluid{
    width: 100%;
  }
} */
@media (max-width: 767.5px) {
  html,
  body,
  .canvas {
    font-size: 3.846vw !important;
  }

  .container-pf-mini,
  .container-pf,
  .container-pf-v2,
  .container-pf-blogs,
  .container-pf-fluid {
    width: 100% !important;
  }
  .container-pf-fluid {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }

  /* Default Fonts for Mobile */
  .display-3 {
    font-size: 3.5rem !important;
    line-height: 4rem !important;
  }

  h1,
  .h1,
  .fs-1 {
    font-size: 2.5rem !important;
    line-height: 3rem !important;
  }

  h2,
  .h2,
  .fs-2 {
    font-size: 2rem !important;
    line-height: 2.5rem !important;
  }

  h3,
  .h3,
  .fs-3 {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
  }

  h4,
  .h4,
  .fs-4 {
    font-size: 1.25rem !important;
    line-height: 2rem !important;
  }

  h5,
  .h5,
  .fs-5 {
    font-size: 1rem !important;
    line-height: 1.5rem !important;
  }

  h6,
  .h6,
  .fs-6 {
    font-size: 0.88rem !important;
    line-height: 1rem !important;
  }

  p {
    font-size: 1rem !important;
    line-height: 1.5rem !important;
  }

  .fs-9 {
    font-size: 0.5rem !important;
    line-height: 0.75rem !important;
  }

  .fs-8 {
    font-size: 0.626rem !important;
    line-height: 0.75rem !important;
  }

  .fs-7 {
    font-size: 0.75rem !important;
    line-height: 1rem !important;
  }

  .fs-6 {
    font-size: 0.88rem !important;
    line-height: 1rem !important;
  }

  .fs-5 {
    font-size: 1rem !important;
    line-height: 1.5rem !important;
  }

  .fs-4 {
    font-size: 1.25rem !important;
    line-height: 2rem !important;
  }

  .fs-3 {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
  }

  .fs-2 {
    font-size: 2rem !important;
    line-height: 2.5rem !important;
  }

  .fs-1 {
    font-size: 2.5rem !important;
    line-height: 3rem !important;
  }
}
/* .container-pf-blogs{
  max-width: 808px;
  width: 100% !important;
} */
@media (min-width: 768px) {
  /* Letter Spacing */
  .ls-em-md-01 {
    letter-spacing: 0.1em !important;
  }
  .ls-em-md-006 {
    letter-spacing: 0.06em !important;
  }
  .ls-px-md-096 {
    letter-spacing: 0.96px !important;
  }
  .ls-px-md-12 {
    letter-spacing: 1.2px !important;
  }
  .ls-px-md-112 {
    letter-spacing: 1.12px !important;
  }
  /* font weights */
  .fw-md-light {
    font-family: "HKGP" !important;
    font-weight: 300;
  }
  .fw-md-normal {
    font-family: "HKGP" !important;
    font-weight: 400;
  }
  .fw-md-medium {
    font-family: "HKGP" !important;
    font-weight: 500;
  }
  .fw-md-semibold {
    font-family: "HKGP" !important;
    font-weight: 600;
  }
  .fw-md-bold {
    font-family: "HKGP" !important;
    font-weight: 700;
  }
  .fw-md-bolder {
    font-family: "HKGP900" !important;
    font-weight: 900;
  }

  /* Default Fonts for desktop */
  .display-3 {
    font-size: 4rem !important;
    line-height: 4rem !important;
  }

  h1,
  .h1 {
    font-size: 2.8rem !important;
    line-height: 3.2rem !important;
  }

  h2,
  .h2 {
    font-size: 2rem !important;
    line-height: 2.4rem !important;
  }

  h3,
  .h3 {
    font-size: 1.6rem !important;
    line-height: 2rem !important;
  }

  h4,
  .h4 {
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
  }

  h5,
  .h5 {
    font-size: 1rem !important;
    line-height: 1.6rem !important;
  }

  h6,
  .h6 {
    font-size: 0.8rem !important;
    line-height: 1.2rem !important;
  }

  p {
    font-size: 1rem !important;
    line-height: 1.6rem !important;
  }

  .fs-md-1 {
    font-size: 2.8rem !important;
    line-height: 3.2rem !important;
  }

  .fs-md-2 {
    font-size: 2rem !important;
    line-height: 2.4rem !important;
  }

  .fs-md-3 {
    font-size: 1.6rem !important;
    line-height: 2rem !important;
  }

  .fs-md-4 {
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
  }

  .fs-md-5 {
    font-size: 1rem !important;
    line-height: 1.6rem !important;
  }

  .fs-md-6 {
    font-size: 0.8rem !important;
    line-height: 1.2rem !important;
  }

  .fs-md-7 {
    font-size: 0.7rem !important;
    line-height: 0.8rem !important;
  }

  .fs-md-8 {
    font-size: 0.6rem !important;
    line-height: 0.8rem !important;
  }

  .fs-md-9 {
    font-size: 0.5rem !important;
    line-height: 0.6rem !important;
  }

  /* Ending */
}

/* Buttons Defined Hovers and Clicked States According to the Base Figma styles file || https://www.figma.com/file/YNyWvFF7twQ3z39axivrkt/Creative-Solutions-BASE-STYLES?type=design&node-id=658-2&t=OsjB8aZJaBwpGuOk-0 ||*/

/* ----- linear gradien hover and active bg for all solid buttons  */

.btn-black {
  color: #dcdcde;
}
.btn-black:hover {
  color: #dcdcde !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #000 !important;
}

.btn-black:active {
  color: #dcdcde !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #000 !important;
}

.btn-black.disabled,
.btn-black[disabled] {
  color: #dcdcde !important;
  border-color: transparent;
  opacity: 0.25;
  background: #000000;
}

.btn-gray-1:hover {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #f4f5f7 !important;
}

.btn-gray-1:active {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #f4f5f7 !important;
}
.btn-gray-1.disabled,
.btn-gray-1[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #f4f5f7;
}

.btn-gray-2:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #dcdcde !important;
}

.btn-gray-2:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #dcdcde !important;
}
.btn-gray-2.disabled,
.btn-gray-2[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #dcdcde;
}

.btn-gray-3:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #a2a2a3 !important;
}

.btn-gray-3:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #a2a2a3 !important;
}
.btn-gray-3.disabled,
.btn-gray-3[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #a2a2a3;
}

.btn-gray-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #545454 !important;
}

.btn-gray-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #545454 !important;
}
.btn-gray-4.disabled,
.btn-gray-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #545454;
}

.btn-gray-5:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #474747 !important;
}

.btn-gray-5:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #474747 !important;
}
.btn-gray-5.disabled,
.btn-gray-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #474747;
}

.btn-gray-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #333333 !important;
}

.btn-gray-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #333333 !important;
}
.btn-gray-6.disabled,
.btn-gray-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #333333;
}
.btn-gray-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #242424 !important;
}

.btn-gray-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #242424 !important;
}
.btn-gray-7.disabled,
.btn-gray-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #242424;
}

.btn-gray-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #191919 !important;
}

.btn-gray-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #191919 !important;
}
.btn-gray-8.disabled,
.btn-gray-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #191919;
}

.btn-gray-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #121212 !important;
}

.btn-gray-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #121212 !important;
}
.btn-gray-9.disabled,
.btn-gray-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #121212;
}

.btn-orange-1 {
  color: #242424 !important;
}
.btn-orange-1:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #f7d4ba !important;
}

.btn-orange-1:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #f7d4ba !important;
}
.btn-orange-1.disabled,
.btn-orange-1[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #f7d4ba;
}

.btn-orange-2 {
  color: #242424 !important;
}
.btn-orange-2:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #fba462 !important;
}

.btn-orange-2:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fba462 !important;
}
.btn-orange-2.disabled,
.btn-orange-2[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #fba462;
}
.btn-orange-3 {
  color: #242424 !important;
}
.btn-orange-3:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #fa6c00 !important;
}

.btn-orange-3:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fa6c00 !important;
}
.btn-orange-3.disabled,
.btn-orange-3[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #fa6c00;
}

.btn-orange-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #c45500 !important;
}

.btn-orange-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #c45500 !important;
}
.btn-orange-4.disabled,
.btn-orange-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #c45500;
}

.btn-orange-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #662c00 !important;
}

.btn-orange-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #662c00 !important;
}
.btn-orange-5.disabled,
.btn-orange-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #662c00;
}

.btn-orange-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #572600 !important;
}

.btn-orange-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #572600 !important;
}
.btn-orange-6.disabled,
.btn-orange-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #572600;
}
.btn-orange-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #471f00 !important;
}

.btn-orange-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #471f00 !important;
}
.btn-orange-7.disabled,
.btn-orange-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #471f00;
}

.btn-orange-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #3d1b00 !important;
}

.btn-orange-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #3d1b00 !important;
}
.btn-orange-8.disabled,
.btn-orange-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #3d1b00;
}

.btn-orange-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #1c0d00 !important;
}

.btn-orange-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #1c0d00 !important;
}
.btn-orange-9.disabled,
.btn-orange-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #1c0d00;
}

.btn-purple-1:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      var(--hover-1, rgba(255, 255, 255, 0.2)) 0%,
      var(--hover-1, rgba(255, 255, 255, 0.2)) 100%
    ),
    #7b62f2 !important;
}

.btn-purple-1:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      var(--click-1, rgba(255, 255, 255, 0.5)) 0%,
      var(--click-1, rgba(255, 255, 255, 0.5)) 100%
    ),
    #7b62f2 !important;
}

.btn-purple-2:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      var(--hover-1, rgba(255, 255, 255, 0.2)) 0%,
      var(--hover-1, rgba(255, 255, 255, 0.2)) 100%
    ),
    #8177b7 !important;
}

.btn-purple-2:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      var(--click-1, rgba(255, 255, 255, 0.5)) 0%,
      var(--click-1, rgba(255, 255, 255, 0.5)) 100%
    ),
    #8177b7 !important;
}

.btn-yellow-1 {
  color: #242424 !important;
}

.btn-yellow-1:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #f7eabc !important;
}

.btn-yellow-1:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #f7eabc !important;
}
.btn-yellow-1.disabled,
.btn-yellow-1[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #f7eabc;
}
.btn-yellow-2 {
  color: #242424 !important;
}
.btn-yellow-2:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fbda64 !important;
}

.btn-yellow-2:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #fbda64 !important;
}
.btn-yellow-2.disabled,
.btn-yellow-2[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #fbda64;
}
.btn-yellow-3 {
  color: #242424 !important;
}
.btn-yellow-3:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fac402 !important;
}

.btn-yellow-3:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #fac402 !important;
}
.btn-yellow-3.disabled,
.btn-yellow-3[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #fac402;
}

.btn-yellow-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #8f7001 !important;
}

.btn-yellow-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #8f7001 !important;
}
.btn-yellow-4.disabled,
.btn-yellow-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #8f7001;
}

.btn-yellow-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #665001 !important;
}

.btn-yellow-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #665001 !important;
}
.btn-yellow-5.disabled,
.btn-yellow-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #665001;
}

.btn-yellow-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #594601 !important;
}

.btn-yellow-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #594601 !important;
}
.btn-yellow-6.disabled,
.btn-yellow-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #594601;
}
.btn-yellow-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #4f3e01 !important;
}

.btn-yellow-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #4f3e01 !important;
}
.btn-yellow-7.disabled,
.btn-yellow-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #4f3e01;
}

.btn-yellow-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #403201 !important;
}

.btn-yellow-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #403201 !important;
}
.btn-yellow-8.disabled,
.btn-yellow-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #403201;
}

.btn-yellow-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #1c1601 !important;
}

.btn-yellow-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #1c1601 !important;
}
.btn-yellow-9.disabled,
.btn-yellow-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #1c1601;
}
.btn-blue-1:hover {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #badcf7 !important;
}

.btn-blue-1:active {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #badcf7 !important;
}
.btn-blue-1.disabled,
.btn-blue-1[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #badcf7;
}

.btn-blue-2:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #62b6fb !important;
}

.btn-blue-2:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #62b6fb !important;
}
.btn-blue-2.disabled,
.btn-blue-2[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #62b6fb;
}

.btn-blue-3:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #0089fa !important;
}

.btn-blue-3:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #0089fa !important;
}
.btn-blue-3.disabled,
.btn-blue-3[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #0089fa;
}

.btn-blue-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #006dc7 !important;
}

.btn-blue-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #006dc7 !important;
}
.btn-blue-4.disabled,
.btn-blue-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #006dc7;
}

.btn-blue-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #003866 !important;
}

.btn-blue-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #003866 !important;
}
.btn-blue-5.disabled,
.btn-blue-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #003866;
}

.btn-blue-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #003057 !important;
}

.btn-blue-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #003057 !important;
}
.btn-blue-6.disabled,
.btn-blue-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #003057;
}
.btn-blue-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #00294a !important;
}

.btn-blue-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #00294a !important;
}
.btn-blue-7.disabled,
.btn-blue-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #00294a;
}

.btn-blue-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #00223d !important;
}

.btn-blue-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #00223d !important;
}
.btn-blue-8.disabled,
.btn-blue-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #00223d;
}

.btn-blue-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #00182b !important;
}

.btn-blue-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #00182b !important;
}
.btn-blue-9.disabled,
.btn-blue-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #00182b;
}

.btn-indigo-1 {
  color: #fff !important;
}
.btn-indigo-1:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #c4d6fe !important;
}

.btn-indigo-1:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #c4d6fe !important;
}
.btn-indigo-1.disabled,
.btn-indigo-1[disabled] {
  color: #fff !important;
  border-color: transparent;
  opacity: 0.25;
  background: #c4d6fe;
}
.btn-indigo-2 {
  color: #fff !important;
}
.btn-indigo-2:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #83a2f7 !important;
}

.btn-indigo-2:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #83a2f7 !important;
}
.btn-indigo-2.disabled,
.btn-indigo-2[disabled] {
  color: #fff !important;
  border-color: transparent;
  opacity: 0.25;
  background: #83a2f7;
}

.btn-indigo-3:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #396af5 !important;
}

.btn-indigo-3:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #396af5 !important;
}
.btn-indigo-3.disabled,
.btn-indigo-3[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #396af5;
}

.btn-indigo-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #0b1ec7 !important;
}

.btn-indigo-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #0b1ec7 !important;
}
.btn-indigo-4.disabled,
.btn-indigo-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #0b1ec7;
}

.btn-indigo-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #061066 !important;
}

.btn-indigo-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #061066 !important;
}
.btn-indigo-5.disabled,
.btn-indigo-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #061066;
}

.btn-indigo-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #050d57 !important;
}

.btn-indigo-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #050d57 !important;
}
.btn-indigo-6.disabled,
.btn-indigo-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #050d57;
}
.btn-indigo-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #040b4a !important;
}

.btn-indigo-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #040b4a !important;
}
.btn-indigo-7.disabled,
.btn-indigo-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #040b4a;
}

.btn-indigo-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #04093d !important;
}

.btn-indigo-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #04093d !important;
}
.btn-indigo-8.disabled,
.btn-indigo-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #04093d;
}

.btn-indigo-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #040938 !important;
}

.btn-indigo-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #040938 !important;
}
.btn-indigo-9.disabled,
.btn-indigo-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #040938;
}

.btn-violet-1:hover {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #d9cdf7 !important;
}

.btn-violet-1:active {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #d9cdf7 !important;
}
.btn-violet-1.disabled,
.btn-violet-1[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #d9cdf7;
}

.btn-violet-2:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #8385ff !important;
}

.btn-violet-2:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #8385ff !important;
}
.btn-violet-2.disabled,
.btn-violet-2[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #8385ff;
}

.btn-violet-3:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #6760f5 !important;
}

.btn-violet-3:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #6760f5 !important;
}
.btn-violet-3.disabled,
.btn-violet-3[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #6760f5;
}

.btn-violet-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #430fc7 !important;
}

.btn-violet-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #430fc7 !important;
}
.btn-violet-4.disabled,
.btn-violet-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #430fc7;
}

.btn-violet-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #230866 !important;
}

.btn-violet-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #230866 !important;
}
.btn-violet-5.disabled,
.btn-violet-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #230866;
}

.btn-violet-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #1e0757 !important;
}

.btn-violet-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #1e0757 !important;
}
.btn-violet-6.disabled,
.btn-violet-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #1e0757;
}
.btn-violet-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #19064a !important;
}

.btn-violet-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #19064a !important;
}
.btn-violet-7.disabled,
.btn-violet-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #19064a;
}

.btn-violet-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #15053d !important;
}

.btn-violet-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #15053d !important;
}
.btn-violet-8.disabled,
.btn-violet-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #15053d;
}

.btn-violet-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #130438 !important;
}

.btn-violet-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #130438 !important;
}
.btn-violet-9.disabled,
.btn-violet-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #130438;
}

.btn-green-1 {
  color: #242424 !important;
}
.btn-green-1:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #dbf7be !important;
}

.btn-green-1:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #dbf7be !important;
}
.btn-green-1.disabled,
.btn-green-1[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #dbf7be;
}
.btn-green-2 {
  color: #242424 !important;
}
.btn-green-2:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #b1fb67 !important;
}

.btn-green-2:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #b1fb67 !important;
}
.btn-green-2.disabled,
.btn-green-2[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #b1fb67;
}
.btn-green-3 {
  color: #242424 !important;
}
.btn-green-3:hover {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #6fd904 !important;
}

.btn-green-3:active {
  color: #242424 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #6fd904 !important;
}
.btn-green-3.disabled,
.btn-green-3[disabled] {
  color: #242424 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #6fd904;
}

.btn-green-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #448503 !important;
}

.btn-green-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #448503 !important;
}
.btn-green-4.disabled,
.btn-green-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #448503;
}

.btn-green-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #346602 !important;
}

.btn-green-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #346602 !important;
}
.btn-green-5.disabled,
.btn-green-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #346602;
}

.btn-green-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #2a5202 !important;
}

.btn-green-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #2a5202 !important;
}
.btn-green-6.disabled,
.btn-green-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #2a5202;
}
.btn-green-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #244701 !important;
}

.btn-green-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #244701 !important;
}
.btn-green-7.disabled,
.btn-green-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #244701;
}

.btn-green-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #1f3d01 !important;
}

.btn-green-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #1f3d01 !important;
}
.btn-green-8.disabled,
.btn-green-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #1f3d01;
}

.btn-green-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #0d1a01 !important;
}

.btn-green-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #0d1a01 !important;
}
.btn-green-9.disabled,
.btn-green-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #0d1a01;
}

.btn-red-1:hover {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #f7c2ba !important;
}

.btn-red-1:active {
  color: #000;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #f7c2ba !important;
}
.btn-red-1.disabled,
.btn-red-1[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #f7c2ba;
}

.btn-red-2:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fb7662 !important;
}

.btn-red-2:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #fb7662 !important;
}
.btn-red-2.disabled,
.btn-red-2[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #fb7662;
}

.btn-red-3:hover {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #fa2100 !important;
}

.btn-red-3:active {
  color: #000 !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.7) 0%,
      rgba(255, 255, 255, 0.7) 100%
    ),
    #fa2100 !important;
}
.btn-red-3.disabled,
.btn-red-3[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #fa2100;
}

.btn-red-4:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.2) 0%,
      rgba(255, 255, 255, 0.2) 100%
    ),
    #cc1b00 !important;
}

.btn-red-4:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    #cc1b00 !important;
}
.btn-red-4.disabled,
.btn-red-4[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #cc1b00;
}

.btn-red-5:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #660e00 !important;
}

.btn-red-5:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #660e00 !important;
}
.btn-red-5.disabled,
.btn-red-5[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #660e00;
}

.btn-red-6:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #570c00 !important;
}

.btn-red-6:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #570c00 !important;
}
.btn-red-6.disabled,
.btn-red-6[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #570c00;
}
.btn-red-7:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #470a00 !important;
}

.btn-red-7:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #470a00 !important;
}
.btn-red-7.disabled,
.btn-red-7[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #470a00;
}

.btn-red-8:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #3d0800 !important;
}

.btn-red-8:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #3d0800 !important;
}
.btn-red-8.disabled,
.btn-red-8[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #3d0800;
}

.btn-red-9:hover {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #260500 !important;
}

.btn-red-9:active {
  color: #fff !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #260500 !important;
}
.btn-red-9.disabled,
.btn-red-9[disabled] {
  border-color: transparent;
  opacity: 0.25;
  background: #260500;
}
.btn-white {
  color: #333 !important;
}
.btn-white:hover {
  color: #333 !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%
    ),
    #ffffff !important;
}

.btn-white:active {
  color: #333 !important;
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.5) 100%
    ),
    #ffffff !important;
}
.btn-white.disabled,
.btn-white[disabled] {
  color: #333 !important;
  border-color: transparent;
  opacity: 0.25;
  background: #ffffff;
}

/* ----------- */

/*-- Outline Buttons --*/

.btn-outline-black:hover {
  color: #000;
  background: rgba(0, 0, 0, 0.2);
}

.btn-outline-black:active {
  color: #000 !important;
  background: rgba(0, 0, 0, 0.4);
}
.btn-outline-black.disabled,
.btn-outline-black[disabled] {
  color: #000 !important;
  opacity: 0.25;
}
.btn-outline-white:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
}

.btn-outline-white:active {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.4);
}
.btn-outline-white.disabled,
.btn-outline-white[disabled] {
  color: #fff !important;
  opacity: 0.25;
}

.btn-outline-gray-1:hover {
  color: #f4f5f7;
  background: rgba(0, 0, 0, 0.2);
}

.btn-outline-gray-1:active {
  color: #f4f5f7 !important;
  background: rgba(0, 0, 0, 0.4);
}
.btn-outline-gray-1.disabled,
.btn-outline-gray-1[disabled] {
  color: #f4f5f7 !important;
  opacity: 0.25;
}
.btn-outline-gray-2:hover {
  color: #dcdcde;
  background: rgba(220, 220, 222, 0.2);
}

.btn-outline-gray-2:active {
  color: #dcdcde !important;
  background: rgba(220, 220, 222, 0.4);
}
.btn-outline-gray-2.disabled,
.btn-outline-gray-2[disabled] {
  color: #dcdcde !important;
  opacity: 0.25;
}
.btn-outline-gray-3:hover {
  color: #a2a2a3;
  background: rgba(162, 162, 163, 0.2);
}

.btn-outline-gray-3:active {
  color: #a2a2a3 !important;
  background: rgba(162, 162, 163, 0.4);
}
.btn-outline-gray-3.disabled,
.btn-outline-gray-3[disabled] {
  color: #a2a2a3 !important;
  opacity: 0.25;
}
.btn-outline-gray-4:hover {
  color: #545454;
  background: rgba(84, 84, 84, 0.2);
}

.btn-outline-gray-4:active {
  color: #545454 !important;
  background: rgba(84, 84, 84, 0.4);
}
.btn-outline-gray-4.disabled,
.btn-outline-gray-4[disabled] {
  color: #545454 !important;
  opacity: 0.25;
}
.btn-outline-gray-5:hover {
  color: #474747;
  background: rgba(71, 71, 71, 0.2);
}

.btn-outline-gray-5:active {
  color: #474747 !important;
  background: rgba(71, 71, 71, 0.4);
}
.btn-outline-gray-5.disabled,
.btn-outline-gray-5[disabled] {
  color: #474747 !important;
  opacity: 0.25;
}
.btn-outline-gray-6:hover {
  color: #333333;
  background: rgba(51, 51, 51, 0.2);
}

.btn-outline-gray-6:active {
  color: #333333 !important;
  background: rgba(51, 51, 51, 0.4);
}
.btn-outline-gray-6.disabled,
.btn-outline-gray-6[disabled] {
  color: #333333 !important;
  opacity: 0.25;
}
.btn-outline-gray-7:hover {
  color: #242424;
  background: rgba(36, 36, 36, 0.2);
}

.btn-outline-gray-7:active {
  color: #242424 !important;
  background: rgba(36, 36, 36, 0.4);
}
.btn-outline-gray-7.disabled,
.btn-outline-gray-7[disabled] {
  color: #242424 !important;
  opacity: 0.25;
}
.btn-outline-gray-8:hover {
  color: #191919;
  background: rgba(25, 25, 25, 0.2);
}

.btn-outline-gray-8:active {
  color: #191919 !important;
  background: rgba(25, 25, 25, 0.4);
}
.btn-outline-gray-8.disabled,
.btn-outline-gray-8[disabled] {
  color: #191919 !important;
  opacity: 0.25;
}
.btn-outline-gray-9:hover {
  color: #121212;
  background: rgba(18, 18, 18, 0.2);
}

.btn-outline-gray-9:active {
  color: #121212 !important;
  background: rgba(18, 18, 18, 0.4);
}
.btn-outline-gray-9.disabled,
.btn-outline-gray-9[disabled] {
  color: #121212 !important;
  opacity: 0.25;
}

.btn-outline-red-1:hover {
  color: #f7c2ba;
  background: rgba(247, 194, 186, 0.2);
}

.btn-outline-red-1:active {
  color: #f7c2ba !important;
  background: rgba(247, 194, 186, 0.4);
}
.btn-outline-red-1.disabled,
.btn-outline-red-1[disabled] {
  color: #f7c2ba !important;
  opacity: 0.25;
}
.btn-outline-red-2:hover {
  color: #fb7662;
  background: rgba(251, 118, 98, 0.2);
}

.btn-outline-red-2:active {
  color: #fb7662 !important;
  background: rgba(251, 118, 98, 0.4);
}
.btn-outline-red-2.disabled,
.btn-outline-red-2[disabled] {
  color: #fb7662 !important;
  opacity: 0.25;
}
.btn-outline-red-3:hover {
  color: #fa2100;
  background: rgba(250, 33, 0, 0.2);
}

.btn-outline-red-3:active {
  color: #fa2100 !important;
  background: rgba(250, 33, 0, 0.4);
}
.btn-outline-red-3.disabled,
.btn-outline-red-3[disabled] {
  color: #fa2100 !important;
  opacity: 0.25;
}
.btn-outline-red-4:hover {
  color: #cc1b00;
  background: rgba(204, 27, 0, 0.2);
}

.btn-outline-red-4:active {
  color: #cc1b00 !important;
  background: rgba(204, 27, 0, 0.4);
}
.btn-outline-red-4.disabled,
.btn-outline-red-4[disabled] {
  color: #cc1b00 !important;
  opacity: 0.25;
}
.btn-outline-red-5:hover {
  color: #660e00;
  background: rgba(102, 14, 0, 0.2);
}

.btn-outline-red-5:active {
  color: #660e00 !important;
  background: rgba(102, 14, 0, 0.4);
}
.btn-outline-red-5.disabled,
.btn-outline-red-5[disabled] {
  color: #660e00 !important;
  opacity: 0.25;
}
.btn-outline-red-6:hover {
  color: #570c00;
  background: rgba(87, 12, 0, 0.2);
}

.btn-outline-red-6:active {
  color: #570c00 !important;
  background: rgba(87, 12, 0, 0.4);
}
.btn-outline-red-6.disabled,
.btn-outline-red-6[disabled] {
  color: #570c00 !important;
  opacity: 0.25;
}
.btn-outline-red-7:hover {
  color: #470a00;
  background: rgba(71, 10, 0, 0.2);
}

.btn-outline-red-7:active {
  color: #470a00 !important;
  background: rgba(71, 10, 0, 0.4);
}
.btn-outline-red-7.disabled,
.btn-outline-red-7[disabled] {
  color: #470a00 !important;
  opacity: 0.25;
}
.btn-outline-red-8:hover {
  color: #3d0800;
  background: rgba(61, 8, 0, 0.2);
}

.btn-outline-red-8:active {
  color: #3d0800 !important;
  background: rgba(61, 8, 0, 0.4);
}
.btn-outline-red-8.disabled,
.btn-outline-red-8[disabled] {
  color: #3d0800 !important;
  opacity: 0.25;
}
.btn-outline-red-9:hover {
  color: #260500;
  background: rgba(38, 5, 0, 0.2);
}

.btn-outline-red-9:active {
  color: #260500 !important;
  background: rgba(38, 5, 0, 0.4);
}
.btn-outline-red-9.disabled,
.btn-outline-red-9[disabled] {
  color: #260500 !important;
  opacity: 0.25;
}

.btn-outline-orange-1:hover {
  color: #f7d4ba;
  background: rgba(247, 212, 186, 0.2);
}

.btn-outline-orange-1:active {
  color: #f7d4ba !important;
  background: rgba(247, 212, 186, 0.4);
}
.btn-outline-orange-1.disabled,
.btn-outline-orange-1[disabled] {
  color: #f7d4ba !important;
  opacity: 0.25;
}
.btn-outline-orange-2:hover {
  color: #fba462;
  background: rgba(251, 164, 98, 0.2);
}

.btn-outline-orange-2:active {
  color: #fba462 !important;
  background: rgba(251, 164, 98, 0.4);
}
.btn-outline-orange-2.disabled,
.btn-outline-orange-2[disabled] {
  color: #fba462 !important;
  opacity: 0.25;
}
.btn-outline-orange-3:hover {
  color: #fa6c00;
  background: rgba(250, 108, 0, 0.2);
}

.btn-outline-orange-3:active {
  color: #fa6c00 !important;
  background: rgba(250, 108, 0, 0.4);
}
.btn-outline-orange-3.disabled,
.btn-outline-orange-3[disabled] {
  color: #fa6c00 !important;
  opacity: 0.25;
}
.btn-outline-orange-4:hover {
  color: #c45500;
  background: rgba(196, 85, 0, 0.2);
}

.btn-outline-orange-4:active {
  color: #c45500 !important;
  background: rgba(196, 85, 0, 0.4);
}
.btn-outline-orange-4.disabled,
.btn-outline-orange-4[disabled] {
  color: #c45500 !important;
  opacity: 0.25;
}
.btn-outline-orange-5:hover {
  color: #662c00;
  background: rgba(102, 44, 0, 0.2);
}

.btn-outline-orange-5:active {
  color: #662c00 !important;
  background: rgba(102, 44, 0, 0.4);
}
.btn-outline-orange-5.disabled,
.btn-outline-orange-5[disabled] {
  color: #662c00 !important;
  opacity: 0.25;
}
.btn-outline-orange-6:hover {
  color: #572600;
  background: rgba(87, 38, 0, 0.2);
}

.btn-outline-orange-6:active {
  color: #572600 !important;
  background: rgba(87, 38, 0, 0.4);
}
.btn-outline-orange-6.disabled,
.btn-outline-orange-6[disabled] {
  color: #572600 !important;
  opacity: 0.25;
}
.btn-outline-orange-7:hover {
  color: #471f00;
  background: rgba(71, 31, 0, 0.2);
}

.btn-outline-orange-7:active {
  color: #471f00 !important;
  background: rgba(71, 31, 0, 0.4);
}
.btn-outline-orange-7.disabled,
.btn-outline-orange-7[disabled] {
  color: #471f00 !important;
  opacity: 0.25;
}
.btn-outline-orange-8:hover {
  color: #3d1b00;
  background: rgba(61, 27, 0, 0.2);
}

.btn-outline-orange-8:active {
  color: #3d1b00 !important;
  background: rgba(61, 27, 0, 0.4);
}
.btn-outline-orange-8.disabled,
.btn-outline-orange-8[disabled] {
  color: #3d1b00 !important;
  opacity: 0.25;
}
.btn-outline-orange-9:hover {
  color: #1c0d00;
  background: rgba(28, 13, 0, 0.2);
}

.btn-outline-orange-9:active {
  color: #1c0d00 !important;
  background: rgba(28, 13, 0, 0.4);
}
.btn-outline-orange-9.disabled,
.btn-outline-orange-9[disabled] {
  color: #1c0d00 !important;
  opacity: 0.25;
}
.btn-outline-yellow-1:hover {
  color: #f7eabc;
  background: rgba(247, 234, 188, 0.2);
}

.btn-outline-yellow-1:active {
  color: #f7eabc !important;
  background: rgba(247, 234, 188, 0.4);
}
.btn-outline-yellow-1.disabled,
.btn-outline-yellow-1[disabled] {
  color: #f7eabc !important;
  opacity: 0.25;
}
.btn-outline-yellow-2:hover {
  color: #fbda64;
  background: rgba(251, 218, 100, 0.2);
}

.btn-outline-yellow-2:active {
  color: #fbda64 !important;
  background: rgba(251, 218, 100, 0.4);
}
.btn-outline-yellow-2.disabled,
.btn-outline-yellow-2[disabled] {
  color: #fbda64 !important;
  opacity: 0.25;
}
.btn-outline-yellow-3:hover {
  color: #fa6c00;
  background: rgba(250, 108, 0, 0.2);
}

.btn-outline-yellow-3:active {
  color: #fa6c00 !important;
  background: rgba(250, 108, 0, 0.4);
}
.btn-outline-yellow-3.disabled,
.btn-outline-yellow-3[disabled] {
  color: #fa6c00 !important;
  opacity: 0.25;
}
.btn-outline-yellow-4:hover {
  color: #8f7001;
  background: rgba(143, 112, 1, 0.2);
}

.btn-outline-yellow-4:active {
  color: #8f7001 !important;
  background: rgba(143, 112, 1, 0.4);
}
.btn-outline-yellow-4.disabled,
.btn-outline-yellow-4[disabled] {
  color: #8f7001 !important;
  opacity: 0.25;
}
.btn-outline-yellow-5:hover {
  color: #665001;
  background: rgba(102, 80, 1, 0.2);
}

.btn-outline-yellow-5:active {
  color: #665001 !important;
  background: rgba(102, 80, 1, 0.4);
}
.btn-outline-yellow-5.disabled,
.btn-outline-yellow-5[disabled] {
  color: #665001 !important;
  opacity: 0.25;
}
.btn-outline-yellow-6:hover {
  color: #594601;
  background: rgba(89, 70, 1, 0.2);
}

.btn-outline-yellow-6:active {
  color: #594601 !important;
  background: rgba(89, 70, 1, 0.4);
}
.btn-outline-yellow-6.disabled,
.btn-outline-yellow-6[disabled] {
  color: #594601 !important;
  opacity: 0.25;
}
.btn-outline-yellow-7:hover {
  color: #4f3e01;
  background: rgba(79, 62, 1, 0.2);
}

.btn-outline-yellow-7:active {
  color: #4f3e01 !important;
  background: rgba(79, 62, 1, 0.4);
}
.btn-outline-yellow-7.disabled,
.btn-outline-yellow-7[disabled] {
  color: #4f3e01 !important;
  opacity: 0.25;
}
.btn-outline-yellow-8:hover {
  color: #403201;
  background: rgba(64, 50, 1, 0.2);
}

.btn-outline-yellow-8:active {
  color: #403201 !important;
  background: rgba(64, 50, 1, 0.4);
}
.btn-outline-yellow-8.disabled,
.btn-outline-yellow-8[disabled] {
  color: #403201 !important;
  opacity: 0.25;
}
.btn-outline-yellow-9:hover {
  color: #1c1601;
  background: rgba(28, 22, 1, 0.2);
}

.btn-outline-yellow-9:active {
  color: #1c1601 !important;
  background: rgba(28, 22, 1, 0.4);
}
.btn-outline-yellow-9.disabled,
.btn-outline-yellow-9[disabled] {
  color: #1c1601 !important;
  opacity: 0.25;
}

.btn-outline-green-1:hover {
  color: #dbf7be;
  background: rgba(219, 247, 190, 0.2);
}

.btn-outline-green-1:active {
  color: #dbf7be !important;
  background: rgba(219, 247, 190, 0.4);
}
.btn-outline-green-1.disabled,
.btn-outline-green-1[disabled] {
  color: #dbf7be !important;
  opacity: 0.25;
}
.btn-outline-green-2:hover {
  color: #b1fb67;
  background: rgba(177, 251, 103, 0.2);
}

.btn-outline-green-2:active {
  color: #b1fb67 !important;
  background: rgba(177, 251, 103, 0.4);
}
.btn-outline-green-2.disabled,
.btn-outline-green-2[disabled] {
  color: #b1fb67 !important;
  opacity: 0.25;
}
.btn-outline-green-3:hover {
  color: #6fd904;
  background: rgba(111, 217, 4, 0.2);
}

.btn-outline-green-3:active {
  color: #6fd904 !important;
  background: rgba(111, 217, 4, 0.4);
}
.btn-outline-green-3.disabled,
.btn-outline-green-3[disabled] {
  color: #6fd904 !important;
  opacity: 0.25;
}
.btn-outline-green-4:hover {
  color: #448503;
  background: rgba(68, 133, 3, 0.2);
}

.btn-outline-green-4:active {
  color: #448503 !important;
  background: rgba(68, 133, 3, 0.4);
}
.btn-outline-green-4.disabled,
.btn-outline-green-4[disabled] {
  color: #448503 !important;
  opacity: 0.25;
}
.btn-outline-green-5:hover {
  color: #346602;
  background: rgba(52, 102, 2, 0.2);
}

.btn-outline-green-5:active {
  color: #346602 !important;
  background: rgba(52, 102, 2, 0.4);
}
.btn-outline-green-5.disabled,
.btn-outline-green-5[disabled] {
  color: #346602 !important;
  opacity: 0.25;
}
.btn-outline-green-6:hover {
  color: #2a5202;
  background: rgba(42, 82, 2, 0.2);
}

.btn-outline-green-6:active {
  color: #2a5202 !important;
  background: rgba(42, 82, 2, 0.4);
}
.btn-outline-green-6.disabled,
.btn-outline-green-6[disabled] {
  color: #2a5202 !important;
  opacity: 0.25;
}
.btn-outline-green-7:hover {
  color: #244701;
  background: rgba(36, 71, 1, 0.2);
}

.btn-outline-green-7:active {
  color: #244701 !important;
  background: rgba(36, 71, 1, 0.4);
}
.btn-outline-green-7.disabled,
.btn-outline-green-7[disabled] {
  color: #244701 !important;
  opacity: 0.25;
}
.btn-outline-green-8:hover {
  color: #1f3d01;
  background: rgba(31, 61, 1, 0.2);
}

.btn-outline-green-8:active {
  color: #1f3d01 !important;
  background: rgba(31, 61, 1, 0.4);
}
.btn-outline-green-8.disabled,
.btn-outline-green-8[disabled] {
  color: #1f3d01 !important;
  opacity: 0.25;
}
.btn-outline-green-9:hover {
  color: #0d1a01;
  background: rgba(13, 26, 1, 0.2);
}

.btn-outline-green-9:active {
  color: #0d1a01 !important;
  background: rgba(13, 26, 1, 0.4);
}
.btn-outline-green-9.disabled,
.btn-outline-green-9[disabled] {
  color: #0d1a01 !important;
  opacity: 0.25;
}

.btn-outline-blue-1:hover {
  color: #badcf7;
  background: rgba(186, 220, 247, 0.2);
}

.btn-outline-blue-1:active {
  color: #badcf7 !important;
  background: rgba(186, 220, 247, 0.4);
}
.btn-outline-blue-1.disabled,
.btn-outline-blue-1[disabled] {
  color: #badcf7 !important;
  opacity: 0.25;
}
.btn-outline-blue-2:hover {
  color: #62b6fb;
  background: rgba(98, 182, 251, 0.2);
}

.btn-outline-blue-2:active {
  color: #62b6fb !important;
  background: rgba(98, 182, 251, 0.4);
}
.btn-outline-blue-2.disabled,
.btn-outline-blue-2[disabled] {
  color: #62b6fb !important;
  opacity: 0.25;
}
.btn-outline-blue-3:hover {
  color: #0089fa;
  background: rgba(0, 137, 250, 0.2);
}

.btn-outline-blue-3:active {
  color: #0089fa !important;
  background: rgba(0, 137, 250, 0.4);
}
.btn-outline-blue-3.disabled,
.btn-outline-blue-3[disabled] {
  color: #0089fa !important;
  opacity: 0.25;
}
.btn-outline-blue-4:hover {
  color: #006dc7;
  background: rgba(0, 109, 199, 0.2);
}

.btn-outline-blue-4:active {
  color: #006dc7 !important;
  background: rgba(0, 109, 199, 0.4);
}
.btn-outline-blue-4.disabled,
.btn-outline-blue-4[disabled] {
  color: #006dc7 !important;
  opacity: 0.25;
}
.btn-outline-blue-5:hover {
  color: #003866;
  background: rgba(0, 56, 102, 0.2);
}

.btn-outline-blue-5:active {
  color: #003866 !important;
  background: rgba(0, 56, 102, 0.4);
}
.btn-outline-blue-5.disabled,
.btn-outline-blue-5[disabled] {
  color: #003866 !important;
  opacity: 0.25;
}
.btn-outline-blue-6:hover {
  color: #003057;
  background: rgba(0, 48, 87, 0.2);
}

.btn-outline-blue-6:active {
  color: #003057 !important;
  background: rgba(0, 48, 87, 0.4);
}
.btn-outline-blue-6.disabled,
.btn-outline-blue-6[disabled] {
  color: #003057 !important;
  opacity: 0.25;
}
.btn-outline-blue-7:hover {
  color: #00294a;
  background: rgba(0, 41, 74, 0.2);
}

.btn-outline-blue-7:active {
  color: #00294a !important;
  background: rgba(0, 41, 74, 0.4);
}
.btn-outline-blue-7.disabled,
.btn-outline-blue-7[disabled] {
  color: #00294a !important;
  opacity: 0.25;
}
.btn-outline-blue-8:hover {
  color: #00223d;
  background: rgba(0, 34, 61, 0.2);
}

.btn-outline-blue-8:active {
  color: #00223d !important;
  background: rgba(0, 34, 61, 0.4);
}
.btn-outline-blue-8.disabled,
.btn-outline-blue-8[disabled] {
  color: #00223d !important;
  opacity: 0.25;
}
.btn-outline-blue-9:hover {
  color: #00182b;
  background: rgba(0, 24, 43, 0.2);
}

.btn-outline-blue-9:active {
  color: #00182b !important;
  background: rgba(0, 24, 43, 0.4);
}
.btn-outline-blue-9.disabled,
.btn-outline-blue-9[disabled] {
  color: #00182b !important;
  opacity: 0.25;
}

.btn-outline-indigo-1:hover {
  color: #c4d6fe;
  background: rgba(196, 214, 254, 0.2);
}

.btn-outline-indigo-1:active {
  color: #c4d6fe !important;
  background: rgba(196, 214, 254, 0.4);
}
.btn-outline-indigo-1.disabled,
.btn-outline-indigo-1[disabled] {
  color: #c4d6fe !important;
  opacity: 0.25;
}
.btn-outline-indigo-2:hover {
  color: #83a2f7;
  background: rgba(131, 162, 247, 0.2);
}

.btn-outline-indigo-2:active {
  color: #83a2f7 !important;
  background: rgba(131, 162, 247, 0.4);
}
.btn-outline-indigo-2.disabled,
.btn-outline-indigo-2[disabled] {
  color: #83a2f7 !important;
  opacity: 0.25;
}
.btn-outline-indigo-3:hover {
  color: #396af5;
  background: rgba(57, 106, 245, 0.2);
}

.btn-outline-indigo-3:active {
  color: #396af5 !important;
  background: rgba(57, 106, 245, 0.4);
}
.btn-outline-indigo-3.disabled,
.btn-outline-indigo-3[disabled] {
  color: #396af5 !important;
  opacity: 0.25;
}
.btn-outline-indigo-4:hover {
  color: #0b1ec7;
  background: rgba(11, 30, 199, 0.2);
}

.btn-outline-indigo-4:active {
  color: #0b1ec7 !important;
  background: rgba(11, 30, 199, 0.4);
}
.btn-outline-indigo-4.disabled,
.btn-outline-indigo-4[disabled] {
  color: #0b1ec7 !important;
  opacity: 0.25;
}
.btn-outline-indigo-5:hover {
  color: #061066;
  background: rgba(6, 16, 102, 0.2);
}

.btn-outline-indigo-5:active {
  color: #061066 !important;
  background: rgba(6, 16, 102, 0.4);
}
.btn-outline-indigo-5.disabled,
.btn-outline-indigo-5[disabled] {
  color: #061066 !important;
  opacity: 0.25;
}
.btn-outline-indigo-6:hover {
  color: #050d57;
  background: rgba(5, 13, 87, 0.2);
}

.btn-outline-indigo-6:active {
  color: #050d57 !important;
  background: rgba(5, 13, 87, 0.4);
}
.btn-outline-indigo-6.disabled,
.btn-outline-indigo-6[disabled] {
  color: #050d57 !important;
  opacity: 0.25;
}
.btn-outline-indigo-7:hover {
  color: #040b4a;
  background: rgba(4, 11, 74, 0.2);
}

.btn-outline-indigo-7:active {
  color: #040b4a !important;
  background: rgba(4, 11, 74, 0.4);
}
.btn-outline-indigo-7.disabled,
.btn-outline-indigo-7[disabled] {
  color: #040b4a !important;
  opacity: 0.25;
}
.btn-outline-indigo-8:hover {
  color: #04093d;
  background: rgba(4, 9, 61, 0.2);
}

.btn-outline-indigo-8:active {
  color: #04093d !important;
  background: rgba(4, 9, 61, 0.4);
}
.btn-outline-indigo-8.disabled,
.btn-outline-indigo-8[disabled] {
  color: #04093d !important;
  opacity: 0.25;
}
.btn-outline-indigo-9:hover {
  color: #040938;
  background: rgba(4, 9, 56, 0.2);
}

.btn-outline-indigo-9:active {
  color: #040938 !important;
  background: rgba(4, 9, 56, 0.4);
}
.btn-outline-indigo-9.disabled,
.btn-outline-indigo-9[disabled] {
  color: #040938 !important;
  opacity: 0.25;
}

.btn-outline-violet-1:hover {
  color: #d9cdf7;
  background: rgba(217, 205, 247, 0.2);
}

.btn-outline-violet-1:active {
  color: #d9cdf7 !important;
  background: rgba(217, 205, 247, 0.4);
}
.btn-outline-violet-1.disabled,
.btn-outline-violet-1[disabled] {
  color: #d9cdf7 !important;
  opacity: 0.25;
}
.btn-outline-violet-2:hover {
  color: #8385ff;
  background: rgba(131, 133, 255, 0.2);
}

.btn-outline-violet-2:active {
  color: #8385ff !important;
  background: rgba(131, 133, 255, 0.4);
}
.btn-outline-violet-2.disabled,
.btn-outline-violet-2[disabled] {
  color: #8385ff !important;
  opacity: 0.25;
}
.btn-outline-violet-3:hover {
  color: #6760f5;
  background: rgba(0, 137, 250, 0.2);
}

.btn-outline-violet-3:active {
  color: #6760f5 !important;
  background: rgba(0, 137, 250, 0.4);
}
.btn-outline-violet-3.disabled,
.btn-outline-violet-3[disabled] {
  color: #6760f5 !important;
  opacity: 0.25;
}
.btn-outline-violet-4:hover {
  color: #430fc7;
  background: rgba(67, 15, 199, 0.2);
}

.btn-outline-violet-4:active {
  color: #430fc7 !important;
  background: rgba(67, 15, 199, 0.4);
}
.btn-outline-violet-4.disabled,
.btn-outline-violet-4[disabled] {
  color: #430fc7 !important;
  opacity: 0.25;
}
.btn-outline-violet-5:hover {
  color: #230866;
  background: rgba(35, 8, 102, 0.2);
}

.btn-outline-violet-5:active {
  color: #230866 !important;
  background: rgba(35, 8, 102, 0.4);
}
.btn-outline-violet-5.disabled,
.btn-outline-violet-5[disabled] {
  color: #230866 !important;
  opacity: 0.25;
}
.btn-outline-violet-6:hover {
  color: #1e0757;
  background: rgba(30, 7, 87, 0.2);
}

.btn-outline-violet-6:active {
  color: #1e0757 !important;
  background: rgba(30, 7, 87, 0.4);
}
.btn-outline-violet-6.disabled,
.btn-outline-violet-6[disabled] {
  color: #1e0757 !important;
  opacity: 0.25;
}
.btn-outline-violet-7:hover {
  color: #19064a;
  background: rgba(25, 6, 74, 0.2);
}

.btn-outline-violet-7:active {
  color: #19064a !important;
  background: rgba(25, 6, 74, 0.4);
}
.btn-outline-violet-7.disabled,
.btn-outline-violet-7[disabled] {
  color: #19064a !important;
  opacity: 0.25;
}
.btn-outline-violet-8:hover {
  color: #15053d;
  background: rgba(21, 5, 61, 0.2);
}

.btn-outline-violet-8:active {
  color: #15053d !important;
  background: rgba(21, 5, 61, 0.4);
}
.btn-outline-violet-8.disabled,
.btn-outline-violet-8[disabled] {
  color: #15053d !important;
  opacity: 0.25;
}
.btn-outline-violet-9:hover {
  color: #130438;
  background: rgba(19, 4, 56, 0.2);
}

.btn-outline-violet-9:active {
  color: #130438 !important;
  background: rgba(19, 4, 56, 0.4);
}
.btn-outline-violet-9.disabled,
.btn-outline-violet-9[disabled] {
  color: #130438 !important;
  opacity: 0.25;
}

/* Hover and Clicked effect for links */
a.text-primary:hover {
  color: #569afe !important;
  border-color: #569afe !important;
}

a.text-primary:active {
  color: #86b7fe !important;
  border-color: #86b7fe !important;
}

a.text-secondary:hover {
  color: #989ea4 !important;
  border-color: #989ea4 !important;
}

a.text-secondary:active {
  color: #b6babe !important;
  border-color: #b6babe !important;
}

a.text-success:hover {
  color: #5eab87 !important;
  border-color: #5eab87 !important;
}

a.text-success:active {
  color: #8cc3aa !important;
  border-color: #8cc3aa !important;
}

a.text-info:hover {
  color: #56daf5 !important;
  border-color: #56daf5 !important;
}

a.text-info:active {
  color: #86e5f8 !important;
  border-color: #86e5f8 !important;
}

a.text-warning:hover {
  color: #ffd451 !important;
  border-color: #ffd451 !important;
}

a.text-warning:active {
  color: #ffe083 !important;
  border-color: #ffe083 !important;
}

a.text-danger:hover {
  color: #e7727d !important;
  border-color: #e7727d !important;
}

a.text-danger:active {
  color: #ee9aa2 !important;
  border-color: #ee9aa2 !important;
}

a.text-light:hover {
  color: #fafbfc !important;
  border-color: #fafbfc !important;
}

a.text-light:active {
  color: #fcfcfd !important;
  border-color: #fcfcfd !important;
}

a.text-dark:hover {
  color: #646669 !important;
  border-color: #646669 !important;
}

a.text-dark:active {
  color: #909294 !important;
  border-color: #909294 !important;
}

a.text-dark-gray:hover {
  color: #5e5e5e !important;
  border-color: #5e5e5e !important;
}

a.text-dark-gray:active {
  color: #8c8c8c !important;
  border-color: #8c8c8c !important;
}

a.text-black:hover,
a.text-black:hover i {
  color: #939598 !important;
  border-color: #939598 !important;
}

a.text-black:active,
a.text-black:active i {
  color: #939598 !important;
  border-color: #939598 !important;
}

a.text-white:hover,
a.text-white:hover i {
  color: #939598 !important;
  border-color: #939598 !important;
}

a.text-white:active,
a.text-white:active i {
  color: #939598 !important;
  border-color: #939598 !important;
}

a.text-red-1:hover,
a.text-red-1:hover i {
  color: #f7c2ba !important;
  opacity: 0.5;
  border-color: #f7c2ba !important;
}
a.text-red-1:active,
a.text-red-1:active i {
  color: #f7c2ba !important;
  opacity: 0.3;
  border-color: #f7c2ba !important;
}
a.text-red-2:hover,
a.text-red-2:hover i {
  color: #fb7662 !important;
  opacity: 0.5;
  border-color: #fb7662 !important;
}
a.text-red-2:active,
a.text-red-2:active i {
  color: #fb7662 !important;
  opacity: 0.3;
  border-color: #fb7662 !important;
}
a.text-red-3:hover,
a.text-red-3:hover i {
  color: #fa2100 !important;
  opacity: 0.5;
  border-color: #fa2100 !important;
}
a.text-red-3:active,
a.text-red-3:active i {
  color: #fa2100 !important;
  opacity: 0.3;
  border-color: #fa2100 !important;
}
a.text-red-4:hover,
a.text-red-4:hover i {
  color: #cc1b00 !important;
  opacity: 0.5;
  border-color: #cc1b00 !important;
}
a.text-red-4:active,
a.text-red-4:active i {
  color: #cc1b00 !important;
  opacity: 0.3;
  border-color: #cc1b00 !important;
}
a.text-red-5:hover,
a.text-red-5:hover i {
  color: #660e00 !important;
  opacity: 0.5;
  border-color: #660e00 !important;
}
a.text-red-5:active,
a.text-red-5:active i {
  color: #660e00 !important;
  opacity: 0.3;
  border-color: #660e00 !important;
}
a.text-red-6:hover,
a.text-red-6:hover i {
  color: #570c00 !important;
  opacity: 0.5;
  border-color: #570c00 !important;
}
a.text-red-6:active,
a.text-red-6:active i {
  color: #570c00 !important;
  opacity: 0.3;
  border-color: #570c00 !important;
}
a.text-red-7:hover,
a.text-red-7:hover i {
  color: #470a00 !important;
  opacity: 0.5;
  border-color: #470a00 !important;
}
a.text-red-7:active,
a.text-red-7:active i {
  color: #470a00 !important;
  opacity: 0.3;
  border-color: #470a00 !important;
}
a.text-red-8:hover,
a.text-red-8:hover i {
  color: #3d0800 !important;
  opacity: 0.5;
  border-color: #3d0800 !important;
}
a.text-red-8:active,
a.text-red-8:active i {
  color: #3d0800 !important;
  opacity: 0.3;
  border-color: #3d0800 !important;
}
a.text-red-9:hover,
a.text-red-9:hover i {
  color: #260500 !important;
  opacity: 0.5;
  border-color: #260500 !important;
}
a.text-red-9:active,
a.text-red-9:active i {
  color: #260500 !important;
  opacity: 0.3;
  border-color: #260500 !important;
}

a.text-orange-1:hover,
a.text-orange-1:hover i {
  color: #f7d4ba !important;
  opacity: 0.5;
  border-color: #f7d4ba !important;
}
a.text-orange-1:active,
a.text-orange-1:active i {
  color: #f7d4ba !important;
  opacity: 0.3;
  border-color: #f7d4ba !important;
}
a.text-orange-2:hover,
a.text-orange-2:hover i {
  color: #fba462 !important;
  opacity: 0.5;
  border-color: #fba462 !important;
}
a.text-orange-2:active,
a.text-orange-2:active i {
  color: #fba462 !important;
  opacity: 0.3;
  border-color: #fba462 !important;
}
a.text-orange-3:hover,
a.text-orange-3:hover i {
  color: #fa6c00 !important;
  opacity: 0.5;
  border-color: #fa6c00 !important;
}
a.text-orange-3:active,
a.text-orange-3:active i {
  color: #fa6c00 !important;
  opacity: 0.3;
  border-color: #fa6c00 !important;
}
a.text-orange-4:hover,
a.text-orange-4:hover i {
  color: #c45500 !important;
  opacity: 0.5;
  border-color: #c45500 !important;
}
a.text-orange-4:active,
a.text-orange-4:active i {
  color: #c45500 !important;
  opacity: 0.3;
  border-color: #c45500 !important;
}
a.text-orange-5:hover,
a.text-orange-5:hover i {
  color: #662c00 !important;
  opacity: 0.5;
  border-color: #662c00 !important;
}
a.text-orange-5:active,
a.text-orange-5:active i {
  color: #662c00 !important;
  opacity: 0.3;
  border-color: #662c00 !important;
}
a.text-orange-6:hover,
a.text-orange-6:hover i {
  color: #572600 !important;
  opacity: 0.5;
  border-color: #572600 !important;
}
a.text-orange-6:active,
a.text-orange-6:active i {
  color: #572600 !important;
  opacity: 0.3;
  border-color: #572600 !important;
}
a.text-orange-7:hover,
a.text-orange-7:hover i {
  color: #471f00 !important;
  opacity: 0.5;
  border-color: #471f00 !important;
}
a.text-orange-7:active,
a.text-orange-7:active i {
  color: #471f00 !important;
  opacity: 0.3;
  border-color: #471f00 !important;
}
a.text-orange-8:hover,
a.text-orange-8:hover i {
  color: #3d1b00 !important;
  opacity: 0.5;
  border-color: #3d1b00 !important;
}
a.text-orange-8:active,
a.text-orange-8:active i {
  color: #3d1b00 !important;
  opacity: 0.3;
  border-color: #3d1b00 !important;
}
a.text-orange-9:hover,
a.text-orange-9:hover i {
  color: #1c0d00 !important;
  opacity: 0.5;
  border-color: #1c0d00 !important;
}
a.text-orange-9:active,
a.text-orange-9:active i {
  color: #1c0d00 !important;
  opacity: 0.3;
  border-color: #1c0d00 !important;
}

a.text-yellow-1:hover,
a.text-yellow-1:hover i {
  color: #f7eabc !important;
  opacity: 0.5;
  border-color: #f7eabc !important;
}
a.text-yellow-1:active,
a.text-yellow-1:active i {
  color: #f7eabc !important;
  opacity: 0.3;
  border-color: #f7eabc !important;
}
a.text-yellow-2:hover,
a.text-yellow-2:hover i {
  color: #fbda64 !important;
  opacity: 0.5;
  border-color: #fbda64 !important;
}
a.text-yellow-2:active,
a.text-yellow-2:active i {
  color: #fbda64 !important;
  opacity: 0.3;
  border-color: #fbda64 !important;
}
a.text-yellow-3:hover,
a.text-yellow-3:hover i {
  color: #fac402 !important;
  opacity: 0.5;
  border-color: #fac402 !important;
}
a.text-yellow-3:active,
a.text-yellow-3:active i {
  color: #fac402 !important;
  opacity: 0.3;
  border-color: #fac402 !important;
}
a.text-yellow-4:hover,
a.text-yellow-4:hover i {
  color: #8f7001 !important;
  opacity: 0.5;
  border-color: #8f7001 !important;
}
a.text-yellow-4:active,
a.text-yellow-4:active i {
  color: #8f7001 !important;
  opacity: 0.3;
  border-color: #8f7001 !important;
}
a.text-yellow-5:hover,
a.text-yellow-5:hover i {
  color: #665001 !important;
  opacity: 0.5;
  border-color: #665001 !important;
}
a.text-yellow-5:active,
a.text-yellow-5:active i {
  color: #665001 !important;
  opacity: 0.3;
  border-color: #665001 !important;
}
a.text-yellow-6:hover,
a.text-yellow-6:hover i {
  color: #594601 !important;
  opacity: 0.5;
  border-color: #594601 !important;
}
a.text-yellow-6:active,
a.text-yellow-6:active i {
  color: #594601 !important;
  opacity: 0.3;
  border-color: #594601 !important;
}
a.text-yellow-7:hover,
a.text-yellow-7:hover i {
  color: #4f3e01 !important;
  opacity: 0.5;
  border-color: #4f3e01 !important;
}
a.text-yellow-7:active,
a.text-yellow-7:active i {
  color: #4f3e01 !important;
  opacity: 0.3;
  border-color: #4f3e01 !important;
}
a.text-yellow-8:hover,
a.text-yellow-8:hover i {
  color: #403201 !important;
  opacity: 0.5;
  border-color: #403201 !important;
}
a.text-yellow-8:active,
a.text-yellow-8:active i {
  color: #403201 !important;
  opacity: 0.3;
  border-color: #403201 !important;
}
a.text-yellow-9:hover,
a.text-yellow-9:hover i {
  color: #1c1601 !important;
  opacity: 0.5;
  border-color: #1c1601 !important;
}
a.text-yellow-9:active,
a.text-yellow-9:active i {
  color: #1c1601 !important;
  opacity: 0.3;
  border-color: #1c1601 !important;
}

a.text-green-1:hover,
a.text-green-1:hover i {
  color: #dbf7be !important;
  opacity: 0.5;
  border-color: #dbf7be !important;
}
a.text-green-1:active,
a.text-green-1:active i {
  color: #dbf7be !important;
  opacity: 0.3;
  border-color: #dbf7be !important;
}
a.text-green-2:hover,
a.text-green-2:hover i {
  color: #b1fb67 !important;
  opacity: 0.5;
  border-color: #b1fb67 !important;
}
a.text-green-2:active,
a.text-green-2:active i {
  color: #b1fb67 !important;
  opacity: 0.3;
  border-color: #b1fb67 !important;
}
a.text-green-3:hover,
a.text-green-3:hover i {
  color: #6fd904 !important;
  opacity: 0.5;
  border-color: #6fd904 !important;
}
a.text-green-3:active,
a.text-green-3:active i {
  color: #6fd904 !important;
  opacity: 0.3;
  border-color: #6fd904 !important;
}
a.text-green-4:hover,
a.text-green-4:hover i {
  color: #448503 !important;
  opacity: 0.5;
  border-color: #448503 !important;
}
a.text-green-4:active,
a.text-green-4:active i {
  color: #448503 !important;
  opacity: 0.3;
  border-color: #448503 !important;
}
a.text-green-5:hover,
a.text-green-5:hover i {
  color: #346602 !important;
  opacity: 0.5;
  border-color: #346602 !important;
}
a.text-green-5:active,
a.text-green-5:active i {
  color: #346602 !important;
  opacity: 0.3;
  border-color: #346602 !important;
}
a.text-green-6:hover,
a.text-green-6:hover i {
  color: #2a5202 !important;
  opacity: 0.5;
  border-color: #2a5202 !important;
}
a.text-green-6:active,
a.text-green-6:active i {
  color: #2a5202 !important;
  opacity: 0.3;
  border-color: #2a5202 !important;
}
a.text-green-7:hover,
a.text-green-7:hover i {
  color: #244701 !important;
  opacity: 0.5;
  border-color: #244701 !important;
}
a.text-green-7:active,
a.text-green-7:active i {
  color: #244701 !important;
  opacity: 0.3;
  border-color: #244701 !important;
}
a.text-green-8:hover,
a.text-green-8:hover i {
  color: #1f3d01 !important;
  opacity: 0.5;
  border-color: #1f3d01 !important;
}
a.text-green-8:active,
a.text-green-8:active i {
  color: #1f3d01 !important;
  opacity: 0.3;
  border-color: #1f3d01 !important;
}
a.text-green-9:hover,
a.text-green-9:hover i {
  color: #0d1a01 !important;
  opacity: 0.5;
  border-color: #0d1a01 !important;
}
a.text-green-9:active,
a.text-green-9:active i {
  color: #0d1a01 !important;
  opacity: 0.3;
  border-color: #0d1a01 !important;
}

a.text-blue-1:hover,
a.text-blue-1:hover i {
  color: #badcf7 !important;
  opacity: 0.5;
  border-color: #badcf7 !important;
}
a.text-blue-1:active,
a.text-blue-1:active i {
  color: #badcf7 !important;
  opacity: 0.3;
  border-color: #badcf7 !important;
}
a.text-blue-2:hover,
a.text-blue-2:hover i {
  color: #62b6fb !important;
  opacity: 0.5;
  border-color: #62b6fb !important;
}
a.text-blue-2:active,
a.text-blue-2:active i {
  color: #62b6fb !important;
  opacity: 0.3;
  border-color: #62b6fb !important;
}
a.text-blue-3:hover,
a.text-blue-3:hover i {
  color: #0089fa !important;
  opacity: 0.5;
  border-color: #0089fa !important;
}
a.text-blue-3:active,
a.text-blue-3:active i {
  color: #0089fa !important;
  opacity: 0.3;
  border-color: #0089fa !important;
}
a.text-blue-4:hover,
a.text-blue-4:hover i {
  color: #006dc7 !important;
  opacity: 0.5;
  border-color: #006dc7 !important;
}
a.text-blue-4:active,
a.text-blue-4:active i {
  color: #006dc7 !important;
  opacity: 0.3;
  border-color: #006dc7 !important;
}
a.text-blue-5:hover,
a.text-blue-5:hover i {
  color: #003866 !important;
  opacity: 0.5;
  border-color: #003866 !important;
}
a.text-blue-5:active,
a.text-blue-5:active i {
  color: #003866 !important;
  opacity: 0.3;
  border-color: #003866 !important;
}
a.text-blue-6:hover,
a.text-blue-6:hover i {
  color: #003057 !important;
  opacity: 0.5;
  border-color: #003057 !important;
}
a.text-blue-6:active,
a.text-blue-6:active i {
  color: #003057 !important;
  opacity: 0.3;
  border-color: #003057 !important;
}
a.text-blue-7:hover,
a.text-blue-7:hover i {
  color: #00294a !important;
  opacity: 0.5;
  border-color: #00294a !important;
}
a.text-blue-7:active,
a.text-blue-7:active i {
  color: #00294a !important;
  opacity: 0.3;
  border-color: #00294a !important;
}
a.text-blue-8:hover,
a.text-blue-8:hover i {
  color: #00223d !important;
  opacity: 0.5;
  border-color: #00223d !important;
}
a.text-blue-8:active,
a.text-blue-8:active i {
  color: #00223d !important;
  opacity: 0.3;
  border-color: #00223d !important;
}
a.text-blue-9:hover,
a.text-blue-9:hover i {
  color: #00182b !important;
  opacity: 0.5;
  border-color: #00182b !important;
}
a.text-blue-9:active,
a.text-blue-9:active i {
  color: #00182b !important;
  opacity: 0.3;
  border-color: #00182b !important;
}

a.text-indigo-1:hover,
a.text-indigo-1:hover i {
  color: #c4d6fe !important;
  opacity: 0.5;
  border-color: #c4d6fe !important;
}
a.text-indigo-1:active,
a.text-indigo-1:active i {
  color: #c4d6fe !important;
  opacity: 0.3;
  border-color: #c4d6fe !important;
}
a.text-indigo-2:hover,
a.text-indigo-2:hover i {
  color: #83a2f7 !important;
  opacity: 0.5;
  border-color: #83a2f7 !important;
}
a.text-indigo-2:active,
a.text-indigo-2:active i {
  color: #83a2f7 !important;
  opacity: 0.3;
  border-color: #83a2f7 !important;
}
a.text-indigo-3:hover,
a.text-indigo-3:hover i {
  color: #396af5 !important;
  opacity: 0.5;
  border-color: #396af5 !important;
}
a.text-indigo-3:active,
a.text-indigo-3:active i {
  color: #396af5 !important;
  opacity: 0.3;
  border-color: #396af5 !important;
}
a.text-indigo-4:hover,
a.text-indigo-4:hover i {
  color: #0b1ec7 !important;
  opacity: 0.5;
  border-color: #0b1ec7 !important;
}
a.text-indigo-4:active,
a.text-indigo-4:active i {
  color: #0b1ec7 !important;
  opacity: 0.3;
  border-color: #0b1ec7 !important;
}
a.text-indigo-5:hover,
a.text-indigo-5:hover i {
  color: #061066 !important;
  opacity: 0.5;
  border-color: #061066 !important;
}
a.text-indigo-5:active,
a.text-indigo-5:active i {
  color: #061066 !important;
  opacity: 0.3;
  border-color: #061066 !important;
}
a.text-indigo-6:hover,
a.text-indigo-6:hover i {
  color: #050d57 !important;
  opacity: 0.5;
  border-color: #050d57 !important;
}
a.text-indigo-6:active,
a.text-indigo-6:active i {
  color: #050d57 !important;
  opacity: 0.3;
  border-color: #050d57 !important;
}
a.text-indigo-7:hover,
a.text-indigo-7:hover i {
  color: #040b4a !important;
  opacity: 0.5;
  border-color: #040b4a !important;
}
a.text-indigo-7:active,
a.text-indigo-7:active i {
  color: #040b4a !important;
  opacity: 0.3;
  border-color: #040b4a !important;
}
a.text-indigo-8:hover,
a.text-indigo-8:hover i {
  color: #04093d !important;
  opacity: 0.5;
  border-color: #04093d !important;
}
a.text-indigo-8:active,
a.text-indigo-8:active i {
  color: #04093d !important;
  opacity: 0.3;
  border-color: #04093d !important;
}
a.text-indigo-9:hover,
a.text-indigo-9:hover i {
  color: #040938 !important;
  opacity: 0.5;
  border-color: #040938 !important;
}
a.text-indigo-9:active,
a.text-indigo-9:active i {
  color: #040938 !important;
  opacity: 0.3;
  border-color: #040938 !important;
}

a.text-violet-1:hover,
a.text-violet-1:hover i {
  color: #d9cdf7 !important;
  opacity: 0.5;
  border-color: #d9cdf7 !important;
}
a.text-violet-1:active,
a.text-violet-1:active i {
  color: #d9cdf7 !important;
  opacity: 0.3;
  border-color: #d9cdf7 !important;
}
a.text-violet-2:hover,
a.text-violet-2:hover i {
  color: #8385ff !important;
  opacity: 0.5;
  border-color: #8385ff !important;
}
a.text-violet-2:active,
a.text-violet-2:active i {
  color: #8385ff !important;
  opacity: 0.3;
  border-color: #8385ff !important;
}
a.text-violet-3:hover,
a.text-violet-3:hover i {
  color: #6760f5 !important;
  opacity: 0.5;
  border-color: #6760f5 !important;
}
a.text-violet-3:active,
a.text-violet-3:active i {
  color: #6760f5 !important;
  opacity: 0.3;
  border-color: #6760f5 !important;
}
a.text-violet-4:hover,
a.text-violet-4:hover i {
  color: #430fc7 !important;
  opacity: 0.5;
  border-color: #430fc7 !important;
}
a.text-violet-4:active,
a.text-violet-4:active i {
  color: #430fc7 !important;
  opacity: 0.3;
  border-color: #430fc7 !important;
}
a.text-violet-5:hover,
a.text-violet-5:hover i {
  color: #230866 !important;
  opacity: 0.5;
  border-color: #230866 !important;
}
a.text-violet-5:active,
a.text-violet-5:active i {
  color: #230866 !important;
  opacity: 0.3;
  border-color: #230866 !important;
}
a.text-violet-6:hover,
a.text-violet-6:hover i {
  color: #1e0757 !important;
  opacity: 0.5;
  border-color: #1e0757 !important;
}
a.text-violet-6:active,
a.text-violet-6:active i {
  color: #1e0757 !important;
  opacity: 0.3;
  border-color: #1e0757 !important;
}
a.text-violet-7:hover,
a.text-violet-7:hover i {
  color: #19064a !important;
  opacity: 0.5;
  border-color: #19064a !important;
}
a.text-violet-7:active,
a.text-violet-7:active i {
  color: #19064a !important;
  opacity: 0.3;
  border-color: #19064a !important;
}
a.text-violet-8:hover,
a.text-violet-8:hover i {
  color: #15053d !important;
  opacity: 0.5;
  border-color: #15053d !important;
}
a.text-violet-8:active,
a.text-violet-8:active i {
  color: #15053d !important;
  opacity: 0.3;
  border-color: #15053d !important;
}
a.text-violet-9:hover,
a.text-violet-9:hover i {
  color: #130438 !important;
  opacity: 0.5;
  border-color: #130438 !important;
}
a.text-violet-9:active,
a.text-violet-9:active i {
  color: #130438 !important;
  opacity: 0.3;
  border-color: #130438 !important;
}

a.text-gray-1:hover,
a.text-gray-1:hover i {
  color: #f4f5f7 !important;
  opacity: 0.5;
  border-color: #f4f5f7 !important;
}
a.text-gray-1:active,
a.text-gray-1:active i {
  color: #f4f5f7 !important;
  opacity: 0.3;
  border-color: #f4f5f7 !important;
}
a.text-gray-2:hover,
a.text-gray-2:hover i {
  color: #dcdcde !important;
  opacity: 0.5;
  border-color: #dcdcde !important;
}
a.text-gray-2:active,
a.text-gray-2:active i {
  color: #dcdcde !important;
  opacity: 0.3;
  border-color: #dcdcde !important;
}
a.text-gray-3:hover,
a.text-gray-3:hover i {
  color: #a2a2a3 !important;
  opacity: 0.5;
  border-color: #a2a2a3 !important;
}
a.text-gray-3:active,
a.text-gray-3:active i {
  color: #a2a2a3 !important;
  opacity: 0.3;
  border-color: #a2a2a3 !important;
}
a.text-gray-4:hover,
a.text-gray-4:hover i {
  color: #545454 !important;
  opacity: 0.5;
  border-color: #545454 !important;
}
a.text-gray-4:active,
a.text-gray-4:active i {
  color: #545454 !important;
  opacity: 0.3;
  border-color: #545454 !important;
}
a.text-gray-5:hover,
a.text-gray-5:hover i {
  color: #474747 !important;
  opacity: 0.5;
  border-color: #474747 !important;
}
a.text-gray-5:active,
a.text-gray-5:active i {
  color: #474747 !important;
  opacity: 0.3;
  border-color: #474747 !important;
}
a.text-gray-6:hover,
a.text-gray-6:hover i {
  color: #333333 !important;
  opacity: 0.5;
  border-color: #333333 !important;
}
a.text-gray-6:active,
a.text-gray-6:active i {
  color: #333333 !important;
  opacity: 0.3;
  border-color: #333333 !important;
}
a.text-gray-7:hover,
a.text-gray-7:hover i {
  color: #242424 !important;
  opacity: 0.5;
  border-color: #242424 !important;
}
a.text-gray-7:active,
a.text-gray-7:active i {
  color: #242424 !important;
  opacity: 0.3;
  border-color: #242424 !important;
}
a.text-gray-8:hover,
a.text-gray-8:hover i {
  color: #191919 !important;
  opacity: 0.5;
  border-color: #191919 !important;
}
a.text-gray-8:active,
a.text-gray-8:active i {
  color: #191919 !important;
  opacity: 0.3;
  border-color: #191919 !important;
}
a.text-gray-9:hover,
a.text-gray-9:hover i {
  color: #121212 !important;
  opacity: 0.5;
  border-color: #121212 !important;
}
a.text-gray-9:active,
a.text-gray-9:active i {
  color: #121212 !important;
  opacity: 0.3;
  border-color: #121212 !important;
}
/* Ending */

/* forms  */
.form-mark {
  width: 1.2em;
  height: 1.2em;
  text-align: center;
}

.form-control.is-valid,
.was-validated .form-control:valid {
  background-image: none;
}

/* form colored switches */
.form-check-input.active-black:checked {
  background-color: #000;
}

/* .form-check-input.active-cool-gray-1:checked {
  background-color: #939598;
}

.form-check-input.active-cool-gray-2:checked {
  background-color: #c9cacc;
}

.form-check-input.active-cool-gray-3:checked {
  background-color: #e6e6e7;
}

.form-check-input.active-cool-gray-4:checked {
  background-color: #f5f5f5;
}

.form-check-input.active-warm-gray:checked {
  background-color: #f2f1ea;
} */

.form-check-input.active-gray-1:checked {
  background-color: #f5f5f5;
}

.form-check-input.active-gray-2:checked {
  background-color: #e6e6e7;
}

.form-check-input.active-gray-3:checked {
  background-color: #939598;
}

.form-check-input.active-gray-4:checked {
  background-color: #191919;
}

.form-check-input.active-gray-5:checked {
  background-color: #f2f1ea;
}

.form-check-input.active-orange-1:checked {
  background-color: #f04e23;
}

.form-check-input.active-orange-2:checked {
  background-color: #fcbb75;
}

.form-check-input.active-orange-3:checked {
  background-color: #f47920;
}

.form-check-input.active-purple-1:checked {
  background-color: #7b62f2;
}

.form-check-input.active-purple-2:checked {
  background-color: #8177b7;
}

.form-check-input.active-yellow-1:checked {
  background-color: #ffc222;
}

.form-check-input.active-yellow-2:checked {
  background-color: #ffe3a6;
}

.form-check-input.active-yellow-3:checked {
  background-color: #fedd00;
}

/* .form-check-input.active-blue-1-light:checked {
  background-color: #034ea2;
}

.form-check-input.active-blue-1-dark:checked {
  background-color: #0089fa;
}

.form-check-input.active-blue-2:checked {
  background-color: #0066b3;
}

.form-check-input.active-blue-3:checked {
  background-color: #659ad2;
}

.form-check-input.active-bolt-4k-blue:checked {
  background-color: #009af8;
} */

.form-check-input.active-blue-1:checked {
  background-color: #0089fa;
}

.form-check-input.active-blue-2:checked {
  background-color: #0066b3;
}

.form-check-input.active-blue-3:checked {
  background-color: #659ad2;
}

.form-check-input.active-blue-4:checked {
  background-color: #034ea2;
}

.form-check-input.active-blue-5:checked {
  background-color: #009af8;
}

.form-check-input.active-green-1:checked {
  background-color: #3a9948;
}

.form-check-input.active-green-2:checked {
  background-color: #3f542a;
}

.form-check-input.active-green-3:checked {
  background-color: rgba(137, 199, 101, 1);
}

.form-check-input.active-white:checked {
  background-color: #fff;
}

/* ending */

/* nav tabs */
.nav-tabs-orange,
.nav-tabs-blue {
  width: fit-content;
  background: white;
}

.nav-tabs-orange .nav-link.active {
  color: white;
  background: #f04e23;
}

.nav-tabs-orange .nav-link {
  color: #f04e23;
  background: white;
}

.nav-tabs-blue .nav-link.active {
  color: white;
  background: #7b62f2;
}

.nav-tabs-blue .nav-link {
  color: #7b62f2;
  background: white;
}

.nav-pills-purple {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: rgba(123, 98, 242, 1);
  border: 1px solid rgba(123, 98, 242, 1);
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-purple li,
.nav-pills-orange li,
.nav-pills-yellow li,
.nav-pills-green li,
.nav-pills-blue li,
.nav-pills-white li {
  margin-bottom: 0 !important;
}

.nav-pills-purple .nav-link.active {
  color: #fff !important;
  background-color: rgba(123, 98, 242, 1) !important;
}

.nav-pills-purple .nav-link {
  border-left: 1px solid rgba(123, 98, 242, 1);
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: rgba(123, 98, 242, 1);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.nav-pills-purple .nav-link:hover {
  background-color: rgba(130, 104, 255, 0.15);
  color: #fff;
}

.nav-pills-orange {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #f04e23;
  border: 1px solid #f04e23;
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-orange .nav-link {
  border-left: 1px solid #f04e23;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: #f04e23;
  /*   font-size: 16px; */
  font-weight: 500;
  /*   line-height: 24px; */
}

.nav-pills-orange .nav-link.active {
  color: #fff !important;
  background-color: #f04e23 !important;
}

.nav-pills-orange .nav-link:hover {
  background-color: rgba(255, 164, 140, 0.15);
  color: #fff;
}

.nav-pills-yellow {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #000;
  --bs-nav-pills-link-active-bg: #ffc222;
  border: 1px solid #ffc222;
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-yellow .nav-link.active {
  color: #000 !important;
  background-color: #ffc222 !important;
}

.nav-pills-yellow .nav-link {
  border-left: 1px solid #ffc222;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: #ffc222;
  /*   font-size: 16px; */
  font-weight: 500;
  /*   line-height: 24px; */
}

.nav-pills-yellow .nav-link:hover {
  background-color: rgba(255, 194, 34, 0.15);
  color: #fff;
}

.nav-pills-green {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #3a9948;
  border: 1px solid #3a9948;
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-green .nav-link.active {
  color: #fff !important;
  background-color: #3a9948 !important;
}

.nav-pills-green .nav-link {
  border-left: 1px solid #3a9948;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: #3a9948;
  /*   font-size: 16px; */
  font-weight: 500;
  /*   line-height: 24px; */
}

.nav-pills-green .nav-link:hover {
  background-color: rgba(58, 153, 72, 0.15);
  color: #fff;
}

.nav-pills-blue {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #0089fa;
  border: 1px solid #0089fa;
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-blue .nav-link.active,
.nav-pills-blue .show > .nav-link {
  color: #fff !important;
  background-color: #0089fa !important;
}

.nav-pills-blue .nav-link {
  border-left: 1px solid #0089fa;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: #0089fa;
  /*   font-size: 16px; */
  font-weight: 500;
  /*   line-height: 24px; */
}

.nav-pills-blue .nav-link:hover {
  background: rgba(0, 137, 250, 0.15);
  color: #fff;
}

.nav-pills-white {
  /* --bs-nav-pills-border-radius: 16px; */
  --bs-nav-pills-link-active-color: #000;
  --bs-nav-pills-link-active-bg: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 0.8em;
  margin: 0;
  padding: 0;
  overflow: hidden !important;
}

.nav-pills-white .nav-link.active,
.nav-pills-white .show > .nav-link {
  color: #000 !important;
  background-color: #ffffff !important;
}

.nav-pills-white .nav-link {
  border-left: 1px solid #ffffff;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  color: #ffffff;
  /*   font-size: 16px; */
  font-weight: 500;
  /*   line-height: 24px; */
}

.nav-pills-white .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.5);
  color: #fff;
}

.nav-pills-blackunderline .nav-link {
  background: transparent;
  color: #939598 !important;
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  padding: 8px 32px 32px 32px;
}
.nav-pills-blackunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Base-Black, #000) !important;
}
.nav-pills-blackunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-blackunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-whiteunderline .nav-link {
  background: transparent;
  color: #fff !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  padding: 8px 32px 32px 32px;
}
.nav-pills-whiteunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Base-Black, #fff) !important;
}
.nav-pills-whiteunderline .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-whiteunderline .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-redunderline .nav-link,
.nav-pills-orangeunderline .nav-link,
.nav-pills-yellowunderline .nav-link,
.nav-pills-greenunderline .nav-link,
.nav-pills-blueunderline .nav-link,
.nav-pills-indigounderline .nav-link,
.nav-pills-violetunderline .nav-link {
  background: transparent;
  color: #939598 !important;
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  padding: 8px 32px 32px 32px;
}
.nav-pills-redunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Red-Red-3, #fa2100) !important;
}
.nav-pills-redunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-redunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-redunderline-dark .nav-link,
.nav-pills-orangeunderline-dark .nav-link,
.nav-pills-yellowunderline-dark .nav-link,
.nav-pills-greenunderline-dark .nav-link,
.nav-pills-blueunderline-dark .nav-link,
.nav-pills-indigounderline-dark .nav-link,
.nav-pills-violetunderline-dark .nav-link {
  background: transparent;
  color: #939598 !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  padding: 8px 32px 32px 32px;
}
.nav-pills-redunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Red-Red-3, #fa2100) !important;
}
.nav-pills-redunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-redunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-orangeunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Orange-Orange-3, #fa6c00) !important;
}
.nav-pills-orangeunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-orangeunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-orangeunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Orange-Orange-3, #fa6c00) !important;
}
.nav-pills-orangeunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-orangeunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-yellowunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Yellow-Yellow-3, #fac402) !important;
}
.nav-pills-yellowunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-yellowunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-yellowunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Yellow-Yellow-3, #fac402) !important;
}
.nav-pills-yellowunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-yellowunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-greenunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Green-Green-3, #6fd904) !important;
}
.nav-pills-greenunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-greenunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-greenunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Green-Green-3, #6fd904) !important;
}
.nav-pills-greenunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-greenunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-blueunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Blue-Blue-3, #0089fa) !important;
}
.nav-pills-blueunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-blueunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-blueunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Blue-Blue-3, #0089fa) !important;
}
.nav-pills-blueunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-blueunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-indigounderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Indigo-Indigo-3, #396af5) !important;
}
.nav-pills-indigounderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-indigounderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-indigounderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Indigo-Indigo-3, #396af5) !important;
}
.nav-pills-indigounderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-indigounderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}

.nav-pills-violetunderline .nav-link.active {
  background: transparent !important;
  color: var(--Base-Black, #000) !important;
  border-bottom: 4px solid var(--Violet-Violet-3, #6760f5) !important;
}
.nav-pills-violetunderline .nav-link:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.05);
}
.nav-pills-violetunderline .nav-link:active {
  border-bottom: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.15);
}

.nav-pills-violetunderline-dark .nav-link.active {
  background: transparent !important;
  color: var(--Base-White, #fff) !important;
  border-bottom: 4px solid var(--Violet-Violet-3, #6760f5) !important;
}
.nav-pills-violetunderline-dark .nav-link:hover {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
}
.nav-pills-violetunderline-dark .nav-link:active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.25);
}
/* ending */

/* play/pause video block */
.playIcon {
  border: none;
  background: rgb(10, 10, 10);
  box-sizing: border-box;
  width: 4.5em;
  opacity: 1;
  height: 4.5em;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  border-radius: 50%;
  cursor: pointer;
}

/* ---------- */

/* secondaryNavbar */
.nav-link.active {
  color: #fff !important;
}

/* ------------------------ */

/* carousel */
.carouselgrey-control-prev,
.carouselgrey-control-next,
.carouselorange-control-prev,
.carouselorange-control-next,
.carouselyellow-control-prev,
.carouselyellow-control-next {
  width: 2.4em;
  height: 2.4em;
}

.carouselgrey-control-prev:hover,
.carouselgrey-control-prev:focus,
.carouselgrey-control-next:hover,
.carouselgrey-control-next:focus {
  color: #fff !important;
  text-decoration: none;
  outline: 0;
  opacity: 0.9;
}

.carouselgrey-control-prev:hover,
.carouselgrey-control-next:hover {
  background: #353636;
}

.carouselgrey-control-prev:active,
.carouselgrey-control-next:active {
  background: #4d4e4f;
  color: #fff;
}

.carouselorange-control-prev:hover,
.carouselorange-control-next:hover {
  background: #873620;
  filter: invert(1);
}

.carouselorange-control-prev:active,
.carouselorange-control-next:active {
  background: #c64422;
  filter: invert(1);
}

.carouselyellow-control-prev:hover,
.carouselyellow-control-next:hover {
  background: #8f7020;
  filter: invert(1);
}

.carouselyellow-control-prev:active,
.carouselyellow-control-next:active {
  background: #d2a121;
  filter: invert(1);
}

@media (max-width: 768px) {
  .carousel-indicators [data-bs-target] {
    width: 14px;
    height: 14px;
  }

  .carouselgrey-control-prev,
  .carouselgrey-control-next,
  .carouselorange-control-prev,
  .carouselorange-control-next,
  .carouselyellow-control-prev,
  .carouselyellow-control-next {
    width: 48px;
    height: 48px;
  }
}

/* --------------------------------------------------------------------------- */

/* -----  modal -----  */
.modal.fade.show {
  background: rgba(36, 36, 36, 0.24) !important;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}
.modal {
  opacity: 1;
  visibility: visible;
}
.modal-content,
.modal-body iframe,
.modal-body {
  border-radius: 16px;
}
.modal-backdrop {
  position: static;
}
.modal-content::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.modal-content {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.modal.fade .modal-dialog {
  top: 50%;
  transform: translate(0, 100%);
  transition: 0.5s ease-in-out;
}

.modal.fade.show .modal-dialog {
  top: 50%;
  transform: translate(0, -50%);
  transition: 0.5s ease-in-out;
}

.modal.fade:not(.show) {
  transition: 0.5s ease-in-out;
}

.btn-close {
  background-image: none !important;
  box-shadow: none;
  outline: none;
}

.btn-close {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  width: 2rem;
  height: 2rem;
  border-radius: 360px;
  box-sizing: border-box;
  z-index: 150;
  background-color: #474747;
  opacity: 1;
}

.btn-close:hover,
.closeBtn:hover {
  border-radius: 360px;
  /* background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), #474747!important */
  background-color: #6c6c6c !important;
}

.btn-close:active,
.closeBtn:active {
  border-radius: 360px;
  /* background: linear-gradient(0deg, #ffffff80 0%, rgba(255, 255, 255, 0.50) 100%), #474747!important; */
  background-color: #a3a3a3 !important;
}

.btn-close:active i.text-gray-3,
.closeBtn:active i.text-gray-3 {
  color: #d0d0d1 !important;
}
.fade.show {
  opacity: 1 !important;
}

/* CART PAGE */

.cart-item > td + td {
  /* padding-left: 4rem; */
  padding-left: 1.2rem;
  display: table-cell;
  vertical-align: middle;
}

a:not([href]) {
  cursor: pointer;
}
img {
  max-width: 100%;
  height: auto;
}
@media screen and (min-width: 750px) {
  .cart-item__price-wrapper > *:only-child:not(.cart-item__discounted-prices) {
    margin-top: 10rem;
  }
}