@charset "UTF-8";
/*Hoja de estilos del website*/
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');

body{background-color: #E6E6E6;
	margin: 1%;
	font-family: "Jost", sans-serif;
	font-size: 14pt;
	}

	header{background-color: lightsteelblue;
			text-align: center;
			margin: 0;}
			
	nav{background-color: #E0FFFF;
		padding: 10px;
		margin: 0;}
		
		ul{
			text-align: center;
			list-style: none;
			}
			
			li{border: 1px solid black;
				width: 60%;
				margin: 5px;
				padding: 3px 6px;
				background-color: lavender;
				border-radius: 5px 5px 5px 5px}
			
	main{background-color: #EDB9DD;
			margin: 0;
			padding-bottom: 3ex;			
			}
			
		h1{color: #6519FD;
			text-align: center;
			font-size: 230%;}
			
		h2{color: #8043FF;
			text-align: center;
			font-size: 200%}
			
		p{text-align: justify;
			margin: 5px 5px;
			line-height: 3.5ex;
			margin-bottom: 2.5ex;}
		
	aside{background-color: lightcyan;
			margin: 0;}
			
		figure{margin: 0;}
		
			a{color: #2D1E55;
				text-decoration: none;}
			
				img{vertical-align: middle;}
				
	footer{
		background-color: lightsteelblue;			
		margin: 0;
		text-align: right;
		}

/*Columnas*/
	main{
		column-count: 2;
		column-gap: 3em;
		column-rule: 1px solid black;
		}
		
	h1,h2{column-span: all;
		}
		
	main>p{
			text-align: justify;
			margin: 1em;
			hyphens: auto; 
			}

/*Display y Posicionamiento (display, position, top, left, float, overflow)*/
	
/*Layout en columnas flexible*/

/*Reset del layout*/

body, header, nav, aside, footer, figure {
														margin: 0;
														padding: 0;
														width: auto;
														height: auto;
														border: none;
														border-radius: 0;
														box-shadow: none;
														}
/*Statics elements*/			
										
	body{
		width: auto;
		min-width: 240px;
		max-width: 1208px;
		margin: 2% auto;}
		
	header{
			overflow: hidden;			
			}
			
	footer{
			clear: both;			
			}
			
/*Flex elements*/	

	#central {
				display: flex;
				flex-direction: row;
				justify-content: flex-start;
				}
	
	#central>nav, #central>aside{
										width: 240px;
										}
	
	#central>main{
					max-width: 728px;
					min-width: 240px;
					}
	
	/*Columnas*/
	
	blockquote{
				column-count: 2;
				column-gap: 3em;
				column-rule: 1px solid black;
				margin 3ex auto;
				}
	
	blockquote>p{
					text-align: justify;
					line-height: 3ex;
					margin: 0 auto 3ex auto;
					hyphens: auto;
					}