/*Version movil*/
#articulos{
	width: 100%;
	height: auto;
	position: absolute;
	left:0%;
	overflow: auto;
	overflow-x:hidden;
	background-color:#bc7ea5; /*Personalizado*/
	margin-top:62px;
	color:#fff; /*Personalizado*/
	padding-left:0%;
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
	visibility:hidden;
	display:none;
	z-index:9999;
	
	

}
/*Version Web*/
#articulos2 {
	width: 100%;
	margin-top:0px;
	height: auto;
	position: absolute;
	left:0%;
	overflow: auto;
	overflow-x:hidden;
	background-color:#bc7ea5; /*Personalizado*/
	color:#fff; /*Personalizado*/
	padding-left:0%;
	border-top-left-radius:0px;
	border-top-right-radius:0px;
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
	-moz-border-bottom-left-radius:0px;
	-moz-border-bottom-right-radius:0px;
	
	font-family: 'Noticia Text', sans-serif;
		

}

#cerrar-menu{		
	visibility:hidden;
	display:none;

}

#articulos h3, #articulos2 h3{
	font-weight:400;
	font-size:12px;
	padding-bottom:10px;
	padding-top:10px;
	padding-left:10px;
	cursor:pointer;
	text-align:left;
	padding-right:30px;
	
}
#articulos h3:hover, #articulos2 h3:hover{
	background-color:#682f7c;
	color:#fff;
	
}

.menuheader.expandable{
	background-image:url(../jpg/children.png);
	background-repeat:no-repeat;
	background-position:right 7px;

}
.menuheader.expandable.openheader{
	background-image:url(../jpg/children2.png);
	background-repeat:no-repeat;
	background-position:right 7px;

}
#articulos .menuheader2, #articulos2 .menuheader2{	
	background:none;
	background-repeat:no-repeat;
	background-position:right 7px;



}
#articulos  ul, #articulos2  ul{
	margin-top:0px;
	
	
}

#articulos ul li, #articulos2 ul li{
	display: block;
	border-bottom:0px solid rgba(198,199,200,.5);
	padding:0 auto;
	
}

/*Aplica al .categoryitems:hover*/
#articulos  ul li:hover, #articulos2  ul li:hover {
	background-color:#81389c; /*Personalizado*/
	color:#FFF; /*Personalizado*/
	
}

#articulos  ul li a, #articulos2  ul li a {
	display: block;
	margin:0 auto;
	padding:0 auto;
	color:#fff; /*Personalizado*/
	text-decoration:none;
	padding-left:0px;
		
}
header nav ul li:hover .categoryitems {
	display: none;
	border:none;
	outline:none;
	
}
#articulos .categoryitems, #articulos2 .categoryitems {
	width: 100%;
	position: relative;
	display:none;
	border:none;
	outline:none;
	padding:0;
	margin:0;
	
	background-color:#602377;
	font-size:12px;
		
		
}

/*Aplica opcion desplegada*/
.openheader{
	background-color:#21072c;
	color:#FFF;
	margin-bottom:0px;
	

}
#articulos .categoryitems li a, #articulos2 .categoryitems li a {
	margin-left:0px;
	border:none;
	outline:none;
	padding:0;
	margin:0;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:10px;
	-webkit-transition: all .15s ease-in; 
    -moz-transition: all .15s ease-in; 
    -o-transition: all .15s ease-in; 
	-ms-transition: all .15s ease-in;
    transition: all .15s ease-in;

}
#articulos .categoryitems li a:hover, #articulos2 .categoryitems li a:hover  {
	color:#fff;
	margin-left:0px;
	border:none;
	outline:none;
	padding:0;
	margin:0;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:30px;
	-webkit-transition: all .15s ease-in; 
    -moz-transition: all .15s ease-in; 
    -o-transition: all .15s ease-in; 
	-ms-transition: all .15s ease-in;
    transition: all .15s ease-in;

}

@media (max-width: 1024px) {
#articulos{
	width: 30%;
	height:calc(100% - 60px);
	position: fixed;
	left:-100%;
	overflow: scroll;
	overflow-x:hidden;
	margin-top:0px;
	padding-left:2%;
	visibility:visible;
	display:block;
	top:0px;
	padding-bottom:20px;
	padding-top:40px;
		

}

#cerrar-menu{
	width:70px;
	height:40px;
	float:right;
	cursor:pointer;
	line-height:40px;
	visibility:visible;
	display:block;
	margin-top:-40px;

}
#cerrar-menu img{
	padding-top:5px;
	padding-bottom:5px;

}
#articulos2 {
	visibility:hidden;
	display:none;		

}	
}
@media (max-width: 900px) {
#articulos {
	width: 80%;
	position: fixed;
	left:-100%;
	overflow: scroll;
	overflow-x:hidden;
	margin-top:0px;
	padding-left:2%;
	visibility:visible;
	display:block;
	top:0px;
		

}
}
@media (max-width: 500px) {
#articulos {
	width: 90%;
}
}