html {
  background: rgb(102,191,198);
  background: linear-gradient(180deg, rgba(102,191,198,1) 0%, rgba(255,255,255,1) 100%);
  background-repeat: no-repeat;
  min-height: 100vh;
}

body,
body.toolbar-horizontal.toolbar-fixed {
  background: transparent;
  min-height: 100vh;
  padding-top: 20px !important;
}

.footer-img {
  background: transparent url("/modules/custom/fb_step_counter/img/step-counter-footer-shallow.svg") no-repeat center bottom / 100% auto;
  padding-top: 20%;
}

.total {
  transition: all .5s ease-in-out;
}

.copyright {
  margin-top: -2px;
  position:relative;
  background: #2b8033;
}

.success-submit {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 1024 1024'%3E%3Cpath fill='%2320a434' d='M823.168 225.835l-439.168 439.168-183.168-183.168c-16.683-16.683-43.691-16.683-60.331 0s-16.683 43.691 0 60.331l213.333 213.333c16.683 16.683 43.691 16.683 60.331 0l469.333-469.333c16.683-16.683 16.683-43.691 0-60.331s-43.691-16.683-60.331 0z' stroke='inherit'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  text-align: left;
  padding-left: 40px;
}

.progress-labels {
  height: 18px;
  line-height:18px;
}

.progress-labels > div {
  transform: translateX(-50%);
  white-space: nowrap;
  font-weight: 600;
  color: var(--bs-secondary);
  font-size: 0.85rem;
}

.progress-labels > div:first-child {
  left: 0;
}

.progress-labels > div:nth-child(2) {
  left: 20%
}

.progress-labels > div:nth-child(3) {
  left: 40%
}

.progress-labels > div:nth-child(4) {
  left: 60%
}

.progress-labels > div:nth-child(5) {
  left: 80%
}

.progress-labels > div:last-child {
  left: 100%
}

.total-progress-wrapper {

}

.total-progress {
  height: 30px;
}

.progress-markers {
  height: 20px;
}

.progress-markers > div {
  width: 2px;
  height: 20px;
  background: white;
}

.progress-markers > div:first-child {
  left: 0;
}

.progress-markers > div:nth-child(2) {
  left: 20%;
  height: 16px;
}

.progress-markers > div:nth-child(3) {
  left: 40%;
  height: 16px;
}

.progress-markers > div:nth-child(4) {
  left: 60%;
  height: 16px;
}

.progress-markers > div:nth-child(5) {
  left: 80%;
  height: 16px;
}

.progress-markers > div:last-child {
  left: 100%;
  height: 100%;
}

.form-item .description {
  padding-left: 10px;
  padding-right: 10px;
  font-size: 0.85rem;
  padding-top: 4px;
  margin-bottom: 10px;
}
