xos-header {
  .badge {
    display: block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    border: 4px solid red;
    background: transparent;
    position: absolute;
    right: 15px;
    top: 18px;
  }

  .fa {
    cursor: pointer;
  }

  .notification-panel {
    position: absolute;
    background: darken(grey, 5);
    right: 10px;
    top: 60px;
    border: 1px solid darken(grey, 35);
    max-height: 200px;
    overflow-y: scroll;

    ul {
      margin: 0;
      padding: 0;
      list-style: none;

      li {
        padding: 10px;
        border-bottom: 1px solid darken(grey, 35);
        color: #fff;

        &.viewed {
          background: darken(grey, 20);
        }
      }
    }
  }
}