/* ------------------------------------- */
/* 6. FORM NOTIFICATIONS ............... */
/* ------------------------------------- */
.block-message,
#block-answer {
  position: fixed;
  z-index: 99999;
  top: 2rem;
  right: -50%;
  display: table;
  width: auto;
  height: auto;
  min-height: 9rem;
  padding: 15px;
  -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  opacity: 0;
  border-radius: 5px;
  background: transparent;
}

.block-message .message,
.block-message #answer,
.block-message .error-message,
.block-message .success-message,
#block-answer .message,
#block-answer #answer,
#block-answer .error-message,
#block-answer .success-message {
  display: table-cell;
  padding-left: 6rem;
  vertical-align: middle;
}

.block-message .message p.notify-valid,
.block-message #answer p.notify-valid,
.block-message .error-message p.notify-valid,
.block-message .success-message p.notify-valid,
#block-answer .message p.notify-valid,
#block-answer #answer p.notify-valid,
#block-answer .error-message p.notify-valid,
#block-answer .success-message p.notify-valid {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0;
  text-transform: none;
  color: #FFFFFF;
}

.block-message .message p.notify-valid span,
.block-message #answer p.notify-valid span,
.block-message .error-message p.notify-valid span,
.block-message .success-message p.notify-valid span,
#block-answer .message p.notify-valid span,
#block-answer #answer p.notify-valid span,
#block-answer .error-message p.notify-valid span,
#block-answer .success-message p.notify-valid span {
  font-size: 30px;
  line-height: 1;
  position: absolute;
  top: 2rem;
  left: 0;
  display: block;
  height: calc(100% - 4rem);
  padding: 0 2rem;
  color: rgba(17, 17, 17, 0.2);
  border-right: 2px solid rgba(17, 17, 17, 0.1);
}

.block-message .message p.notify-valid span.validation,
.block-message #answer p.notify-valid span.validation,
.block-message .error-message p.notify-valid span.validation,
.block-message .success-message p.notify-valid span.validation,
#block-answer .message p.notify-valid span.validation,
#block-answer #answer p.notify-valid span.validation,
#block-answer .error-message p.notify-valid span.validation,
#block-answer .success-message p.notify-valid span.validation {
  color: #00c8aa;
}

.block-message .message p.notify-valid span i,
.block-message #answer p.notify-valid span i,
.block-message .error-message p.notify-valid span i,
.block-message .success-message p.notify-valid span i,
#block-answer .message p.notify-valid span i,
#block-answer #answer p.notify-valid span i,
#block-answer .error-message p.notify-valid span i,
#block-answer .success-message p.notify-valid span i {
  position: relative;
  top: 0;
  top: calc(50% - 15px);
  display: block;
  height: 100%;
}

.block-message.show-block-error,
#block-answer.show-block-error {
  right: 2rem;
  opacity: 1;
  background: var(--theme-color);
}

.block-message.show-block-valid,
#block-answer.show-block-valid {
  right: 2rem;
  opacity: 1;
  background: var(--theme-color);
}
#block-answer span {
    color: #fff !important;
}
.col.display-none {
    display: none;
}