/********************************************************************************
									DISEÑO 1
*********************************************************************************/


/*
nav ul
{
	width: 90%;
	list-style: none;
	margin: 55px auto auto;
/*	margin-bottom: 0px; /
	font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}


nav li
{
/*	display: block; /
}


nav li a
{
	display: block;
    width: auto;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 7px;
	padding-right: 7px;
	margin: 0px 0px 10px 0px;
    border:1px solid #000000;
    text-align:center;
    letter-spacing: 1px;
    color:#FFFFFF;
    background-color:#000000;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
/*		border-top-right-radius: 60%; /

-webkit-box-shadow: 2px 2px 1px 2px rgba(255,255,255, 0.7) inset;
		box-shadow: 2px 2px 1px 2px rgba(255,255,255, 0.7) inset;
}

nav li a:hover
{
    background-color:#fff;
    color:#000;
}


@media screen and (max-width: 768px)
{
	nav li
	{
		/*float: left; /
		display: block;
		margin: 15px;
		text-align: justify;
	}

	nav li a
	{
	    width: auto;
		padding-top: 4px;
		padding-bottom: 4px;
		padding-left: 7px;
		padding-right: 7px;
	}
}

*/

/********************************************************************************
									DISEÑO 2
*********************************************************************************/
/*-------------- BOTON PARA MOSTRAR MENU --------------*/
.boton_para_mostrar_menu
{
	float: left;
	display: block;
	width: 30px;
	height: 30px;
	margin: 0px 5px 5px 5px;
  /*position: absolute;
  top: 3px;
  left: 5px;*/
/*float: left;*/
	box-sizing: border-box;
	cursor: pointer;
	background-color: #AAAAFF;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
}

.boton_para_mostrar_menu span
{
	display: block;
	width: 20px;
	height: 1px;
	margin: 7px auto;
	background: #271E03;
}

#checkbox_para_mostrar_el_menu
{
	display: none;
}


/*--------- NOMBRE DE LA PLATAFORMA ---------*/
	/*FP-ARTE*/
#label_nombre_de_la_plataforma
{
	float: left;
	width: 15%;
	font-family: Arial;
	font-size: 20px;
	font-weight: bold;
	margin-top: 3px;
	padding-left: 7px;
	margin-bottom: 4px;
	color: #DDDDDD;
}

/*-------------- CONTENEDOR UL --------------*/
nav ul
{
	float: left;
	display: inline;
	width: 85%;
	height: 20px;
	list-style: none;
	margin: 4px auto 4px;
	font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16px;
	text-align: center;  /*Centro los li dentro del ul */
}

nav li
{
	display: inline;
	margin: 15px;
	text-align: justify;
}


nav li a
{
    width: auto;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 7px;
	padding-right: 7px;

    border:1px solid #000000;
    text-align:center;
    letter-spacing: 1px;
    color:#FFFFFF;
    background-color:#000000;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;

		/*border-top-right-radius: 60%;*/
}

nav li a:hover
{
    background-color:#fff;
    color:#000;
}


/*------------------------ MEDIA QUERY --------------------------*/

/* MUESTRA el botón para mostrar menu */
@media screen and (max-width: 767px)
{
	#label_boton_para_mostrar_menu{display: block;}
	#label_nombre_de_la_plataforma{width: 30%;}

	/* Re-define el contenedor ul para el menu*/
	nav ul
	{
		display: none;
		position: absolute;
		top: 35px;
		left: 0px;
		width: auto;
		height: auto;
		background-color: #333333;
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px;
			border-radius: 10px;
	}
	nav li
	{
	display: block;
	}

	nav li a
	{
		border: none;
		background-color: #333333;
	}
}
		/* OCULTA el botón para mostrar menu */
		@media screen and (min-width: 768px)
		{
			#label_boton_para_mostrar_menu{display: none;}
		}

		@media screen and (max-width: 312px)
		{
			#label_nombre_de_la_plataforma{width: 40%;}
		}