#content ,.card-cont{
	/*border: 1px solid #ff0000;*/
}


.bookmark-card{
	/*height: 200px;*/
	/*aaaaaaaaaaaaaaaaaaaaaaaa*/
	background-size: cover;
}
.bookmark-card-cont{
	/*height: 200px;*/
	width: 90%;
	background-color: rgb(51,51,51,0.2);
	backdrop-filter: saturate(100%) blur(5px);
	-webkit-backdrop-filter: saturate(100%) blur(5px);
	color: #fff;
	font-size: 25px;
	font-weight: bold;
	padding: 0 5%;
	/*padding-top: 30%;*/
	/*line-height: 200px;*/
	text-align: center;
}


@media screen and (min-width: 1301px) {
	.card-button img{
		width: 20px;
		height: 20px;
	}
	.card-loc, .card-star{
		font-size: 14px;
	}
	.card-text{
		padding: 2% 0;
	}
	.card-time{
		font-size: 12px;
	}
	.card-user{
		width: 25px;
		height: 25px;
	}
}
@media screen and (min-width: 1024px) and (max-width: 1300.9px) {
	.card-button img{
		width: 18px;
		height: 18px;
	}
	.card-loc, .card-star{
		font-size: 14px;
	}
	.card-text{
		padding: 2% 0;
	}
	.card-time{
		font-size: 12px;
	}
	.card-user{
		width: 23px;
		height: 23px;
	}
}
@media screen and (min-width: 721px) and (max-width: 1023.9px) {
	.card-button img{
		width: 14px;
		height: 14px;
	}
	.card-loc, .card-star{
		font-size: 13px;
	}
	.card-text{

		padding: 1% 0;
	}
	.card-time{
		font-size: 11px;
	}
	.card-user{
		width: 20px;
		height: 20px;
	}
}
@media screen and (min-width: 721px) {
	.card,
	.bookmark-card {
	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	    transition: 0.3s;
	    border: 1px solid #ccc;
		border-radius: 10px;
		display: inline-block;
		overflow: hidden;
	}
	.bookmark-card div{
		border-radius: 10px;
	}
	.card:active,
	.card:hover,
	.bookmark-card:active,
	.bookmark-card:hover {
	    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.5);
	}
	.card-img {
		width: 100%;
	}
	.card-cont{
		margin: 3% 5%;
		position: relative;
	}
	.card-button img{
		padding: 0 4% 0 0;
	}
	.card-button .bookmark{
		padding: 0;
		position: absolute;
		right: 0;
	}
	.card-star{
		color: #9D5C2B;
	}
	.card-text{
	width: 100%;
	overflow: hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
	}
	.card-time{
		color: #999;
	}
	.card-user{
	    border: thin solid #ccc;
	    border-radius: 999em;
		position: absolute;
		bottom: 1%;
		right: 0%;
		/*margin-bottom: 2%;*/
	}
}

@media screen and (max-width: 720.9px) {
	.card,
	.bookmark-card {
	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	    transition: 0.3s;
	    border: 1px solid #ccc;
		border-radius: 10px;
		display: inline-block;
		overflow: hidden;
	}
	.card:active,
	.card:hover,
	.bookmark-card:active,
	.bookmark-card:hover {
	    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.5);
	}
	.card-img {
		width: 100%;
	}
	.card-cont{
		margin: 3% 5%;
		position: relative;
	}
	.card-button img{
		padding: 0 4% 0 0;
	}
	.card-button .bookmark{
		padding: 0;
		position: absolute;
		right: 0;
	}
	.card-star{
		color: #9D5C2B;
	}
	.card-text{
	width: 100%;
	overflow: hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
	}
	.card-time{
		color: #999;
	}
	.card-user{
	    border: thin solid #ccc;
	    border-radius: 999em;
		position: absolute;
		bottom: 1%;
		right: 0%;
		/*margin-bottom: 2%;*/
	}
	
	.card-button img{
		width: 14px;
		height: 14px;
	}
	.card-loc, .card-star{
		font-size: 12px;
	}
	.card-text{
		padding: 1% 0;
	}
	.card-time{
		font-size: 12px;
	}
	.card-user{
		width: 20px;
		height: 20px;
	}
}
@media screen and (min-width: 360px) and (max-width: 720.9px) {
	
}
@media screen and (max-width: 359.9px) {
	
}