/*RESETEO UNIVERSAL*/
*{
    border: 0;/*modelo de caja*/
    margin: 0;/*margen*/
    padding: 0;/*relleno*/
}
/*FIN RESETEO UNIVERSAL*/

/*ESTILO LINKS*/
a,visited{
    color: #003366;
    text-decoration: none;
}

a:hover{
    color: #ff9900;
}
/*TERMINA ESTILO LINKS*/

/*ESTILO BODY*/
body{
    background: #222222;/*color de fondo*/
    color: #000000;/*color de la letra: blanco*/
    font-family: 'Arial', Helvetica, Verdana, sans-serif;/*tipo de fuente para la letra*/
    font-size: 1em;/*tamaño de la letra*/
}
/*FIN ESTILO BODY*/

/*ESTILO DE LAS IMAGENES*/
img{
    max-width: 100%;
}
/*FIN ESTILO DE LAS IMAGENES*/

/*ESTILO: HEADER,NAV Y FOOTER*/
header,nav,footer{
    background: #001B58;/*color de fondo: azul marino obscuro*/
    margin: auto;/*margen va estar pegado en la parte superior*/
    text-align: center;/*texto alineado al centro*/
    max-width: 100%;/*el ancho va ocupar toda la pantalla*/
}
/*TERMINA ESTILO: HEADER, NAV Y FOOTER*/

header{
	background: #001B58;/*color de fondo: azul marino obscuro*/
    padding: 1em;
}

/*ESTILO NAV*/
nav{
    background: #CA9C1D;/*color de fondo: dorado*/
    color: #FFFFFF;
    font-size: 18px;
    padding: 0.5em;
    max-width: 100%;/*OCUPAR EL 100% DEL ANCHO DE LA PANTALLA*/
}
/*TERMINA ESTILO NAV*/

/*ESTILO SECTION INDEX*/
section#index{
    background: #FFFFFF;/*color de fondo: blanco*/
    max-width: 100%;/*ancho va a ocupar toda la pantalla*/
    padding: 4em;
}
/*TERMINA ESTILO SECTION INDEX*/

/*ESTILO DEL FORMULARIO DEL INDEX (FORM#FORM1)*/
form#form1{
    background: #F2F2F2;/*color de fondo: gris con blanco claro*/
    border: 1px solid #CA9C1D;/*color del borde del formulario: dorado*/
    color: #000000;/*color de la letra: negro*/
    margin: auto;/*formulario este centrado*/
    padding: 2em;/*separación de lados, arriba y abajo*/
    text-align: center;/*texto este centrado*/
    width: 50%;/*ancho que va ocupar el formulario es del 100%*/
}

input{
    font-size: 25px;/*tamaño de la letra de los inputs*/
    margin: 15px;/*15px de los lados*/
    padding: 5px;/*separación de lados, arriba y abajo*/
    width: 15%;/*ancho de los inputs*/
}

input[type="submit"]{
    background: linear-gradient(#144c83,#2da8ea);
    border: 0;
    border-radius: 20px;
    color: #FFFFFF;
    cursor: pointer;
    margin: 0 auto;
    opacity: 0.8;
    width: auto;
}

input[type="submit"]:hover{
    background: linear-gradient(#2da8ea,#144c83);
    opacity: 1;
}

input[type="submit"]:active{
    transform: scale(0.95);
}
/*ESTILO DEL FORMULARIO DEL INDEX (FORM#FORM1)*/

/*ESTILO FOOTER E IMAGEN*/
#unam{
    display: inline-block;
    max-width: 10%;/*ancho de la imagen*/
}
footer{
    color: #FFFFFF;
    font-size: 18px;/*color de la letra del footer: blanco*/
    padding: 2em;/*separación de los lados, arriba y abajo*/
}
/*TERMINA ESTILO FOOTER E IMAGEN*/

/*ESTILO encuesta_CAD*/
#contenedor_encuesta{
    background: #ffffff;
    margin: 0 auto;
    padding: 30px;
    text-align: center;/*texto justificado*/
    width: 80%;
}

#contenedor_encuesta h1{
    text-align: center;
}

#contenedor_encuesta #form{
    margin-top: 20px;
}
/*TERMINA ESTILO encuesta_CAD*/

/*ESTILO BIENVENIDO.PHP*/
/*ESTILO BIENVENIDO.PHP SECTION contenedor*/
section#contenedor{
    background: #FFFFFF;/*color de fondo: blanco*/
    height: auto;
    margin: 0 auto;/*el contenido quede centrado*/
    max-width: 100%;/*ancho va a ocupar toda la pantalla*/
    padding: 1em;/*separación de arriba, abajo, izquierda y derecha*/
    text-align: center;
}
/*TERMINA ESTILO BIENVENIDO.PHP SECTION contenedor*/




/*ESTILO SECTION mensaje_bienvenida*/
section#mensaje_bienvenida{
	margin: 0 auto;/*centrar*/
	padding-top: 15px;/*separación de arriba*/
    padding-bottom: 15px;/*separación de abajo*/
    padding-left: 2.5px;/*separación de la izquierda*/
    padding-right: 2.5px;/*separación de la derecha*/
	text-align: center;/*texto alineado al centro*/
	text-align: justify;/*texto justificado*/
	width: 58%;/*ancho de la "caja" principal*/
}
/*TERMINA ESTILO SECTION mensaje_bienvenida*/

/*ESTILO principal y aside*/
section#principal,aside{
    background: #FFFFFF;/*color de fondo: blanco*/
    border-radius: 0.5em;/*borde de cada "caja" sea un poco redondo*/
    display: inline-block;/*las "cajas" se muestren en forma horizontal, una junto a la otra*/
    max-width: 100%;/*maximo ancho de las "cajas"*/
    vertical-align: top;/*las "cajas" aparescan en la parte superior de la pantalla*/
}
/*TERMINA ESTILO principal y aside*/

/*ESTILO section#principal*/
section#principal{
    border: #CCCCFF 2px solid;/*borde de la "caja" menu_ejes va hacer de un pixel*/
    padding-top: 15px;/*separación de arriba*/
    padding-bottom: 15px;/*separación de abajo*/
    padding-left: 2.5px;/*separación de la izquierda*/
    padding-right: 2.5px;/*separación de la derecha*/
    width: 86%/*ancho de la "caja" principal*/
}
/*TERMINA ESTILO section#principal*/

/*ESTILO DEL aside*/
aside#menu_ejes{
    border: #CCCCFF 2px solid;/*borde de la "caja" menu_ejes va hacer de un pixel*/
    float: left;/*la "caja" menu_ejes estará pegada hacia la izquierda*/
    padding-bottom: 10px;/*separación de la "caja" menu_ejes de la parte de abajo*/
    text-align: left;
    width: 13%;/*ancho de la "caja" menu_ejes*/
}

/*ESTILO DE LOS EJES*/
aside#menu_ejes h2{
    border-bottom-width: 1px; /*ancho del borde*/
    border-bottom-style: solid; /*stilo del borde*/
    border-bottom-color: #deae3d;/*color del borde: dorado*/
    color: #0a4e9b;/*color de la letra: azul*/
    font-family: Arial, Helvetica, sans-serif; /*tipo de letra*/
    font-size: 14px; /*tamaño de la letra*/
    font-weight: bold; /*letra en negritas*/
    margin-top: 12px; /*margen en la parte de arriba*/
    margin-left: 0px; /*margen a la izquierda*/
    margin-right: 0px; /*margen a la derecha*/
    text-transform: uppercase;/*pone las letras en mayuscula*/

}

aside#menu_ejes ul{
   margin: 0px; !important;
   padding: 0; !important;

}
aside#menu_ejes li {
    margin: 0px; !important;
    padding: 0; !important;

}
aside#menu_ejes a{
    margin: 0px; !important;
    padding: 0; !important;

}


/*TERMINA ESTILO DE LOS EJES*/

/*ESTILO DEL MENSAJE DE BIENVENIDA AL USUARIO*/
aside#menu_ejes h3{
    border-bottom-width: 1px;/*ancho del borde*/ 
    border-bottom-style: solid; /*tipo de estilo de borde*/
    border-bottom-color: #CCCCFF;/*color del borde: lila claro*/
    color: #0a4e9b;/*color de la letra: azul*/
    font-family: Arial, Helvetica, sans-serif;/*tipo de letra*/ 
    font-size: 13px;/*tamaño de letra*/ 
    font-weight: bold;/*letra en negrita*/ 
    margin-bottom: 3px;/*margen de abajo*/ 
    margin-top: 5px;/*margen de arriba*/ 
    margin-left: 8px; /*margen a la izquierda*/
}
/*TERMINA ESTILO DEL MENSAJE DE BIENVENIDA AL USUARIO*/
/*TERMINA ESTILO DEL aside*/

/*ESTILO ul#menu_ejes*/
/*AQUI ME QUEDE*/
/*ul#menu_ejes, ul#menu_ejes li, ul#menu_ejes ul{
    float: left;
    width: 240px;
}*/

ul#menu_ejes:after{/*para internet exploer*/
    clear: both;
    display: block;
    font: 1px/0px serif;
    content: ".";
    height: 0;
    visibility: hidden;
}

ul#menu_ejes li{
    float: left;/*para IE*/
    position: relative;
    list-style-type: none;/*quitamos el tipo de lista (circulos, cuadrados, etc)*/
    line-height: 15pt;/*alto de la línea*/
    display: block;/*despliegue en forma de bloque*/
}

/*ROOT Menu Principal*/
ul#menu_ejes a{
    color: yellow;/*color de la letra: azul*/
    display: block;/*despliegue en forma de bloques*/
    font-family: Arial, Helvetica, sans-serif;/*tipo de letra*/
    font-size: 12px;/*tamaño de la letra*/
    height: auto;/*altura sea automatica*/
    text-decoration: none;/*ningun tipo de decoracion de texto*/
}

/*ROOT Menu Principal Propiedad HOVER*/
ul#menu_ejes a:hover,ul#menu_ejes li:hover a,ul#menu_ejes li.iehover a{
    background: #FFCC00;/*color de fondo: amarillo*/
    color: #FF9900;/*color de la letra: naranja*/
    font-family: Arial, Helvetica, sans-serif;/*tipo de letra*/
    font-size: 12px;/*tamaño de la letra*/
    width: 100%;
}
/*TERMINA ROOT Menu Principal Propiedad HOVER*/
/*TERMINA ROOT Menu Principal*/

/*2DO MENU*/
ul#menu_ejes li:hover li a,ul#menu_ejesli.hover li a{
    background: #F0F6FE;/*color de fondo: azul claro*/
    border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #316bb2;	
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #316bb2;
    color: #113E79;/*color de la letra del 2do menu: azul*/
    width: 120px;/*ancho del 2do menu*/
}

/*2DO MENU PROPIEDAD HOVER*/
ul#menu_ejes li:hover li a:hover, ul#menu_ejes li:hover li:hover a, ul#menu_ejes li.iehover li a:hover,
ul#menu_ejes li.iehover li.iehover a{
    background: #E7E5E5;/*color de fondo: gris cuando no esta seleccionado*/
    background: #CCCCFF;/*color de fondo: morado cuando esta seleccionado por el mouse*/
    color: #0D283F;/*color de la letra: azul*/
    font-family: Arial, Helvetica, sans-serif;/*tipo de letra*/
    font-size: 12px;/*tamaño de la letra*/
}
/*2DO MENU PROPIEDAD HOVER*/
/*TERMINA 2DO MENU*/

/*REDUCE EL MENU A LOS EJES*/
ul#menu_ejes ul,
ul#menu_ejes ul ul,
ul#menu_ejes ul ul ul {
    border-right-width: 1px;/*ancho del borde derecho*/
	border-left-width: 1px;/*ancho del borde izquierdo*/
	border-right-style: solid;/*estilo del borde derecho*/
	border-left-style: solid;/*estilo del borde izquierdo*/
	border-right-color: #316bb2;/*color del borde derecho: azul*/
	border-left-color: #316bb2;/*color del borde izquerdo: azul*/
	display: none;/*ningun tipo de desplegado*/
    left: 240px;/*posición del sub-menu (programas)*/
	position: absolute;/**/
	top: 0;/**/
}
/*TERMINA REDUCE EL MENU A LOS EJES*/

ul#menu_ejes li:hover ul ul,
ul#menu_ejes li:hover ul ul ul,
ul#menu_ejes li.iehover ul ul,
ul#menu_ejes li.iehover ul ul ul {
  display: none;
}

/*MUESTRA LOS PROGRAMAS DE LOS EJES*/
ul#menu_ejes li:hover ul,
ul#menu_ejes ul li:hover ul,
ul#menu_ejes ul ul li:hover ul,
ul#menu_ejes li.iehover ul,
ul#menu_ejes ul li.iehover ul,
ul#menu_ejes ul ul li.iehover ul {
  display: block;/*despliega en forma de bloque*/
}
/*MUESTRA LOS PROGRAMAS DE LOS EJES*/
/*TERMINA ESTILO ul#menu_ejes*/

/*ESTILO PARA LA CLASE titulos*/
.titulos{
    border-bottom: 6px solid #2158A1;/*línea que aparece debajo de los títulos*/
    color: #003399;/*color azul para las letras de los titulos*/
    font-family: Arial, Helvetica, sans-serif;/*fuente de la letra*/
    font-size: 20px;/*tamaño de la letra*/
    padding-bottom: 5px;/*espacio entre el título(letras) y la línea*/
    font-weight: bold;/*las letras del titulo van a estar en negritas*/
}
/*TERMINA ESTILO PARA LA CLASE titulos*/
/*TERMINA ESTILO BIENVENIDO.PHP*/

/*ESTILO INDICADOR_PERIODO_AVANCE.PHP*/
/*ESTILO PARA EL TEXTAREA*/
textarea{
    resize: none;/*EL USUARIO NO PUEDA CAMBIAR EL TAMAÑO DEL textarea*/
}
/*TERMINA ESTILO PARA EL TEXTAREA*/
/*ESTILO PARA LA CLASE indicador*/
.indicador{
    border: #CCCCFF 2px solid;/*borde de la "caja" menu_ejes va hacer de un pixel*/
    text-align: left;
    padding: 0.5em;
    width: 60%;
}
/*TERMINA ESTILO PARA LA CLASE indicador*/

/*ESTILO PARA LA CLASE input_indicador*/
.input_indicador{
    border: #CCCCFF 2px solid;/*borde de la "caja" menu_ejes va hacer de un pixel*/
    font-size: 15px;/*tamaño de la letra de los inputs*/
    margin: 15px;/*15px de los lados*/
    padding: 5px;/*separación de lados, arriba y abajo*/
}
/*TERMINA ESTILO PARA LA CLASE input_indicador*/

/*ESTILO PARA LA CLASE input_submit_indicador*/
.input_submit_indicador[type="submit"]{
    background: linear-gradient(#144c83,#2da8ea);
    border: 0;
    border-radius: 10px;
    color: #FFFFFF;
    cursor: pointer;
    font-size: 20px;/*tamaño de la letra de los inputs*/
    margin: 0 auto;
    opacity: 0.8;
}

.input_submit_indicador[type="submit"]:hover{
    background: linear-gradient(#2da8ea,#144c83);
    opacity: 1;
}


.input_submit_indicador[type="submit"]:active{
    transform: scale(0.95);
}

/*TERMINA ESTILO PARA LA CLASE input_submit_indicador*/
/*ESTILO PARA LA CLASE titulos2*/
.titulos2{
	color:#003399;/*color de la letra: azul*/
    font-family:Arial, Helvetica, sans-serif;/*tipo de letra*/
	font-size:16px;/*tamaño de la letra*/
    font-weight: bold;/*letra en negritas*/
	margin-bottom:7px;/*margen de abajo*/
	padding-bottom:5px;/*separación de abajo*/
	padding-left:5px;/*separacion de la izquierda*/
	text-decoration:none;/*ningun tipo decoración*/
}
/*TERMINA ESTILO PARA LA CLASE titulos2*/
/*TERMINA ESTILO INDICADOR_PERIODO_AVANCE.PHP*/

/*ESTILO PARA LAS TABLAS*/
table#tabla_indicador{
    border-collapse: collapse;
    margin: auto;
    padding: 15px
}

td{
    border: #CCCCFF 3px solid;
    margin: auto;
    padding: 10px;
}
/*TERMINA ESTILO PARA LAS TABLAS*/

/*ESTILO PARA LA CLASE input_indicador2 QUE ESTA EN TABLAS*/
.input_indicador_tabla{
    border: #CCCCFF 1px solid;/*borde de la "caja" menu_ejes va hacer de un pixel*/
    font-size: 13px;/*tamaño de la letra de los inputs*/
    margin: 15px;/*15px de los lados*/
    padding: 5px;/*separación de lados, arriba y abajo*/
    width: auto;/*ancho del input va hacer de automático*/
}
/*TERMINA ESTILO PARA LA CLASE input_indicador QUE ESTA EN TABLAS*/