/**
* Block Name: progress
*/

.progress {
  display: flex;
  height: auto;
  overflow: visible;
  line-height: normal;
  font-size: medium;
  background-color: transparent;
  border-radius: 0;
}

section.progress .progressbar {
  border-top: 1px solid var(--ziegelrot);
  padding-top: 20px;
  gap: 15px;
}

section.progress .progressbar span {
  position: relative;
  top: -33px;
}

section.progress .progressbar p {
  transform: rotate(-45deg);
}

@media (min-width: 1440px) {
  section.progress .progressbar {
    padding-top: 50px;
  }
  section.progress .progressbar span {
    top: -63px;
  }
}

@media (min-width: 1660px) {
  section.progress .progressbar {
    padding-top: 70px;
  }
  section.progress .progressbar span {
    top: -83px;
  }
}

@media (max-width: 767px) {
  section.progress .progressbar {
    flex-direction: column !important;
    border-top: none;
    border-left: 1px solid var(--ziegelrot);
    gap: 50px;
    padding-top: 0;
  }

  section.progress .progressbar div {
    flex-direction: row !important;
    align-items: flex-start !important;
  }

  section.progress .progressbar p {
    transform: rotate(0);
  }

  section.progress .progressbar span {
    top: 0;
    left: -22px;
  }
}

@media (max-width: 576px) {
  section.progress .progressbar {
    margin-left: 30px;
  }
}