/*==================================================
  Friend List CSS = Newsfeed and Timeline
  ==========.========================================*/

.friend-list .friend-card {
  border-radius: 4px;
  border-bottom: 1px solid #f1f2f2;
  overflow: hidden;
  margin-bottom: 20px;
}

.friend-list .friend-card .card-info {
  padding: 0 20px 10px;
}

.friend-list .friend-card .card-info img.profile-photo-lg {
  margin-top: -60px;
  border: 7px solid #fff;
}

img.profile-photo-lg {
  height: 80px;
  width: 80px;
  border-radius: 50%;
}

.tx-green {
  color: #10a510;
}
.bg-green {
  background-color: #036303;
}
.text-red {
  color: red;
}
h3 {
  font-weight: bolder;
}
.card-icon {
  display: inline-block;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  margin-top: -40px;

  text-align: center;
  vertical-align: top;
}
.card-icon .fas,
.card-icon .far {
  color: #fff;
  font-size: 2rem;
  line-height: 4.5rem;
}
.info {
  height: 100px;
}
.bg-5 {
  background: linear-gradient(135deg, #f59c28, #ec0808) !important;
}
.bg-10 {
  background: linear-gradient(135deg, #2888f5, #1f08ec) !important;
}
.bg-15 {
  background: linear-gradient(135deg, #024b9e, #08beec) !important;
}
.bg-20 {
  background: linear-gradient(135deg, #07da46, #055e05) !important;
}
.bg-30 {
  background: linear-gradient(135deg, #c528f5, #540483) !important;
}
.bg-gradient {
  background: radial-gradient(#0e728b, #03e29f);
  border-radius: 15px;
}
.bg-gradient-blue {
  background: radial-gradient(#1fe4f5, #3fbafe);
  border-radius: 15px;
}
.bg-blue {
  background: #2888f5;
}
.bg-blue-500 {
  background: #08a6f0;
}
.bg-blue-light {
  background-color: #1f08ec;
}
.tx-blue {
  color: blue;
}
.tx-blue-light {
  color: #0087f5;
}
.bg-purple {
  background-color: #540483;
}
.tx-purple {
  color: #c528f5;
}
.bolder {
  font-weight: bolder;
}
.my-50 {
  margin-top: -150px;
}
.mt-10{
  margin-top: 55px;
}