body
{
	display:flex;
	justify-content:center;
	flex-direction:column;	
	box-sizing:border-box
	
}
h1, h2, h3 {text-align:center;}

.bloque
{
	justify-content:center;
	width:100%;
	padding:10px;		
}
.cabecera
	{	
	box-sizing:border-box;
	width:98;
	margin-left:1%;
	margin-right:1%;
	margin-top:10px;
	margin-bottom:10px;
	background-color:lightblue;
	color:navy;
	text-align:center;
	border:solid navy 5px;	
	padding:10px;
	}



.central
{
	
	display:flex;	
	flex-direction:row;	
	justify-content:center;
	box-sizing:border-box
	width:100%;
	
}

.bloque_pie
{
	width:100%;
}
.pie
{
	box-sizing:border-box;
	width:98%; 
	background-color:aquamarine;
	color:darkcyan;
	border: 5px solid darkcyan;
	margin-left:1%;
	margin-right:1%;
	margin-top:10px;
	padding: 10px;
	text-align:center;
}

.temas
	{	
		box-sizing:border-box;
		min-width:20%;
		background-color:lightgreen;
		color:green;
		border: olive solid 5px;
		padding:10px;
		margin:10px;
		display:flex;
		flex-direction:column;
		
	}
.contenidos
	{
		box-sizing:border-box;
		width:70%;
		background-color:tan;
		color:black;
		border:5px solid brown;
		margin:10px;
		padding:10px;
		
	}
	
.ejemplo
{
	box-sizing:border-box;
	padding:10px;
	display:flex; flex-direction:column;
	text-align:center;
	float:left;
}

.cuadro_texto
{
	border: 1px black solid;
	padding: 10px;
	margin:10px;
	background-color:Cornsilk;
	color: DarkGoldenRod;
	text-align:center;
}
	


canvas{border:black solid 5px;
		background-color:white;}
		
@media only screen and (max-width: 600px) 
			{
				
				.central
				{
					display:flex;
					flex-direction:column;
				}
				.temas{width:90%;display:flex; flex-direction:row;} 
				.contenidos{width:90%;}
			}