
#sidebar {
	display: block;
	width:245px;
	height:100%;
	/*background:#303439;*/
	background:#2c3d7a;
	/*float:left;*/
	overflow-y:auto;
	position: fixed;
	top:0px;
	bottom:0px;
}

.menu_sidebar ul {
	font-size:16px;
	font-weight:300;
	color:rgba(255,255,255,0.4);
	list-style-type:none;
	margin:0;
	padding:0;
}

.menu_sidebar li {
	font-weight:300;
	padding:10px 0px 20px;
	border-bottom:rgba(255,255,255,0.2) solid 1px;
}

.menu_sidebar li img {
	opacity:0.3;
	margin-right:7px;
	position:relative;
	bottom: -5px;
}

.menu_sidebar li:hover img {
	opacity:0.7;
}

.menu_sidebar li a {
	display:block;
	font-size:16px;
	font-weight:300;
	color:rgba(255,255,255,0.4);
	margin-left:25px;
	
}

.menu_sidebar li:hover, .menu_sidebar li:hover > a {
	color:rgba(255,255,255,0.7);
	font-weight:300;
	cursor: pointer;
}

.menu_sidebar li.activo > a {
	color:rgba(255,255,255,0.7) !important;
	font-weight:300;
	
}

.menu_sidebar li.activo > a img {
	opacity:0.7;
}


aside {
  transition: all 0.4s ease-out;
}


@media (max-width: 768px) {

aside, #sidebar {
z-index:999;

}

#sidebar.active {
 transition: all 0.4s ease-out;
  -webkit-box-shadow: 5px 0px 22px -8px rgba(0,0,0,0.85);
-moz-box-shadow: 5px 0px 22px -8px rgba(0,0,0,0.85);
box-shadow: 5px 0px 22px -8px rgba(0,0,0,0.85);
}

aside.active {
  left: 0px;
 
}

aside { left:-245px; position:absolute; }

}