﻿.progress-form fieldset:not(:first-of-type) {
    display: none;
}

.progress-form .btn:not(a) {
    display: block;
    margin: auto;
}

.step-progression {
    overflow: hidden;
    color: lightgrey;
    padding-left: 0;
}

    .step-progression li {
        list-style-type: none;
        font-size: 0.9375rem;
        float: left;
        position: relative;
        font-weight: 400;
        width: calc(100% / var(--nb-steps));
    }

        .step-progression li:before {
            width: 50px;
            height: 50px;
            line-height: 50px;
            display: block;
            font-size: 1.25rem;
            color: #fff;
            background-color: lightgray;
            border-radius: 50%;
            margin: 0 auto 10px auto;
            font-family: FontAwesome;
            content: attr(data-icon);
        }

        .step-progression li:after {
            content: '';
            width: 100%;
            height: 2px;
            background-color: lightgray;
            position: absolute;
            left: 0;
            top: 25px;
            z-index: -1;
        }

.progress {
    height: 20px;
    background-color: #eee;
}

.fadeout {
    animation: fadeout .3s;
}

.fadein {
    animation: fadein .3s;
}

@keyframes fadeout {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}