/**
 * Notice
 */
.notice {
  position: relative;
  font-size: 15px;
  line-height: 22px;
  padding: 15px;
  padding-left: 55px;
  color: #656565;
  /* border-bottom: 1px solid #FFFFFF;
  border-right: 1px solid #FFFFFF; */
  border-radius: 3px;
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
  background-color: #E0E0E0;
}

/* .notice:before {
  display: block;
  position: absolute;
  content: ' ';
  top: 50%;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, .1);
  overflow: hidden;
} */

.notice i {
  display: inline-block;
  visibility: visible;
  font-size: 28px;
  line-height: 28px;
  position: absolute;
  top: calc(50% - 14px);
  left: 15px;
}

.notice.light {
  color: #656565;
  border: 1px solid #E0E0E0;
  background-color: #FFFFFF;
}

.notice.light i {
  fill: #656565;
  color: #656565;
}

.notice.grey {
  color: #656565;
  background-color: #E0E0E0;
}

.notice.grey i {
  fill: #656565;
  color: #656565;
}

.notice.blue {
  color: #fff;
  background-color: #3786e5;
}

.notice.blue i {
  fill: #fff;
  color: #fff;
}

.notice.yellow {
  color: #000;
  background-color: #fff19a;
}

.notice.yellow i {
  fill: #000;
  color: #000;
}

.notice.orange {
  color: #fff;
  background-color: #FFBD7D;
}

.notice.orange i {
  fill: #fff;
  color: #fff;
}

.notice.green {
  color: #fff;
  background-color: #7acb48;
}

.notice.green i {
  fill: #fff;
  color: #fff;
}

.notice.red {
  color: #fff;
  background-color: #cd1212;
}

.notice.red i {
  fill: #fff;
  color: #fff;
}

.notice a {
  color: inherit !important;
  text-decoration: underline !important;
}

.notice a:hover {
  text-decoration: none !important;
}