:root {
  /* boostrap color */
  --bs-body-color: #707070;
  --bs-primary-rgb: 183, 209, 7;
  --bs-link-color-rgb: 0, 146, 143;
  --bs-link-hover-color-rgb: 245, 127, 37;

  /* theme color */
  --white: #FFFFFF;
  --black: #000000;
  --snow-gray: #FAFAFA;
  --light-gray: #EFEFEF;
  --light-cloud: #F8F8F8;
  --tropical-cyan: #00928F;
  --cyan-neon: #04DEDA;
  --lime-green: #99AE06;
  --chartreuse-green: #B7D107;
  --lime-burst: #AEEA07;
  --sunset-orange: #F57F25;
  --tangerine-orange: #EB6C0B;
  --midnight-blue: #031B39;
  --deep-navy-blue: #082446;
  --indigo-blue: #143052;
  --border-light: #E6E6E6;
}

.color-inherit {
  color: inherit;
}

.color-body {
  color: var(--bs-body-color);
}

.color-tropical-cyan {
  color: var(--tropical-cyan);
}

.color-lime-green {
  color: var(--lime-green);
}

.color-chartreuse-green {
  color: var(--chartreuse-green);
}

.color-tangerine-orange {
  color: var(--tangerine-orange);
}

.color-sunset-orange {
  color: var(--sunset-orange);
}

.color-light-gray {
  color: var(--light-gray);
}

.color-light-cloud {
  color: var(--light-cloud);
}

.color-snow-gray {
  color: var(--snow-gray);
}

.color-white {
  color: var(--white);
}

.color-black {
  color: var(--black);
}

.color-midnight-blue {
  color: var(--midnight-blue);
}

.color-deep-navy-blue {
  color: var(--deep-navy-blue);
}

.color-indigo-blue {
  color: var(--indigo-blue);
}

.color-hover-tropical-cyan:hover {
  color: var(--tropical-cyan);
}

.color-hover-cyan-neon:hover {
  color: var(--cyan-neon);
}

.color-hover-lime-green:hover {
  color: var(--lime-green);
}

.color-hover-chartreuse-green:hover {
  color: var(--chartreuse-green);
}

.color-hover-tangerine-orange:hover {
  color: var(--tangerine-orange);
}

.color-hover-sunset-orange:hover {
  color: var(--sunset-orange);
}

.color-hover-light-gray:hover {
  color: var(--light-gray);
}

.color-hover-light-cloud:hover {
  color: var(--light-cloud);
}

.color-hover-snow-gray:hover {
  color: var(--snow-gray);
}

.color-hover-white:hover {
  color: var(--white);
}

.color-hover-black:hover {
  color: var(--black);
}

.color-hover-midnight-blue:hover {
  color: var(--midnight-blue);
}

.color-hover-deep-navy-blue:hover {
  color: var(--deep-navy-blue);
}

.color-hover-indigo-blue:hover {
  color: var(--indigo-blue);
}

.color-hover-border-light:hover {
  color: var(--border-light);
}

.bg-dark {
  background-color: var(--midnight-blue);
}

.bg-tropical-cyan,
.hover-bg-tropical-cyan:hover {
  background-color: var(--tropical-cyan);
}

.bg-lime-green,
.hover-bg-lime-green:hover {
  background-color: var(--lime-green);
}

.bg-chartreuse-green,
.hover-bg-chartreuse-green:hover {
  background-color: var(--chartreuse-green);
}

.bg-tangerine-orange,
.hover-bg-tangerine-orange:hover {
  background-color: var(--tangerine-orange);
}

.bg-sunset-orange,
.hover-bg-sunset-orange:hover {
  background-color: var(--sunset-orange);
}

.bg-light-gray,
.hover-bg-light-gray:hover {
  background-color: var(--light-gray);
}

.bg-light-cloud,
.hover-bg-light-cloud:hover {
  background-color: var(--light-cloud);
}

.bg-snow-gray,
.hover-bg-snow-gray:hover {
  background-color: var(--snow-gray);
}

.bg-white,
.hover-bg-white:hover {
  background-color: var(--white);
}

.bg-black,
.hover-bg-black:hover {
  background-color: var(--black);
}

.bg-midnight-blue,
.hover-bg-midnight-blue:hover {
  background-color: var(--midnight-blue);
}

.bg-deep-navy-blue,
.hover-bg-deep-navy-blue:hover {
  background-color: var(--deep-navy-blue);
}

.bg-indigo-blue,
.hover-bg-indigo-blue:hover {
  background-color: var(--indigo-blue);
}

.border-tropical-cyan {
  border: 1px solid;
  border-color: var(--tropical-cyan);
}

.border-cyan-neon {
  border: 1px solid;
  border-color: var(--cyan-neon);
}

.border-lime-green {
  border: 1px solid;
  border-color: var(--lime-green);
}

.border-chartreuse-green {
  border: 1px solid;
  border-color: var(--chartreuse-green);
}

.border-lime-burst {
  border: 1px solid;
  border-color: var(--lime-burst);
}

.border-tangerine-orange {
  border: 1px solid;
  border-color: var(--tangerine-orange);
}

.border-sunset-orange {
  border: 1px solid;
  border-color: var(--sunset-orange);
}

.border-light-gray {
  border: 1px solid;
  border-color: var(--light-gray);
}

.border-light-cloud {
  border: 1px solid;
  border-color: var(--light-cloud);
}

.border-snow-gray {
  border: 1px solid;
  border-color: var(--snow-gray);
}

.border-white {
  border: 1px solid;
  border-color: var(--white);
}

.border-black {
  border: 1px solid;
  border-color: var(--black);
}

.border-midnight-blue {
  border: 1px solid;
  border-color: var(--midnight-blue);
}

.border-deep-navy-blue {
  border: 1px solid;
  border-color: var(--deep-navy-blue);
}

.border-indigo-blue {
  border: 1px solid;
  border-color: var(--indigo-blue);
}

.btn.btn-primary {
  background-color: var(--sunset-orange);
  color: var(--white);
}

.btn.btn-primary:hover {
  background-color: var(--tropical-cyan);
  color: var(--white);
}

.btn.btn-midnight-blue {
  background-color: var(--midnight-blue);
  border-color: var(--midnight-blue);
  color: var(--white);
}

.btn.btn-midnight-blue:hover {
  background-color: var(--tropical-cyan);
  border-color: var(--tropical-cyan);
  color: var(--white);
}

.btn.btn-tropical-cyan {
  background-color: var(--tropical-cyan);
  border-color: var(--tropical-cyan);
  color: var(--white);
}

.btn.btn-tropical-cyan:hover {
  background-color: var(--sunset-orange);
  border-color: var(--sunset-orange);
  color: var(--white);
}

.btn.btn-sunset-orange {
  background-color: var(--sunset-orange);
  border-color: var(--sunset-orange);
  color: var(--white);
}

.btn.btn-tangerine-orange {
  background-color: var(--tangerine-orange);
  border-color: var(--tangerine-orange);
  color: var(--white);
}

.btn.btn-sunset-orange:hover,
.btn.btn-tangerine-orange:hover {
  background-color: var(--tropical-cyan);
  border-color: var(--tropical-cyan);
  color: var(--white);
}