@charset "utf-8";
/* CSS Document */

body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	text-align: left;
	color: #000000;
}



                                                 /******** Maquetacion*******/


/************************************ COMUN MAQUETACION estos css estan en todas las paginas *******/

.contenedor {
	position:relative;
	width: 1000px;
	margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
	text-align: left; /* esto anula text-align: center en el elemento body. */
	background-color:#FFFFFF;
} 
.header{
	height:155px;
	width:1000px;
	margin:0px;
	padding:0px;
	background-image:url(../imagenes/comunes/banners/BannerPrincipal.gif);
	background-repeat:no-repeat;
}

	

.menuhorizontal{
	margin:0px;
	height:27px;
	width:1000px;
	background-color:#000033;
}

.linea{
	clear:both;
	height:3px;
	width:1000px;
	background-color:#FF9900;
}


.titulo{
	height:62px;
	width:1000px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color:#FFFFFF;
}

.principal{
	width:1000px;
	background-color:#FFFFFF;
	}

.principal2{
	margin-left:23px;
	width:977px;
	background-color:#FFFFFF;
	}

#pie{
	height:161px;
	background-image:url(../imagenes/comunes/banners/pie.gif);
	background-repeat:no-repeat;
	width:1000px;
	clear: both;
}


/* Primera Parte de las paginas es la cabecera en ella hemos creado el menu principal              */

/********************* MAQUETACION TITULO: Diferente en paginas Titulo HV y Grupos **********/



								/**************** MENU SUPERIOR *********************/

#menusuperior{
	margin:0px;
}

#menusuperior li{
	float:right;
	width:100px;
	height:147px;
	margin-left:40px;
	list-style-type:none;
	background-image:url(../imagenes/comunes/menu_superior/Boton-Banner.gif);
	
}

#menusuperior li a{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	height: 120px;
	width: auto;
	font-size: 13px;
	text-decoration: none;
	margin-top: 23px;
	padding-left: 10px;
	float: left;
	padding-top: 0px;
}

#menusuperior li:hover{
	float:right;
	width:100px;
	height:147px;
	margin-left:40px;
	list-style-type:none;
	background-image:url(../imagenes/comunes/menu_superior/Boton-Banner2.gif);
	
}
#menusuperior li a:hover{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	height: 120px;
	width: auto;
	font-size: 13px;
	text-decoration: none;
	margin-top: 23px;
	padding-top: 0px;
	padding-left: 10px;
}

#menusuperior img{
	width:49px;
	height:49px;
	border:none;
	margin-bottom: 10px;
	margin-right: 12px;
	clear: none;
	padding-bottom: 0px;
	margin-top: 25px;
	margin-left: 10px;
}
/********************************************************************************************************************/


				/* A continuacion dentro de la capa menuhorizontal se encuentra el menu que contiene las paginas HV */

								/***************** Menu Horizontal ******************/

#menuhorizontal{
	height:27px;
	background-color:#2F4473;
	list-style-type: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
	
	}
#menuhorizontal li{
	float:left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	width: 165px;
	list-style-type: none;
	background-image:url(../imagenes/comunes/menu_horizontal/Principal.gif);
	background-repeat: no-repeat;
	margin-right: 1px;
	text-align: right;
	padding-top: 0px;
	padding-bottom: 0px;
	height: 27px;
	}
	
#menuhorizontal li a{
	float:right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	width: auto;
	text-decoration:none;
	padding-top: 5px;
	text-align:right;
	margin-right: 4px;
	padding-right: 5px;
	width:140px;
	}
#menuhorizontal li:hover{
	float:left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	width: 165px;
	list-style-type: none;
	background-image:url(../imagenes/comunes/menu_horizontal/principal2.gif);
	background-repeat: no-repeat;
	margin-right: 1px;
	text-align: right;
	padding-top: 0px;
	padding-bottom: 0px;
	height: 27px;
	}
#menuhorizontal li a:hover{
	float:right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000033;
	width: 166px;
	text-decoration:none;
	padding-top: 5px;
	text-align:right;
	margin-right: 4px;
	padding-right: 5px;
	width:140px;
	}
	
/********************************************************************************************************************/	

	/* Despues hacemos la linea que dara paso a la capa de titulo (estas dos las podemos ver en la parte de Maquetacion*/
			/* Dentro de la capa Titulo Tenemos dos tipos uno para paginas HV y otro paginas Grupos */


											/* TITULO PAGINAS GRUPO */


/* TITULO 1 ===========> Especifica las caracteristicas del Titulo Principal para las paginas Grupo (Organizacion de Eventos, Servicios,...*/


#titulo1{
	float:left;
	position:relative;
	width:219px;
	margin-left:0px;
	margin-top:18px;
	text-align:right;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #6666CC;
	font-weight: bold;
	font-size: 17px;
}

/* TITULO_IMAGEN ======> Es la capa que contiene el logo del grupo se repetira en todos los subgrupos del grupo correspondiente*/

.titulo_imagen{
	float:left;
	background:none;
	height:34px;
	width:34px;
	margin-left:28px;
	margin-top:11px;
}

/* SUBTITULO =====> El subtitulo especifica el subgrupo en el cual nos encontramos */

.subtitulo{
	float:right;
	height:19px;
	width:400px;
	margin-right:5px;
	margin-top:39px;
	background-color:#FFFFFF;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #666666;
	font-size: 16px;
	text-align: right;
	font-weight: bold;
}



										/* TITULO PAGINAS HV*/
								
/* Debido a que la colocaccion del titulo varia en este tipo de paginas creamos un nuevo titulo, el cual da error en paginas internet explorer 6, porque ponemos margin-left en  un float left*/

#titulo2{
	float:left;
	width:400px;
	
}

#titulo2 h1{
	margin-left:23px;
	margin-top:10px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #6666CC;
	font-weight: bold;
	font-size: 17px;
	border-left-width: thin;
	border-left-style: solid;
	border-left-color: #FF9900;
	padding-top: 8px;
	padding-left: 23px;
}


/* SUBTITULO2 ==> Es el logo que se encuentra a la derecha del titulo en este tipo de imagenes */

.subtitulo2{
	float:right;
	height:50px;
	width:50px;
	margin-right:5px;
	margin-top:6px;
	background-color:#FFFFFF;
}


/********************************************************************************************************************/

										/* Ahora en ambas paginas creamos otra linea */
				/* A continuacion se hace uso de la capa principal. Aqui tambien hay dos tipos de cuerpo principal */
										/*En las paginas Grupo, Hay un menu lateral */


/* MENULATERAL ====>Esta capa es la que contiene el menu lateral, posee un alto fijo lo cual limita el menu*/

.menulateral{
	height:350px;
	width:247px;
	float:left;
	background-color:#FFFFFF;
}
/*Para Servicios*/

.menulateral2{
	height:450px;
	width:247px;
	float:left;
	margin-top:10px;
	background-color:#FFFFFF;
}

/* Para Ingenieria */

.menulateralIng{
	height:200px;
	width:247px;
	float:left;
	margin-top:10px;
	background-color:#FFFFFF;
}
/* Para Eventos */

.menulateralEvn{
	height:250px;
	width:247px;
	float:left;
	margin-top:10px;
	background-color:#FFFFFF;
}

.menulateralDis{
	width:100px;
	float:left;
	margin-top:10px;
	background-color:#FFFFFF;
}

/* El menu vertical que se ve a continuacion es unico de las paginas de Gupo **/


							/*    			MENU VERTICAL  SOLO PAGINAS GRUPO			*/

/*UL*/

#menuvertical2{
	float:left;
	padding:0px;
	margin:0px;
	
}

#menuvertical2 li{
	width:219px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #999999;
	text-align:right;
	text-decoration: none;
	list-style-type: none;
	padding-top:15px;
	
}

#menuvertical2 li a{
	width:219px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #999999;
	text-align:right;
	text-decoration: none;
	list-style-type: none;
	padding-top:15px;
	
}

#menuvertical2 li a:hover{
	width:219px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#666666;
	text-align:right;
	text-decoration: none;
	list-style-type: none;
	padding-top:15px;
	
}
 /********************************************************************************************************************/
 
 
 /* Esta capa es el efecto linea vertical se encuentra dentro de la capa MENULATERAL*/
.vertical{
	float:right;
	height:80%;
	width:1px;
	margin-right:10px;
	margin-top:10px;
	margin-bottom:10px;
	background-color:#FF9900;
}

.vertical2{
	float:left;
	height:430px;
	width:1px;
	margin-right:28px;
	margin-top:20px;
	background-color:#FF9900;
}

.vertical3{
	float:left;
	height:170px;
	width:1px;
	margin-right:28px;
	margin-top:20px;
	background-color:#FF9900;
}

.vertical4{
	float:left;
	height:220px;
	width:1px;
	margin-right:28px;
	margin-top:20px;
	background-color:#FF9900;
}


#centro{
	float:left;
	width:700px;
	margin-top:20px;
	text-align:justify;
}

#centro p{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	text-indent: 20px;
	}
#centro h2{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	}
#centro ul{
	margin-bottom:20px;
}
#centro li{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-top:4px;
	color:#999999;
	text-decoration:none;
}

#centro a{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	border:0px;
	text-decoration:none;
	padding:5px;
}

#centro  img{
	clear:both;
	float:right;
	margin:10px;
	
}

.rate{
	float:left;
	width:100px;
	height:100px;	
	padding:10px;
	background-color:#FFFFFF;
	
	}

/* Luego encontramos la capa CUERPO id, ella especifica el texto de la paginas GRUPOS */

														/********* CUERPO PAGINAS GRUPO********/

#cuerpo{
	float:left;
	width:712px;
	margin-left:15px;
	color: #F7F6F4;
	text-align: justify;
	margin-top: 10px;
	text-indent:20px;
}

#cuerpo h2{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	}
#cuerpo ul{
	margin-bottom:20px;
}
#cuerpo li{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-top:4px;
	color:#999999;
	text-decoration:none;
}

#cuerpo li a{
	text-decoration:none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;	
}

#cuerpo  img{
	clear:both;
	float:right;
	margin:10px;
	
}

.lista{
	float:left;
	margin:10px;
	}
/* FOTOS EN GRUPO */

#fotos {
	padding:0px;
	margin-top:10px;
	clear: both;
	margin-right:105px;
	padding-bottom:10px;
	text-decoration: none;
	border:0px;
	width:600px;
	}

#fotos table{
	width:600px;
}

#fotos td{
	padding:0px;
}


											/* CAPA PRINCIPAL EN PAGINAS HV */
											
											
/* Tendremos una capa izaquierda donde ira la informacion y en la derecha tendremos una imagen que caracteristica de la página en la que nos encontramos*/


/* IZQUIERDA ====> Es la linea Vertical */


.izquierda{
	float:left;
	background-color:#FF9900;
	width:1px;
	margin-top:10px;
	margin-bottom:10px;
	margin-right:23px;
	height:350px;
	
}

/* DERECHA ========> Contiene la foto */

.derecha{
	float:left;
	width:530px;
	height:385px;
}

.derecha2{
	float:left;
	width:530px;
}


/************************* TEXTO EN PAGINAS HV CUERPO DE LAS PAGINAS NOTICIAS EMPRESA...*******/
#texto{
	float:left;
	width:412px;
	margin-right:11px;

}

#texto p{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: justify;
}

#texto a{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align: center;
	color:#000066;
	text-decoration:none;
}

.texto_izquierda{
	float:left;
	width:150px;
	margin-left:0px;
	margin-top:10px;
	height:150px;
	background-color:#0000FF;
}
.texto_derecha{
	float:right;
	width:150px;
	margin-right:6px;
	margin-top:10px;
	height:150px;
	background-color:#FF0000;
}

.texto_derecha2{
	clear:none;
	float:right;
	width:150px;
	margin-right:6px;
	margin-top:10px;
	height:150px;
	background-color:#FF0000;
}

 									/******************* PIE ******************/

/*PIE H1 ===> Contiene la direccion de la oficina central en todas las paginas */

#pie h1{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-align: center;
	clear: both;
	float: left;
	margin-top: 140px;
	margin-left: 260px;
}


							/**** TABLA DIRECCIONES **/
							
table#sample {
	background-color:#FFFFFF;
	width: 400px;

}

table#sample td {
	padding: 5px;

}

.data {
	color: #666666;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	

}

.toprow {
	font-style: normal;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	border: thin solid #FF9900;
	color: #000033;

}

.leftcol {
    font-weight: bold;
    text-align: left;
    width: 150px;
    background-color: #CCCCCC;

}

.anchos{
	width:200px;
}


/**** TABLA DISTRIBUCCIONES **/
							
table#distribucciones {
	background-color:#FFFFFF;
	width: 100%;
	margin-left:0px;
	margin-top:20px;
	

}

table#distribucciones td {
	padding: 5px;

}

.logos{
	margin-top: 0px;
	
	text-align: justify;
	
	}


.letras{
	margin:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	}
	
.data2 {
	color: #666666;
	text-align:justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin-top:0px;

}

#principal2{
	margin-left:23px;
	width:977px;
	background-color:#FFFFFF;
	}
	
#principal2 li{
	list-style:none;
	margin-top: 10px;
}

#principal2 li a{

	text-decoration:none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;	
	
}

#numeros {
	width:800px;
	clear:both;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	text-align: center;
	margin-bottom:10px;
}

#numeros a{
	text-decoration:none;
}

#formulario{
	margin-top:10px;
	text-align:right;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 13px;
}

/**** TABLA JAZZ **/
							
table#texto {
	background-color:#FFFFFF;
	width: 200px;
	margin-left:0px;
	margin-top:20px;

}

table#texto td {
	padding: 5px;

}

.tit_sanj{
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	border-bottom-width: medium;
	border-bottom-style: solid;
	border-bottom-color: #598FCB;
	color: #999;
	font-weight: bold;
	text-align: left;
	padding-left: 10px;
	width:690px;
	clear:both;
	margin-top:10px;
}

.programacion{
	width:110px;
	height:110px;
	float:left;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #000;
	font-weight: normal;
	text-align: justify;
	padding-left: 10px;
	vertical-align: middle;
	font-size: 12px;
	
}

#programacion{
	width:100px;
	height:100px;
	float:left;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #000;
	font-weight: normal;
	text-align: justify;
	
	font-size: 12px;
	
}
#programacion img{
	width:90px;
	height:90px;
}
