/* primero hacemos el cuerpo de la pagina:
una imagen de fondo "fondo.jpg", que se repetirá por toda la página en un mosaico.
También se definen unos márgenes y el alineamiento del texto, en este caso centrado,
para que el contenido de la página aparezca en el centro 
Además se definen otros atributos para el cuerpo de la página,
que luego heredarán otros elementos, como el tipo de letra o el color del texto. */
BODY {
	font : 10pt Arial, Helvetica, sans-serif;
	margin : 0px 0px 0px 0px;
	padding : 0px 0px 0px 0px;
	/*para marginar la página*/ text-align: center;
	background-color: #339900;
	background-image: url(../imagenes/fondo.jpg);
	background-position: top left;
	background-repeat: repeat-x;
	SCROLLBAR-FACE-COLOR: #ffffff;
	SCROLLBAR-SHADOW-COLOR: #950000;
	SCROLLBAR-3DLIGHT-COLOR: #950000;
	SCROLLBAR-ARROW-COLOR: #ffffff;
	SCROLLBAR-DARKSHADOW-COLOR: #ffffff;
	SCROLLBAR-BASE-COLOR: #95000;
}
A:LINK, A:VISITED {
	color : #B55161;
}
A:HOVER {
	color: #999999;
}
INPUT {
	font-size : 8pt;
}
/* Es el estilo del titular del cuerpo*/
	H1{
	font-size: 14pt;
}
/* la capa contenedor:
En esta capa definimos el alineamiento del texto a la izquierda
También definimos un ancho, un color de fondo blanco y el margen, con el
atributo "margin", lo definimos como "auto", para que Mozilla y otros navegadores
centren la capa.
Podemos hacer la prueba de incluir un borde en la capa contenedor. Para ello hay que
añadir en el estilo para la capa contenedor el atributo border
En Mozilla y navegadores similares, todo es correcto. Pero en Internet Explorer la cosa
tiene su problema. Esto es debido a que el espacio de los bordes, en Explorer, se toma
del que se haya asignado a la propia capa y en Mozilla y otros navegadores, se toma como
espacio adicional, aparte del que se haya asignado a la capa en si.
*/
#contenedor{
	text-align: left;
	width: 800px;
	/*border-left : 1px solid #ffffff;*/
	/*border-bottom : 1px solid #ffffff;*/
	/*margin: auto;*/
	background-image: url(../imagenes/cuerpo.jpg);
}
/* la capa cabecera:
Los atributos de estilo definidos para la cabecera son las dimensiones de la capa,
que queremos que sean las mismas que las de la imagen. Aunque en este caso podríamos
habernos ahorrado definir esos valores porque son los que se tomarían por defecto.  
 */ 
#cabecera{
	background-color : #000000;
	height : 140px;
	width: 800px;
	background: transparent url(../imagenes/cabezal.jpg) no-repeat;
}

/* la capa navegador (botonera):
Por lo que respecta a la capa, se define un color y una imagen de fondo,
unos márgenes internos (atributo padding) y un borde, tanto para la parte de arriba
de la capa como para la de abajo.  */ 
 
#navegador{
	background: transparent url(../imagenes/botonera.jpg) no-repeat;
	height : 50px;
	width: 800px;
	/*background-color: #000000;*/
}
#navegador p{
	padding: 8px 3px 1px 10px;
	margin : 0px 0px 0px 0px;
}

.menu {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #333333;
	margin-left: 40px;
	margin-right: 40px;
	letter-spacing: 2px;
	text-align: center;
	margin-top: 6px;
}
.menu A:link {
	COLOR: #333333; TEXT-DECORATION: none
}
.menu A:visited {
	COLOR: #333333; TEXT-DECORATION: none
}
.menu A:hover {
	COLOR: #b55161;
	TEXT-DECORATION: underline
}

#titular{
	background: transparent url(../imagenes/titular.jpg) no-repeat;
	height : 110px;
	width: 800px;
	padding-top: 0px;
	padding-right: 40px;
	padding-bottom: 5px;
	padding-left: 30px;
	/*background-color: #000000;*/
}
/* los estilos del cuerpo:
Los estilos del cuerpo definen la anchura, margen, margen interno, y un color de fondo.
Además, se define el atributo "float:left" para hacer que el cuerpo "flote" a la izquierda.
El resultado es que la capa del cuerpo se coloque a la izquierda y el contenido escrito a
continuación se sitúe, rodeando a esta capa, a la derecha. 
Para posibilitar la disposición en dos columnas vamos a hacer que la capa del cuerpo
"flote" a la derecha. Posteriormente, la capa del lateral-, haremos que "flote" a la izquierda. 
*/ 
.titular{
	color:#666666;
	font-size:15pt;
	ext-transform : uppercase;
	font-weight : normal;
	letter-spacing : 2px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 3px;
	padding-bottom: 0px;
	padding-left: 200px;
}
.copete{
	color:#B35161;
	font-size:8pt;
	ext-transform : uppercase;
	font-weight : normal;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 1px;
}
#cuerpo{
	width: 590px;
	float:right;
	/*background: transparent url(imagenes/cuerpo.jpg) no-repeat bottom right*/;
	padding-top: 13px;
	padding-right: 20px;
	padding-bottom: 15px;
	padding-left: 10px;
}
.subtitulo { 
	font-family: Arial, Helvetica, sans-serif;
 	font-size: 14px; 
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #B55161}
.cuerpo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	margin-left: 10px;
}
.cuerpo_bold { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
 	font-size: 11px; 
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #950000}
.cuerpo_destacado { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
 	font-size: 12px; 
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #333333}

#lateral{
	width: 190px;
	float:left;
	height: 200px;
	margin-top: 13px;
	margin-left: 20px;
}
.cuerpolateral{
	padding-top: 5px;
	padding-right: 4px;
	padding-bottom: 13px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
}
.cuerpolateral A:link {
	COLOR: #333333; TEXT-DECORATION: none
}
.cuerpolateral A:visited {
	COLOR: #333333; TEXT-DECORATION: none
}
.cuerpolateral A:hover {
	COLOR: #b55161;
	TEXT-DECORATION: underline
}

.titlat{
	color:#ffffff;
	font-size:8pt;
	ext-transform : uppercase;
	padding: 7px 3px 7px 8px;
	margin: 20px 0px 0px 0px;
	font-weight : normal;
	letter-spacing : 2px;
	background: #950000 url(imagenes/titlat3.jpg) no-repeat bottom right;
}
#pie{
	/*border-bottom: 1px solid #800000;*/
	/*padding: 3 10 3 10px; */
	height : 30px;
	width: 800px;
	text-align:center;
	clear: both;
	background-image: url(../imagenes/pie.jpg);
	background-repeat: no-repeat;
	padding-top: 8px;
} 
.pie {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #ffffff;
	margin-top: 10px;
}
.pie A:link {
	COLOR: #ffffff; TEXT-DECORATION: none
}
.pie A:visited {
	COLOR: #cccccc; TEXT-DECORATION: none
}
.pie A:hover {
	COLOR: #ffffff; TEXT-DECORATION: none
}
