.page-notif {
  position: fixed;
  top: 50px;
  padding: 20px;
  left: 50%;
  -ms-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  color: #234600;
  border: 1px solid #be7;
  background: #f8fff0;
  min-width: 50%;
  max-width: 1412px;
  z-index: 15;
}

@media (max-width: 1024px) {
  .page-notif {
    width: 90%;
  }
}

.page-notif.center {
  top: 50%;
}

.page-notif.status {
  background: #f8fff0;
}

.page-notif.warning {
  background: #fffce5;
}

.page-notif.error {
  background: #fef5f1;
}

.page-notif > span.notif-close {
  position: absolute;
  right: 5px;
  top: 0;
  padding: 5px;
  cursor: pointer;
}