.zxcvbn input[type="password"] {
    font-size: 1.5em;
}
.zxcvbn input[type="password"]:focus {
    transition: background 0.5s linear;
}
.zxcvbn input[type="password"]::placeholder {
    color: #aaa;
}
.zxcvbn input[type="password"]:focus::placeholder {
    color: transparent;
}
.strength1,
.strength2,
.zxcvbn input[type="password"].strength1,
.zxcvbn input[type="password"].strength2 {
    background-color: #C63136;
}
.strength3,
.strength4,
.zxcvbn input[type="password"].strength3,
.zxcvbn input[type="password"].strength4 {
    background-color: #DE7B46;
}
.strength5,
.zxcvbn input[type="password"].strength5 {
    background-color: #2F8249;
}
#explanation {
    font-size: 1em;
}
#explanation strong {
    font-size: 2.2em;
    display: block;
    text-transform: uppercase;
}
.zxcvbn input[type="password"].strength1,
.zxcvbn input[type="password"].strength2,
.zxcvbn input[type="password"].strength3,
.zxcvbn input[type="password"].strength4,
.zxcvbn input[type="password"].strength5,
.zxcvbn input[type="password"].strength1:focus,
.zxcvbn input[type="password"].strength2:focus,
.zxcvbn input[type="password"].strength3:focus,
.zxcvbn input[type="password"].strength4:focus,
.zxcvbn input[type="password"].strength5:focus {
    color: #fff;
}