.mdc_pwd_strength {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#strength-progress {
    width: 70%;
    border-radius: 2px;
    margin-top: -15px;
    margin-bottom: 10px;
}

#strength-progress::-webkit-progress-bar {
    background-color: rgb(253, 250, 250);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
    border-radius: 2px;
}

#strength-label {
    width: 30%;
    margin-bottom: 10px;
    margin-top: -15px;
    align-items: center;
    text-align: center;
}

#strength-progress::-webkit-progress-value {
    border-radius: 2px;
}

.strength-Bad::-webkit-progress-value {
    background-color: rgb(160, 20, 20);
}

.strength-Mauvais::-webkit-progress-value {
    background-color: rgb(160, 20, 20);
}


.strength-Weak::-webkit-progress-value {
    background-color: rgb(255, 142, 4);
}

.strength-Faible::-webkit-progress-value {
    background-color: rgb(255, 142, 4);
}

.strength-Good::-webkit-progress-value {
    background-color: rgb(188, 224, 28);
}

.strength-Bon::-webkit-progress-value {
    background-color: rgb(188, 224, 28);
}

.strength-Strong::-webkit-progress-value {
    background-color: rgb(59, 192, 59);
}

.strength-Fort::-webkit-progress-value {
    background-color: rgb(59, 192, 59);
}

.strength-Excellent::-webkit-progress-value {
    background-image: linear-gradient(-45deg,
            rgb(34, 110, 19),
            rgb(59, 192, 59),
            rgb(34, 110, 19),
            rgb(59, 192, 59));
}

#input-pwd-error {
    outline-color: rgb(255, 76, 76);
    outline-style: solid;
    outline-width: 0.1875rem;
    padding-left: -2px !important;
}

#alea-btn {
    background-color: #7A7A7A;
    padding: .78rem 1rem;

}

/* Firefox */

#strength-progress::-moz-progress-bar {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
    border-radius: 2px;
}

#strength-progress::-moz-progress-value {
    border-radius: 2px;
}

.strength-Bad::-moz-progress-bar {
    background-color: rgb(160, 20, 20);
}

.strength-Mauvais::-moz-progress-bar {
    background-color: rgb(160, 20, 20);
}

.strength-Weak::-moz-progress-bar {
    background-color: rgb(255, 142, 4);
}

.strength-Faible::-moz-progress-bar {
    background-color: rgb(255, 142, 4);
}

.strength-Good::-moz-progress-bar {
    background-color: rgb(188, 224, 28);
}

.strength-Bon::-moz-progress-bar {
    background-color: rgb(188, 224, 28);
}

.strength-Strong::-moz-progress-bar {
    background-color: rgb(59, 192, 59);
}

.strength-Fort::-moz-progress-bar {
    background-color: rgb(59, 192, 59);
}

.strength-Excellent::-moz-progress-bar {
    background-image: linear-gradient(-45deg,
            rgb(34, 110, 19),
            rgb(59, 192, 59),
            rgb(34, 110, 19),
            rgb(59, 192, 59));
}