iframe{margin: 0;}

.m-video{padding-left: 15px; border-left: 1px solid var(--hover-ic);}
.watch-on img{width: 14px; height: auto;display: ;margin-right: 5px;}

.chnl-pic{display: flex;align-items: baseline;justify-content: center;margin: 0 5px;}
.chnl-pic img{
	min-width: 100%;
	max-width: 100px;
	max-height: 100%; 
	object-fit: cover;
}	
.v-cards{
	display: grid;grid-template-columns: repeat(auto-fill, minmax(250px , 1fr));
	grid-gap: 20px; margin-top: 12px;
}
.vcard:hover{outline: 1px solid ;outline-color: var(--hover-ic);}
.vcard {background: var(--site-fg);display: grid; cursor: pointer;position: relative;
	border-radius: 6px; overflow: hidden;
	box-shadow: 0 0 5px -5px var(--default-text);
}
.vcard h6 ,.vcard video{line-height: 0;width: 0; height: 0;overflow: hidden;}
.vcard .about{display: grid; grid-template-columns: repeat(2, auto);}
.vcard .about {padding-right: 5px;}
.thumb-c {height: 0;width: 100%; padding-top: calc(100% * (9 / 16));position: relative;}
.thumb-c img {width:100%;height: 100%; object-fit:  cover;position: absolute; top: 0;object-position: top;}
.vcard .title{font-size: 14px;padding: 0 20px 0 10px; line-height: 18px;font-weight: 500;}
.vcard p{font-size: 14px; font-weight: 500;}
.vcard .watch-on{font-size: 14px;display: flex;align-items: center;justify-content: end;padding: 0 10px 5px 0;}
.vcard .info, .vcard .chnl-pic {padding: 5px 2px; grid-column: 1/3;}
.vcard .info{display: grid;position: relative;}
.vcard > div .info > *{margin-top: 5px;}
.w-on{grid-column: 1/3;display: flex;align-items: center; height: 50px;color: var(--sub-text);}

.page{display: flex;grid-template-columns: repeat(2, auto);}
aside{grid-column: 1/2;width: ;height: 100vh;background: var(--);position: sticky;top: 0;}

.video-menu{background: var(--site-bg); position:;top: 0;width: 220px;
	min-height: 100vh;}
.m-video{grid-column: 2/3; width: -moz-available; width: -webkit-fill-available;margin: 0 15px 15px 0;}

.video-menu ul li {width: 230px;}
.video-menu ul li a:hover{background: var(--hover-ic);}
.video-menu ul li a{
	display: flex;padding: 15px 10px;text-decoration: none;color: var(--sub-text);
	font-size: 14px;align-items: center;text-transform: uppercase;
}
.video-menu span img {width: 18px;height: auto;margin: 0 25px 0 15px;opacity: 0.6;}
.v-banner {
	height: calc(100vw / 4.5);margin: 30px 1px 30px 1px;border-radius: 6px;
	background: var(--fg); overflow: hidden;
}
.sec_title {
    font-weight: 400;
    color: var(--sub-text);
    margin: 40px 5px 40px 5px;
    padding: 20px 0;
    border: 1px solid var(--search-field);
    border-left: none;
    border-right: none;
}
.v-banner img{width: 100%; object-fit: cover;}
.vcard a{ position: absolute;right: 0;left: 0;top: 0;bottom: 0; }
	.video-player{
		position: fixed;top: 0;right: 0;bottom: 0;left: 0;background: var(--hover-ic);
		display: none;justify-content: center;align-items: center;z-index: 111;
	}
	.video-player .video ,.video iframe {
		width: 80vw;background: var(--site-bg);
		height: calc(75vw * (9/16));
		max-height: 98vh;
		margin-bottom: 15px;
	}
	.close_play_video div{
		color: var(--default-text);
		padding: 6px 10px;
		border-radius: 100px;
		background: var(--fg);
		font-size: 14px;
		cursor: pointer;
		width: fit-content;
		margin: 0 auto;
		width: 100px;
		text-align: center;
		box-shadow: 0 0 12px -5px #000;

	}.close_play_video {
		display: none;
		z-index: 112;
		position: fixed;
		bottom: 20px;left: calc(50vw - 60px);
	}
	.t-fix{ height: 0; display: none;}
	.side-show{display: none;}
	.vcard .duration{
		position: absolute;
		bottom: 8px;
		right: 8px;
		padding: 4px 8px;
		backdrop-filter: blur(10px);
		background: #0005;
		border-radius: 99px;
		color: var(--fg);
		color: #fff;
		font-size: 14px;
	}
	.chnl-pic div{
		width: 30px;
		height: 30px;
		overflow: hidden;
		border-radius: 100px;
	}
.video-menu ul{overflow: visible;}
.close_min, .resize{
	top: 52px; left: 6.5vw;
}


@media screen and (max-width: 760px){
	
	.video-menu ul{overflow: hidden;}
	.v-banner{margin: 60px 5px 20px 5px;height: calc(100vw / 2.5)}
	.v-cards{grid-gap: 5px;}
	.vcard{border-radius: 0;}
	.video-player{bottom: unset;}
	.video-menu{width: 200px;}
	.m-video{margin:-44px 1px 5px 41px ; padding-left: 0;}
	aside{width: 200px;}
	
	.video-menu span{position: absolute; right: 0 ;text-align: right}
	.video-menu span img {width: 20px;height: auto;margin: 10px;}
	
	.side-show{display: block;height: 40px;}
	.side-show img{width: 16px;max-height: 16px;float: right;padding: 12px;}	
		
		#side-menu:checked~aside .video-menu  p{display: block;}
		#side-menu:checked~aside .video-menu  a{padding: 0px;}
		aside .video-menu ul li a{padding: 20px;}
		#side-menu:checked~aside .video-menu  span{position: relative;padding: 10px;}
		
		aside .video-menu  p{display: none}
		#side-menu:checked~aside{
			left: 0;padding-top: 0px;
		}
		aside{
			position: fixed;
			transition: all .3s;
			z-index: 10;
			left: -160px;
		}
		.video-player{align-items: baseline;}
		.t-fix_new{display: block}
		.video-player .video ,.video iframe, .t-fix {
			width: 100vw;
			height: calc(100vw * (9/16));
			max-height: 98vh;
		}
	.set_min{ bottom: 0;z-index: 200 }
	}
	#if,.video, .video-player{
		background-image: url('../assets/loading.svg');
		background-repeat: no-repeat;
		background-position: center;
		box-shadow: 0px 8px 6px 0px #0003;
	}
	/*.onl-mob{display: none;}*/
	.onl-mob img{margin:0 -5px -3px 5px;width: 16px; max-height: 16px;}
	.onl-mob{display: inline-block; position: absolute;right: 10px;}
	.vcard p.onl-mob{font-size: 14px;} 
	@media screen and (max-device-width: 480px){
		.v-cards{grid-gap: 0px;}
		.vcard{box-shadow: none;}

		aside, aside *{display: none;}
		.m-video{margin: 0; border: none;}
	}
	.w-on{position: relative;}
	.chnl-pic p{ margin: 0 10px; }
	.chnl-pic a{position: absolute;right: 0;top: 0;left: 0;bottom: 0;}
	.chnl-pic:hover{text-decoration: underline;}
	.chnl-pic{
		display: flex;
		align-items: center;
		position: relative;
	}
	.set_min .close_min{
		top: -50px;
		left: 0px;
	}

}
	.vcard .info {display: grid;grid-template-columns: repeat(2, auto );grid-column: 1/3;}
	.vcard .title {width: -moz-available; grid-column: 1/3;}
	.vcard .opt {
		width: 20px;
		grid-column: 2/3;
		position: absolute;
		right: 4px;
		top: 0;
	}

.video-player .video {position: relative;}

.video-player .video .minimize{position: absolute; right: 3.5%;bottom: 29%;opacity: 0;transition: opacity 1s;z-index: 200;}

.video-player .video:hover .minimize{opacity: 1; background: var(--site-header-bg);}

.set_min{left: unset; top: unset; box-shadow: -5px -3px 20px -8px var(--sub-text); }

.set_min, .set_min .video , .set_min iframe{width: 300px; height: 180px;}
.video-player, .video-player .video , .video-player iframe{transition: all .2s;}



.close_min{
	position: absolute; height: 32px;
	background: var(--page-bg);
	box-shadow: 0 0 23px -7px var(--default-text);
	border-radius: 3px;
}

.set_min .minimize{
	top: -50px;
}
@media screen and (max-width:  600px){
	.set_min .minimize{
		top: -50px;
	}

	.set_min .close_min{
		top: -47px;
	}
}
.set_min .minimize, .set_min .resize{
	box-shadow: 0 0 23px -7px var(--default-text);
	left: 45px;opacity: 1;
	background: var(--page-bg);
	border-radius: 3px;
	/*width: 20px;*/
	/*height: 20px;*/
}
.resize{ top: 95px;}
.set_min .video .minimize {opacity: 1;}
[uhint]:hover::before{margin-top: 45px; font-size: 14px;}
/*.minimize[uhint]:hover::before{margin-top: 75px; font-size: 11px; opacity: .7;}*/