


/* Widget Style */
.widget .imgThm:not(span){
	display:block;
	position:absolute;
	top:50%;
	left:50%;
	max-width:none;
	max-height:108%;
	font-size:12px;
	text-align:center;
	transform:translate(-50%, -50%)
}
.widget .title{
	margin:0 0 25px;
	font-size:var(--widgetT);
	font-weight:var(--widgetTw);
	position:relative
}
.widget .title.dt::before{
	position:absolute;
	top:0;
	right:0;
	content:"";
	width:20px;
	height:20px;
	display:inline-block;
	opacity:.3;
	background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 276.167 276.167' fill='%23989b9f'><path d='M33.144,2.471C15.336,2.471,0.85,16.958,0.85,34.765s14.48,32.293,32.294,32.293s32.294-14.486,32.294-32.293 S50.951,2.471,33.144,2.471z'/><path d='M137.663,2.471c-17.807,0-32.294,14.487-32.294,32.294s14.487,32.293,32.294,32.293c17.808,0,32.297-14.486,32.297-32.293 S155.477,2.471,137.663,2.471z'/><path d='M243.873,67.059c17.804,0,32.294-14.486,32.294-32.293S261.689,2.471,243.873,2.471s-32.294,14.487-32.294,32.294 S226.068,67.059,243.873,67.059z'/><path d='M243.038,170.539c17.811,0,32.294-14.483,32.294-32.293c0-17.811-14.483-32.297-32.294-32.297 s-32.306,14.486-32.306,32.297C210.732,156.056,225.222,170.539,243.038,170.539z'/><path d='M136.819,170.539c17.804,0,32.294-14.483,32.294-32.293c0-17.811-14.478-32.297-32.294-32.297 c-17.813,0-32.294,14.486-32.294,32.297C104.525,156.056,119.012,170.539,136.819,170.539z'/><path d='M243.771,209.108c-17.804,0-32.294,14.483-32.294,32.294c0,17.804,14.49,32.293,32.294,32.293 c17.811,0,32.294-14.482,32.294-32.293S261.575,209.108,243.771,209.108z'/></svg>") center / 20px no-repeat
}
.Rtl .widget .title::before{
	right:auto;
	left:0;
	transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg)
}
.widget .title::after{
	content:"";
	vertical-align:middle;
	width:var(--widgetTa);
	border-bottom:4px dotted var(--widgetTac);
	opacity:.5;
	margin-inline-start:10px;
	display:inline-block
}
.widget:not(.contentWidget) input[type=text], .widget:not(.contentWidget) input[type=email], .widget:not(.contentWidget) textarea{
	display:block;
	width:100%;
	outline:0;
	border:0;
	border-bottom:1px solid rgba(0,0,0,.25);
	border-radius:4px 4px 0 0;
	background:#f3f3f4;
	padding:25px 16px 8px 16px;
	line-height:1.6em;
	transition:var(--trans-1)
}
.widget:not(.contentWidget) input[type=text]:hover, .widget:not(.contentWidget) input[type=email]:hover, .widget:not(.contentWidget) textarea:hover{
	border-color:rgba(0,0,0,.42);
	background:#ececec
}
.widget:not(.contentWidget) input[type=text]:focus, .widget:not(.contentWidget) input[type=email]:focus, .widget:not(.contentWidget) textarea:focus, .widget:not(.contentWidget) input[data-text=fl], .widget:not(.contentWidget) textarea[data-text=fl]{
	border-color:var(--linkB);
	background:#ececec
}
.widget:not(.contentWidget) input[type=button], .widget:not(.contentWidget) input[type=submit]{
	display:inline-flex;
	align-items:center;
	padding:12px 30px;
	outline:0;
	border:0;
	border-radius:4px;
	color:#fffdfc;
	background:var(--linkB);
	font-size:14px;
	white-space:nowrap;
	overflow:hidden;
	max-width:100%
}
.widget:not(.contentWidget) input[type=button]:hover, .widget:not(.contentWidget) input[type=submit]:hover{
	opacity:.7
}
/* Widget searchWidget */
.searchWidget{
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:12
}
.searchWidget form{
	position:relative;
	min-width:320px
}
.searchWidget input{
	position:relative;
	display:block;
	background:var(--srchB);
	border:0;
	outline:0;
	margin-top:-100%;
	padding:10px 55px;
	width:100%;
	height:72px;
	transition:var(--trans-1);
	z-index:2;
	border-radius:0 0 var(--srchMr) var(--srchMr)
}
.searchWidget input:focus{
	margin-top:0;
	box-shadow:0 10px 40px rgba(0,0,0,.2)
}
.searchWidget input:focus ~ button.sb{
	opacity:.9
}
.searchWidget .sb{
	position:absolute;
	left:0;
	top:0;
	display:flex;
	align-items:center;
	padding:0 20px;
	z-index:3;
	opacity:.7;
	height:100%;
	background:transparent;
	border:0;
	outline:0
}
.searchWidget .sb svg{
	width:18px;
	height:18px;
	stroke:var(--srchI)
}
.searchWidget button.sb{
	left:auto;
	right:0;
	opacity:0;
	font-size:13px
}
.searchWidget button.sb .echrahnet-close-icon{
	width:16px;
	height:16px;
	flex:0 0 16px;
	stroke:var(--srchI)!important
}
@media screen and (min-width:897px) {
	header .searchWidget{
		position:static;
		z-index:1
	}
	header .searchWidget input{
		margin-top:0;
		padding:12px 42px;
		height:auto;
		font-size:13px;
		border-radius:var(--srchDr);
		background:rgba(0,0,0,.03);
		width:calc(100% + 26px);
		left:-13px;
		right:-13px;
		transition:var(--trans-2)
	}
	header .searchWidget input:hover{
		background:var(--transB)
	}
	header .searchWidget input:focus{
		box-shadow:none;
		margin-top:0;
		background:var(--transB)
	}
	header .searchWidget .sb{
		padding:0
	}
	header .searchWidget .fCls{
		display:none
	}

}
/* Widget Profile */
.prfI:checked ~ .mainWrp .wPrf{
	top:45px;
	opacity:1;
	visibility:visible;
	-webkit-transform:scale(1);
	transform:scale(1)
}
.prfI:checked ~ .mainWrp .wPrf ~ .fCls{
	z-index:3;
	opacity:1;
	visibility:visible
}
.wPrf{
	display:flex;
	position:absolute;
	top:45px;
	right:0;
	width:260px;
	max-height:400px;
	-webkit-transform:scale(.8);
	transform:scale(.8);
	-webkit-transform-origin:top right;
	transform-origin:top right;
	-webkit-transition:visibility .2s ease, opacity .2s ease, -webkit-transform .2s ease;
	transition:visibility .2s ease, opacity .2s ease, transform .2s ease;
	z-index:4;
	opacity:0;
	visibility:hidden;
	overflow:hidden
}
.wPrf .prfS{
	background:inherit
}
.wPrf.sl .im{
	width:60px;
	height:60px;
	border-radius:26px;
	margin:0 auto
}
.wPrf.sl .prfC{
	text-align:center
}
.prfH .c{
	display:none
}
.sInf{
	margin-bottom:0
}
.sInf .sDt .l{
	display:inline-flex;
	align-items:center
}
.sInf .sTxt{
	margin:5px auto 0;
	max-width:320px;
	font-size:93%;
	opacity:.9;
	line-height:1.5em
}
.sInf .sTxt a{
	text-decoration:underline
}
.sInf .lc{
	display:flex;
	justify-content:center;
	margin:10px 0 0;
	opacity:.8;
	font-size:90%
}
.sInf .lc svg{
	width:16px;
	height:16px
}
.sInf .lc::after{
	content:attr(data-text);
	margin:0 4px
}
/* Widget Scroll Menu */
.navS{
	background:var(--navB);
	overflow-y:hidden;
	overflow-x:scroll;
	scroll-behavior:smooth;
	scroll-snap-type:x mandatory;
	-ms-overflow-style:none;
	-webkit-overflow-scrolling:touch;
	display:flex;
	padding:0;
	border-radius:10px
}
.navS ul{
	display:flex;
	list-style:none;
	margin:0;
	padding:0;
	white-space:nowrap
}
.navS li{
	margin:0 15px;
	padding:10px 0;
	position:relative;
	scroll-snap-align:start
}
.navS li:first-child{
	margin-left:auto
}
.navS li:last-child{
	margin-right:auto
}
.navS .l{
	display:block;
	color:var(--bodyC);
	padding:8px 0
}
.navS .l::before{
	content:attr(data-text)
}
.navS .l::after{
	content:"";
	height:1px;
	border-radius:2px 2px 0 0;
	background:var(--linkC);
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	opacity:0
}
.navS span.l{
	opacity:.7
}
.navS a.l:hover, .navS .l.a{
	color:var(--linkC)
}
@media screen and (max-width:896px) {
	.navS .secIn{
		padding:0
	}
	.navS li{
		margin:0;
		padding:8px 0;
		display:flex
	}
	.navS li::before{
		content:"";
		padding:10px
	}
	.navS ul::after{
		content:"";
		display:block;
		padding:10px;
		scroll-snap-align:start
	}
	.navS .l{
		position:relative
	}
	.navS .l::after{
		bottom:-8px
	}
	.navS a.l:hover::after, .navS .l.a::after{
		opacity:1
	}

}
@media screen and (max-width:500px) {
	.navS{
		font-size:13px
	}
	.navS .l::before{
		margin: 12px
	}
	.navS .l{
		background: var(--transB)!important;
		border-radius: 25px!important
	}

}
.drK .navS{
	background:var(--darkBs)
}
.drK .navS .l{
	color:var(--darkC)
}
.drK .navS a.l:hover, .drK .navS .l.a{
	color:var(--darkU)
}
.drK .navS .l::after{
	background:var(--darkU)
}

/* featuredPost card layout shared by the widget on every view. */
.itemFt .itm{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	position:relative;
	width:calc(100% + 20px);
	left:-10px;
	right:-10px
}
.itemFt .itm >*{
	flex:0 0 calc(50% - 20px);
	width:calc(50% - 20px);
	margin-bottom:0;
	margin-left:10px;
	margin-right:10px
}

/* Widget featuredPost */
@media screen and (min-width:501px) {
	.featuredPost .itemFt{
		position:relative;
		overflow:hidden;
		padding:10px;
		background:var(--contentB);
		box-shadow:0 5px 35px rgba(0,0,0,.07);
		border-radius:10px
	}
	.drK .featuredPost .itemFt{
		background:var(--darkBa)
	}
	.featuredPost .itemFt::after{
		content:"";
		position: absolute;
		right:0;
		top:0;
		width:40px;
		height:15px;
		background:var(--linkB);
		border-radius:0 0 0 20px;
		opacity:.2
	}

}
.itemFt .itm >*{
	flex:0 0 310px;
	width:310px
}
.itemFt .itm >*:last-child{
	flex:1 0 calc(100% - 310px - 40px);
	width:calc(100% - 310px - 40px)
}
/* Widget popularPosts */
.popularPosts{
	padding:20px 20px 30px;
	background:var(--contentB);
	box-shadow:0 5px 35px rgba(0,0,0,.07);
	border-radius:10px
}
.itemPp{
	counter-reset:p-cnt
}
.itemPp .iCtnt{
	display:flex
}
.itemPp >*:not(:last-child){
	margin-bottom:25px
}
.itemPp .iCtnt::before{
	flex-shrink:0;
	content:"0" counter(p-cnt);
	counter-increment:p-cnt;
	width:25px;
	opacity:.6;
	font-size:85%;
	line-height:1.8em
}
.iInr{
	flex:1 0;
	width:calc(100% - 25px)
}
.iTtl{
	font-size:.95rem;
	font-weight:500;
	line-height:1.5em
}
.iTtmp{
	display:inline-flex
}
.iTtmp::after{
	content:"—";
	margin:0 5px;
	color:var(--widgetTac);
	opacity:.7
}
.iInf{
	margin:0 25px 8px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis
}
.iInf .pLbls{
	display:inline;
	opacity:.8
}
/* Widget Label */
/* List Label */
.categoryWidget{
	padding:20px;
	background:var(--contentB);
	box-shadow:0 5px 35px rgba(0,0,0,.07);
	border-radius:10px
}
.wL ul{
	display:flex;
	flex-wrap:wrap;
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
	width:calc(100% + 30px);
	left:-15px;
	right:-15px;
	font-size:13px
}
.wL li{
	width:calc(50% - 10px);
	margin:0 5px
}
.wL li >*{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	color:var(--bodyC);
	width:100%;
	padding:8px 10px;
	border-radius:4px;
	line-height:20px
}
.wL li >* svg{
	width:18px;
	height:18px;
	opacity:.8
}
.wL li >*:hover svg, .wL li >div svg{
	/*fill:var(--linkC) !important;*/
	stroke:var(--linkC)
}
.wL li >*:hover .lbC, .wL li >div .lbC{
	color:var(--linkC)
}
.wL .lbR{
	display:inline-flex;
	align-items:center
}
.wL .lbR .lbC{
	margin:0 5px
}
.wL .lbAl{
	max-height:0;
	overflow:hidden;
	transition:var(--trans-4)
}
.wL .lbM{
	display:inline-block;
	margin-top:10px;
	line-height:20px;
	color:var(--linkC);
	cursor:pointer
}
.wL .lbM::before{
	content:attr(data-show)
}
.wL .lbM::after, .wL .lbC::after{
	content:attr(data-text)
}
.wL .lbM::after{
	margin:0 8px
}
.wL .lbT{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	opacity:.7
}
.wL .lbC, .wL .lbM::after{
	flex-shrink:0;
	font-size:12px;
	opacity:.7
}
.lbIn:checked ~ .lbAl{
	max-height:1000vh
}
.lbIn:checked ~ .lbM::before{
	content:attr(data-hide)
}
.lbIn:checked ~ .lbM::after{
	visibility:hidden
}
.wL.bg ul{
	width:calc(100% + 10px);
	left:-5px;
	right:-5px
}
.wL.bg li{
	margin-bottom:10px
}
.wL.bg li >*{
	background:#f6f6f6
}
/* Cloud Label */
.wL.cl{
	display:flex;
	flex-wrap:wrap
}
.wL.cl >*, .wL.cl .lbAl >*{
	display:block;
	max-width:100%
}
.wL.cl .lbAl{
	display:flex;
	flex-wrap:wrap
}
.wL.cl .lbC::before{
	content:"";
	margin:0 4px;
	flex:0 0
}
.wL.cl .lbN{
	display:flex;
	justify-content:space-between;
	margin:0 0 8px;
	padding:9px 13px;
	border:1px solid var(--contentL);
	border-radius:3px;
	color:inherit;
	line-height:20px
}
.wL.cl .lbN:hover .lbC, .wL.cl div.lbN .lbC{
	color:var(--linkB);
	opacity:1
}
.wL.cl .lbN:not(div):hover, .wL.cl div.lbN{
	border-color:var(--linkB)
}
.wL.cl .lbSz{
	display:flex
}
.wL.cl .lbSz::after{
	content:"";
	margin:0 4px;
	flex:0 0
}
/* Widget ContactForm */
.ContactForm{
	max-width:500px;
	font-family:var(--fontB);
	font-size:14px
}











/* Widget Music Player */





@media screen and (min-width:897px) {
	.sidebarTelegram{
		display:none
	}
	.sidebar-widgets > .sidebarTelegram + .widget{
		margin-top:0
	}
}

.scW{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	padding:10px;
	background:var(--notifU);
	color:var(--notifC);
	border-radius:8px;
	overflow:hidden
}
.widget-content .scW:not(:first-child){
	margin-top:25px
}
.scW::after{
	content:attr(data-text);
	position:absolute;
	left:0;
	bottom:0;
	background:var(--linkC);
	color:#fff;
	font-size:11px;
	padding:4px 18px 4px 12px;
	border-radius:0 30px 0 0
}
.scC{
	width:calc(100% - 50px);
	margin-right:10px
}
.scW.ig::after{
	background:#e1306c
}
.scW.yt::after{
	background:#ff0000
}
.scW.tg::after{
	background:#229ed9
}
.scC >*{
	display:block;
	font-size:13px;
	padding:1px 0
}
.scC >*:first-child{
	font-weight:600
}
.scI{
	width:50px;
	height:50px;
	background:var(--transB);
	border-radius:10px;
	display:flex;
	align-items:center;
	justify-content:center
}
.scI >svg{
	width:28px;
	height:28px
}
.scW.ig svg.svgC,
.scW.ig svg .svgC{
	fill:#e1306c
}
.scW.ig svg.line.svgC,
.scW.ig svg.line .svgC{
	stroke:#e1306c
}
.scW.yt svg.svgC,
.scW.yt svg .svgC{
	fill:#ff0000
}
.scW.yt svg.line.svgC,
.scW.yt svg.line .svgC{
	stroke:#ff0000
}
.scW.tg svg.svgC,
.scW.tg svg .svgC{
	fill:#229ed9
}
.scW.tg svg.line.svgC,
.scW.tg svg.line .svgC{
	stroke:#229ed9
}
.drK .scW{
	background:var(--darkBa);
	color:var(--darkT)
}
.drK .scI{
	background:var(--darkBs)
}




/* Pop-up */
.fxPu{
	position:fixed;
	top:-50%;
	bottom:-50%;
	top:-50%;
	left:-50%;
	right:-50%;
	z-index:70;
	background:rgba(0,0,0,.4);
	visibility:hidden;
	opacity:0;
	transition:all .6s ease;
	-webkit-transition:all .6s ease
}
.fxPu.visible{
	visibility:visible;
	opacity:1
}
.fxPuW{
	position:fixed;
	top:0;
	bottom:0;
	top:0;
	left:0;
	right:0;
	z-index:71;
	padding:20px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center
}
.fxPuC{
	position:relative;
	background:#fffdfc;
	width:100%;
	max-width:500px;
	padding:20px 25px 25px;
	border-radius:20px
}
.fxPuCl::after{
	content:"";
	position:absolute;
	top:-15px;
	right:15px;
	background-color:var(--linkC);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fffdfc' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.0005 4.99988L5.00049 18.9999M5.00049 4.99988L19.0005 18.9999'/%3E%3C/svg%3E");
	background-position:center;
	background-repeat:no-repeat;
	background-size:16px 16px;
	display:flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	border-radius:50%;
	transition:var(--trans-1);
	-webkit-transition:var(--trans-1);
	cursor:pointer
}
.fxPuCl:hover::after{
	transform:scale(1.03);
	-webkit-transform:scale(1.03)
}
.fxPuS{
	display:block;
	text-align:center;
	margin-bottom:5px
}
.fxPuS svg.line{
	stroke-width:1;
	width:50px;
	height:50px
}
.fxPuH{
	font-size:1.2rem;
	font-weight:500;
	font-family:var(--fontBa);
	margin-bottom:10px;
	text-align:center
}
.fxPuD{
	line-height:1.7em;
	font-size:15px
}
.fxPuB{
	text-align:center;
	margin-top:20px
}
.fxPuB .btn{
	width:45px;
	height:45px;
	outline:none;
	border:none;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	background:var(--linkC);
	border-radius:50%
}
.fxPuB .btn:hover{
	opacity:.8
}
.fxPuB .btn svg{
	stroke:#fffdfc
}
.drK .fxPuC{
	background:var(--darkBs)
}
.drK .fxPuCl::after{
	background-color:var(--darkU)
}
.drK .fxPuB .btn{
	background:var(--darkU)
}
/* Toast Notif */
.tNtf span{
	position:fixed;
	left:24px;
	bottom:-70px;
	display:inline-flex;
	align-items:center;
	text-align:center;
	justify-content:center;
	z-index:997;
	background:#323232;
	color:rgba(255,255,255,.8);
	font-size:14px;
	font-family:var(--fontB);
	border-radius:3px;
	padding:13px 24px;
	box-shadow:0 5px 35px rgba(149,157,165,.3);
	opacity:0;
	transition:var(--trans-1);
	animation:slidein 5s ease forwards;
	-webkit-animation:slidein 5s ease forwards
}
.tNtf span i{
	content:"";
	width:14px;
	height:14px;
	display:inline-block;
	margin:0 5px;
	opacity:.8
}
.tNtf span i.check{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/><polyline points='22 4 12 14.01 9 11.01'/></svg>") center / 14px no-repeat
}
.tNtf span i.warn{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><g transform='translate(2.500000, 3.000000)'><path d='M9.5,18 C3.00557739,18 0.456662548,17.5386801 0.0435259337,15.2033146 C-0.36961068,12.8679491 2.27382642,8.47741935 3.08841712,7.02846996 C5.81256986,2.18407813 7.66371927,0 9.5,0 C11.3362807,0 13.1874301,2.18407813 15.9115829,7.02846996 C16.7261736,8.47741935 19.3696107,12.8679491 18.9564741,15.2033146 C18.5443995,17.5386801 15.9944226,18 9.5,18 Z'/><line x1='9.5' y1='5.5' x2='9.5' y2='9.395'/><line x1='9.4957' y1='12.895' x2='9.5047' y2='12.895'/></g></svg>") center / 14px no-repeat
}
.tNtf span i.copy{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='9' y='9' width='13' height='13' rx='2' ry='2'/><path d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/></svg>") center / 14px no-repeat
}
.tNtf span i.clipboard{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/><rect x='8' y='2' width='8' height='4' rx='1' ry='1'/></svg>") center / 14px no-repeat
}
.tNtf span i.onCloud{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z'/></svg>") center / 14px no-repeat
}
.tNtf span i.offCloud{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M22.61 16.95A5 5 0 0 0 18 10h-1.26a8 8 0 0 0-7.05-6M5 5a8 8 0 0 0 4 15h9a5 5 0 0 0 1.7-.3'/><line x1='1' y1='1' x2='23' y2='23'/></svg>") center / 14px no-repeat
}
.tNtf span i.onWifi{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.55a11 11 0 0 1 14.08 0'/><path d='M1.42 9a16 16 0 0 1 21.16 0'/><path d='M8.53 16.11a6 6 0 0 1 6.95 0'/><line x1='12' y1='20' x2='12.01' y2='20'/></svg>") center / 14px no-repeat
}
.tNtf span i.offWifi{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='1' y1='1' x2='23' y2='23'/><path d='M16.72 11.06A10.94 10.94 0 0 1 19 12.55'/><path d='M5 12.55a10.94 10.94 0 0 1 5.17-2.39'/><path d='M10.71 5.05A16 16 0 0 1 22.58 9'/><path d='M1.42 9a15.91 15.91 0 0 1 4.7-2.88'/><path d='M8.53 16.11a6 6 0 0 1 6.95 0'/><line x1='12' y1='20' x2='12.01' y2='20'/></svg>") center / 14px no-repeat
}
.tNtf span i.del{
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><g transform='translate(3.500000, 2.000000)'><path d='M15.3891429,7.55409524 C15.3891429,15.5731429 16.5434286,19.1979048 8.77961905,19.1979048 C1.01485714,19.1979048 2.19295238,15.5731429 2.19295238,7.55409524'/><line x1='16.8651429' y1='4.47980952' x2='0.714666667' y2='4.47980952'/><path d='M12.2148571,4.47980952 C12.2148571,4.47980952 12.7434286,0.714095238 8.78914286,0.714095238 C4.83580952,0.714095238 5.36438095,4.47980952 5.36438095,4.47980952'/></g></svg>") center / 14px no-repeat
}
.Rtl .tNtf span{
	left:auto;
	right:24px
}
@media screen and (max-width:896px) {
	.tNtf span{
		margin-bottom:50px
	}

}
@media screen and (max-width:500px) {
	.tNtf span{
		left:20px;
		right:20px;
		font-size:13px
	}
	.tNtf.alt span, .Rtl .tNtf.alt span{
		left:0;
		right:0;
		margin-bottom:-25px;
		justify-content:left;
		text-align:left;
		font-size:15px;
		padding:15px 24px;
		border-radius:0
	}
	.Rtl .tNtf.alt span{
		justify-content:right;
		text-align:right
	}
	.Rtl .tNtf span{
		left:20px;
		right:20px
	}

}
.drK .tNtf span{
	box-shadow:0 10px 40px rgba(0,0,0,.2)
}
.MN-4 .tNtf span{
	margin-bottom:0;
	animation-duration:2s;
	-webkit-animation-duration:2s
}
/* Neon Lighting */
.nLght::before, .nLght::after{
	content:"";
	position:fixed;
	width:100%;
	bottom:0;
	left:0;
	right:0;
	height:3px;
	z-index:55;
	background:linear-gradient(-45deg, #4086F4, #31A952, #FBBE01, #EB4132,#4086F4, #31A952, #FBBE01, #EB4132);
	background-size:200%;
	-webkit-animation:animeNeon 5s linear infinite;
	animation:animeNeon 5s linear infinite;
	visibility:none;
	opacity:0;
	transition:all 1s ease
}
.nLght::after{
	height:10px;
	filter:blur(10px)
}
.nLght.vsbl::before, .nLght.vsbl::after{
	visibility:visible;
	opacity:.7
}
@-webkit-keyframes animeNeon {
	0% {
		background-position:0% 50%
	}
	50% {
		background-position:100% 50%
	}
	100% {
		background-position:0% 50%
	}

}
@keyframes animeNeon {
	0% {
		background-position:0% 50%
	}
	50% {
		background-position:100% 50%
	}
	100% {
		background-position:0% 50%
	}

}
/* Maintenance Mode */










/* Error Page */
.erroP{
	display:flex;
	align-items:center;
	justify-content:center;
	height:100vh;
	text-align:center;
	padding:0
}
.erroC{
	width:calc(100% - 40px);
	max-width:450px;
	margin:auto;
	font-family:var(--fontBa)
}
.erroC h3{
	font-size:1.414rem;
	font-family:inherit
}
.erroC h3 span:not(.e){
	position:relative
}
.erroC h3 span.e{
	display:block;
	font-size:140px;
	line-height:.8;
	margin-bottom:-1rem;
	color:#ebebf0
}
.erroC h3 span.e{
	animation:glitch 1s linear infinite
}
.erroC h3 span.e::before, .erroC h3 span.e::after{
	content:attr(title);
	position:absolute;
	left:0;
	right:0
}
.erroC h3 span.e::before{
	animation:glitchTop 1s linear infinite;
	clip-path:polygon(0 0, 100% 0, 100% 33%, 0 33%);
	-webkit-clip-path:polygon(0 0, 100% 0, 100% 33%, 0 33%)
}
.erroC h3 span.e::after{
	animation:glitchBotom 1.5s linear infinite;
	clip-path:polygon(0 67%, 100% 67%, 100% 100%, 0 100%);
	-webkit-clip-path:polygon(0 67%, 100% 67%, 100% 100%, 0 100%)
}
.erroC p{
	margin:30px 5%;
	line-height:1.6em;
	opacity:.7
}
.erroC .button{
	margin:0;
	padding-left:2em;
	padding-right:2em;
	font-size:14px
}
/* Extra */
.iFxd.bl{
	top:auto;
	bottom:0;
	right:auto;
	left:0
}
.aNm.t{
	background:rgba(255,255,255,.8);
	padding:6px
}
.aNm.t .im{
	width:16px;
	height:16px;
	margin-right:4px
}
.aNm.t .nm{
	font-size:13px;
	color:var(--bodyC)
}
.aNm.t svg{
	width:13px;
	height:13px;
	fill:#1DA1F2;
	margin-left:4px
}
.Rtl .iFxd.bl{
	top:auto;
	bottom:0;
	right:0;
	left:auto
}
.Rtl .aNm.t .im{
	margin-left:4px;
	margin-right:0
}
.Rtl .aNm.t svg{
	margin-left:0;
	margin-right:4px
}
.onIndx .blogPts .ntry, .popularPosts, .widget.categoryWidget, .footer{
	position:relative;
	overflow:hidden
}
.onIndx .blogPts .ntry::before, .itemFt .iCtnt::before, .popularPosts::before, .widget.categoryWidget::before, .footer::before{
	content:"";
	width:70px;
	height:70px;
	position:absolute;
	z-index:0;
	background:rgba(0,0,0,.04);
	bottom:0;
	left:0;
	border-radius:0 70px 0 0
}
.onIndx.Rtl .blogPts .ntry::before, .Rtl .itemFt .iCtnt::before, .Rtl .popularPosts::before, .Rtl .widget.categoryWidget::before, .Rtl .footer::before{
	border-radius:70px 0 0 0;
	bottom:0;
	left:unset;
	right:0
}
@media screen and (min-width:501px) {
	.itemFt .iCtnt::before{
		display:none
	}

}
.pTtmp[data-type]{
	display:inline-flex;
	align-items:center
}
.pTtmp[data-type]::before{
	content:attr(data-type);
	display:inline;
	background:var(--linkB);
	color:#fff;
	font-size:10px;
	line-height:.6rem;
	padding:3px;
	border-radius:2px;
	margin-right:4px
}
.pTtmp[data-type="Published"]::before{
	content:"منشور في"
}
.pTtmp[data-type="Modified"]::before{
	content:"آخر تحديث"
}
.drK .pTtmp[data-type]::before{
	background:var(--darkU)
}
.pTtmp[data-type]::after{
	display:inline
}
.Rtl .pTtmp[data-type]::before{
	margin-left:4px;
	margin-right:0
}
.Rtl .featuredPost .itemFt::after{
	left:0;
	right:unset;
	border-radius:0 0 20px 0
}



.pThmb .iFxd.bl{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	overflow:visible
}

.pThmb .aNm.t.echrahnet-author{
	position:relative;
	display:flex;
	align-items:center;
	padding:6px;
	background:var(--contentB);
	border-radius:6px;
	overflow:hidden;
	cursor:pointer;
	transition:background-color .25s ease
}

.pThmb .echrahnet-author > .im{
	width:16px;
	height:16px;
	flex:0 0 16px;
	margin-right:4px
}

.pThmb .echrahnet-author > svg{
	width:13px;
	height:13px;
	flex:0 0 13px;
	fill:#1DA1F2;
	margin-left:4px
}

/* The name is expanding content inside the SAME visual body. */
.pThmb .echrahnet-author-card{
	position:static;
	display:flex;
	align-items:center;
	width:0;
	max-width:0;
	height:auto;
	min-height:0;
	margin:0;
	padding:0;
	background:transparent!important;
	border:0;
	border-radius:0;
	box-shadow:none;
	opacity:0;
	visibility:hidden;
	overflow:hidden;
	transform:none;
	pointer-events:none;
	transition:
		width .25s ease,
		max-width .25s ease,
		opacity .18s ease,
		visibility .18s ease;
	z-index:auto
}

.pThmb .echrahnet-author-card > img{
	display:none!important
}

.pThmb .echrahnet-author-card-text{
	display:flex;
	align-items:center;
	min-width:0;
	margin:0;
	padding:0
}

.pThmb .echrahnet-author-label{
	display:none!important
}

.pThmb .echrahnet-author-name{
	display:block;
	width:max-content;
	max-width:145px;
	margin:0;
	padding:0;
	color:var(--bodyC)!important;
	font-family:var(--fontB);
	font-size:12px!important;
	font-weight:400!important;
	line-height:16px!important;
	text-decoration:none!important;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}

.pThmb .echrahnet-author-name:hover{
	color:var(--linkC)!important
}

.pThmb .echrahnet-author.is-open .echrahnet-author-card,
.pThmb .echrahnet-author:focus-within .echrahnet-author-card{
	width:auto;
	max-width:145px;
	opacity:1;
	visibility:visible;
	pointer-events:auto
}

@media (hover:hover) and (pointer:fine) {
	.pThmb .echrahnet-author:hover .echrahnet-author-card{
		width:auto;
		max-width:145px;
		opacity:1;
		visibility:visible;
		pointer-events:auto
	}
}

.Rtl .pThmb .echrahnet-author > .im{
	margin-left:4px;
	margin-right:0
}

.Rtl .pThmb .echrahnet-author > svg{
	margin-left:0;
	margin-right:4px
}



@media screen and (max-width:768px) {
	.pThmb > .iFxd:not(.bl){
		display:flex!important;
		visibility:visible!important;
		opacity:1!important
	}

	.pThmb > .iFxd:not(.bl) .bM,
	.pThmb > .iFxd:not(.bl) .bmPs{
		display:flex!important;
		visibility:visible!important;
		opacity:1!important
	}
}


/* Follow Google */
.follow-google{
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:1px solid #ddd;
	padding:10px;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center
}
/* Window Scroll */
.progress-container{
	width:100%;
	position:fixed;
	z-index:9
}
.progress-bar{
	width:0%;
	height:5px;
	background:var(--linkB)
}
.drK .progress-bar{
	background:var(--darkU)
}
/* RGB Effect */
.stwRainbow,.stwBlurRainbow{
	position:fixed;
	width:100%;
	bottom:0;
	left:0;
	right:0;
	height:3px;
	z-index:23;
	background:linear-gradient(-45deg, #4086F4, #31A952, #FBBE01, #EB4132,#4086F4, #31A952, #FBBE01, #EB4132);
	background-size:200%;
	-webkit-animation:animeBar 5s linear infinite;
	animation:animeBar 5s linear infinite
}
.stwBlurRainbow{
	height:10px;
	z-index:22;
	filter:blur(10px);
	opacity:.7
}
@-webkit-keyframes animeBar {
	0% {
		background-position:0% 50%
	}
	50% {
		background-position:100% 50%
	}
	100% {
		background-position:0% 50%
	}

}
@keyframes animeBar {
	0% {
		background-position:0% 50%
	}
	50% {
		background-position:100% 50%
	}
	100% {
		background-position:0% 50%
	}

}

.en-noscript{margin:16px;padding:16px;border:1px solid currentColor;border-radius:10px;background:var(--contentB);color:var(--bodyC)}.en-noscript p{margin:.5em 0}




/* 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
}






/* Root View Transition: JavaScript animates the new snapshot reveal. */
::view-transition-old(root),
::view-transition-new(root){
	mix-blend-mode:normal;
	animation:none
}
::view-transition-old(root){
	z-index:1
}
::view-transition-new(root){
	z-index:9999
}

/* Bidirectional page scroll — dark appearance lives with the dark layer. */
.drK .tTb{
	color:var(--darkT)
}
.drK .tTb circle:first-of-type{
	fill:var(--darkBs);
	stroke:#404045
}
.drK .tTb circle:last-of-type{
	stroke:var(--darkU)
}

/* Change Mode */
.headR .headM{
	display:block;
	position:absolute;
	top:45px;
	right:0;
	padding:10px 0;
	width:150px;
	font-size:13px;
	-webkit-transform:scale(.8);
	transform:scale(.8);
	-webkit-transform-origin:top right;
	transform-origin:top right;
	-webkit-transition:visibility .2s ease, opacity .2s ease, -webkit-transform .2s ease;
	transition:visibility .2s ease, opacity .2s ease, transform .2s ease;
	overflow:hidden;
	z-index:18;
	opacity:0;
	visibility:hidden
}
.headR .headM:before{
	content:attr(data-text);
	display:block;
	padding:0 15px 10px;
	width:100%;
	font-size:11px;
	opacity:.7
}
.headR .headM >*{
	display:block;
	padding:9px 15px;
	width:100%;
	cursor:pointer
}
.headR .headM >*:before{
	content:attr(aria-label);
	opacity:.9
}
.headR .headM >*:hover{
	background:rgba(0,0,0,.05)
}
.navM:checked ~ .mainWrp .headM{
	visibility:visible;
	opacity:1;
	-webkit-transform:scale(1);
	transform:scale(1)
}
.navM:checked ~ .mainWrp .headM + .fCls{
	visibility:visible;
	opacity:1;
	z-index:17
}
.headR .headM .sydB{
	display:block
}
:root:not(.drK):not(.syD) .bD .headR .headM .lgtB{
	background-color:rgba(0,0,0,.1)
}
.drK:not(.syD) .headR .headM .drkB{
	background-color:rgba(0,0,0,.1)
}
.syD .headR .headM .sydB{
	background-color:rgba(0,0,0,.1)
}
.drK .headR .headM, .drK .cusW, .drK .wTrans{
	background:var(--darkBs);
	border-color:var(--darkBa)
}
.drK .wBkm, .drK .wPrf{
	background:var(--darkBs);
	border-color:var(--darkBa)
}
.Rtl .headR .headM{
	right:auto;
	left:0;
	-webkit-transform-origin:top left;
	transform-origin:top left
}
/* Header appearance icon and system badge; palette selection is independent. */
.modeState{
	position:relative
}
.modeState .d1, .modeState .modeAuto{
	display:none
}
.modeState .d2, .drK .modeState .d1{
	display:block
}
.drK .modeState .d2{
	display:none
}
.modeState .modeAuto{
	position:absolute;
	right:0;
	bottom:0;
	width:16px;
	height:16px;
	border-radius:16px;
	align-items:center;
	justify-content:center;
	background:var(--headerB);
	color:var(--linkC);
	font-family:Arial,sans-serif;
	font-size:10px;
	font-weight:400;
	line-height:1;
	z-index:2;
	pointer-events:none
}
.syD .modeState .modeAuto{
	display:flex
}
.drK .modeState .modeAuto{
	background:var(--darkB);
	color:var(--darkU)
}
/* Dark Mode */
.drK body.onIndx .blogPts >*, .drK .rPst, .drK .popularPosts, .drK .categoryWidget{
	background:var(--darkBa)
}
.drK .tDL:not(.modeState) .d2{
	display:block
}
.drK .tDL::after{
	content:attr(data-light)
}
.drK .tDL:not(.modeState) svg .f{
	stroke:none;
	fill:var(--darkT)
}
.drK .pThmb:not(.nul)::before{
	background-image:linear-gradient(90deg, rgba(0,0,0,0) 0, rgba(0,0,0,.07) 20%, rgba(0,0,0,.1) 60%, rgba(0,0,0,0))
}
.drK input::placeholder, .drK .cpL input{
	color:rgba(255,255,255,.25)
}
.drK .erroC h3 span.e{
	color:var(--darkBa)
}

.drK .cmC i[rel=image]::before, .drK .widget:not(.contentWidget) input[type=text], .drK .widget:not(.contentWidget) input[type=email], .drK .widget:not(.contentWidget) textarea{
	background:var(--darkBs);
	border-color:rgba(255,255,255,.15)
}
.drK svg, .drK svg.c-1{
	fill:var(--darkT)
}
.drK svg.line{
	fill:none;
	stroke:var(--darkT)
}
.drK svg.c-2{
	fill:var(--darkTa);
	opacity:.4
}
.drK .Header .echrahnetLogo::after{
	background:var(--darkU)
}
.drK, .drK body, .drK .headCn, .drK .mnBrs{
	background:var(--darkB);
	color:var(--darkT)
}
.drK .ntfC, .drK .mobMn{
	background:var(--darkBa);
	color:var(--darkTa)
}
.drK .ntfC{
	color:rgba(255,255,255,.9)
}
.drK header, .drK .mnMn >li.br::after, .drK .blogCont::before, .drK .tbHd, .drK .cmHl >li >.cmIn, .drK .pTag .pMart a, .drK .pRelate, .drK blockquote, .drK .cmC i[rel=quote], .drK blockquote.s-1, .drK details.sp, .drK .ps table:not(.tr-caption-container), .drK .ps table th, .drK .ps table:not(.tr-caption-container) tr:not(:last-child) td, .drK .pre.tb .preH, .drK details.ac, .drK .mnMob{
	border-color:rgba(255,255,255,.15)
}
.drK .pre{
	background:var(--darkBs);
	color:var(--darkT)
}
.drK .footer{
	background:var(--darkBs)
}
.drK .footerSocialLink{
	background:var(--darkBa);
	border-color:#404045;
	color:var(--darkT)
}
.drK a.footerSocialLink:hover{
	background:var(--darkB)
}
.drK .mnMn li:not(.mr) .a:hover, .drK .mnMn ul li >*:hover, .drK .wL.bg li >*, .drK .mobMn li >*:hover{
	background:rgba(0,0,0,.15)
}
.drK .tIc::after{
	background:var(--darkBs)
}
.drK header a, .drK h1, .drK h2, .drK h3, .drK h4, .drK h5, .drK h6, .drK footer, .drK .button{
	color:var(--darkT)
}
.drK .dlBox, .drK .fixLs{
	background:var(--darkBs)
}
.drK .tocLi{
	background:var(--darkB)
}
.drK .tocC span, .drK .searchWidget input, .drK .cmHl >li >.cmIn{
	background:var(--darkBa)
}
.drK .tocC span::before{
	background:var(--darkBa)
}
.drK .tocC span::after{
	background:var(--darkU)
}
.drK .tocL svg.rad{
	fill:var(--darkBa)
}
.drK .mobMn li >*:hover svg.line{
	fill:var(--darkT) !important
}
.drK .mobMn li >*:hover svg.line .svgC{
	fill:var(--darkU) !important;
	stroke:var(--darkU)
}
.drK body.mobS .mobMn li >*:hover, .drK .button.ln{
	background:transparent
}
.drK .pTag .pPric::before, .drK .pTag .pInfo small{
	color:var(--darkTa)
}
.drK::selection, .drK a, .drK .free::after, .drK .new::after, .drK .mnMn li:not(.mr) .a:hover, .drK .mnMn ul li a:hover, .drK .aTtl a:hover, .drK .pSnpt.nTag, .drK .pTag .pPric, .drK details.ac[open] summary, .drK .cpL #copyPostLink, .drK .wL li >*:hover .lbC, .drK .wL li >div .lbC, .drK .wL .lbM, .drK .cmBtn.ln:hover, .drK .wL.cl .lbN:hover .lbC, .drK .wL.cl div.lbN .lbC{
	color:var(--darkU)
}
.drK .mnMn .a:hover svg:not(.d){
	fill:var(--darkU)
}
.drK .mnMn .a:hover svg.line:not(.d), .drK .pJmp svg{
	fill:none;
	stroke:var(--darkU)
}
.drK .wL li >*:hover svg, .drK .wL li >div svg{
	stroke:var(--darkU)
}
.drK body.MN-3 .mobMn li >*:hover::after, .drK body.MN-4 .mobMn li >*:hover::after, .drK .blogPg >*, .drK .button, .drK .zmImg > .zmClose, .drK .widget:not(.contentWidget) input[type=button], .drK .widget:not(.contentWidget) input[type=submit]{
	background:var(--darkU)
}
.drK body.MN-3 .mobMn li >*:hover svg.line, .drK body.MN-4 .mobMn li >*:hover svg.line{
	stroke:var(--darkU);
	fill:var(--darkU) !important
}
.drK body.MN-3 .mobMn li >*:hover svg .f, .drK body.MN-4 .mobMn li >*:hover svg .f, .drK footer .credit a svg{
	fill:var(--darkU)
}
.drK .pS input[id*="1"]:checked ~ .tbHd label[for*="1"], .drK .pS input[id*="2"]:checked ~ .tbHd label[for*="2"], .drK .pS input[id*="3"]:checked ~ .tbHd label[for*="3"], .drK .pS input[id*="4"]:checked ~ .tbHd label[for*="4"], .drK .widget:not(.contentWidget) input[type=text]:focus, .drK .widget:not(.contentWidget) input[type=email]:focus, .drK .widget:not(.contentWidget) textarea:focus, .drK .widget:not(.contentWidget) input[data-text=fl], .drK .widget:not(.contentWidget) textarea[data-text=fl], .drK .wL.cl .lbN:not(div):hover, .drK .wL.cl div.lbN{
	border-color:var(--darkU)
}
.drK .button.ln:hover{
	border-color:var(--darkU);
	box-shadow:0 0 0 1px var(--darkU) inset
}
.drK .mnBr a, .drK .pLbls >*, .drK .aTtl a, .drK .blogPg >*, .drK .brdCmb a, .drK .wL li >*, .drK .mobMn li >*, .drK .cmAc a{
	color:var(--darkT)
}
.drK .blogPg .nPst, .drK .blogPg .current{
	background:var(--contentL);
	color:var(--bodyCa)
}
.drK .featuredPost .itemFt::after{
	background:var(--darkTa)
}
@media screen and (min-width:897px) {
	.drK header .searchWidget input{
		background:var(--darkBs)
	}
	.drK header .searchWidget input:focus, .drK header .searchWidget input:hover{
		background:var(--darkBa)
	}
	.drK body.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn .n, .drK body.bD:not(.hdMn) .navI:checked ~ .mainWrp .mnMn li:not(.mr) ul, .drK body.hdMn .navI:not(:checked) ~ .mainWrp .mnMn .n, .drK body.hdMn .navI:not(:checked) ~ .mainWrp .mnMn li:not(.mr) ul{
		background:var(--darkBa);
		box-shadow:0 10px 40px rgba(0,0,0,.2);
		color:var(--darkTa)
	}
	.drK body.LS-2 .blogCont::before{
		background:var(--darkBs)
	}
	.drK body.LS-3 .headCn{
		background:transparent
	}
	.drK body.LS-3 .headL, .drK body.LS-3 .mnBrs{
		background:var(--darkBs)
	}
	.drK body.LS-3 .headR{
		background:var(--darkB)
	}
	.drK .tocLi::before{
		border-color:rgba(255,255,255,.15)
	}

}
@media screen and (min-width:897px) {
	.drK header{
		border-bottom:var(--headerL) solid rgba(255,255,255,.15);
		box-shadow:none
	}
	.drK .blogCont::before{
		border-right:1px solid rgba(255,255,255,.15)
	}
	.drK .mnBrs{
		box-shadow:none
	}

}
@media screen and (min-width:641px) {
	.drK .ftMn a:hover{
		color:var(--darkU)
	}

}
@media screen and (max-width:640px) {
	.drK .ftMn{
		background:var(--darkBa)
	}

}
@media screen and (max-width:500px) {
	.drK .itemFt .itm .iCtnt{
		background:var(--darkBa)
	}

}

/* Comment reply: keep the cancel action aligned with the dark-mode text palette. */
.drK .cm #cancel-comment-reply-link{
	color:var(--darkT)
}
.drK .cm #cancel-comment-reply-link:hover{
	color:var(--darkU)
}
