.links{
	&-content{
		.content-style();
		&-data {
			display: flex;
			width: 100%;
			box-sizing: border-box;
			padding: 64px 80px;
			font-size: 18px;
			justify-content: space-between;
			flex-wrap: wrap;
			transition: all 0.4s ease-in-out;
			img {
				display: flex;
				width: 100%;
				height: 100%;
			}
			&-item{
				display: flex;
				padding: 20px;
				margin-right: 10px;
				border-radius: 10px;
				margin-bottom: 20px;
				background: #ffffff;
				border: 1px solid #F8F9FB;
				cursor: pointer;
				position: relative;
				top: 0;
				transition: ease-in-out;
				-moz-transition: all .4s;
				-webkit-transition: all .4s;
				-o-transition: all .4s;
				&:hover {
					background: #F8F9FB;
					top: -10px;
					box-shadow: 0 10px 10px 0 rgba(50,50,50,0.1);
				}
				a {
					width: 100%;
					height: 100%;
					text-decoration: none;
					color: #333333;
				}
				.card {
					display: flex;
					.user-link-image {
						display: flex;
						width: 48px;
						height: 48px;
						img {
							border-radius: 50%;
						}
					}
					.user-link-info {
						display: flex;
						flex-direction: column;
						min-width: 166px;
						padding-left: 10px;
						padding-top: 6px;
						h1 {
							max-width: 170px;
							color: #3C4858;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
							font-weight: 500;
							font-size: 16px;
						}
						span {
							max-width: 170px;
							color: #718096;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
							font-size: 14px;
						}
					}
				}
			}
			&-info {
				width: 100%;
				margin-top: 20px;
			}	
		}	
	}
}




@media screen and (max-width:800px) {
	.links-content {
		&-data{
			padding: 64px 50px;
		}
	}
}

@media screen and (max-width:600px) {
	.links-content {
		&-data{
			padding: 64px 20px;
		}
	}
}