@charset "UTF-8";

html {
height: 100%;
width: 100%;
overflow: hidden;
}

#contenidoflash {
height: 100%;
width: 100%;
left: 214px;
top: 72px;
margin: 0;
padding: 0;
background-color: #000000;
}
    
body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
background-color: #000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
color:#666666;
text-align:center; /*aqui mandamos a centrar todo el contenido*/ 
}
	
	
#contenedor {
width:90%; /*ancho total de la pagina*/ 
border:1px solid #333333; /*encadeno los 3 atributos claves del borde en una sola linea, ahorrando codigo XD*/ 
background-color:#FFF8F0;
margin:10px auto; /*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*/ 
}

#encabezado {
margin:10px; /*para que no se pegue al borde*/ 
padding:4px; /*algo de relleno*/
width:35%; /*este ancho es para que cuadre con el texto*/ 
height:20px; /*idem*/ 
border:0px solid #333333; /*decoracion*/
background-color:#FFF8F0; /*algo de color*/ 
float:left; /*lo flotamos a la izquierda*/ 
display:inline; /*(*)*/ 
}

#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:400px;
color:#000000;
margin:0; /*los h1 vienen con margen, con esto se lo quito*/ 
text-transform:uppercase; /*convierte todas en mayusculas*/ 
padding-bottom:10px;
}


#menu {
float:left;
margin:0px 10px auto 0;
border:1px solid #333333;
width:67%;
height:120px;
} 

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:#FFF8F0; /*algo de color*/ 
color:#FFFFFF; /*mas*/ 
width:354px; /*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*/ 
   
}
li a:hover {
background-color:#999900; /*decoración para el evento hover (mouse encima)*/ 
}

#contenido {
width:100%; /*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:10px;
}

#contenido h2 {
font-size:16px;
color:#999900;
width:98%;
margin:7px; /*para que no se pegue al borde*/ 
padding:0px; /*algo de relleno*/    
   
}

#contenido h3 {
width:90%;
font-size:14px;
color:#999900;
border-bottom:1px dotted #999900;
}

#footer {
width:560px; /*menos porque debemos sumar el padding del div contenido*/ 
text-align:right;
padding:10px;
font-size:80%; /*mas pequeño el texto*/ 
font-style:italic;
color:#999999;
}

.Estilo1 {
color: #990000;
font-weight: bold;
}
 
#Layer7 {	
position: absolute;
width:188px;
height:16px;
z-index:5;
left: 1007px;
top: 25px;
}

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