
.fa-green {
    color: var(--inputCorrect);
}

.fa-red {
    color: var(--inputIncorrect);
}

.inputCorrect {
    box-shadow: 2px 2px 3px var(--inputCorrect);
}

.inputIncorrect {
    box-shadow: 2px 2px 3px var(--inputIncorrect);
}

.inputVide {
}


input, select {
    box-shadow: 2px 2px 3px black;
    padding: 0.5em;
}

label {
    align-self: center;
}

fieldset {
    grid-column: 1 / span 2;
    padding: 0.5em;
}

form {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    grid-gap: 0.5em;
    grid-auto-rows: minmax(1em, auto);
    width: 75%;
}
.colSpan2{
    grid-column: 1 / span 2;
}

.oeil {
    position: absolute;
    right: 0.5em;
    margin-top:0.5em;
}

.infoBulle {
    position: absolute;
    background-color: whitesmoke;
    margin-top: 3vh;
    right: 0;
    z-index: 10;
    white-space: nowrap;
} 

.col-span-form {
    grid-column: 1/5 ;
}

.gridAideMDP {
    display: grid;
    grid-template-columns: 0.1fr 2fr;
    grid-gap: 0.2em;
    grid-auto-rows: minmax(1em, auto);
    width: 75%;
}