/* Home Sticky 2 */
.wpln-featured {
	display: grid;
	column-gap: 20px;
	row-gap: 20px;
}
.wpln-featured a {
	color: var(--wpln-font-color);
}

.wpln-featured-post-1 a.hit-area:hover h2.entry-title,
.wpln-featured-post-2 a.hit-area:hover h2.entry-title,
.wpln-featured-post-3 a.hit-area:hover h2.entry-title,
.wpln-featured-post-4 a.hit-area:hover h2.entry-title,
.wpln-featured.items-4 .related-links-featured li a:hover {
	color: var(--color-theme-light-blue);
}
.featured-post-wrap {
	display: block;
}
.wpln-featured.items-4 {
	grid-template-columns: 2fr 1px 1fr;
	grid-template-areas:
		"main rule rail"
		"main rule rail"
		"main rule widget";
}
.wpln-featured.items-4 .featured-main {
	grid-area: main;
}
.wpln-featured.items-4 .featured-rail {
	grid-area: rail;
}
.wpln-featured.items-4 .featured-hr {
	grid-area: rule;
	background-color: #ccc;
	width: 1px;
	height: 100%;
}
.wpln-featured.items-4 .wpln-after-sticky {
	grid-area: widget;
}
.wpln-featured.items-4 .wpln-featured-post-1,
.wpln-featured.items-4 .wpln-featured-post-2,
.wpln-featured.items-4 .wpln-featured-post-3,
.wpln-featured.items-4 .wpln-featured-post-4 {
	position: relative;
}

.wpln-featured.items-4 .related-links-featured {
	font-family: 'Charter', 'Palatino', serif;
	font-weight: 700;
	margin-top: 20px;
	list-style: inside;
}
.wpln-featured.items-4 .related-links-featured li {
	margin-bottom: 10px;
	line-height: 1.5;
	font-size: 16px;
}

/* first post grid */
.wpln-featured.items-4 .wpln-featured-post-1 {
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;;
	margin-bottom: 20px;
}
.wpln-featured.items-4 .wpln-featured-post-1 a.hit-area {
	grid-area: main;
	display: grid;
	grid-template-columns: auto 400px;
	grid-template-rows: min-content 1fr;
    grid-template-areas:
        "headline image"
        "excerpt image";
    column-gap: 20px;
}

.wpln-featured.items-4 .wpln-featured-post-1 img {
	grid-area: image;
	grid-row: 1 / span 2;
	width: 100%;
	transition: .2s ease-out;
	align-self: start;
	justify-self: end;
}
.wpln-featured.items-4 .wpln-featured-post-1 .entry-title {
	grid-area: headline;
}
.wpln-featured.items-4 .wpln-featured-post-1 .featured-excerpt {
	grid-area: excerpt;
}

/* second post grid */
.wpln-featured.items-4 .wpln-featured-post-2 a.hit-area {
	display: grid;
	grid-template-columns: auto 220px;
	grid-template-areas: "headline image"
				"excerpt image";
	column-gap: 20px;
}
.wpln-featured.items-4 .wpln-featured-post-2 .entry-title {
	grid-area: headline;
}
.wpln-featured.items-4 .wpln-featured-post-2 .featured-excerpt {
	grid-area: excerpt;
}
.wpln-featured.items-4 .wpln-featured-post-2 img {
	grid-area: image;
	width: 100%;
	grid-row: 1 / span 2;
	transition: .2s ease-out;
	align-self: start;
	justify-self: end;
}
.wpln-featured-post-1:hover img.attachment-genesis-singular-images,
.wpln-featured-post-2:hover img.attachment-genesis-singular-images {
	opacity: .8;
}
.wpln-featured.items-4 .wpln-featured-post-3 {
	display: block;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;;
	margin-bottom: 20px;
}
.wpln-featured.items-4 .wpln-featured-post-4{
	display: block;
}
.wpln-featured-post-3 .attachment-genesis-singular-images,
.wpln-featured-post-4 .attachment-genesis-singular-images {
	display: none;
}
/* compact audio player for featured posts */
.wpln-featured .audio-embed {
	height: auto;
	margin: 16px 0 0;
	background-color: var(--color-theme-bright);
	border-radius: 25px;
	width: 200px;
}
.wpln-featured .jp-audio {
	height: 32px;
}
.wpln-featured .jp-audio .jp-progress {
	line-height: 32px;
	left: 34px;
	height: 32px;
	border-radius: 0 16px 16px 0;
}
.wpln-featured .jp-audio .jp-progress .jp-seek-bar {
	border-radius: 0 16px 16px 0;
	background-color: #215080;
}
.wpln-featured .jp-audio .jp-controls span  {
	line-height: 32px;
	font-size: 16px;
	padding-left: 14px;
}

.wpln-featured .jp-audio .jp-details,
.wpln-featured .jp-audio .jp-time-holder {
	width: auto;
	line-height: 32px;
}
.wpln-featured .jp-audio .jp-details {
	padding: 0 4px;
}
.wpln-featured .jp-audio .jp-time-holder {
	right: 6px;
}
.wpln-featured .jp-audio .jp-controls {
	width: 32px;
	line-height: 32px;
	border-radius: 16px 0 0 16px;
	border-right: none;
}
.wpln-featured .jp-audio .jp-time-holder,
.wpln-featured .jp-audio .jp-duration {
	width: auto;
	line-height: 34px;
}
.wpln-featured .jp-title,
.wpln-featured .jp-audio .jp-time-holder {
	font-size: 16px;
	margin-right: 10px;
	white-space: nowrap;
}
.wpln-featured .jp-title {
	font-weight: 600;
	text-transform: uppercase;
	padding-left: 0;
}

.wpln-featured .jp-audio .jp-time-holder {
	float: right;
	width: auto;
}
/* /Home Sticky 2*/

.wpln-featured .entry-title {
	margin-bottom: 6px;
}

@media only screen and (max-width: 960px) {
	.wpln-featured.items-4 {
		grid-template-columns: auto;
		grid-template-areas:
			"main"
			"rail"
			"widget"
	}
	.featured-hr {
		display: none;
	}
	.wpln-featured.items-4 .wpln-featured-post-2 {
		padding-bottom: 20px;
    	border-bottom: 1px solid #ccc;
    	margin-bottom: 20px;
	}
}

@media only screen and (max-width: 710px) {
	.wpln-featured.items-4 .wpln-featured-post-1 a.hit-area {
		grid-template-columns: auto;
		grid-template-areas:
			"image"
			"headline"
			"excerpt";
		row-gap: 10px;
	}
	.wpln-featured.items-4 .wpln-featured-post-1 img,
	.wpln-featured.items-4 .wpln-featured-post-2 img  {
		grid-row: 1 / span 1;

	}
	.wpln-featured {
		row-gap: 0;
	}
}
	@media only screen and (max-width: 510px) {
		.wpln-featured.items-4 .wpln-featured-post-2 a.hit-area {
			grid-template-columns: auto;
			grid-template-areas:
				"image"
				"headline"
				"excerpt";
			row-gap: 10px;
		}
		.wpln-featured.items-4 .wpln-featured-post-3 a.hit-area,
		.wpln-featured.items-4 .wpln-featured-post-4 a.hit-area {
			row-gap: 10px;
		}

}
