


/* Responsive */
@media screen and (min-width:897px) {
	/* mainIn */
	.mainIn, .blogM{
		display:flex
	}
	.blogMn{
		width:var(--navW);
		flex-shrink:0;
		position:relative;
		transition:var(--trans-1);
		z-index:1
	}
	.blogCont{
		padding-top:30px
	}
	.blogCont::before{
		content:"";
		position:absolute;
		top:var(--headerHi);
		left:0;
		height:calc(100% + var(--headerH))
	}
	.blogCont{
		width:calc(100% - var(--navW))
	}
	.mnBrs{
		box-shadow:0 0 15px rgba(0,0,0,.07)
	}
	.blogCont .secIn{
		padding-left:25px;
		padding-right:25px
	}
	.mainbar{
		flex:1 0 calc(100% - var(--sideW) - 25px);
		width:calc(100% - var(--sideW) - 25px)
	}
	.sidebar{
		display:flex;
		flex:0 0 calc(var(--sideW) + 25px);
		width:calc(var(--sideW) + 25px);
		margin:0
	}
	.sidebar::before{
		content:"";
		flex:0 0 25px
	}
	.sidebar .sideIn{
		width:calc(100% - 25px)
	}
	/* mainNav */
	.mnBr{
		position:sticky;
		position:-webkit-sticky;
		top:var(--headerH)
	}
	.mnBrs{
		display:flex;
		height:calc(100vh - var(--headerH));
		font-size:13px;
		position:relative
	}
	.mnBrs >*:not(.mnMob){
		width:100%
	}
	.mnMen{
		padding:20px;
		overflow-y:auto;
		overflow-x:hidden
	}
	.mnMob{
		position:fixed;
		width:var(--navW)
	}
	.mnH, .mobMn{
		display:none
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .blogMn, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMob, .hdMn .navI:not(:checked) ~ .mainWrp .blogMn, .hdMn .navI:not(:checked) ~ .mainWrp .mnMob{
		width:75px
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn a:hover, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn a:hover{
		opacity:1;
		color:inherit
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn .a, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn .a{
		max-width:40px;
		border-radius:15px
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn .drp.mr, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn svg.d, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMob .navigationPages, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMob .mSoc, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn .drp.mr, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn svg.d, .hdMn .navI:not(:checked) ~ .mainWrp .mnMob .navigationPages, .hdMn .navI:not(:checked) ~ .mainWrp .mnMob .mSoc{
		display:none
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMob .mNav, .hdMn .navI:not(:checked) ~ .mainWrp .mnMob .mNav{
		display:flex
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn >li.br::after, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn >li.br::after{
		max-width:20px
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMen, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMen:hover, .hdMn .navI:not(:checked) ~ .mainWrp .mnMen, .hdMn .navI:not(:checked) ~ .mainWrp .mnMen:hover{
		overflow-y:visible;
		overflow-x:visible
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn .n, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr) ul, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn .n, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr) ul{
		position:absolute;
		left:35px;
		top:3px;
		margin:0 5px;
		padding:8px 10px;
		border-radius:5px 16px 16px 16px;
		max-width:160px;
		background:var(--contentB);
		color:var(--bodyC);
		opacity:0;
		visibility:hidden;
		box-shadow:0 5px 20px 0 rgba(0,0,0,.1);
		z-index:1
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr) ul, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr) ul{
		padding:0 5px;
		margin:0;
		overflow:hidden;
		display:block
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr):last-child ul, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr):last-child ul{
		top:auto;
		bottom:3px;
		border-radius:16px 16px 16px 5px
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.drp) .a:hover .n, .bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr):hover ul, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.drp) .a:hover .n, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr):hover ul{
		opacity:1;
		visibility:visible
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn ul li >*, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn ul li >*{
		border-radius:0
	}
	/* Collapsed icon navigation keeps its original popup, without row animation. */
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr) ul >li, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr) ul >li{
		opacity:1;
		visibility:inherit;
		max-height:none;
		transition:none
	}
	.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr):focus-within ul, .hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr):focus-within ul{opacity:1;visibility:visible}
	/* Article */
	.onIndx.onHm .blogPts >*{
		flex:0 0 calc(33.33% - 20px);
		width:calc(33.33% - 20px)
	}
	.onIndx.onMlt .blogPts >*{
		flex:0 0 calc(25% - 20px);
		width:calc(25% - 20px)
	}

}
@media screen and (min-width:768px) {
	::-webkit-scrollbar{
		-webkit-appearance:none;
		width:8px;
		height:5px
	}
	::-webkit-scrollbar-track{
		background:transparent
	}
	::-webkit-scrollbar-thumb{
		background:rgba(0,0,0,.15);
		border-radius:10px
	}
	::-webkit-scrollbar-thumb:hover{
		background:rgba(0,0,0,.35)
	}
	::-webkit-scrollbar-thumb:active{
		background:rgba(0,0,0,.35)
	}

}
@media screen and (max-width:1100px) {
	/* Article */
	.onIndx.onHm .blogPts >*{
		flex:0 0 calc(50% - 20px);
		width:calc(50% - 20px)
	}
	.onIndx.onMlt .blogPts >*{
		flex:0 0 calc(33.33% - 20px);
		width:calc(33.33% - 20px)
	}
	/* Widget */
	.itemFt .itm >*, .itemFt .itm >*:last-child{
		flex:0 0 calc(50% - 20px);
		width:calc(50% - 20px)
	}
	.itemFt .itm >*:last-child{
		flex-grow:1
	}
	.itemFt .pSnpt{
		display:none
	}
	/* Footer */
	.fotIn >*, .fotIn >*:first-child{
		width:calc(50% - 30px)
	}

}
@media screen and (max-width:896px) {
	/* Header */
	.ntfC{
		padding-left:20px;
		padding-right:20px
	}
	header, .drK header{
		box-shadow:none;
		border:none
	}
	
	
	
	
	
	
	.headL{
		padding:0 0 0 15px;
		flex:1 1 0;
		min-width:0
	}
	.headR{
		padding:0 20px 0 0;
		flex-grow:0
	}
	.headIc .isSrh{
		display:block
	}
	.headI .headS{
		margin:0
	}
	/* mainNav */
	.blogMn{
		display:flex;
		justify-content:flex-start;
		position:fixed;
		left:0;
		top:0;
		bottom:0;
		margin-left:-100%;
		z-index:20;
		transition:var(--trans-1);
		width:100%;
		height:100%
	}
	.flT .blogMn{
		left:15px;
		top:15px;
		bottom:15px;
		height:auto
	}
	.flT .mnBr{
		border-radius:20px;
		width:80%
	}
	.Rtl.flT .blogMn{
		left:auto;
		right:15px
	}
	.mnBr{
		width:85%;
		max-width:480px;
		height:100%;
		border-radius:0 12px 12px 0;
		transition:inherit;
		z-index:3;
		overflow:hidden;
		position:relative;
		box-shadow:0 5px 30px 0 rgba(0,0,0,.05)
	}
	.mnBrs{
		padding:60px 0 0;
		overflow-y:scroll;
		overflow-x:hidden;
		width:100%;
		height:100%
	}
	.mnH{
		padding:0 15px
	}
	.mnH label{
		padding:15px 10px
	}
	.mnH .c::after{
		margin:0 13px
	}
	.mnMen{
		padding-top:0
	}
	.navI:checked ~ .mainWrp .blogMn{
		margin-left:0
	}
	.navI:checked ~ .mainWrp .blogMn .fCls,
	.tocI:checked ~ .tocL .fCls{
		opacity:1;
		visibility:visible;
		background:rgba(0,0,0,.2);
		-webkit-backdrop-filter:saturate(180%) blur(10px);
		backdrop-filter:saturate(180%) blur(10px)
	}
	/* Article */
	.onIndx.onHm .blogPts >*{
		flex:0 0 calc(33.33% - 20px);
		width:calc(33.33% - 20px)
	}
	/* Widget */
	.itemFt .pSnpt{
		display:-webkit-box
	}
	.bD:not(.MN-4) .mobMn + footer{
		padding-bottom:calc(55px + 20px)
	}
	.bD:not(.MN-4) .wvH{
		height:calc(100px + 60px)
	}
	/* Widget Scroll Menu */
	
}
@media screen and (max-width:768px) {
	/* Article */
	.onIndx.onHm .blogPts >*, .onIndx.onMlt .blogPts >*{
		flex:0 0 calc(50% - 20px);
		width:calc(50% - 20px)
	}

}
@media screen and (max-width:640px) {
	/* Header */
	.headCn{
		height:var(--headerHm)
	}
	/* Pop-up */
	.fixL{
		align-items:flex-end
	}
	.fixL .fixLi, .fixL .cmBri{
		border-radius:12px 12px 0 0;
		max-width:680px
	}
	.fixL .cmBri:not(.mty){
		border-radius:0;
		height:100%;
		max-height:100%
	}
	/* Footer */
	footer{
		padding-top:30px
	}

}
@media screen and (max-width:500px) {
	/* Font and Blog */
	.iFxd, .crdtIn{
		font-size:12px
	}
	.brdCmb{
		font-size:13px
	}
	.pDesc{
		font-size:14px
	}
	.pEnt{
		font-size:var(--postFm)
	}
	.pTtl.itm{
		font-size:var(--postTm)
	}
	.pInf.ps .pDr{
		font-size:12px
	}
	.pInf .pNm, .pInf .pDr{
		display:flex;
		flex-direction:column
	}
	.pInf .pDr >*:not(:first-child)::before{
		display:none
	}
	/* Article */
	.onIndx:not(.oneGrd) .blogPts{
		width:calc(100% + 10px);
		left:-5px;
		right:-5px
	}
	.onIndx:not(.oneGrd) .blogPts >*{
		padding:8px 8px 40px;
		flex:0 0 calc(50% - 10px);
		width:calc(50% - 10px);
		margin-left:5px;
		margin-right:5px;
		margin-bottom:10px
	}
	.onIndx:not(.oneGrd) .blogPts .pTag{
		padding-bottom:5px
	}
	.onIndx:not(.oneGrd) .blogPts div.ntry{
		flex:0 0 calc(100% - 10px)
	}
	.onIndx:not(.oneGrd) .pCntn{
		padding:0
	}
	.onIndx:not(.oneGrd) .ntry .pSml{
		font-size:12px
	}
	.onIndx:not(.oneGrd) .blogPts .pInf{
		bottom:10px;
		left:8px;
		right:8px
	}
	.onIndx:not(.oneGrd) .ntry .iFxd{
		font-size:10px
	}
	.onIndx:not(.oneGrd) .ntry .iFxd:not(.l) >*{
		margin-left:0
	}
	.Rtl.onIndx:not(.oneGrd) .ntry .iFxd:not(.l) >*{
		margin-left:5px;
		margin-right:0
	}
	.onIndx:not(.oneGrd) .ntry .iFxd:not(.l) >* svg{
		width:14px;
		height:14px;
		stroke-width:1.7
	}
	.onIndx:not(.oneGrd) .ntry .iFxd:not(.l) >* svg{
		margin:0 1.5px
	}
	.onIndx:not(.oneGrd) .ntry .pTtl{
		font-size:.8rem;
		font-weight:600
	}
	.onIndx:not(.oneGrd) .ntry:not(.pTag) .pSnpt, .onIndx:not(.oneGrd) .ntry .pInf:not(.nSpr) .pJmp, .onIndx:not(.oneGrd) .ntry .iFxd .spnr, .onIndx:not(.oneGrd) .iFxd .bM{
		display:none
	}
	.onIndx:not(.oneGrd) .ntry .iFxd{
		padding:8px 3px
	}
	.onIndx:not(.oneGrd) .ntry .iFxd .cmnt, .onIndx:not(.oneGrd) .ntry .iFxd .pV{
		padding:3.5px
	}
	.onIndx:not(.oneGrd) .ntry .iFxd >* svg{
		padding:1px
	}
	.onIndx.oneGrd .blogPts >*{
		flex:0 0 calc(100% - 20px);
		width:calc(100% - 20px)
	}
	/* Share */
	.pShc::before{
		width:100%
	}
	.pShc .wa::after, .pShc .tw::after{
		display:none
	}
	/* Widget */
	.prfI:checked ~ .mainWrp .wPrf{
		top:auto;
		bottom:0;
		-webkit-transform:none;
		transform:none
	}
	.prfI:checked ~ .mainWrp .Profile .fCls{
		background:rgba(0,0,0,.2);
		-webkit-backdrop-filter:saturate(180%) blur(10px);
		backdrop-filter:saturate(180%) blur(10px)
	}
	.prfH .c{
		display:flex
	}
	.wPrf{
		position:fixed;
		top:auto;
		left:0;
		right:0;
		bottom:-100%;
		width:100%;
		max-height:calc(100% - var(--headerH));
		-webkit-transform:none;
		transform:none;
		-webkit-transform-origin:center;
		transform-origin:center;
		transition:var(--trans-1);
		border-radius:12px 12px 0 0
	}
	.itemFt .itm{
		padding-bottom:80px
	}
	.itemFt .itm >*{
		flex:0 0 calc(100% - 20px);
		width:calc(100% - 20px)
	}
	.itemFt .itm .iCtnt{
		flex:0 0 calc(100% - 42px);
		width:calc(100% - 42px);
		margin:0 auto;
		position:absolute;
		left:0;
		right:0;
		bottom:0;
		padding:13px;
		background:rgba(255,253,252,.92);
		border-radius:10px;
		box-shadow:0 10px 20px -5px rgba(0,0,0,.1);
		-webkit-backdrop-filter:saturate(180%) blur(10px);
		backdrop-filter:saturate(180%) blur(10px)
	}
	.itemFt .pTtl{
		font-size:1rem
	}
	.itemFt .pSnpt{
		font-size:93%
	}
	/* Footer */
	.fotIn >*, .fotIn >*:first-child{
		width:calc(100% - 30px)
	}

}
/* Keyframes Animation */
@keyframes shimmer {
	100% {
		transform:translateX(100%)
	}

}
@keyframes slidein {
	0% {
		opacity:0
	}
	10% {
		opacity:1;
		bottom:24px
	}
	50% {
		opacity:1;
		bottom:24px
	}
	90% {
		opacity:1;
		bottom:24px
	}
	100% {
		opacity:0;
		bottom:-70px;
		visibility:hidden
	}

}
@keyframes fadein {
	50% {
		opacity:1
	}
	80% {
		opacity:1;
		padding-top:5px;
		height:22px
	}
	100% {
		opacity:0;
		padding-top:0;
		height:0
	}

}
@keyframes nudge {
	0% {
		transform:translateX(0)
	}
	30% {
		transform:translateX(-5px)
	}
	50% {
		transform:translateX(5px)
	}
	70% {
		transform:translateX(-2px)
	}
	100% {
		transform:translateX(0)
	}

}
@keyframes tonext {
	75% {
		left:0
	}
	95% {
		left:100%
	}
	98% {
		left:100%
	}
	99% {
		left:0
	}

}
@keyframes tostart {
	75% {
		left:0
	}
	95% {
		left:-300%
	}
	98% {
		left:-300%
	}
	99% {
		left:0
	}

}
@keyframes tonext-rev {
	75% {
		right:0
	}
	95% {
		right:100%
	}
	98% {
		right:100%
	}
	99% {
		right:0
	}

}
@keyframes tostart-rev {
	75% {
		right:0
	}
	95% {
		right:-300%
	}
	98% {
		right:-300%
	}
	99% {
		right:0
	}

}
@keyframes snap {
	96% {
		scroll-snap-align:center
	}
	97% {
		scroll-snap-align:none
	}
	99% {
		scroll-snap-align:none
	}
	100% {
		scroll-snap-align:center
	}

}
@keyframes indicator {
	0% {
		opacity:0
	}
	50% {
		opacity:1
	}
	100% {
		opacity:0
	}

}
@keyframes opaCity {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}

}
@-webkit-keyframes fadein {
	50% {
		opacity:1
	}
	80% {
		opacity:1;
		padding-top:5px;
		height:22px
	}
	100% {
		opacity:0;
		padding-top:0;
		height:0
	}

}
@-webkit-keyframes slidein {
	0% {
		opacity:0
	}
	10% {
		opacity:1;
		bottom:24px
	}
	50% {
		opacity:1;
		bottom:24px
	}
	90% {
		opacity:1;
		bottom:24px
	}
	100% {
		opacity:0;
		bottom:-70px;
		visibility:hidden
	}

}
@-webkit-keyframes nudge {
	0% {
		transform:translateX(0)
	}
	30% {
		transform:translateX(-5px)
	}
	50% {
		transform:translateX(5px)
	}
	70% {
		transform:translateX(-2px)
	}
	100% {
		transform:translateX(0)
	}

}
@-webkit-keyframes tonext {
	75% {
		left:0
	}
	95% {
		left:100%
	}
	98% {
		left:100%
	}
	99% {
		left:0
	}

}
@-webkit-keyframes tostart {
	75% {
		left:0
	}
	95% {
		left:-300%
	}
	98% {
		left:-300%
	}
	99% {
		left:0
	}

}
@-webkit-keyframes tonext-rev {
	75% {
		right:0
	}
	95% {
		right:100%
	}
	98% {
		right:100%
	}
	99% {
		right:0
	}

}
@-webkit-keyframes tostart-rev {
	75% {
		right:0
	}
	95% {
		right:-300%
	}
	98% {
		right:-300%
	}
	99% {
		right:0
	}

}
@-webkit-keyframes snap {
	96% {
		scroll-snap-align:center
	}
	97% {
		scroll-snap-align:none
	}
	99% {
		scroll-snap-align:none
	}
	100% {
		scroll-snap-align:center
	}

}
@-webkit-keyframes indicator {
	0% {
		opacity:0
	}
	50% {
		opacity:1
	}
	100% {
		opacity:0
	}

}
@-moz-keyframes indicator {
	0% {
		opacity:0
	}
	50% {
		opacity:1
	}
	100% {
		opacity:0
	}

}
@keyframes glitch {
	2%,64% {
		transform:translate(2px,0) skew(0deg)
	}
	4%,60% {
		transform:translate(-2px,0) skew(0deg)
	}
	62% {
		transform:translate(0,0) skew(5deg)
	}

}
@keyframes glitchTop {
	2%,64% {
		transform:translate(2px,-2px)
	}
	4%,60% {
		transform:translate(-2px,2px)
	}
	62% {
		transform:translate(13px,-1px) skew(-13deg)
	}

}
@keyframes glitchBotom {
	2%,64% {
		transform:translate(-2px,0)
	}
	4%,60% {
		transform:translate(-2px,0)
	}
	62% {
		transform:translate(-22px,5px) skew(21deg)
	}

}
@-webkit-keyframes opaCity {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}

}
/* Noscript Option */
.lazy:not([lazied]){
	display:none
}
.bD .pS img.lazy:not([lazied]){
	display:none !important
}





/* Hide Scroll */
.scrlH::-webkit-scrollbar{
	width:0;
	height:0
}
.scrlH::-webkit-scrollbar-track{
	background:transparent
}
.scrlH::-webkit-scrollbar-thumb{
	background:transparent;
	border:none
}


