.article-block {
	margin-top: 40px;
}

.article-block .card {
	background-color: transparent !important;
	border: 0;
	margin-bottom: 2rem;
}

.article-block .card:hover .img-cover {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

.article-block .article-desc:before {
	content: "";
	background-color: #eeb211;
	position: absolute;
	right: 2px;
	bottom: 2px;
	width: 90%;
	height: 90%;
	-webkit-transition: .6s;
	transition: .6s;
}

.article-block .card:hover .article-desc:before {
	right: -6px;
	bottom: -6px
}

.article-block .article-desc {
	background-color: #ffffff;
	margin-top: -2.5rem;
	position: relative;
}

.article-block h4 {
	font-size: 16px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.article-block .article-category {
	position: absolute;
	top: -20px;
	left: -10px;
	font-size: 14px;
	background-color: #d50f25;
	color: #ffffff;
	padding: 4px 8px;
	box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.1);
}

.article-block .card:hover h4 {
	color: #dc3545;
}

.article-block .img-cover {
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	max-width: 100%;
	position: relative;
	box-shadow: 0 0 30px 0 rgba(27, 30, 36, 0.1);
}

.article-block .bg-white {
	position: inherit;
	box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.1);
}

.article-detail .article-header {
	margin-bottom: 20px;
}

.article-detail .article-header h1 {
	margin-top: 10px;
	font-size: 28px;
}

.article-detail .article-header p {
	margin-bottom: 10px;
}

@media (max-width: 576px) {
	.article-block h4 {
		font-size: 14px;
	}
	.article-detail .article-header h1 {
		font-size: 24px;
	}
}
