/* The message box is shown when the user clicks on the password field */
#pwdmsg {
display:none;
background: #f8f7fa;
color: #000;
position: relative;
padding: 20px;
margin-top: 10px;
}

#pwdmsg p {
padding: 0px 0px;
font-size: 13px;
}

/* Add a green text color and a checkmark when the requirements are right */
.valid {
color: var(--col-text);
}

.valid:before {
position: relative;
left: -35px;
content: "✔";
}

/* Add a red text color and an "x" when the requirements are wrong */
.invalid {
color: #f6be2d;
}

.invalid:before {
position: relative;
left: -35px;
content: "✖";
}