header{
	position:fixed;
	top:0px;
	left:0px;
	height: auto;
	width: 100%;

	background-color: #464646;

	transition:1s;
}

.nav-menu{
	height:100%;
	width:100%;	
	display: flex;
	flex-direction: column;
}

.menu{
	height: 100vh;
	width: 100%;
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/* margin-top: -55px; */

	overflow-y:scroll;
	overflow-x:hidden;
	-ms-overflow-style: none !important;  /* Internet Explorer 10+ */
    scrollbar-width: none !important;  /* Firefox */

	
	padding-bottom:70px;
}
.menu::-webkit-scrollbar {
    display: none;
}
.menu a, .menu span{
	color:white;
	transition:0.5s;
}

.e-menu{
	/* width:60%; */
	width:100%;
	max-width:80%;
	text-align: center;
	padding:15px 0px;
	border-bottom: 1px solid white !important;
}
.e-menu:hover{
	background-color:white;
	color:#2f2e2e !important;
}
.e-link{
	min-width: 100%;
	margin-left: 20%;
	margin-bottom: 0px;
}
.e-submenu {
	position:relative !important;
	display:none !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;	

	width: auto;
	height: auto;
	background-color: white;
	position: absolute;
	left: 0px;
	top: 0px;

	transition:0.5s;
}

/* BURGER */
.contBurguer {
    width: 60px;
    height: 50px;
    position: relative;
    margin:11px;
}

.burgerBars {
    width: 45px;
    height: 3px;
    position: absolute;
    left: 8px;
    border-radius: 10px;
    background-color: white;
}

.burgerBar1 {
    top: 10px;
    transition: 0.75s;

}

.burgerBar2 {
    top: 22px;
    transition: 0.20s;

}

.burgerBar3 {
    top: 34px;
    transition: 0.5s;

}

.burgerBar1-On {
    transform: rotate(-40deg);
    top: 22px !important;
    transition: 0.5s;
}

.burgerBar2-On {
    transform: rotate(40deg);
    transition: 0.75s;
}

.burgerBar3-On {
    width:0px !important;
    transition: 0.20s;
}
/* FIN BURGER */

.submenu-activo{
	display:flex !important;
	animation-name: submenu-animation;
    animation-duration: 0.5s;
}
@keyframes submenu-animation {
    0%   {opacity: 0; }
    100% {opacity: 1;}
}
.e-submenu > div{
	width:100%;
}
.e-submenu > a{
	width:100%;
}
.e-submenu > a:hover {
	background-color: lightgrey !important;
	/* transition:0.5s; */
}
.e-submenu > a{
	padding:10px,5px !important;
	margin-bottom:0px !important;
	color: black !important;
	transition:0.5s;
}
.e-submenu > a:hover {
	color: crimson !important;
	transition:0.5s;
}
.e-submenu > a > div{
	padding: 10px 5px;
}

.logo-info > img{
	max-width:200px;
}

@media only screen and (min-width: 768px){}
@media only screen and (min-width: 992px){
	header{
		height: 100%;
		width: 300px;
		background-color: transparent;
		background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.65) 0,rgba(0,0,0,0.65) 100%);
		background-image: -moz-linear-gradient(270deg,rgba(0,0,0,0.65) 0,rgba(0,0,0,0.65) 100%);
		background-image: -o-linear-gradient(270deg,rgba(0,0,0,0.65) 0,rgba(0,0,0,0.65) 100%);
	}
	.bck-header{
		background-image:none !important;
		background-color: #464646 !important;
		transition:1s;
	}
	.w-header{
		width:80px;
		transition:1s;
	}
	main, footer{padding-left:80px ; transition:1s;}	
	.pl-300{padding-left:300px !important; transition:1s;}

	.menu{
		display: flex !important;
		justify-content: start;
	}	
	.e-menu{
		max-width:90%;
	}
	.e-menu:hover{
		
		background-color:white;
		/* width:100% !important; */
		/* transition:0.25s; */
	}
	.e-menu:hover a, .e-menu:hover span,.e-menu:hover{
		color:#2f2e2e !important;
		transition:0.5s;
	}
	.e-link{
		min-width: 100%;
		margin-left: 10%;
		
	}
	.e-submenu {
		position:absolute !important;
		width: 100vw !important;
		height: 100% !important;
		left: 300px !important;
		top: 0px !important;

		align-items: start !important;
	}
	.e-submenu > a{
		width:300px !important;
	}
	.burger{ 
		opacity: 0;
		margin-right: auto ;
    	margin-left: 13px ;
	}
	.d-menu-none{
		display:none !important;
	}

	.logo-info > img{
		max-width:250px;
	}

	/* EFECTO DE OCULTAR (slideLeft) */
	
	.ocultarMenu{
		opacity: 0 !important; 
		transition: 0.3s;
		animation-duration: 0.3s;
	}
	.mostrarMenu{
		opacity: 1 !important; 
		transition: 1s;
		transition-delay: 0.2s;
	}
	.ocultarBurger{
		opacity: 0 !important; 
	}
	.mostrarBurger{
		opacity: 1 !important; 
		transition: 1s;
		transition-delay: 0.2s;
	}
	/* FIN - EFECTO DE OCULTAR (slideLeft) */

	.m-borderland{
		height:100%;
		width:100%;
		position: fixed;
		top: 0px;
		z-index: 2;

		display:none;
	}
}

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

}
@media only screen and (min-width: 1400px){

}