/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*\
	
	Contenido

		* maas1024
		* 1024
		* 770
		* 450

\*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/



/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*\
										@maas1024
\*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#elMenu{
	background-color: #000;
}
	#elMenu nav{
		
	}
	#menu_chk{
		display: none;
	}
	
	#menu_chk + label{
		margin: 0;
		cursor: default;
	}
	#menu_chk + label #menu_ppl, #menu_chk:checked + label #menu_ppl{
		width: 100%;
		height: auto;
		
	}
	#menu_chk:checked + label #menu_ppl, #menu_ppl.verMenu{
		width: 100%;
		height: auto;
		float: none;
	}
	#menu_ppl > p{
		display: none;
	}
	#menu_ppl > ul{
		width: auto;
		display: table;
		padding-bottom: 0;
		max-height: none;
		min-width: 0;
		margin-bottom: 0;
		position: relative;
	}
		#menu_ppl > ul > li{
			display: table-cell;
			vertical-align: top;
			color: #fff;
			cursor: default;
			border: none;
		}
		#menu_ppl > ul > li > a{
			padding: 15px 20px;
			display: block;
			background-color: #000;
			white-space: nowrap;
			color: #FFF;
			-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
				 -o-transition:all 0.3s ease-out;  /* Opera */
			   -moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
				-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
					transition:all 0.3s ease-out;  /* W3C */
		}
		#menu_ppl > ul > li > a:hover, #menu_ppl > ul > li:hover > a{
			background-color: #ddd;
			color: #4e4e4e;
		}
		#menu_ppl > ul > li.parent > a{
			background-image: url(../images/arrow.png); 
			background-repeat: no-repeat;
			background-position: center 40px;
		}
		#menu_ppl > ul > li > ul{
			width: 96%;
			max-height: 0px;
			list-style: none;
			padding: 0px 2%;
			background-color: #469230;
			overflow: hidden;
			position: absolute;
			left: 0;
			top: 50px;
			z-index: 1000;
			-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
				 -o-transition:all 0.3s ease-out;  /* Opera */
			   -moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
				-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
					transition:all 0.3s ease-out;  /* W3C */
		}
		#menu_ppl > ul > li:hover > ul{
			width: 96%;
			max-height: 600px;
			padding: 15px 2%;
			max-height: 210px;
		}
			#menu_ppl > ul > li > ul li{
				float: left;
			}
			#menu_ppl > ul > li > ul a{
				display: block;
				width:160px;
				padding: 0px 20px 0px 30px;
				line-height: 30px;
				background: url(../images/dot.png) 18px 11px no-repeat transparent;
				color: #fff;
				font-size: 0.9rem;
				text-decoration: none;
			}
			#menu_ppl > ul > li > ul a:hover{
				background: url(../images/dot.png) 18px 11px no-repeat transparent;
				color: #ddd;
			}
	#btn_menu{
		display: none;
		float: left;
		width: 40px;
		height: 40px;
		background-image: url(../images/btn_menu.png);
	}


/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*\
										@770
\*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (max-width:770px){
	#elMenu nav{
		position: relative;
	}
		#elMenu .ancho_sitio{
			width: 90%;
		}
			#menu_chk + label{
				cursor: pointer;
				display: table;
			}
				#menu_chk + label #menu_ppl, #menu_ppl{
					width:0;
					max-height: 0;
					position: absolute;
					top: 0;
					left: 0;
					overflow: hidden;
					z-index: 1000;
					-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
						 -o-transition:all 0.3s ease-out;  /* Opera */
					   -moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
						-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
							transition:all 0.3s ease-out;  /* W3C */
				}
				#menu_chk:checked + label #menu_ppl, #menu_ppl.verMenu{
					width: 60%;
					max-height: 533px;
				}
					#menu_ppl > p{
						display: block;
						margin:0;
						margin-left: 40px;
						background-color: #595959;
						color:#bebebe;
						text-align: center;
						line-height: 40px;
					}
					#menu_ppl > ul{
						display: block;
						margin-left: 40px;
						padding-bottom:1px;
						max-height: 500px;
						overflow-y: auto;
						margin-bottom: 0;
					}
						#menu_ppl > ul > li{
							display: block;
							border-bottom:1px solid #1d1d1d;
							border-top: 1px solid #454545;
						}
						#menu_ppl > ul > li:last-child{
							border-bottom: none;
						}
							#menu_ppl > ul > li a{
								padding: 15px 20px;
								background-color: #303030;
								text-align: center;
								color: #FFF;
							}
							#menu_ppl > ul > li a:active, #menu_ppl > ul > li a:hover, #menu_ppl > ul > li:hover > a{
								background-color: #000;
								color: #fff;
							}
							#menu_ppl > ul > li.parent > a{
								background-image: url(../images/arrow_w.png);
								background-repeat: no-repeat;
								background-position: center 40px;
							}
							#menu_ppl > ul > li > ul{
								position: static;
								width: 100%;
								max-height: none;
								padding: 0;
							}
							#menu_ppl > ul > li:hover > ul{
								width: auto;
								max-height: none;
								padding: 0;
								max-height: 210px;
							}
								#menu_ppl > ul > li > ul li{
									float: none;
									border-bottom:1px solid #1d1d1d;
									border-top: 1px solid #454545;
								}
									#menu_ppl > ul > li > ul a{
										width: auto;
										padding: 10px 20px;
										background-image: none;
										background-color: #232323;
										text-decoration: none;
										font-size: 0.9rem;
									}
									#menu_ppl > ul > li > ul a:hover, #menu_ppl > ul > li > ul a:focus{
										background-image: none;
										background-color: #000;
									}
				#btn_menu{
					display: block;
				}
				#menu_chk:checked + label #btn_menu, .btn_activo{
					background-position: bottom;
				}

}


/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*\
										@450
\*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (max-width:450px){
	
		#menu_chk:checked + label #menu_ppl, #menu_ppl.verMenu{
			width: 80%;
		}
}