.steps-box {
    padding: 12px 24px 24px;
    display: flex;
    background-color: #fff;
    margin: 0.5rem 1.5rem 0;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.09);

    .steps {
        margin: auto;
        flex: 1;
        justify-content: space-evenly;

        .step-container {
            display: flex;

            &:not(:last-child) {
                flex: 1;
            }

            .step {
                border: none;
                background: none;
                display: flex;
                flex-direction: column;
                align-items: center;
                position: relative;

                // Icons
                .fa {
                    font-size: 20px !important;
                }

                .fa-check-circle-o {
                    color: #50c146;
                }

                .fa-circle-o.disabled {
                    color: #e9ebeb;
                }

                .fa-circle-o {
                    color: #4f87ce;
                }

                .step-text {
                    position: absolute;
                    top: 20px;
                    font-size: small;
                    white-space: nowrap;
                }
            }
        }

        .step-container:not(:last-child)::after {
            content: " ";
            border-bottom: 1px dashed #e9ebeb;
            flex: 1;
            height: 18px;
        }

    }
}