/* notification-container{
  min-height: 70vh;
} */
.notifications-wrapper{
  margin: 4rem 0;
  width: 100%;
  float: none;
  /* border: 1px solid #BFB8AF; */
  padding: 0;
}
.notification-inner{
  padding: 1.75rem 1.5rem;
  border-top: 1px solid #888;
  color: #505050;
  display: block;
  background-color: #F9F7F3;
  text-decoration: none !important;
}

.notification-inner.unread-notification{
  background-color: #D6715B ;
  border-top-color: #EAEAEA;
}
.notification-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: .5rem;
}
.notification-header h5 {
  color: #2F2B2B;
  font-family: 'Effra-medium' !important;
  font-size: 1.75rem;
  margin: 0;
  line-height: 2.5rem;
}
.unread-notification .notification-header h5 {
  
  color: #fff;
}
.notification-header span {
  color: #888;
  font-size: .9rem;
  font-family: 'Effra-Regular';
  line-height: 1.25rem;
}
.unread-notification  .notification-header span {
  color: #F9F7F3;  
}

.notification-body p {
  color: #505050;
  font-size: 1rem;
  font-family: 'Poppins-Regular';
  line-height: 1.75rem;
  margin: 0;
}
.unread-notification .notification-body p {
  color: #F9F7F3;
  
}

.notification-container .pagination-wrapper{
  margin-top: 0;
}

.notification-inner:hover{
  /* background-color: #D6715B;
  border-color: #fff;
  text-decoration: none; */
}

.notification-inner:hover div > *{
  /* color: #fff; */
}

@media screen and (max-width:600px){
  .notifications-wrapper{
    width: auto;
  }
}