@media screen and (max-width:768px){

	:root{
		--mobile-side-width:min(320px,85vw);
	}

	#side.mobile-side-panel{
		position:fixed!important;
		top:0!important;
		right:0!important;
		bottom:0!important;
		left:auto!important;
		width:var(--mobile-side-width)!important;
		max-width:var(--mobile-side-width)!important;
		height:100vh!important;
		margin:0!important;
		padding:0!important;
		background:#ffffff!important;
		z-index:2147483001!important;
		box-shadow:-2px 0 12px rgba(0,0,0,0.15)!important;
		transform:translateX(100%)!important;
		transition:transform 0.3s ease!important;
		display:block!important;
		opacity:1!important;
		filter:none!important;
		pointer-events:auto!important;

		overflow-y:auto!important;
		overflow-x:hidden!important;
		-webkit-overflow-scrolling:touch!important;
	}

	#side.mobile-side-panel.is-open{
		transform:translateX(0)!important;
	}

	#side.mobile-side-panel aside{
		position:relative!important;
		width:100%!important;
		max-width:100%!important;
		height:auto!important;
		max-height:none!important;
		margin:0!important;
		padding:0!important;
		background:#ffffff!important;
		overflow:visible!important;
		box-sizing:border-box!important;
		opacity:1!important;
		filter:none!important;
		pointer-events:auto!important;
	}

	#side.mobile-side-panel *,
	#side.mobile-side-panel #mybox,
	#side.mobile-side-panel .side-widgets,
	#side.mobile-side-panel .widget,
	#side.mobile-side-panel .widget_block,
	#side.mobile-side-panel .widget_text,
	#side.mobile-side-panel .textwidget,
	#side.mobile-side-panel .tagcloud,
	#side.mobile-side-panel ul,
	#side.mobile-side-panel li,
	#side.mobile-side-panel p,
	#side.mobile-side-panel a,
	#side.mobile-side-panel form,
	#side.mobile-side-panel input,
	#side.mobile-side-panel div{
		opacity:1!important;
		filter:none!important;
		pointer-events:auto!important;
	}

	.mobile-side-toggle{
		position:fixed!important;
		top:50%!important;
		right:0!important;
		width:36px!important;
		height:56px!important;
		margin:0!important;
		padding:0!important;
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
		background:#ffffff!important;
		border:1px solid #cccccc!important;
		border-right:0!important;
		border-radius:8px 0 0 8px!important;
		box-shadow:-2px 0 8px rgba(0,0,0,0.12)!important;
		z-index:2147483002!important;
		cursor:pointer!important;
		font-size:20px!important;
		line-height:1!important;
		transform:translateY(-50%)!important;
		transition:transform 0.3s ease!important;
		appearance:none!important;
		-webkit-appearance:none!important;
	}

	.mobile-side-toggle.is-open{
		transform:translateY(-50%) translateX(calc(var(--mobile-side-width) * -1))!important;
	}

	.mobile-side-overlay{
		position:fixed!important;
		top:0!important;
		right:0!important;
		bottom:0!important;
		left:0!important;
		background:rgba(0,0,0,0.35)!important;
		z-index:2147483000!important;
		opacity:0!important;
		visibility:hidden!important;
		pointer-events:none!important;
		transition:opacity 0.3s ease,visibility 0.3s ease!important;
	}

	.mobile-side-overlay.is-open{
		opacity:1!important;
		visibility:visible!important;
		pointer-events:auto!important;
	}

	body.mobile-side-open{
		overflow:hidden!important;
	}
}

@media screen and (min-width:769px){

	.mobile-side-toggle,
	.mobile-side-overlay{
		display:none!important;
	}

	#side.mobile-side-panel{
		transform:none!important;
		position:static!important;
		width:auto!important;
		max-width:none!important;
		height:auto!important;
		max-height:none!important;
		box-shadow:none!important;
		overflow:visible!important;
	}

	#side.mobile-side-panel aside{
		height:auto!important;
		max-height:none!important;
		overflow:visible!important;
	}
}