/**
 * WORK STEPS ELEMENTS
 =======================================================
 * Work steps which is sort of a component has the 
 * following classes available:
 =======================================================
 * Wrapper classes
 * - work-step__wrapper
 *
 * Region classes
 * - work-step__counter
 * - work-step__content
 *
 * Element classes
 * - work-step__title
 * - work-step__body
 *
 */

.work-step__wrapper {
  max-width: 42rem;
  margin: 0 auto 2rem;
}

.work-step__counter {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  font-size: 1.375rem;
  min-width: 3rem;
  min-height: 3rem;
  margin-top: 0;
  margin-bottom: 1rem;
}

.work-step__content {
  color: #cbd5e0;
  line-height: 1.375;
  text-align: center;
}

@media (min-width: 640px) {
  .work-step__counter {
    display: flex;
  }

  .work-step__content {
    text-align: left;
  }
}

/* --------------------
   Elements
/* -------------------- */

.step__title {
  margin-top: 0.25rem;
}

/*# sourceMappingURL=work-steps.css.map */
