/* RESET STYLES */
*,  ul, ol, li { margin:0; padding:0 }


.bt-nav-int {
	display: none;
}

.header-home .bt-nav {
	font-size: 16px;
	color: #3D22BD;
	text-decoration: none;
	padding: 22px 0px 22px 0px;
	margin: 0px 25px 0px 0px;
	transition: all 0.2s;

	display: flex;
	align-items: center;
}
.header-home .bt-nav:hover {
	color: #3D22BD;
}

.product-int .bt-nav {
	font-size: 16px;
	color: white;
	text-decoration: none;
	padding: 22px 0px 22px 0px;
	margin: 0px 25px 0px 0px;
	transition: all 0.2s;

	display: flex;
	align-items: center;
}
.product-int.bt-nav:hover {
	color: white;
}

.menu {
	display: flex;
}

.menu li{
	display: flex;
	position: relative;
}

.menu li:first-child{margin-left:0; }





.product-int .menu li a:hover, .menu li:hover a{
	color: #642ACA; 
}






/* DISTANCIA LISTA DESPLEGABLE */
.sub-menu{
	display: none;
	margin: 0;
	padding: 0;
	width: 230px;
	position: absolute;
	top: 66px;
	left: 0px;
}

.menu ul li {
	display: block;
	background:none;
	margin:0;
	padding:0;
}



/* botones LISTA DESPLEGABLE menu */
.header-home .menu ul li a {
	font-size:15px;
	padding: 12px 14px 12px 14px;	
	display:block;
	color:#1F0F91;
	border-left: 5px solid #1F0F91;
	background: white;
	text-decoration: none;
	transition: all 0.2s;
}
.product-int .menu ul li a {
	font-size:15px;
	padding: 12px 14px 12px 14px;	
	display:block;
	color:white;
	border-left: 5px solid #642ACA;
	background: #202020;
	text-decoration: none;
	transition: all 0.2s;
}


.header-home .menu ul li a:hover, .menu ul li:hover > a{
	background:#1F0F91;
	border-left:9px solid #968ce2;
	color: white;
}

.product-int .menu ul li a:hover, .menu ul li:hover > a{
	background:#642ACA;
	border-left:9px solid #bca7e0;
	color: white;
}

.menu li:hover > ul{ display: block;}

.menu ul ul {
	left: 149px;
	top: 0px;
}





.header-home .mobile-menu {
	display:none; transition: all 0.3s;
	background-color: white;
	font-size: 18px;
	color: #1F0F91; 
	font-weight: lighter; 
	text-align: center; 
	text-decoration:none; 
	box-sizing: border-box;
	width:100%;
	padding: 10px 0px 11px 0px;
	text-transform: unset;
}

.header-home .mobile-menu:hover{
	color: #1F0F91;
	text-decoration: none;
}



.product-int .mobile-menu {
	width: 100%;
	display: none;
}










@media (max-width: 960px) {


.menu{display:none; }

.header-home .mobile-menu {
	width: 100%;
	display:block; 
	transition: all 0.3s;
}

.header-home .bt-nav-int {
	display: block;
	width: 100%;
	background-color: #1F0F91 !important;
	text-decoration: none;
	color: white !important;
}

.header-home .bt-nav {
	font-size: 16px;
    color: #3D22BD;
    text-decoration: none;
    padding: 9px 0px 7px 10px;
    margin: 0px 0px 0px 0px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
}

.header-home .menu ul li a {
	font-size: 15px;
    padding: 10px 14px 10px 20px;
    display: block;
    color: #1F0F91;
    border-left: 5px solid #1F0F91;
    background: white;
    text-decoration: none;
}

.header-home .menu li a { 
	color: #1F0F91;
	font-size: 16px;
	border-top:1px solid #1F0F91;
	padding: 8px 0px 6px 8px;
	background-color: #d6d3eb;
	border-left: 7px solid #1F0F91;
}






.product-int .mobile-menu {
	width: 100%;
	display:block; 
	background-color: #202020;
	font-size: 18px;
	color: white; 
	font-weight: lighter; 
	text-align: center; 
	text-decoration:none; 
	box-sizing: border-box;
	width:100%;
	padding: 10px 0px 11px 0px;
	text-transform: unset;
}
.product-int .menu li a { 
	color: white;
	font-size: 16px;
	border-top:1px solid #888;
	padding: 8px 0px 6px 8px;
	background-color: #888;
	border-left: 7px solid #333;
}
.product-int .menu ul li a {
	font-size: 15px;
    display: block;
    border-left: 5px solid #333;
    text-decoration: none;
}
.product-int  .bt-nav {
	font-size: 16px;
    color: #3D22BD;
    text-decoration: none;
    padding: 9px 0px 7px 10px;
    margin: 0px 0px 0px 0px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
}
.product-int .bt-nav-int {
	display: block;
	width: 100%;
	background-color: #642ACA !important;
	text-decoration: none;
	color: white !important;
}



nav {
	margin: 0; 
	width: 100%;
}

.menu li{display:block;	
margin:0;}



.menu li a:hover, .menu li:hover > a{
background:#f0f0f0;
color:#797979;
border-left:19px solid black;}

.menu ul {display:block;
position:relative;
top: 0;
left:0;
width:100%;}

.menu ul ul {left:0;}

}