body a{
    text-decoration: none;
    color: #000;
  }
  .head{
    height: 50px;
    background: #000;
    color: #fff;
  }
  .profile{
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background: #a89a;
    float: left;
  }

  .user-img{
    justify-content: center;
    text-align: center;
    height: 50px;
    width: 50px;
    border-radius: 50%;
  }
  .name_p{
    text-align: left;
    color: #fff;
    padding: 15px;
    margin-left: 8px;
    font-size: 18px;
    font-family: helvetica, arial, sans-serif;
  }








/*this is the style sheet for friends card*/
.friend-card-box{
width: 100%;
display: block;
height: 80px;
margin: 6px 2px;
border-bottom:1px solid #ccc;
}

.friend-card-box-image{
width: 50px;
height: 50px;
margin: 6px 6px;
display: block;
float: left;
}

.friend-card-box-image .profile{
width: 50px;
height: 50px;
border-radius: 50%;
justify-content: center;
background-size: contain;
object-fit: cover;
object-position: center;
}

.friend-card-box-name{
float: left;
width: 75%;
height: 35px;
margin:4px 4px;
}

.friend-card-box-name .name{
font-family: Helvetica;
font-size: 18px;
font-weight: bold;
line-height: 1.38;
color: #222;
text-decoration:none;
margin-bottom:2px;
}


.friend-card-box-name span{
display: block;
margin: 2px 2px;
font-family: Helvetica;
font-size:14px;
color: #222;
}


.friend-card-box-function{
width: 75%;
float: left;
height: 20px;
margin: 8px 8px;
}

.friend-card-box-function span{
display: inline-block;
width: 30%;
font-family: Helvetica;
font-size:14px;
color: #90949c;
height: 15px;
}