﻿.pl-featured-blog {
	position: relative;
	font-family: "Rubik", sans-serif;
	padding: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: color-mix(in srgb, var(--sp-background-color), transparent calc((1 - var(--sp-opacity)) * 100%));
	--text-hover-color: #9ae6fc;

	@media (min-width: 768px) {
		padding: 60px 30px;
	}
}

.pl-featured-blog::before,
.pl-featured-blog::after {
	content: "";
	position: absolute;
	z-index: 1;
	height: 100%;
	top: 0;
	width: 40%;

	@media (min-width: 768px) {
		width: 20%;
	}
}

/* .pl-featured-blog::before {
	left: 0;
	background-image: linear-gradient(to left, transparent, var(--sp-background-color));
}

.pl-featured-blog::after {
	right: 0;
	background-image: linear-gradient(to right, transparent, var(--sp-background-color));
} */

.pl-featured-blog a,
.pl-featured-blog a:link,
.pl-featured-blog a:visited,
.pl-featured-blog a:hover,
.pl-featured-blog a:active {
	color: var( --text-hover-color );
}

/* "Featured" template. */

.pl-featured-blog .post-featured-thumbs {
	display: flex;
	position: relative;
	z-index: 2;
	flex-direction: column;
}

.pl-featured-blog .post-featured-thumbs .post-main-thumb {
	margin-bottom: 30px;
	margin-right: 30px;
}

.pl-featured-blog .post-featured-thumbs .post-main-thumb,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs {
	width: 100%;
}

.pl-featured-blog .post-main-thumb .post-title a {
	line-height: 1.2;
	margin-bottom: 3px;
	font-family: var(--h3_typography-font-family);
	color: var(--wp--preset--color--white);
}

.pl-featured-blog .post-main-thumb .post-title a:hover {
	color: var( --text-hover-color );
}

.pl-featured-blog .post-main-thumb .post-title a h2 {
	margin: 0;
	color: inherit;
	font-size: 25px;
}

.pl-featured-blog .post-main-thumb .post-text-container {
	padding: 15px 20px 20px;
}

.pl-featured-blog .post-main-thumb .post-author-and-category {
	margin-bottom: 10px;
	font-family: "Roboto";
	color: var(--wp--preset--color--white);
}

.pl-featured-blog .post-main-thumb .post-author {
	color: var(--text-hover-color);
}

.pl-featured-blog .post-main-thumb .post-category {
	text-transform: uppercase;
}

.pl-featured-blog .post-main-thumb .post-excerpt {
	margin-top: 6px;
	font-size: 16px;
	font-family: 'Roboto';
	line-height: normal;
	color: var(--wp--preset--color--white);
}

.pl-featured-blog .post-main-thumb .embed-responsive {
	border: solid 5px transparent;
}

.pl-featured-blog .post-main-thumb .post-excerpt .post-excerpt-watch-icon {
	font-size: 11px;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-media {
	width: 132px;
	height: 74px;
	overflow: hidden;
}

.pl-featured-blog .post-featured-thumbs .post-main-thumb .post-thumb-media {
	overflow: hidden;
}

.pl-featured-blog .post-featured-thumbs .post-main-thumb .post-thumb-media a:hover img,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-media a:hover img {
	transform: scale(1.1);
}

.pl-featured-blog .post-featured-thumbs .post-main-thumb .post-thumb-media img,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-media img {
	object-fit: cover;
	transition: transform .3s ease;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-media img {
	aspect-ratio: 16 / 9;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-content {
	width: calc(100% - 160px);
	padding: 0 10px;
}

/* "Thumbnail" template. */
.pl-featured-blog .post-featured-thumbs .post-small-thumbs {
	justify-content: flex-start;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb {
	display: flex;
	margin-bottom: 15px;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-category {
	font-family: "Roboto";
	font-weight: 500;
}

.pl-featured-blog .post-small-thumb-author {
	font-family: "Roboto";
	font-size: 12px;
	color: var(--wp--preset--color--white);
}

.pl-featured-blog .post-small-thumb-author a,
.pl-featured-blog .post-small-thumb-author a:link,
.pl-featured-blog .post-small-thumb-author a:visited,
.pl-featured-blog .post-small-thumb-author a:active,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb a.post-small-thumb-title h3,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb a.post-small-thumb-title:link h3,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb a.post-small-thumb-title:visited h3,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb a.post-small-thumb-title:active h3 {
	color: var(--wp--preset--color--white);
	transition: color .3s ease;
}

.pl-featured-blog .post-small-thumb-author a:hover,
.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb a.post-small-thumb-title:hover h3 {
	color: var(--text-hover-color);
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-title h3 {
	--fontSizeTitle: 16px;
	font-size: var(--fontSizeTitle) !important;
	margin: 0;
}

.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-title:hover {
	text-decoration: none;
}

.pl-featured-blog .post-watch-more-link {
	font-size: 14px;
}

@media (min-width: 480px) {
	.pl-featured-blog .post-featured-thumbs .post-small-thumbs .post-small-thumb .post-small-thumb-title h3 {
		--fontSizeTitle: 18px;
		font-size: var(--fontSizeTitle) !important;
	}
}

@media (min-width: 768px) {
	.pl-featured-blog .post-featured-thumbs {
		flex-direction: row;
	}
}

@media (min-width: 992px) {
	.pl-featured-blog .post-featured-thumbs.container {
		flex-direction: row;
	}

	.pl-featured-blog .post-featured-thumbs .post-main-thumb {
		margin-bottom: 0;
	}

	.pl-featured-blog .post-featured-thumbs .post-main-thumb {
		width: calc(62% - 30px);
	}

	.pl-featured-blog .post-featured-thumbs .post-small-thumbs {
		width: 38%;
	}
}

@media (min-width: 1200px) {
	.pl-featured-blog .post-featured-thumbs.container {
		/*max-width: 1200px !important;
		margin: 0 auto !important;
		padding: 0 30px !important;*/
	}
}

.fusion-content-widget-area .widget.widget_pl-featured-blog-widget {
	margin: 0;
}