/* Estilos Comunes a  todas */



body {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 12px;

	color: #000000;

	background-color: #EFEBEF;

	margin-top:0;

}

a:link { color: #000000; text-decoration: none; }

a:hover {color:#4a83ac;}

a:visited { color: #333333; text-decoration: none;}

a:active { color: #4A83AC;}

li { text-indent: 0; } /* Formateo común a todas las listas , sirve para que el segundo renglón se ubique debajo del texto superior y no debajo del punto o circulo o letra, en fin... de eso   */

dl { margin-top: 5px; }

dt { 

	font-weight: bolder;

	color: #000000;

	padding-top: 5px;

	text-indent: 0px;

	text-align: left;

	padding-left: 5px;

}

dd { text-indent: 0; padding-left: 3px; }

h1 {

	font-family:  'Franklin Gothic Medium', Arial, Helvetica, sans-serif;

	color: #FFFFFF;

	font-size: 20px;

	font-weight: normal;

	text-align: center;

	padding-top: 4px;

	margin: 0;

	padding-bottom: 4px;

}

h2 {

	font-size: 14px;

	font-weight: bolder;

	margin-top: 4px;

	margin-bottom: 4px;

	text-align: center;

	clear: both;

}

h3 {

	font-size: 13px;

	font-weight:bolder;

	margin: 0;

	padding-left:10px;

}

h4 {

	font-size: 13px;

	font-weight: bolder;

	width: 50%;

	text-align: center;

	border-bottom-width: 1px;

	border-bottom-style: solid;

	margin-top: 0;

	margin-right: 0;

	margin-bottom: 0;

	margin-left: 25%;

}

h5 {

	font-size: 12px;

	font-weight: bolder;

	text-align: left;

	margin-top: 2px;

}

/* ESTILO PARA TODAS LAS PAGINAS: DEFINE ANCHO DE PAGINA Y POSICIONA EL CONTENIDO EN EL CENTRO */

#caja_pag {

	width:760px;

	text-align:left; /* alinear textos */

	margin:auto;

	background-color: #DEDFC6;

	height: auto;

	padding: 0px;

}	

/* ENCABEZADO: todos tienen en comun es el posicionamiento de la imagen  y el AREA DE TITULO Y TEXTO, el título y la CAJA PARA EL ENCABEZADO se consignan la hoja de cada area porque tienen fondo.  */

.img_area {

	float: left;

	height: auto;

	width: 444px;

	padding: 0;

	margin-top: 10px;

	margin-right: 0;

	margin-bottom: 0;

	margin-left: 0;

}

#indice_area {

	float: right;

	width: 316px;

	height: 159px;

	background-color: #FFFFFF;

	margin-top: 0;

	padding-bottom: 1px;

}

/* DEFINE EL AREA PARA EL  CONTENIDO TOTAL ESPECIFICO DE CADA PAGINA */

#caja_cont {

	clear: left;

	float: left;

	height: auto;

	width: 760px;

	background-color:  #D6D3CE;

	margin: 0px;

}

/* area para el indice fijo lateral izquierdo corresponde al indice guia para pacientes, buscar, etc. define todas las caracteristicas incluida la posición a la izquierda */

#lateral {   

	width:155px;

	float: left;

	background-color: #D6D3CE;

	clear: left;

	padding-top:20px;

	padding-left: 5px;



}

/* formato para los links del índice lateral - Es necesario para que no  se inactiven una vez visitados */

#lateral a:link { color: #000000; text-decoration: none; }

#lateral a:hover { color: #4a83ac; }

#lateral p {

	margin-top: 0px;

	margin-bottom: 10px;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 11px;

	font-weight: bolder;

	text-align: left;



}

/* area para el contenido propiamente dicho (texto, imagenes, etc.)  */

#contenido { /*define el ancho del espacio disponible, el color del fondo y lo ubica a la derecha */

	background-color: #FFFFFF;

	width:600px;

	float: right;

	margin: 0;

	height: auto;

}

#contenido p{

	padding-right: 3px;

	padding-left: 5px;

}

.texto {

	text-align: justify;

	text-indent: 10px;

	padding-right: 8px;

	padding-left: 2px;

	width: 580px;

	float: right;

	clear:right;

	margin-top: 5px;

}





/* Texto a dos Columnas */

.colum_izq {

	font-size: 11px;

	text-align: left;

	height: auto;

	width: 50%;

	float: left;

	margin-top: 5px;

	background-color: #FFFFFF;

}

.colum_der {

	font-size: 11px;

	text-align: left;

	width: 49%;

	float: right;

	margin-top: 5px;

	background-color: #FFFFFF;

}

.cuadro { 

	color: #333333;

	padding: 5px; 

	border: 1px solid #333333;

	clear: both;

	width:400px;

	margin-left:100px;

	margin-top:10px;

}

.violeta { 

	color: #FFFFFF;

	padding: 5px; 
	
	background: #993399; 

	clear: both;

	width:400px;

	margin-left:100px;

	margin-top:10px;

}

.naranja { 

	color: #FFFFFF;

	padding: 5px; 
	
	 background:#FF6633;
		
	clear: both;

	width:400px;

	margin-left:100px;

	margin-top:10px;

}

.resaltar { /* Texto resaltado por el fondo de color  */

	color: #000000;

	background-color: #ebebeb;

	width: 480px;

	padding: 5px;

	margin-left: 50px;

	margin-bottom:10px;

}

.naranja_form {

	color: #CE6533;
	font-size: 12px;
	font-weight: bold;
	text-align:center;

}

/* INFORMACIÓN DESTACADA */

#barra{ /* DEFINE LA CAJA PARA LA INFORMACIÓN DESTACADA  */

	width: 100%;

	clear: both;

	float: left;

	display: inline;

	height: auto;

	background-color: #FFFFFF;

	margin: 0;

	padding-top: 0;

	padding-right: 1px;

	padding-bottom: 0;

	padding-left: 0;

}

#barra2{ /* DEFINE LA CAJA PARA LOS ACCESOS RAPIDOS  */

	width: 100%;

	clear: both;

	float: left;

	display: inline;

	height: auto;

	background-color: #D6D3CE;

	margin: 0;

	padding-top: 0;

	padding-right: 1px;

	padding-bottom: 0;

	padding-left: 0;

}

.celda { /* celda  */

	font-size: 11px;

	color: #000000;

	display: block;

	height: 93px;

	width: 247px;

	text-align: left;

	padding: 3px;

	float: left;

	margin: 0px;

	border-top-width: 1px;

	border-top-style: solid;

}

.celda img { /* formato para posición de imagen de Información Destacada - No hace falta formatearla  cuando se inserta, deja un borde y la coloca a la izquierda con el texto rodeandola  */

	padding-right: 3px; 

	float: left;

	padding-left: 2px;

}



/* formato para los links de la información destacada - Es necesario para que sigan cambiando de color una vez visitados */



.celda a:link { color: #000000; text-decoration: none; }

.celda a:hover { color: #4a83ac; }





/* PIE DE PAGINA */



#pie {

	clear: left;

	width: 760px;

	height:70px;

	margin:0;

}	

#pie_form {

	clear: left;

	width: 760px;

	height:70px;

	margin:0;
	
	background:#CE6500

}	

#pie_form p {

	font-size: 10px;

	color: #FFFFFF;

	display: block;

	text-align: center;

	padding: 12px;

	margin: 2px;

}


.img_pie1 {

	display: block;

	float: left;

	margin-top: 20px;

	margin-left: 3px;

}

.img_pie2 {

	display: block;

	float: right;

	margin-top: 15px;

	font-size:9px;

	margin-right: 3px;

}



#pie p {

	font-size: 10px;

	color: #FFFFFF;

	display: block;

	text-align: center;

	padding: 12px;

	margin: 2px;

}





/* NAVEGADOR SUPERIOR: formato para los links  (Principal | Comunciación | Ubicación | Mapa del Sitio - son necesarios para que no se inactiven una vez visitados */



#nav_sup p{

    font-size: 11px;

	background-color: #FFFFFF;

	text-align: right;	padding: 10px;

	margin: 0;

}



#nav_sup a:link { color: #000000; text-decoration: none; }

#nav_sup a:hover { color: #4a83ac; font-weight: bolder; }





/* navegador dentro del area  */



#aqui_estoy {

	font-size: 10px;

	color: #000000;

	clear: left;

	float: left;

	height: 20px;

	width: 757px;

	padding-left: 3px;

	background-color: #FFFFFF;

	padding-top: 3px;

}





/* Menú de Navegación por Areas - Es largo y tedioso de leer, por eso está al final y despues de  estos, no hay ninguna otra definición de estilo */ 



#menu_H {

	clear: left;

	float: left;

	padding-top: 10px;

	padding-bottom: 10px;

	display: inline;

	height: auto;

	width: 760px;

	background-color: #DEDFC6;

}



.nav_inst, nav_inst a:link, 

.nav_asist, .nav_asist a:link, 

.nav_adm, .nav_adm a:link, 

.nav_fisicos, .nav_fisicos a:link, 

.nav_doc, .nav_doc a:link, 

.nav_inv, .nav_inv a:link {

	font-family: 'Arial', Helvetica, sans-serif;

	font-size: 14px;

	font-weight: bolder;

	color: #000000;

	text-decoration: none;

	background-color: #DEDFC6;

	text-align: center;

	display: block;

	float: left;

	margin-right:1px;

	margin-left:1px;

}


.cuadroeven { 
	padding: 5px; 
	background-color:#CCCCCC;
	clear: both;
	font-size:16px;
	color:#000000;
	text-align:center;
}


.nav_inst {width: 114px; }

.nav_inst a:hover {color: #FFFFFF; background-color: #9C0063; display: block;}	



.nav_asist {width: 142px; }

.nav_asist a:hover {color: #FFFFFF; background-color: #313063; display: block;}



.nav_adm {width: 130px; }

.nav_adm a:hover {color: #FFFFFF; background-color: #CE6500;  display: block;}	



.nav_fisicos {width: 142px; }

.nav_fisicos a:hover {color: #FFFFFF; background-color: #639A31; display: block;}



.nav_doc { width: 90px; }

.nav_doc a:hover {color: #FFFFFF; background-color: #C40e0e; display: block;}	



.nav_inv { width: 110px;}

.nav_inv a:hover {color: #FFFFFF; background-color: #009A9C; display: block;}	



/* Navegador por Areas actual */