html
{
    position: relative; 
    min-height: 100%;
}

body {
	margin: 0 0 30px;
	padding: 0;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-size: 16px;
	background-repeat: round;
	background-attachment: fixed;
}

h1, h2 {
	margin: 0;
	padding: 0;
	font-weight: normal;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight: 200;
	color: #1e4a68;	
}

h3 {
	margin: 0;
	text-transform: uppercase;
	color: #565656;	
}

h4 {
	color: #1e4a68;
}

p, ul, ol {
	margin-top: 0;
	line-height: 180%;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
}

/* Franja superior de la página */

#franja_cabecera {
	height: 30px;/* Altura de la franja */
	background-color: #003333;/* Color de fondo */
}

/*Menú horizontal*/

.navegacion{
	width: 100%;/* Ocupará todo el ancho posible */
	border-bottom: 3px solid #E7EBED;/* Borde inferior */
}


.navegacion ul{
	list-style: none;/* Quitar el estilo de la lista */
	margin-bottom: 0;/* Margen inferior */
	font-size: 14px;/* Tamaño de la fuente */ 
	margin-left: -3%;/* Margen izquierdo */
}

.menu > li{
	display: inline-block;/* Los elementos de la lista se mostrarán por bloques */
	text-align: center;/* Alineación del texto */
	width: 130px;/* Ancho de los bloques */
}

.menu > li > a{
	display: block;/* Los elementos de enlace de la lista se mostrarán por bloques */
	padding-top: 10px;/* Relleno superior */
	padding-bottom: 10px;/* Relleno inderior */
	color: #1e4a68;/* Color de la fuente */
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";/* Tipo de fuente */
	text-decoration: none;/* Elimina el subrayado de los enlaces */
	margin-left: 0;/* Margen izquierdo */
	margin-right: 0;/* Margen derecho */
	letter-spacing: 1px;/* Espacio entre letras */
}

.menu li a:hover{
	color: #FFFFFF;/* Color de la fuente */
	background: #003333;/* Color de fondo al seleccionar un item del menú */
	width: auto;/* Anchura automática */
}

/* Submenu*/

.submenu{
	position: absolute;/* Posición del submenu */
	width: 250px;/* Anchho del submenu */
	visibility: hidden;/* Visibilidad oculta mientras no se seleccione algún item con submenu */
	background-color: #f0f0f0;/* Color de fondo */
}

.submenu li a{
	display: block;/* Los elementos del submenu se mostrarán por bloques */
	text-align: left;/* Alineación del texto */
	padding: 15px;/* Relleno */
	color: #000;/* Color de la fuente */
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";/* Tipo de fuente */
	text-decoration: none;/* Elimina el subrayado de los enlaces */
}

.menu li:hover .submenu{
	padding:  0;/* Relleno */
	visibility: visible;/* Los items del submenu se mostrarán */
	margin-left: 0;/* Margen izquierdo */
}

/* Cabecera de la Página */

#header-wrapper {
	background-color: #FFF;/* Color de fondo de la cabecera */
	width: 100%; /* La cabecera ocupará todo el ancho */
	top: 0; /* Posicionamos la cabecera en la parte superior */
	position: absolute;/* Tipo de posición de la cabecera */
	/*position: fixed; /* Permite que la cabecera tenga una posición fija */
	min-width: 1000px;/* Ancho mínimo de la cabecera */
	text-align: center;/* Alineación del texto */
	border-bottom: 3px solid #E7EBED;/* Borde inferior */
}

/* Línea de Separación de la cabecera(Entre la cabecera y el menú) */

hr.linea_cabecera {	
	padding: 0;
	margin: 0;
	height: 0.5px;
}

/* Banner (contenido de la cabecera) */

#banner {
	width: 1000px;/* Ancho máximo que tendrá el contenido del banner de la cabecera */
	margin-right: auto;/* margen automático derecho */
	margin-left: auto;/* margen automático izquierdo */
}

/* Primer título de la cabecera */

#banner h1 {
	letter-spacing: 4px;/* Espacio entre letras */
	font-size: 18px;/* Tamaño de la fuente */
	color: #1e4a68;/* Color de la fuente */
	font-family: Cambria;/* Tipo de fuente */
	margin-top: 40px;/* Margen superior */
	text-transform: uppercase;/* El texto se mostrará siempre en mayúsculas */
	width: 830px;/* Ancho máximo que tendrá el texto */
	margin-left: 5%;/* Margen izquierdo */
}

/* Segundo título de la cabecera */

#banner h2 {
	letter-spacing: 4px;/* Espacio entre letras */
	font-size: 22px;/* Tamaño de la fuente */
	color: #1e4a68;/* Color de la fuente */
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";/* Tipo de fuente para el texto */
	margin-top: 40px;/* Margen superior */
	text-transform: uppercase;/* El texto se mostrará siempre en mayúsculas */
	width: 880px;/* Ancho máximo que tendrá el texto */
	margin-left: 5%;/* Margen izquierdo */
}

/* Tercer título de la cabecera */

#banner h3 {
	letter-spacing: 4px;/* Espacio entre letras */
	font-size: 28px;/* Tamaño de la fuente */
	color: #1e4a68;/* Color de la fuente */
	font-family: Cambria;/* Tipo de fuente para el texto */
	float: right;/* El texto se colocará a la derecha */
	margin-top: 36px;/* Margen superior */	
}

/* Logo de la Universidad */

#banner img{
	width: 100px;/* Anchura de la imagen */
	height: 100px;/* Altura de la imagen */
	float: left;/* La imagen se colocará en el lado izquierdo */
	padding-right: 10px;/* Relleno derecho */
	margin: 3px;/* Margen total */
}

#titulo_grupo {
	width: 680px;/* Anchura máxima de los títulos */
	height: auto;/* Altura automática */
	float: left;/* El texto se colocará en el lado izquierdo */
}

#titulo_grupo h1 {
 	margin-top: 23px;/* Margen superior */
}

#titulo_grupo h2 {
 	margin-top: 10px;/* Margen superior */
}

/* Colocamos en el centro el contenido completo que tendrá cada página */

#page {
	width: 1000px;/* Ancho máximo del contenido de la página */
	margin: 0 auto;/* Centra todo el contenido de la página mediante los márgenes */
	min-width: 1000px;/* Ancho mínimo del contenido de la página */
}

/* Contenido de la página */

#content {
	margin-top: 190px;/* Margen de separación entre el contenido principal y la cabecera */
}

/* Clase con el estilo que se aplicará al contenido principal de la página */

.post {
	margin-top: 23%;/* Margen de separación entre el contenido y la cabbecera de la página */
	margin-bottom: 10%;/* Margen de separación entre el contenido y el pie de página */
	text-align: justify;/* Alineación justificada del texto */
}

/* Clase con el estilo que se aplicará al texto del contenido principal de la página */

.post p {/*Quita los espacios y el relleno inncesario que hay entre los parrafos del contenido de cada posteo*/
	padding: 0;/* Relleno */
	margin: 0;/* Margen */
	line-height: 1.5; /* Separación entre líneas */
	margin-bottom: 20px;/* Margen inferior */
	text-align: justify;/* Alineación justificada del texto */
	letter-spacing: 0.5px;/* Espacio entre letras */
}

/* Título principal de cada página */

.title {
	font-size: 26px;/* Tamaño de la fuente */
	font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;/* Tipo de fuente para el texto */
	color: #1e4a68;/* Color del texto */
	letter-spacing: 1px;/* Espacio entre letras */
	margin-top: 40px;/* Mangen entre el título y la cabecera */
}

/*Página de inicio*/

.lista_presentacion {/* Lineas de Investigación */
	margin-top: 10%;/* Margen de separación entre el contenido y la cabbecera de la página */
	width: 1000px;/* Ancho máximo que ocupan las líneas de investigación de la presentación del Inicio */
}

.lista_presentacion ul {	
	margin: auto;/* Margen automático */
	text-align: center;/* Alineación del texto */
	letter-spacing: 1px;/* Espacio entre letras */
}

.lista_presentacion li {
	list-style: none;/* Quitar el estilo de la lista */
	margin-top: 20px;/* Margen superior*/
	width: 400px;/* Ancho de cada cuadro de la lista de investigación */
	float: left;/* El cuadro se colocará a la izquierda */
	padding: 25px;/* Relleno */
	margin-right: 10px;/* Margen derecho */
	font-size: 15px;/* Tamaño de la fuente */
	color: white;/* Color de la fuente */
	background-color: #1e4a68;/* Color de fondo */
	box-shadow: 2px 2px 5px #999;/* Sombra */
}

/* Item central de las lineas de investigación */

li.item_lista_centro {
	width: 400px;/* Anchura del item */
	margin-bottom: 14%;/* Margen de separación entre el contenido y el pie de página */
	margin-right: 23%;/* Margen derecho */
	margin-left: 23%;/* Margen izquierdo */
}

/*Parámetros de las tablas para la pestaña: Miembros*/

.tabla_miembros  {
	margin: auto;/* Margen automático */
	width: 600px;/* Ancho de la tabla */
  	border-spacing: 0px 30px;/*Separación entre los contenidos de la tabla*/
	border: 1px solid #000000;/* Borde de la tabla */
	box-shadow: 2px 2px 5px #999;/* Sombra exterior de la tabla */
	font-size: 16px;/* Tamaño de la fuente */
	letter-spacing: 0.5px;/* Espacio entre letras */
	
}

.tabla_miembros img  {/* Atributos para la imagen de perfil */
	width: 150px;/* Ancho de cada imagen dentro de la tabla */
	height: auto;/* Altura automática */
	float: right;/* La imagen se colocará a la izquierda */
	margin-right: 50px;/* Margen izquierdo */
	margin-top: 3px;/* Margen superior */
}

.tabla_miembros p  {
	width: 450px;/* Ancho máximo que tendrá el texto de descripción de cada miembro del grupo */
	margin-top: 20px;/* Margen superior */
	margin-left: 50px;/* Margen izquierdo */
}

/*Parámetros para la pestaña: Contacto*/

.contacto {
	width: 1000px;/* Ancho máximo */
	margin-bottom: 7%;/* Margen de separación entre el contenido y el pie de página */
	
}

.contacto p {/* Atributos para el texto */
	width: 412px;/* Ancho máximo que tendrá el texto de descripción sobre el contacto */
 	margin-top: 25px;/* Margen superior */
	margin-left: auto;/* Margen izquierdo automático */
	margin-right: auto;/* Margen derecho automático */
	font-size: 18px;/* Tamaño de la fuente */
}

/* Pie de página */

#footer{/* Atributos para el pie de página */
	margin: 0 auto;/* Centra todo el contenido del pie de página automáticamente */
	padding: 20px 0 15px 0;/* Relleno del pie del página */
    position: absolute;/* Tipo de posición del pie de página */
  	bottom: 0;/*Hace que el pie de página siempre esté en la parte inferior de la página*/
	width: 100%;/*El pie de página ocupará todo el ancho*/
	/*border-top: 3px solid #E7EBED;*/
	min-width: 1000px;/* Ancho mínimo que tendrá el pie de página */
	background-color: #323232;/* Color de fondo del pie de página */
	
	
}

#footer p {/* Atributos para el texto del pie de página */
	text-shadow: 2px 2px 0px rgba(0,0,0,0.2);/* Sombra del texto */
	padding-top: 10px;/* Relleno superior */
	text-align: right;/* Alineación del texto hacia la derecha */
	color: #FFF;/* Color de la fuente */
	font-size: 12px;/* Tamaño de la fuente */
	width: 1000px;/* Ancho máximo que tendrá el contenido del pie de página */
	margin: auto;/* Margen automático */
	letter-spacing: 1.5px;/* Espacio entre letras */
}

.two-columns {
    
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    
    -webkit-column-gap: 10px; /* Chrome, Safari, Opera */
    -moz-column-gap: 10px; /* Firefox */
    column-gap: 10px;
    
    -webkit-column-gap: 2rem; /* Chrome, Safari, Opera */
    -moz-column-gap: 2rem; /* Firefox */
    column-gap: 2rem;
    
    -webkit-column-rule: 5px solid #1e4a68  ; /* Chrome, Safari, Opera */
    -moz-column-rule: 5px solid #1e4a68  ; /* Firefox */
    column-rule: 5px solid #1e4a68  ;
    
    -webkit-column-rule: 0.5rem solid #1e4a68  ; /* Chrome, Safari, Opera */
    -moz-column-rule: 0.5rem solid #1e4a68  ; /* Firefox */
    column-rule: 0.5rem solid #1e4a68  ;
    
    margin: 20px;
    margin: 2rem;

}