#wrapper{
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;   
}

#menu-left{
	margin-left: 16px;
}

#sidebar-wrapper-left {
    position: relative;
    width: 300px;  
   
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#sidebar-wrapper-left .sidebar-nav {
    position: absolute;
    top: 0;
    right:0;
    width: 300px;
    margin: 0;
    margin-right: 16px;
    padding: 0;
    list-style: none;
	background-color: #fff;
}

#sidebar-wrapper-left .sidebar-nav.open{
	background-color: #fff;
	margin-right: 0px;
}

.sidebar-nav li {
    padding:10px;
    padding-right:15px;
    border-bottom: 1px solid #ececec;
	border-left: 2px solid transparent;
}

.sidebar-nav li a{
    text-decoration: none;
    color: #754C0D;
    letter-spacing: 0.5px;
}

.sidebar-nav li span{
	cursor:pointer;
}

.sidebar-nav li a:hover,
.sidebar-nav li a:active,
.sidebar-nav li a:focus {
    text-decoration: none;
    color: #754C0D;
}

.sidebar-nav > .sidebar-brand {
    background: #d2a743;
    padding: 6px 12px;
}

 #wrapper.toggled #sidebar-wrapper-left {
	width: 40px;        
}

#wrapper.toggled #sidebar-wrapper-left .sidebar-nav {
    height: 40px;
    overflow: hidden;
}

.mobile-menu-left{
	display:none;
}

div#menu-toggle {
    margin: 0;
    font-size: 1.125rem;
    color: #fff;
    cursor: pointer;
    align-items: center;
}

#menu-toggle i.fas.fa-bars {
    font-size: 1.25rem;
}

.sidebar-nav.open span.btn-menu-toggle:before{
	font-family: "Font Awesome 5 Free";
	content: "\f100";
	font-weight: 900;
}

.sidebar-nav span.btn-menu-toggle:before{
	font-family: "Font Awesome 5 Free";
	content: "\f0c9";
	font-weight: 900;
}

/* Sub Menu Styles */

.sub-menu {
	margin-top: 10px;
	padding-left: 25px;
    list-style: none;	
}
.sub-menu li{
	border-bottom: none;
}

.sub-menu li a{
  	margin-left: 0;	
	
	-webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease; 
}

/* ---- Active Item ------ */
li.nav-item-active.child-list ul , li.item-active-child{
	margin:0;
}

li.nav-item-active,
li.nav-item-active.child-list > div ,li.item-active-child > div {
    padding: 10px 15px;
    border-left: 2px solid #754C0D;
}

li.nav-item-active.child-list , li.item-active-child {
	padding:0;
	border-left:0;
}

li.nav-item-active a {
    color: #754C0D;
    font-weight: bold;
    letter-spacing: 0.3px;
}

/*li.item-active-child > div > a{
	font-weight: bold;
} */

/* ---- Active Child Item ------ */
li.nav-item-active> ul > li > a {
    font-weight: normal;
}

ul.sub-menu > li.nav-item-active {
    border:none !important;
}


/* @media (max-width: 991px) { */
/* 	.menu-left { */
/* 	    margin-top: 0px;	     */
/* 	}		 */
/* } */

@media (max-width: 768px) {
	#wrapper, 
	#sidebar-wrapper-left{
		-webkit-transition: none;
    	-moz-transition: none;
   	 	-o-transition: none;
    	transition: none; 
	}
	
	#wrapper.toggled #sidebar-wrapper-left .sidebar-nav{
		height: 0;
	}
	
	#sidebar-wrapper-left .sidebar-nav {
	    position: fixed;
	    width:100%;
	    height:100%;
	    overflow-y: scroll;	
	    z-index:1000; 
	}
	
	#sidebar-wrapper-left .sidebar-nav.open{
		border-radius: 0;
	}
		
 	#wrapper.toggled .sidebar-nav{ 
 		width: 300px; 
	    overflow: hidden; 
 	    position: absolute;
 	    box-shadow: none; 
 	    height: 60px; 
 	    border-radius: 0; 
 	} 

	.sidebar-nav.open > .sidebar-brand{
		border-radius:0;
		border:0;
	}
	
	/* Admistrator role styles */
	
	#wrapper.role-admin	.sidebar-nav.open{
		margin-top:48px;
	}
	
	#wrapper.role-admin.toggled .sidebar-nav{
		top:-107px;
	}
	
	.mobile-menu-left{
		display: inline-block;
	    padding: 20px 15px;
	    float: left;
	    background: #d2a743;
	}
	
	.sidebar-nav.open span.btn-menu-toggle:before {
	    font-family: "Font Awesome 5 Free";
	    content: "\f00d";
	    font-weight: 900;
	}
		
}