/*
 Theme Name:   Videolife Pro Child
 Template:     videolife-pro
 Version:      1.0
*/

body {
	--body-padding: 1.5rem;
	--post-roundness: 7px;
	overflow-x: hidden;
}

.content-loop .hentry:hover .icon-play {
	background-color: #e91329;
}

fluid_video_wrapper, .fluid_video_wrapper video, video {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16/9;
	border-radius: 0.5rem;
}

.single-bottom-ad {
	min-width: 0
}

.content-block-1 .hentry .entry-title a, .content-loop .hentry .entry-title a, .entry-related .hentry .entry-title a,
.sidebar .widget a,
.sidebar .widget-posts-thumbnail .thumbnail-wrap
{
    color: #dadada !important;
}

#page {
	overflow-x: hidden;
	width: 100%;
/* 	max-width: unset; */
	    color: #dadada !important;
    background: #101010;
}

#masthead > *,
.site-content
{
	padding: 0 var(--body-padding)
}

#primary-nav {
	display: flex !important;
}

#primary-menu {
	display: flex !important;
	flex-wrap: nowrap;
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	touch-action: unset !important
}

#primary-menu > li {
	min-width: fit-content !important;
}

#primary-menu li a i {
	margin-right: 8px;
}

.header-toggles .toggle-icon .fa {
	font-size: 25px
}

.search-icon span {
	font-size: 30px
}

#left-nav li {
background: #252525;
	border-radius: 0.5rem;
	margin-bottom: 0.5rem;
}

.left-sidebar {
	margin: 10px 10px -13px 10px;
	padding-right: 10px;
}


#left-nav li.current-cat > a {
	background-color: #ff9000 !important;
}

@media only screen and (max-width: 500px) {
	body {
--body-padding: 10px
	}
	
	#masthead {
	margin-bottom: var(--body-padding)
}
}

.site-content > .clear::before,
.content-loop.clear:before,
.related-loop.clear:before,
.single-wrap.clear:before,
.single-wrap.clear:after,
#featured-content.clear:before
	{
	display: none !important
}

body.single-post article.post {
	display: grid;
	border-bottom: 1px solid #393939;
	padding-bottom: 30px;
	margin-bottom: 50px;
}

body.single-post article.post header {
	display: flex;
	grid-row-start: 2;
	padding: 0 !important;
	margin: 0;
}

body.single-post article.post header .entry-meta {
	flex-grow: 1;
	width: 100%
}

body.single-post article.post header .entry-meta .entry-comment {
	display: none
}

body.single-post .post-bottom-related {
	grid-template-columns: 1fr !important
}

.content-loop, .related-loop {
		display: grid;
	  gap: 5px 10px;
}

.content-loop .entry-category {
	display: none
}

.content-loop .thumbnail-wrap,
.sidebar .widget-posts-thumbnail .thumbnail-wrap
{
	border-radius: var(--post-roundness);
	overflow: hidden;
	aspect-ratio: 16/9
}

.content-loop .thumbnail-wrap img,
.sidebar .widget-posts-thumbnail .thumbnail-wrap img
{
	width: 100%;
	height: 100%;
	object-fit: cover
}

.content-loop > *,
.related-loop > *
{
	width: 100%;
	padding: 0 !important;
}

@media only screen and (min-width: 959px) {
	#primary-menu {
	justify-content: center;
	}
	
	.header-search  {
		float: right;
		width: 40% !important;
	}
	
	.site-content:not(.single-post .site-content) > :first-child {
	display: grid;
	grid-template-columns: auto 1fr
}
	
	#featured-content {
	display: grid;
	grid-template-columns: 1fr 1fr
}
	
	body .single-wrap {
		display: grid !important;
		gap: var(--body-padding);
		grid-template-columns: 1fr 0.4fr
	}
	
	body .single-wrap > *, 	body .single-wrap  {
		width: 100% !important;
	}
}



@media (max-width: 500px) {
	.content-loop .thumbnail-wrap,
	.related-loop .thumbnail-wrap
	{
	aspect-ratio: 1 / 0.7;
}
	
	.content-loop .post:nth-child(5n) .thumbnail-wrap,
	.related-loop .post:nth-child(5n) .thumbnail-wrap
	{
		aspect-ratio: 16/9
	}
}

@media (min-width: 200px) {
	.content-loop, .related-loop {
    grid-template-columns: 1fr 1fr;
	}
	
	.pagination .page-numbers {
	padding: 0 15px
}
	
	.sidebar .widget-posts-thumbnail .thumbnail-wrap {
		width: 160px
	}
	
	.single #primary .entry-header .entry-category {
        display: unset;
    }
}

@media (min-width: 768px) {
	.content-loop, .related-loop {
    grid-template-columns: 1fr 1fr 1fr;
	}
}

@media (min-width: 1200px) {
	.content-loop {
    grid-template-columns: 1fr 1fr 1fr 1fr;
	}
		.related-loop {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	}
}
