/* CSS Document */
/*empezamos por esto, para evitar resultados extraños en distintos navegadores, y algo de estilo al texto*/
body {

    background-color:#757574;
    font-family:Arial, "Arial", Verdana, sans serif;
    font-size:10px;
    color:#555555;
    text-align:center; /*aqui mandamos a centrar todo el contenido*/ 
}

#contenedor {
    width:900px; /*ancho total de la pagina*/ 
	height: auto;
    border:1px solid #555555; /*encadeno los 3 atributos claves del borde en una sola linea, ahorrando codigo XD*/ 
    background-color:#DFDDDE;
    margin:auto;
	padding-bottom:0px; 
	margin-bottom:0px;/*10px arriba y abajo, y auto a los lados, para los navegadores nuevos es suficiente para centrar la pagina*/ 
    text-align:left; /*aqui alineamos todo de nuevo a la izquierda, pero dentro del contenedor*/ 
	float:center;
	
}

#encabezado {
    margin:0px; /*para que se pegue al borde*/ 
    padding:0px; /*relleno*/
    width:900px; /*este ancho es para que cuadre con el texto*/ 
    height:119px; /*idem*/ 
    border:0px solid #333333; /*decoracion*/ 
    background-color:#BEBCBD; /*more*/ 
    float:left; /*lo flotamos a la izquierda*/ 
    display:inline; /*(*)*/ 
	/*(*)display:inline; se usa en este caso para corregir un error en IE, en la interpretación del margin y el padding, si flotamos a la izquierda, y hay 10px de margin a la izquierda, IE sumara el doble de ese margen. Con esta linea corregimos eso.*/ 
}
#encabezado h1 { /*encadenamos el identificador del div, con la etiqueta par areferirnos solo al h1 dentro del div encabezado, asi no afectara otros h1 en el resto del documento.*/ 
    font-size:18px;
    font-weight:bold;
    width:900px;
    border-bottom:16px solid #FFFFFF;
    color:#FFFFFF;
    margin:0; /*los h1 vienen con margen, con esto se lo quito*/ 
    text-transform:uppercase; /*convierte todas en mayusculas*/ 
    padding-bottom:10px;
}

#menu {
    float:center;
    margin:0;
    width:900px;
    height:40px;
}
ul {
    list-style-type:none; /*con esto quitamos las viñetas*/
    margin:0; /*le quitamos el margen a la lista*/ 
    padding:0; /*y el relleno*/
}
li {
    margin:0; /*le quito el margen al elemento de la lista*/ 
    float:left; /*y los floto a la izquierda para eliminar el salto de linea*/ 
}
li a {
    display:block; /*con esto el vinculo tendra un area rectangular, asi no sera solo el texto*/ 
    background-color:#CC3300; /*algo de color*/ 
    color:#FFFFFF; /*mas*/ 
    width:58px; /*defino el ancho del rectangulo del vinculo*/
    padding:4px 0 5px 22px; /*sumamos el relleno al ancho y alto del rectangulo para obtener el div #menu completamente ocupado con los ítems del menú*/ 
    text-decoration:none; /*elimino el subrayado del vínculo*/ 
    font-weight:bold; /*decoración*/ 
    text-transform:uppercase; /*decorare los vinculos en mayusculas*/
}
li a:hover {
    background-color:#999900; /*decoración para el evento hover (mouse encima)*/ 
}
#contenido {
    width:850px; /*el ancho mas el padding me da 600px de ancho que es loque mide la pagina */
    clear:both; /*con esto nos aseguramos de que no se ponga nada a los lados*/ 
    padding:20px;
    margin:auto;

}
/*estilo para los titulos dentro del contenido*/
#contenido h2 {
    font-size:16px;
    color:#CC3300;
    width:800px;
    text-transform:uppercase;
    border-bottom:1px dotted #CC3300;
}
#contenido h3 {
    width:800px;
    font-size:14px;
    color:#999900;
    border-bottom:1px dotted #999900;
}
#banner {
    width:900px;
	height: 185;
    border:0px solid #333333; /*encadeno los 3 atributos claves del borde en una sola linea, ahorrando codigo XD*/ 
    background-color:#DFDEDE;
	margin-top:0px; /*10px arriba y abajo, y auto a los lados, para los navegadores nuevos es suficiente para centrar la pagina*/ 
	margin-left:0px; /*10px arriba y abajo, y auto a los lados, para los navegadores nuevos es suficiente para centrar la pagina*/ 
}

#footer {
    width:850px; /*menos porque debemos sumar el padding del div contenido*/ 
	height:20px;
    text-align:center;
    padding:5px;
    font-size:10px; /*mas pequeño el texto*/ 
    font-style:bold;
    color:#555555;
	background-color:#cccccc;
}

.Arial
	{
	font-family:Arial, "Arial", Verdana, sans serif;
	color:#990000;
	font-size: 14px;
	font-weight: normal;
	}
	.ArialGris
	{
	font-family: Arial, "Arial", Verdana, sans serif;
	color:#555555;
	font-size: 15px;
	font-weight: normal;
	line-height:18px;
	}

.link_Home{

	font-family: Arial, Verdana, Helvetica, sans-serif;

	font-size: 10px;

	font-weight: bold;
	
	text-decoration: none;
	
	style: none;

	color: #555555;
	
	margin:10px;


}

.link_Home:link {

	text-decoration: none;

}

.link_Home:active {

	text-decoration: none;

}

.link_Home:hover {

	text-decoration: underline;

	color: #990000;

}

.link_Enlaces{

	font-family: Arial, Verdana, Helvetica, sans-serif;

	font-size: 13px;

	font-weight: normal;
	
	text-decoration: none;
	
	style: none;

	color: #990000;
	
	margin:10px;
	


}

.link_Enlaces:link {

	text-decoration: none;

}

.link_Enlaces:active {

	text-decoration: none;

}

.link_Enlaces:hover {

	text-decoration: underline;

	color: #CCCCCC;

}
.link_socios{

	font-family: Arial, Verdana, Helvetica, sans-serif;

	font-size: 12px;

	font-weight: normal;
	
	text-decoration: none;
	
	style: none;

	color: #555555;
	
	margin:10px;
	


}

.link_socios:link {

	text-decoration: none;

}

.link_socios:active {

	text-decoration: none;

}

.link_socios:hover {

	text-decoration: underline;

	color: #990000;

}
.margin
{
	margin-left:20px;
}
