/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 08 2025 | 12:44:17 */
/*---------------------------------------------------------------Desktop-------------------------------------------------------------*/
.blog-card-wrapper {
	display: flex;
	flex-direction:row;
	flex-wrap: wrap;
	justify-content:center;
	gap: 36px 28px;
}
.link-wrapper{
	width:31.8%;
}
.blog-card {
	border: 1px solid #ddd;
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.blog-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.blog-image img {
	width: 100%;
	height: auto;
	display: block;
}
.blog-content {
	padding: 16px;
}
.blog-title {
	font-family: "Anton", sans-serif;
	font-size: 28px;
	line-height:36px;
	margin-bottom: 10px;
	color: #212121;
}
.blog-excerpt {
	font-family: "Manrope", sans-serif;
	font-size: 20px;
	color: #212121;
	line-height: 28px;
	margin-bottom: 30px;
}
.blog-pagination {
	margin-top: 30px;
	text-align: center;
}
.blog-pagination .page-numbers {
	margin: 0 5px;
	padding: 8px 12px;
	background: #f0f0f0;
	color: #333;
	border-radius: 4px;
	text-decoration: none;
}
.blog-pagination .current {
	background: #FFD233;
	color: #fff;
	font-weight: bold;
}
.loader {
	display: inline-block;
	width: 30px;
	height: 30px;
	border: 3px solid #ccc;
	border-top: 3px solid #333;
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}
@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}
.content {
	padding:0 80px;
	margin-top:120px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.breadcrumb{
	font-family: "Manrope", sans-serif;
	font-size:14px;
	line-height:22px;
}
.breadcrumb a{
	color: #868686;
}
.breadcrumb span{
	font-weight: 700;
	color: #FFD233;
}
.heading-paragraph{
	display: flex;
	flex-direction: column;
	gap:24px;
}
.image-container img{
	width:100%;
	border-radius:16px;
}
.content .heading-paragraph .post-title h1, .heading-paragraph h2, .heading-paragraph h3, .heading-paragraph h4, .heading-paragraph h5, .recent-header h2 {
	font-family: "Anton", sans-serif;
	font-weight: 400;
	margin: 0 0 12px;
	padding: 0;
	color: #212121;
	
}
.content .heading-paragraph p, .card-content .card-title a {
	font-family: "Manrope", sans-serif;
	font-weight: 400;
	margin: 0;
	padding: 0;
	color: #212121;
}
.content .heading-paragraph .post-title h1 {
	font-size: 56px;
	line-height: 64px;
}
.heading-paragraph h2, .recent-header h2 {
	font-size: 40px;
	line-height:48px;
}
.heading-paragraph h3{
	font-size:32px;
	line-height:40px;
}
.heading-paragraph h4{
	font-size:24px;
	line-height:32px;
}
.content .heading-paragraph p, .card-content .card-title a {
	font-size: 20px;
	line-height: 28px;
	margin-bottom:24px;
}
/*Recent posts*/
.recent-posts{
	margin-top:8px;
}
.recent-posts .recent-header, .post-title{
	display:flex;
	flex-direction:row;
	gap:12px;
	align-items:flex-start;
}
.recent-posts-cards {
	display: flex;
	flex-direction: row;
	gap: 24px;
	justify-content:flex-start;
	align-items:stretch;
	margin-top:24px;
}
.card.recent-post-card {
	width: 32%;
	box-shadow: -2px 2px 8px 0 rgba(36,36,36, .19);
	border-radius: 12px;
	padding:16px 12px;
	cursor:pointer;
}
.card-img img {
	width: 100%;
	height: 220px;
	border-radius: 8px;
}
.card-content .card-title a{
	font-weight:700;
}
.card:hover .card-title a{
	color:#FFD233;
}
.card-content .card-title{
	margin: 12px 0 0;
}
.content .heading-paragraph .post-title h1 {
	font-size: 56px;
	line-height: 64px;
}
.heading-paragraph h2, .recent-header h2 {
	font-size: 40px;
	line-height:48px;
}
.heading-paragraph h3{
	font-size:32px;
	line-height:40px;
}
.heading-paragraph h4{
	font-size:24px;
	line-height:32px;
}
.content .heading-paragraph p, .card-content .card-title a {
	font-size: 20px;
	line-height: 28px;
}
/*----------------------------------------------------------------Tablet-------------------------------------------------------------*/
@media(min-width:768px) and (max-width:1024px) {
	.blog-card-wrapper {
		gap: 30px 28px;
	}
	.link-wrapper{
		width:48%;
	}
	.blog-title {
		font-size: 24px;
		line-height:32px;
		margin-bottom:8px;
	}
	.blog-excerpt {
		font-size:16px;
		line-height:24px;
		margin-bottom:20px;
	}
	.content {
		padding:0 24px;
		margin-top: 90px;
	}
	.heading-paragraph{
		gap:20px
	}
	.image-container img{
		border-radius:12px;
	}
	.content .heading-paragraph .post-title h1, .heading-paragraph h2, .heading-paragraph h3, .heading-paragraph h4, .heading-paragraph h5, .recent-header h2{
		margin: 0 0 8px;
	}
	.content .heading-paragraph .post-title h1 {
		font-size: 48px;
		line-height: 56px;
	}
	.heading-paragraph h2, .recent-header h2 {
		font-size:36px;
		line-height:44px;
	}
	.heading-paragraph h3{
		font-size:28px;
		line-height:36px;
	}
	.heading-paragraph h4{
		font-size:20px;
		line-height:28px;
	}
	.content .heading-paragraph p , .card-content .card-title a{
		font-size: 16px;
		line-height: 24px;
		margin-bottom:20px;
	}
	/*Recent posts*/
	.recent-posts .recent-header, .post-title{
		gap:8px;
	}
	.recent-posts-cards{
		gap:20px;
		margin-top:20px;
	}
	.card.recent-post-card {
		padding:12px 8px;
	}
	.card-img img {
		height: 140px;
	}
	
}
/*----------------------------------------------------------------Mobile-------------------------------------------------------------*/
@media (max-width: 767px) {
	.blog-card-wrapper {
		gap: 24px;
	}
	.link-wrapper{
		width:100%;
	}
	.blog-card{
		border-radius: 8px;
	}
	.blog-content {
		padding: 12px;
	}
	.blog-title {
		font-size: 20px;
		line-height:28px;
		margin-bottom:4px;
	}
	.blog-excerpt {
		font-size:12px;
		line-height:20px;
		margin-bottom:10px;
	}
	.content {
		padding:0 24px;
		margin-top: 80px;
	}
	.heading-paragraph{
		gap:16px
	}
	.image-container img{
		border-radius:8px;
	}
	.content .heading-paragraph .post-title h1, .heading-paragraph h2, .heading-paragraph h3, .heading-paragraph h4, .heading-paragraph h5, .recent-header h2{
		margin: 0 0 4px;
	}
	.content .heading-paragraph .post-title h1 {
		font-size: 36px;
		line-height: 44px;
	}
	.gradient-box{
		width:8px;
	}
	.post-title .gradient-box{
		height:48px;
	}
	.heading-paragraph h2, .recent-header h2 {
		font-size:28px;
		line-height:36px;
	}
	.heading-paragraph h3{
		font-size:24px;
		line-height:32px;
	}
	.heading-paragraph h4{
		font-size:16px;
		line-height:24px;
	}
	.content .heading-paragraph p, .card-content .card-title a {
		font-size: 14px;
		line-height: 22px;
	}
	/*Recent posts*/
	.recent-posts-cards{
		flex-wrap:wrap;
	}
	.recent-posts .recent-header, .post-title{
		gap:4px;
	}
	.recent-posts-cards{
		margin-top:16px;
	}
	.card.recent-post-card{
		width:100%;
		border-radius: 8px;
		padding:10px 8px;
	}
	.card-img img {
		height: 198px;
		border-radius:4px;
	}
}