.fake-notification {
  height: 6rem;
  padding: 0 1.5rem;
  font: 1.53rem/1.8rem auto;
  color: #e7e7e7;
  overflow: hidden;
  border-bottom: .1rem solid rgba(255, 255, 255, .05);
}

.fake-notification [data-icon] {
  float: left;
  width: 3rem;
  height: 3rem;
  margin: 1.5rem 0;
}

/* alert icon: white on red background */
[data-icon].alert {
  color: #fff;
  background-color: #b90000;
  border-radius: 50%;
  width: 2.4rem;
  height: 2.4rem;
  margin: 1.8rem 0;
}

[data-icon].alert:before {
  overflow: hidden;
  display: block;
  border-radius: 50%;
  font-size: 2rem; /* Slightly decreasing font-size to get the icon to fit in the circle */
  margin-top: -0.2rem;
  text-align: center;
}

.fake-notification .title-container {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fake-notification .detail {
  color: #858585;
  font-size: 1.4rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notification.attention-notification {
  background-color: rgba(0, 202, 242, 0.3);
}

/* RTL View */

html[dir="rtl"] .fake-notification [data-icon] {
  float: right;
}