main {
    margin: 1rem;
}

.rowx {
    background-color: pink;
}

.text-justify {
    text-align: justify;
    text-justify: inter-word;
}

.header-tip {
    background-color: #F2F2F2;
    color: #7B818E;
    /*    margin-top: 2rem;
    margin-bottom: 2rem;
*/ /*position: relative;*/
}

div.header-tip i.bi {
    color: white;
    font-size: 5rem;
    padding: 2px;
}

div.header-tip div:nth-child(1) {
    /*z-index: 2;*/
    /*background-color: pink;*/
}

div.header-tip div:nth-child(2) {
    /*z-index: 1;*/
    /*background-color: lightblue;*/
}

.registration-wizard {
    background-color: white;
    background: linear-gradient(0deg, rgba(13,13,13,1) 0%, rgba(127,127,127,1) 100%);
}

div.registration-wizard p {
    text-align: left;
    min-width: 18rem;
}

.registration-profile p {
    text-align: left;
    min-width: 18rem;
}

/*    .text-multi-column {
                                                                                                                                                                                                                                                                                                                                                        column-count: 2
                                                                                                                                                                                                                                                                                                                                                    }*/

.text-xs-small {
    font-size: 12px;
}

.text-xs-large {
    font-size: 18px;
}

.step-number {
    font-size: 1.5rem;
    background-color: black;
    color: lightgrey;
    border: 2px solid black;
    border-radius: 1.5rem;
    width: 2.5rem;
    margin-top: -5.25rem;
    margin-bottom: 4rem;
    margin-left: auto;
    margin-right: auto;
}

    .step-number.active-step {
        background-color: whitesmoke;
        color: black;
    }

    .step-number.passed-step {
        background-color: green;
        color: white;
    }

    .step-number.failed-step {
        background-color: darkred;
        color: white;
    }

div[id^="step-output-"] {
    vertical-align: middle;
    padding: 1rem;
}

div[id$="-failure"] {
    /*min-height: 5rem;*/
    background-color: lightyellow;
    color: darkred;
    border: 2px solid darkred;
}

div[id$="-success"] {
    /*min-height: 5rem;*/
    background-color: white;
    color: green;
    border: 2px solid green;
}

@media (min-width: 768px) {
    .text-multi-column {
        column-count: 1
    }

    .text-sm-small {
        font-size: 13px;
    }

    .text-sm-large {
        font-size: 19px;
    }
}

@media (min-width: 992px) {
    .text-multi-column {
        column-count: 2
    }

    .text-md-small {
        font-size: 15px;
    }

    .text-md-large {
        font-size: 23px;
    }
}