.notifications-box {
  position: absolute;
  z-index: 1000;
  width: 300px;
  background: #fff;
  border: 1px solid #cccc;
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15), 0 5px 15px -5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15), 0 5px 15px -5px rgba(0, 0, 0, 0.5);
}
.notifications-box .top {
  padding: 16px;
  border-bottom: 1px solid #eee;
}
.notifications-box .top .btn {
  margin-top: -3px;
}
.notifications-box .inject {
  height: 288px;
  overflow: auto;
}
.notifications-box .notification {
  border-bottom: 1px solid #eee;
}
.notifications-box .notification a.open {
  display: block;
  padding: 10px 16px;
  color: #333;
}
.notifications-box .notification a.open:hover {
  text-decoration: none;
}
.notifications-box .notification:hover {
  background: #fcfcfc;
}
.notifications-box .notification .right {
  margin-left: 20px;
  margin-top: 10px;
  margin-right: 10px;
}
.notifications .notification {
  position: relative;
  border-bottom: 1px solid #eee;
}
.notifications .notification.last {
  border-bottom: 0;
}
.notifications .notification > a:hover {
  background: #fafafa;
  text-decoration: none;
}
.notifications .notification.archived {
  opacity: .5;
}
.notifications .notification.archived a {
  color: #333;
}
.notifications .notification .right {
  position: absolute;
  top: 4px;
  right: 4px;
  margin: 0;
}
.notifications .notification .right .btns {
  float: right;
}
.notifications .notification .view,
.notifications .notification .edit,
.notifications .notification .mark {
  color: #777;
  padding: 6px 8px;
  float: left;
  margin-left: 1px;
}
.notifications .notification .mark {
  text-align: center;
  display: block;
}
.notifications .notification .mark:hover::before {
  color: #6EBE01;
}
#content .notifications {
  margin: -30px;
}
#content .notifications .notification > a {
  display: block;
  padding: 30px;
}
#content .notifications .notification .right {
  margin: 0;
}
#content .notifications .notification .view,
#content .notifications .notification .edit,
#content .notifications .notification .mark {
  padding: 26px 20px;
}
li.notifications {
  position: relative;
}
li.notifications span {
  position: absolute;
  top: 0px;
  right: -5px;
  background: #da5a47;
  border: 2px solid #333F4D;
  padding: 0px 4px;
  line-height: 1.5em;
  border-radius: 20px;
  font-size: 0.8em;
}
.center {
  text-align: center;
}