@charset "utf-8";

/* CSS Document */



/* ESTA LINEA DEBE DE IR DE PRIMERO SIEMPRE PARA QUE NO SE DESORDENEN LOS MARGENES DE LA HOJA */

* {
	text-indent:0px;
	margin:0px;
	padding:0px;
	border: 0px;
	color: #000;
	visibility: visible;
	border-color: #000;
}

/* AQUÍ JUSTIFICAMOS LOS PARRAFOS */

p {text-align: justify}



/* LOS TITULOS SE DEFINEN CON LAS ETIQUETAS H1,H2... */

h1 {padding: 5px 10px 5px 10px; font-size: 2.5em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}



h2 {padding: 5px 10px 5px 10px; font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}



/* PARA QUE QUEDE CENTRADA EN TODOS LOS NAVEGADORES*/

body{ text-align: center}


body {background-image: url(imagenes/fondo.gif) }



/*AQUI DEFINIMOS EL ANCHO DE LA PAGINA*/

#global {width:800px ; margin: 4px auto}



/* aquí insertamos la imagen que le va a dar bordes redondeados  a la parte de arriba*/

#curva-superior { background-image: url(imagenes/curva-superior.gif) ;

                  background-repeat: no-repeat ;

                  width:800px ;

                  height: 12px ;

                  overflow : hidden }

									

#cabecera {border-left: black 1px solid ; 

           border-right: black 1px solid ; height:85px}

#logotipo  {float:left; text-align:center;}



#publicidad {width:518px ; float:right}



/* MENU PRINCIPAL */

#navegacion {background-color:#9BCD9B ; border: black 1px solid ; height:20px}/*#D3D3D3#00FA9A #FFFACD*/



/*PARA EL MENú HORIZONTAL*/

#navegacion li {float:left; list-style:none; margin: 0px 20px 0px 20px}

/* para centrar los elementos del menu horizontal*/

#navegacion ul { margin-left: 50px }

/* PARTE PRINCIPAL DE LA PAGINA */

#contenido { margin:auto; background-color: #ADFF2F; border-left: black 1px solid ; border-right: black 1px solid; 

border-bottom: black 1px solid}



/* PARA QUE EL PARRAFO NO QUEDE PEGADO AL MARGEN DE LA CAPA Y EL TEXT-IDENT ES PARA TABULAR EL INICIO DE CADA PARRAFO */

#contenido p {
	padding: 5px 10px 5px 10px;
	text-indent: 15px;
}



/* LA PARTE DEL ; background-position: bottom  es para que se pueda ver el borde de abajo de la imagen*/

#menu {width: 150px ; float:left ; text-align:left ; margin: 3px 10px 3px 3px;

			background-image: url(imagenes/menu-parte-inferior.gif); background-position: bottom; padding-bottom:5px  }



/* AQUI LE DECIMOS QUE QUEREMOS EL MENU SIN NINGUN ESTILO DE PUNTOS O GUIONES, Y LE PONEMOS LOS */

		/* MARGENES QUE NOS GUSTEN */

#menu li {list-style:none ; margin: 8px 8px 4px 6px}



/*Características para el titulo del menu*/

#menu h1 {text-decoration:none ; font-size:14px; 

          background-image: url(imagenes/menu-parte-superior.gif)}

					

/*PIE ES LA CAPA PRINCIPAL */

#pie {background-color: #FFFFFF; border-left: black 1px solid ; border-right: black 1px solid; height: 88px; text-align:left}



/*AQUI DEFINIMOS LAS CARACTERISTICAS QUE QUEREMOS QUE COMPARTAN TODOS LOS MENúS DE LA CAPA PIE 

/*EN ESTE CASO QUE NO TENGAN PUNTITOS ANTES DE CADA ITEM NI QUE ESTEN SUB-RAYADOS

#pie li  {list-style: none }

/*AQUí DEFINIMOS LAS SUB-CAPAS DE PIE Y LE PONEMOS EL FLOAT LEFT PARA QUE SE UBIQUEN EN UNA SOLA LINEA HORIZONTAL

#pieuno  {float:left; width:150px }

#piedos  {background-color: silver ; float:left; width:496px}

#pietres {float:left; width:150px}



#pieuno li {margin: 8px 8px 4px 6px}

#pietres li { margin: 8px 8px 4px 6px}



#pie a         {color: blue; text-decoration:none ; display: block }

#pie a:link    {}

#pie a:visited {}

#pie a:hover   {color:black ; text-decoration:underline ; background-color: white }

#pie a:active  {color:black}*/

									

#curva-inferior { background-image: url(imagenes/curva-inferior.gif) ;

                  background-repeat: no-repeat ;

                  width:800px ;

                  height: 12px ;

                  overflow : hidden }

									

/* AQUI DEFINIMOS LOS COLORES QUE TENDRÁN LOS LINKS EN SUS DIFERENTES ESTADOS, la caracteristica de display:block*/

/*es para que en cualquier parte que se situe el cursor en direccion del iten el link se active y no si solamente*/ /*nos posicionamos en el texto */

a {color: #008B00 ; text-decoration:none ; display: block }/*#1E90FF*/

a:link {}

a:visited {color:red}

a:hover {color:red; text-decoration:underline; background-color: silver}

a:active {}



#logotipo a         {}

#logotipo a:link    {}

#logotipo a:visited {}

#logotipo a:hover   {background-color: white }

#logotipo a:active  {}