* {
	padding:0;
	margin:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.icon-menu:before {
    content: "\eaea";
}

.capaAbsolutaMenu
{
    position: fixed;
    width: 100%;
    z-index: 90;
    top: 0px;
}

#menuColorFondo
{
    position: fixed;
    width: 100%;
    height: 70px;
    z-index: 89;
    opacity: 1;
    top: 0px;
    margin-left: 0px;
    background-color: #ffffff;
    display: none;
}

#menuFondo 
{
    position: relative;
    /* float: left; */
    min-width: 88%;
    /* text-align: right; */
    z-index: 90;
    opacity: 0.8;
    top: 50px;
    /* margin-left: 12%; */
    display: inline-block;
}

.MenuFondoFijo
{
    position: fixed;
    min-width: 88%;
    text-align: right;
    z-index: 90;
    opacity: 1;
    background-color: #ffffff;
    top: 0px !important;
    /*margin-left: 12%;*/    
    transition: 0.5s ease;
    -moz-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
}

#menuFondoInterior 
{
    float: left;
    background-color: #ffffff;
    width: 100%;
    /* text-align: right; */
    z-index: 10;
    height: 70px;
    /* top: 15px; */
    position: relative;
}

.menuTexto
{
    /*display: table-cell;*/
    vertical-align: middle;
    padding: 10px;
    color: #333;
}

.menu_bar {
	display:none;
}
 
#menu 
{    
    text-align: center;
    color: #333333;
    right: 0;
    font-size: 12px;
    font-family: Montserrat;  
    font-weight: 700;
	z-index:1000;
	float: right;
	margin-top: 15px;
}
#menu ul {
list-style-type: none;
}

#menu ul li {
    width: 125px;
    float: left;
    color: #fff;
    /* padding-left: 4px; */
    /* padding-right: 4px; */
    /* padding-bottom: 10px; */
    /* height: 46px; */
}

#menu ul li.submenu1:hover, #menu ul li:hover, #menu ul li a:hover
{
    background-color: #eaeaea;
}



/*
#menu ul li:last-child {
width: 100px;
float: left;
color: #333333;
background-color: #ffffff;
border-right: 0px solid #f4f4f4;
padding-left: 4px;
padding-right: 4px;
}*/

#menu ul li.nivel1 ul.nivel2 li {
    color: #333;
    background-color: #fff;
    height: auto !important;
    top: 45px;
}



#menu ul li.nivel2,#menu ul.nivel3 li, #menu ul.nivel4 li
{
    background-color: #eaeaea;
}

#menu ul li a {
display: block;
text-decoration: none;
color: #333;
padding: 0px;
position: relative;
}


#menu ul li.nivel1 { 
float: left;
}

#menu ul li.nivel2 { 
float: left;
background-color: #fff;
}

/* Esta clase es la que hace que se muestren las cosas y se oculten el nivel 1 de submenú */
#menu ul li:hover  ul.nivel2, #menu ul li a:hover  ul.nivel2{
    display: block;
    position: absolute;    
    /*left: 108px;*/
    /*font-weight: bold;*/
}

/* Esta clase es la que hace que se muestren las cosas y se oculten el nivel 2 de submenú */
#menu ul li ul li a:hover ul.nivel3, #menu ul li ul li:hover ul.nivel3 {
    display: block;
    position: absolute;
    left: 125px;
    top: 0px!important;
    background-color: #eaeaea;
}

#menu ul.nivel2, #menu ul.nivel3
{
    display: none;
    width: 125px;
    font-size: 13px;
    background-color: #eaeaea;
    position: absolute;
    /* left: 108px!important; */
    /* text-transform: lowercase; */
}

#menu ul.nivel2 li
{
    /* border: 0px !important; */
    padding-left: 0px !important;
    padding-right: 0px !important;
    border-bottom: 1px solid #fff;
}

#menu ul.nivel2 li a:hover
{
    background-color: #333;
    color: White;
    border: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

#menu ul.nivel2 li a:hover .menuTexto
{
    color: #fff;
}

#menu a.nivel2 .menuTexto
{    
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}


/* Dani nivel 4 */
/* Para ampliar niveles solo hay que copiar este apartado y incrementar en uno el número del nivel */

#menu ul li a.nivel4, #menu ul li a.nivel4ie {
color: #333333;
}

#menu ul li ul li ul li a {
width: 100%;
/*padding: 8px 0px;*/
border-top-color: transparent;
}

#menu ul li ul li ul li a:hover {
border-top-color: transparent;
position: relative;
color: Black;
}

#menu ul li ul li ul li ul li a.primera {
border-top-color: transparent;
}

/* Esta clase es la que hace que se muestren las cosas y se oculten el nivel 3 de submenú */
#menu ul li ul li ul li a:hover ul.nivel4, #menu ul li ul li ul li:hover ul.nivel4 {
display: block;
position: absolute;
left: 100px;
top: 10px;
color: Black;
height: 33px !important;
    
}
.OpcionVisible {
    display: block !important;
    background-color: Red;
    -webkit-transition: all 400ms;
    transition: all 400ms;
}
 
@media screen and (max-width: 1024px) {
	    
	body {
		padding-top:80px;
	}
	
	
	.logoEnMenu
	{
	    display: none !important;
	}
	
	
	#Logo
	{
	    display: none;
	}
	
	#menuColorFondo
    { 
        height: 90px !important;
        z-index: 90;
    }
    
    #menuFondo
    {
        float: none;
        margin: 0;
        top: 0 !important;
        opacity: 1 !important;
        width: 100%;
    }
    
    
    
    .menuTexto {
        padding: 20px;
    }
    
    #menu ul li:hover ul.nivel2, #menu ul li a:hover ul.nivel2
    {
        display: none;
        position: relative;
    }    
	
	#menu ul li ul li a:hover ul.nivel3, #menu ul li ul li:hover ul.nivel3
	{
	    left: 0px !important;
	    top: 0px !important;   
	}
    
    .capaAbsolutaMenu {
        position: fixed;
        width: 100%;
        z-index: 90;
        top: 0px;
        height: 90px;
    }
    
    #menuFondoInterior
    {
        width: 100%;
        margin-left: 0px;
        height: 90px;
    }
    
    .MenuFondoFijo
    {
        position: fixed !important;
        width: 100%;
        z-index: 90;
        opacity: 1;
        background-color: #ffffff;
        top: 0px !important;
        margin-left: 0;    
        transition: 0.5s ease;
        -moz-transition: 0.5s ease;
        -webkit-transition: 0.5s ease;
        -o-transition: 0.5s ease;
    }
    
	.menu_bar {
		display:block;
		width:100%;
		position: fixed;
		top:0;
		height: 90px;
		left:0;
	}
	
	.ImagenLogo
	{
	    float: left;
	    height: 73px !important;
	}
 
	.menu_bar .bt-menu {
		display: block;
		padding: 20px;
		color: #333;
		overflow: hidden;
		font-size: 25px;
		font-weight: bold;
		text-decoration: none;
	}
	
	.menu_bar .bt-menu-logo 
	{
	    float: left;		
		padding: 10px;
		color: #333;
		overflow: hidden;
		font-size: 25px;
		font-weight: bold;
		text-decoration: none;
	}
 
	.menu_bar span {
		float: right;
        font-size: 30px;
        margin-top: 20px;
	}
 
	#menu {
		width: 35%;
		height: calc(100% - 80px);
		position: fixed;
		right:100%;
		margin: 0;
		overflow: scroll;
		top: 90px;
		background-color: #fff;
	}
	
	#menu ul
	{
	    background-color: #fff;
	}
 
	#menu ul li {
		display: block;
		border-bottom:1px solid rgba(0,0,0,0.4);
		width: 100%;
		height: inherit;
	}
 
	#menu ul li a {
		display: block;
	}
 
	#menu ul li:hover .nivel1 {
		display: none;
	}
 
	#menu ul li .nivel1 {
		width: 100%;
		position: relative;
	}
 
	#menu ul li .nivel1 li a {
		margin-left:20px;
	}
	
	#menu ul li .nivel2 
	{
	    display: none;
	    position: relative;
	    left: 0px;
	    width: 100%;
	}
	
	#menu ul li:hover .nivel2 
	{
	    display:none;
        position: relative;
        left: 0px;
        width: 100%;
    }
	
	#menu ul li .nivel2 li a
	{
	    width: 100%;
	}
	
	#menu ul li .nivel2 li .nivel3
	{
	    display: none;
	    position: relative;
	    left: 0px;
	    width: 100%;
	}
	
	#menu ul li .nivel2 li:hover .nivel3
	{
	    display: none;
	    position: relative;
	    left: 0px;
	    width: 100%;
	}
	
	#menu ul li .nivel2 li .nivel3 li, #menu ul li .nivel2 li .nivel3 li a
	{
	    width: 100%;
	}
 
	#menu ul li .caret {
		float: right;
	}
	
	
}

@media screen and (max-width: 800px) {
	 
	#menu {
		width: 80%;
        height: calc(100% - 80px);
        position: fixed;
        /* right: 100%; */
        margin: 0;
        overflow: scroll;
        top: 90px;
        left: -100%;
	}	
	
}