.password-policy-rules {
  display: none;
  margin-top: 5px;
  font-size: 12px;
  font-family: 'Open Sans';
}
.password-policy-rules.active { 
  display: block;
}
.password-policy-rules .validation-group {   
  display: inline-block;
  margin-top: 10px;
}
.password-policy-rules .validation-group > label {
  color: #707070;
  font-weight: bold;
  margin-bottom: 10px;
  display: inline-block;
  font-size: 12px !important;
  padding: 0 !important;
}
.password-policy-rules .validation-group .rules {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.password-policy-rules .condition {
  position: relative;
  display: inline-block;  
  margin-bottom: 5px;
  min-width: 180px;
}
.password-policy-rules .condition .state-flag {
  position: relative;
  display: inline-block;
  margin-right: 5px;
  vertical-align: middle;  
}
.password-policy-rules .condition .state-flag::before {
  display: block;
  content: '';
  background-image: url('//static.photoweb.fr/image/password-validation/neutral.svg');
  background-size: 17px 17px;
  height: 17px;
  width: 17px;
}
.password-policy-rules .condition.valid .state-flag::before {
  background-image: url('//static.photoweb.fr/image/password-validation/valid.svg');
}
.password-policy-rules .condition.invalid .state-flag::before {
  background-image: url('//static.photoweb.fr/image/password-validation/invalid.svg');
}
.password-policy-rules .condition .state-label {
  color: #707070;
  vertical-align: middle;
  display: inline-block !important;
  padding: 0 !important;
}

input[type="password"].invalid-password-policy-rules, input[type="password"].form-input.invalid-password-policy-rules:focus {  
  outline: 2px auto #FF0000;
}