
.mobile-sidebar {
	margin-top: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	height: 100%;
	width: 290px;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 9000;
	transform: translateX(-100%);
	transition: transform .2s ease-in-out;
	background: var(--porto-body-bg);
}

.mobile-sidebar.sidebar {
	position: fixed;
	padding-top: 0;
	padding-bottom: 0;
}

.mobile-sidebar .sidebar-toggle {
	display: block;
	background: var(--porto-body-bg);
}

.mobile-sidebar>[data-plugin-sticky] {
	height: 100%;
}

.mobile-sidebar .widget {
	margin-top: 0;
}

.mobile-sidebar .sidebar-content {
	display: block;
	overflow-x: hidden;
	overflow-y: scroll;
	height: 100%;
	padding: 20px;
	-webkit-overflow-scrolling: touch;
}

.mobile-sidebar .sidebar-content::-webkit-scrollbar {
	width: 5px;
}

.mobile-sidebar .sidebar-content::-webkit-scrollbar-thumb {
	border-radius: 0px;
	background: var(--porto-gray-2);
}

.column2-right-sidebar .mobile-sidebar, .column2-wide-right-sidebar .mobile-sidebar, .mobile-sidebar.right-sidebar {
	right: 0;
	left: auto;
	transform: translateX(100%);
}

html.sidebar-opened body>:not(.mfp-bg):not(.mfp-wrap) {
	z-index: 0;
}

html.sidebar-opened .mobile-sidebar {
	z-index: 9000;
	transition: transform .3s;
	transform: translateX(0);
}

html.sidebar-opened .mobile-sidebar .sidebar-toggle i:before {
	content: "";
}

html.sidebar-opened .page-wrapper {
	left: 260px;
	overflow: visible;
}

html.sidebar-opened #header.sticky-header .header-main.sticky {
	left: 260px;
}

html.sidebar-opened.sidebar-right-opened #header.sticky-header .header-main.sticky, html.sidebar-opened.sidebar-right-opened .page-wrapper {
	left: -260px;
}
