/* ESTE ES EL CÓDIGO DE LA HOJA DE ESTILOS QUE DEFINE LOS FORMATOS DE LA PÁGINA*/
/* La barra y ela asterisco encierran comentarios como este de ejemplo*/

body{ /*Acá se definen definen propiedades generales. Pero no se imponen a las particulares */
	text-align: left; /*alineación hor del texto*/ 
	font-family: Tahoma, Arial, Geneva, sans-serif; /*tipo de fuente*/
	color: black; /*color de fuente*/
}
/* LOS ELEMENTOS NOMBRADOS CON CADA "id" EN EL HTML ACÁ SE NOMBRAN CON # Y DETALLAN ASÍ: */  
#encabezado{ /*Define propiedades de la cabecera*/
	/*font-family: Fredoka One; Staatliches; Mystery Quest; Henny Penny*/
	font-family: Mystery Quest;
	width: 100%; /*toma todo el ancho disponible en pantalla*/
	height: 120px; /*100 píxeles de alto*/
	text-align: center; /*Alineación horizontal de textos y contenidos*/ 
	font-size: 150%; /*controla proporcionalmente el tamaño de la tipografía*/	
	color: white; /*color de fuente*/
	background-color:#A4C460; /*color de fondo*/
	box-sizing: border-box;
	padding:1px 10px 0px 10px;
	margin: 0px;
	border:0px;
	float: top; /*indica la ubicación relativa del bloque*/
}

#navegacion{ /*Define propiedades de la barra izquierda*/
	width: 20%; /* le asigno un 20% del ancho total*/
	height: 500px; /*Altura en píeles*/
	text-align: left; /*Alineación horizontal de textos y contenidos*/ 
	font-style: italic; /*hace que todo el texto quede en cursiva*/
	background-color:#D2EB93; /*color de fondo*/
	box-sizing: border-box;
	padding:0px 10px 0px 10px;
	margin: 0px;
	border:0px;
	float: left; /*ubicación relativa del bloque*/
	}

#contenido{ /*Define propiedades de la sección principal (centro a la derecha)*/
	width: 80%; /* le asigno un 80% del ancho total*/
	height: 500px; /*Altura en píxeles*/
	text-align: left; /*Alineación horizontal de textos y contenidos*/ 
	background-color:#E5F5C3;
	box-sizing: border-box;
	padding:0px 10px 0px 10px;
	margin: 0px;
	border:0px;
	float: right;/*ubicación relativa del bloque*/
}

#pie{ /*Define propiedades del pie de la página*/
    height: 100px;
	color: white; /*color de fuente*/
    background-color:#A4C460;
    text-align: center; /*Alineación horizontal de textos y contenidos*/ 
   	clear: both;/*ubicación relativa del bloque*/
	box-sizing: border-box;
	padding:0px 10px 0px 10px;
	margin: 0px;
	border:0px;
	float: bottom;/*ubicación relativa del bloque*/
}
#imagenizq{
	width:150px; /*ancho*/	
	margin: 5px;/*define un pequeño margen alrededor */
	float: left;/*ubicación relativa del bloque*/
	float: top;/*ubicación relativa del bloque*/
}
#imagender{
	width:150px;
	margin: 5px;/*define un pequeño margen alrededor */
	float: right;/*ubicación relativa del bloque*/
	float: top;/*ubicación relativa del bloque*/
}
iframe{margin:5px;} /*define un pequeño margen alrededor del cada iframe*/