body {
  background-color: var(--cl-cs-bg);
  color: var(--cl-cs-dark);
  /* font-size: 12px; */
}

/*
* Scroll bars
*/
html {
  scroll-behavior: smooth;
}
/* width */
::-webkit-scrollbar {
  width: 0px;
  height: 8px;
}

/* Track */
::-webkit-scrollbar-track {
  /* background: transparent; */
  background: var(--cl-cs-bg);
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--cl-cs-pink);
  border-radius: 2px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--cl-cs-bg);
  transition: 0.5s;
}

/* Scroll bar end */

.hero {
  /* background-color: rgba(36,37,60,0.25); */
}
#typed-designation {
  color: var(--cl-cs-primary);
  font-weight: 600;
}

.btn-cs-warning {
  color: #fff;
  /* border-color:var(--cl-cs-primary); */
}
.btn-cs-warning:hover {
  color: #fff;
  background-color: var(--cl-cs-primary);
}

.btn-cs-success {
  color: var(--bs-success);
  border-color: var(--bs-success);
}
.btn-cs-success:hover {
  color: #fff;
  background-color: var(--bs-success);
}

.btn-cs-primary {
  color: #fff;
  border-color: var(--cl-cs-blue);
  background-color: var(--cl-cs-blue);
}
.btn-cs-primary:hover {
  color: #fff;
  background-color: var(--cl-cs-blue-light);
}