/* .btn-start-danger {
  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--bs-black);
  background: linear-gradient(to right, transparent 60%, var(--bs-danger));
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-border-radius: .5rem;
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: var(--bs-danger);;
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
}

.btn-end-danger {
  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--bs-black);
  background: linear-gradient(to left, transparent 60%, var(--bs-danger));
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-border-radius: .5rem;
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: var(--bs-danger);;
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
} */

.btn-start {
	background: linear-gradient(
		310deg,
		rgba(211, 54, 54, var(--bs-btn-disabled-opacity)) 0%,
		rgba(211, 54, 54, var(--bs-btn-disabled-opacity)) 50%,
		rgba(76, 161, 42, 1) 50%,
		rgba(76, 161, 42, 1) 100%
	);
}
.btn-end {
	background: linear-gradient(
		50deg,
		rgba(211, 54, 54, var(--bs-btn-disabled-opacity)) 0%,
		rgba(211, 54, 54, var(--bs-btn-disabled-opacity)) 50%,
		rgba(76, 161, 42, 1) 50%,
		rgba(76, 161, 42, 1) 100%
	);
}
.btn-start.btn-end {
  background: rgba(211, 54, 54, var(--bs-btn-disabled-opacity));
}
.note { height: 100px !important; }