Current File : /home/kelaby89/www/wp/wp-content/themes/nexio/skins/default/templates/single-styles/style-1.scss

@import "../../../../css/_mixins.scss";
@import "../../../../css/_theme-vars.scss";
@import "../../css/_skin-vars.scss";

.single_style_style-1 .page_content_wrap {
	padding-top: 0;
}
.single_style_style-1 .post_header_single .content_wrap {
	padding-right: 50px;
	padding-left: 50px;
	@include box-sizing(border-box);
}
.narrow_content.single_style_style-1 {
	.post_header_single .content_wrap {
		padding-right: 90px;
		padding-left: 90px;
		width: 100%;
		max-width: var(--theme-var-content);
	}
	&.single-format-audio {
		.with_featured_image {
			.post_featured.with_audio.with_thumb {
				+ .post_header_single .content_wrap {
					padding-right: 0;
					padding-left: 0;
				}
			}
		}
	}
}

.single_style_style-1 .page_content_wrap > .content_wrap {
	padding-top: 6.2em;
}
.post_header_wrap_style_style-1 {
	position: relative;
	margin-top: 6.2em;
	text-align: center;
	.header_position_over & {
		margin-top: 0;
	}
}

/* header over */
.header_position_over.single_style_style-1 {
	.post_header_wrap_style_style-1 {
		text-align: left;
		.post_featured.with_thumb:not(.with_video) + .post_header,
		.post_featured.with_gallery + .post_header {
			@include transform(translate(-50%, 0));
			bottom: 4.8em;
			top: auto;
			width: 100%;
		}
	}
	.page_content_wrap > .content_wrap {
		padding-top: 6.5em;
	}
	.post_header_single .content_wrap {
		padding-right: 0;
		padding-left: 0;
	}
}

.previous_post_content .post_header_wrap_style_style-1.post_header_wrap_in_header {
	margin-bottom: 4em;
}
.post_header_wrap_style_style-1.with_featured_image {
	margin-top: 0;
}
.post_header_wrap_style_style-1 .post_featured {
	margin-top: 0;
	margin-bottom: 0;
	z-index: 1 !important;
	&.with_video,
	&.with_gallery {
		z-index: auto !important;
	}
}
.post_header_wrap_style_style-1 .post_featured.with_gallery {
	.slider_container .slider_pagination_wrap .swiper-pagination-bullet {
		@include box(6px, 6px);
		opacity: 1;
		border-color:  var(--theme-color-inverse_link);
		background-color: transparent;
		&.swiper-pagination-bullet-active {
			border-color:  var(--theme-color-text_link);
			background-color: var(--theme-color-text_link);
		}
	}
}

.post_header_wrap_style_style-1 .post_featured.post_featured_bg,
.post_header_wrap_style_style-1 .post_featured.sc_parallax_wrap {
	height: 37.7rem;
}
.post_header_wrap_style_style-1 .post_featured.post_featured_bg {
	background-position: center;
}
.post_header_wrap_style_style-1 .post_featured.sc_parallax_wrap {
	@include flex;
	@include flex-align-items( center );
	img {
		position: relative;
	}
	&.sc_parallax_direction_down img {
		top: -15%;
	}
	&.sc_parallax_direction_up {
		top: 15%;
	}
}
.post_header_wrap_style_style-1 .post_featured.post_featured_bg:before {
	display: none;
}
.post_header_wrap_style_style-1 .post_featured img {
	max-width: none;
	width: 100%;
}
.post_header_wrap_style_style-1.with_featured_image:before {
	content: ' ';
	display: block;
	@include abs-cover(3);
	pointer-events: none;
	background: rgba(0,0,0,0.45);
}
.post_header_wrap_style_style-1 .post_author {
	color: var(--theme-color-text_dark);
	&:hover,
	&:focus {
		color: var(--theme-color-text_hover);
	}
}
.post_header_wrap_style_style-1.with_featured_image .post_header a,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_title,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_subtitle,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta_item {
	color: #fff !important;
}
.post_header_wrap_style_style-1.with_featured_image .post_header .post_date,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta_item,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta_item a {
	color: #D2D3D5 !important;
}
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta_item.post_author,
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta.post_meta_categories a {
	color: #fff !important;
}

.post_header_wrap_style_style-1.with_featured_image .post_header a,
.post_header_wrap_style_style-1.with_featured_image .post_header a.post_author .post_author_name {
	@include transition-all(0.3s);
}
.post_header_wrap_style_style-1.with_featured_image .post_header .post_subtitle,
.post_header_wrap_style_style-1.with_featured_image .post_header a:hover,
.post_header_wrap_style_style-1.with_featured_image .post_header a:focus,
.post_header_wrap_style_style-1.with_featured_image .post_header a.post_author:hover .post_author_name,
.post_header_wrap_style_style-1.with_featured_image .post_header a.post_author:focus .post_author_name {
	opacity: 1;
	color: #ffffff !important
}
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta.post_meta_categories a:hover {
	color: #000 !important;
	background-color: #ffffff !important;
	opacity: 1;
}
.post_header_wrap_style_style-1.with_featured_image .post_header a.post_author:hover,
.post_header_wrap_style_style-1.with_featured_image .post_header a.post_author:focus {
	opacity: 1;
}
.post_header_wrap_style_style-1.with_featured_image .post_header .social_item {
	vertical-align: baseline;
}
.post_header_wrap_style_style-1 .post_featured .post_video_list {
	width: 100%;
}
.post_header_wrap_style_style-1 .post_featured.with_thumb .post_audio {
	bottom: 1em;
	.audio_info {
		display: none;
	}
}
.post_header_wrap_style_style-1 .post_header {
	display: block;
}
.post_header_wrap_style_style-1 .post_featured.with_thumb + .post_header,
.post_header_wrap_style_style-1 .post_featured.with_gallery + .post_header {
	display: inline-block;
	@include abs-cc(10);
	box-sizing: border-box;
	margin-bottom: 0;
	margin-top: 0;
}
/* to do: until clarification
.single-format-audio .post_header_wrap_style_style-1 .post_featured.with_thumb + .post_header {
	margin-bottom: 4em;
}
*/
.single-format-video .post_header_wrap_style_style-1 .post_featured.with_video {
	&.with_thumb .post_video_hover {
		margin-top: -3em;
	}
	.post_info_video {
		display: none;
	}
	& + .post_header {
		z-index: 2001;
	}
}
.post_header_wrap_style_style-1 .post_featured.with_video + .post_header,
.post_header_wrap_style_style-1 .post_featured.with_video_list + .post_header {
	margin-top: 0;
}
.post_header_wrap_style_style-1 .post_featured.post_video_play + .post_header {
	display:none;
}
.post_header_wrap_style_style-1 .post_header .post_title {
	margin-top: 0;
	margin-bottom: 0;
	line-height: 1.1em;
}
.post_header_wrap_style_style-1 .post_header .post_subtitle {
	@include font(1.2857em, 1.4em, normal);
	margin-top: 1em;
}
.post_header_wrap_style_style-1 .post_header .post_meta_categories {
    margin-top: 0;
	margin-bottom: 24px;
	text-transform: uppercase;
	letter-spacing: 0;
	@include font( inherit, inherit, 500);
	.post_meta_item:after {
		position: relative;
		top: 2px;
	}
}
.post_header_wrap_style_style-1 .post_header .post_meta_other {
	margin-top: 1em;
}
.post_header_wrap_style_style-1 .post_header .post_meta_other .post_meta_item {
	white-space: nowrap;
}
.post_header_wrap_style_style-1.with_featured_image .post_header .post_meta_other {
	margin-top: 2.2em;
}
.post_header_wrap_style_style-1 .post_header .post_meta_other .post_meta_item:after,
.post_header_wrap_style_style-1 .post_header .post_meta_other .vc_inline-link:after {
	margin: 0 0.5em 0 0.74em
}
.post_header_wrap_style_style-1 .post_header .post_meta_other .post_author_avatar {
	margin-right: 0.85em;
	margin-top: -3px;
}
.post_header_wrap_style_style-1 .post_header .post_meta_other .post_author_avatar > img {
	@include square(32px);
}
.post_header_wrap_style_style-1 {
	.before_post_header_banner_wrap {
		+ .post_featured.with_video {
			margin-top: 3em;
		}
	}
	.post_featured.with_video:not(.with_video_autoplay) {
		+ .post_header {
			margin-top: 2em;
		}
	}
	.post_featured.with_video.with_video_autoplay {
		.video_frame {
			background-color: #000000;
			video {
				object-fit: cover;
				height: 100%;
				max-height: 100%;
			}
		}
	}
}
.single_style_style-1 {
	&.single-format-audio {
		.post_header_wrap_in_header {
			&:before {
				display: none;
			}
			div.post_featured.with_thumb {
				&:after {
					display: block !important;
					background: rgba(0, 0, 0, 0.45);
				}
			}
		}
		.post_featured.with_thumb + .post_header {
			top: calc( 50% - 30px );
		}
	}
	&.single-format-video {
		.post_header_wrap_style_style-1 .post_featured.with_video_list {
			margin-bottom: 4em;
		}
	}
}

/* Video Popup Button */
.single-format-video .post_header_wrap_style_style-1 .post_featured.with_video.with_thumb.post_featured_bg:not(.with_video_autoplay) {
	position: static;
	&:after {
		display: none;
	}
	+ .post_header {
		padding-top: 20px;
		top: calc(50% + 50px);

		.post_title {
			padding-bottom: 0.18em;
			overflow: hidden;
			// max-height: 4em; // old way
			display: -webkit-box;
			-webkit-line-clamp: 4;
			-webkit-box-orient: vertical;
		}
	}
	.post_video_hover {
		margin-top: -45vh;
		position: relative;
		z-index: 999;
		opacity: 0;
		@include transition(color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease-in-out);
		top: calc(50% - 60px);
	}
}

.post_header_wrap_style_style-1 .post_featured.post_featured_bg.with_video.with_video_list {
	height: auto;
	background: none !important;
	.wp-video {
		width: 100% !important;
	}
}
.single_style_style-1.single-format-audio {
	.post_header_wrap_in_header.with_featured_image {
		.post_audio {
			.post_info_audio {
				text-align: center;
				max-width: 50%;
				margin: 0 auto 30px;
				.post_audio_author,
				.post_audio_description,
				.post_audio_title {
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
				.post_audio_description {
					margin-bottom: 0;
				}
				.post_audio_title {
					margin-bottom: 0.4em;
				}
			}
		}
	}
	.post_header_wrap_in_header {
		.post_featured.without_thumb {
			.post_audio {
				max-width: 70%;
				margin: 0 auto 3rem;
				.post_info_audio {
					max-width: 65%;
				}
			}
		}
	}
	&.sidebar_hide.narrow_content {
		.post_header_wrap_in_header.with_featured_image {
			.post_audio {
				.post_info_audio {
					max-width:  630px;
				}
			}
		}
	}
}