.help-block {
  opacity: 0;
  position: absolute;
  top: -22px;
  right: -8px;
  border: 1px solid brown;
  padding: 4px 8px;
  background-color: #ffe400;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  border-radius: 6px;
  -webkit-transition: all .5s ease-in-out 0s;
  transition: all .5s ease-in-out 0s;
  color: brown;
  font-size: 0.8rem; }
  .help-block::after {
    content: "";
    position: absolute;
    left: 20px;
    bottom: -20px;
    border: 10px solid transparent;
    border-top: 10px solid; }

.has-error {
  /*    .input-contact::not(:focus) {
            box-shadow: 0 0 16px 0px brown;
            border-color: brown;
        }*/ }
  .has-error .help-block {
    opacity: .9; }
  .has-error .input-contact:focus ~ .help-block {
    opacity: .1; }

.has-success {
  /*    .input-contact {
            box-shadow: 0 0 16px 0px green;
            border-color: green;
        }*/ }