.VerticalStepsSection:after {
    background-color: #27be56;
    content: "";
    height: 100%;
    left: 11px;
    position: absolute;
    top: 0;
    width: 2px
}

.VerticalStepsSection__icon-current:after {
    background-color: #d0d1d3;
    content: "";
    height: 100vh;
    left: 11px;
    position: absolute;
    top: 0;
    width: 2px;
    z-index: 1
}

.VerticalStepsSection .StepIcon__current:before {
    background-color: #f8f8f8;
    content: "";
    height: 4px;
    left: -2px;
    position: absolute;
    top: -6px;
    width: 24px
}

.VerticalStepsSection .StepIcon__current:after {
    background-color: #f8f8f8;
    bottom: -6px;
    content: "";
    height: 4px;
    left: -2px;
    position: absolute;
    width: 24px
}

.VerticalStepsSection .StepIcon__previous:before {
    background-color: #f8f8f8;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    top: -4px;
    width: 24px
}

.VerticalStepsSection .StepIcon__previous:after {
    background-color: #f8f8f8;
    bottom: -4px;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    width: 24px
}

.StepIcon__oval {
    height: 24px;
    min-width: 24px;
    width: 24px
}

.StepIcon__oval div {
    height: 12px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 12px
}

.HorizontalStepsSection:before {
    background-color: #27be56;
    left: 0;
    width: 100%
}

.HorizontalStepsSection:before,.HorizontalStepsSection__icon-current:after {
    content: "";
    height: 2px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.HorizontalStepsSection__icon-current:after {
    background-color: #d0d1d3;
    left: 40px;
    width: 100vw
}