/*  Plugin: jSide Menu (Responsive Side Menu)
 *   Frameworks: jQuery 3.3.1 & Material Design Iconic Font 2.0
 *   Author: Asif Mughal
 *   GitHub: https://github.com/CodeHimBlog
 *   URL: https://www.codehim.com
 *   License: MIT License
 *   Copyright (c) 2019 - Asif Mughal
 */
/* File: jquery.jside-menu.css */

:root{
    --skin-hover: rgba(0, 0, 0, 0.1); 
    --skin-color:  rgba(255, 255, 255, 0.7);
}
.light-skin{
   --skin: #f0f0f0;
   --skin-hover: #ddd; 
   --skin-color:  #232323;
}
.menu-body.visibility{
  visibility: hidden;
}

.menu-trigger.left{
   left: 20px;
}
.menu-trigger.right{
   right: 20px;
}
.sticky{
   position: fixed;
   top: 0;
   left: 0;
}

.menu-container{
   overflow: auto;
   display: block;
   top: 63px;
}
.menu-container::-webkit-scrollbar {
  width: 4px;
}

.menu-container::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.7); 
}
 
.menu-container::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.11); 
}

.menu-container::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

.position-left{
   left: -270px;
}

.position-left.open{
    left: 0;
}
.position-right{
	position: fixed;
	right: -270px;
}
.position-right.open{
	right: 0;
    transform:translateX(0);
}


.menu-container,
.menu-head,
.menu-left,
.menu-left.open
.menu-right,
.menu-right.open{
    transition: .4s;
  -webkit-transition: .4s;
  -moz-transition: .4s;
  -ms-transition: .4s;
}

.menu-container, .menu-head{
    position: fixed;
    z-index: 70000;
    max-width:450px;
    width:90%;
}

@keyframes fadeIn{
   from{
     opacity: 0;
    -webkit-opacity: 0;
    }
    to{
     opacity: 1;
    -webkit-opacity: 1;
   }
}
@-webkit-keyframes fadeIn{
   from{
     opacity: 0;
    -webkit-opacity: 0;
    }
    to{
     opacity: 1;
    -webkit-opacity: 1;
   }
}


/* Dim background effect */
.dim-overlay{
   display: none;
	position: fixed;
	z-index: 60000;
}
.dim-overlay::before {
	content: "";
	background-color: rgba(0, 0, 0, .7);
	height: 100vh;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	overflow: hidden;
	z-index: 100;
}