.friends{
	
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-left: -10px;
	margin-right: -10px;

}

.friends:after{
	
	content: ""; 
	width: calc(50% - 14px);
	margin: 7px;

}

.friend-button{

	
	width: calc(50% - 14px);
	height: 70px;
	margin: 4px 3px;
	padding: 2px 3px;
	/* color: black; */
	background-size:cover;
	-webkit-background-size:cover;
	-o-background-size:cover;
	border-radius: 4px;
	box-shadow: 0px 0px 1px black;

	
}
	
@media(min-width: 1300px){

	.friend-button{

		width: calc(33% - 14px);

	}

		
	.friends:after{
		
		content: ""; 
		width: calc(33% - 14px);
		margin: 7px;

	}

}
.ftitle{
	
	font-size: 16px;
	font-weight: bold;
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
	margin-top: 6px;
	margin-bottom: -4px;

}

.furl {

    font-size: 10px;
    color: var(--burl);
    white-space: nowrap;
    /* text-overflow: ellipsis; */
    overflow: hidden;
    /* word-break: break-all; */
	display: inline;
	
}

.fimg{
	
	float: left;
	height: 30px;
	margin: 10px 9px 0px 5px;
	border-radius: 100px;
	
}

.fintro{
	
	margin: 1px 6px;
	font-size: 11px;
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;

}