body {
	background: var(--color-white);
}

.listings-banner {
	background-image: url(https://miro.medium.com/v2/resize:fit:720/format:webp/0*M1gkGAj3QgjQKj6G.png);
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: cover;
	height: 50rem;
	padding: 10rem 0;
	position: relative;
	width: 100%;
	z-index: 1
}
.listings-banner .sk-conatiner {
	height: 100%;
}
.listings-banner:before {
	background-color: rgba(var(--color-rgb-black)/50%);
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1
}
.listings-banner h1 {
	color: var(--color-white);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	height: 100%;
}
.blog-listings {
	background-color: #f7fcff;
}
.blogs .sk-container {
	border-bottom: .1rem solid var(--color-border);
	padding-left: var(--gutter-large);
	padding-right: var(--gutter-large);
}

.blog-listings .blogs-inner {
	gap: 3rem;
	padding-top: 0;
}
.blogs-inner {
	align-items: flex-start;
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}
.blog-listings .blogs-inner {
	justify-content: flex-start;
}
.blog-listings .blogs-inner .blog-item {
	background-color: var(--color-white);
	border-radius: 1rem;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
	color: var(--color-black);
}
.blogs-inner .blog-item img {
	border-top-left-radius: 1rem;
	border-top-right-radius: 1rem;
	height: 15rem;
	object-fit: cover;
}
.blog-listings .blog-content {
	padding: var(--gutter-large);
}
.blog-listings .blog-item .sk-h5 {
	cursor: pointer;
	margin-bottom: var(--gutter-base);
}
.blog-listings .blog-content .sk-flex-row {
	gap: 2rem;
}
.blog-content a {
	color: #7a9aff;
}
.blog-listings .blog-content a svg {
	height: 1.2rem;
	width: 1.2rem;
}

.blog-content a svg {
	fill: #7a9aff;
	transform: rotate(180deg);
}
.sk-padding-bottom-small {
	padding-bottom: var(--gutter-small) !important;
}

@media (min-width: 1025px) {
	.home-blogs .blogs-inner .blog-item {
		max-width: 23%
	}

	.blog-listings .blogs-inner .blog-item {
		max-width: 31%
	}
}
@media (max-width: 1024px) {
	.blogs-inner .blog-item {
		max-width: 48%
	}
}

@media (max-width: 768px) {
	.listings-banner {
		height: auto;
		padding: 10rem 0 5rem;
	}
	.listings-banner h1 {
		max-width: 80%;
		margin: 0 auto;
	}
}
	@media (max-width: 600px) {
		.blogs-inner .blog-item {
			max-width: 100%
		}
	}