@charset "utf-8";
/* CSS Document */

body, html{
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
}

#principal {
	display:flex;
	height:84%;
	flex-direction:row;	
	background-color:#F7BBBC;
}

#principal nav{
	order:0;
	min-width:10%;
	background: linear-gradient(45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	text-align:center;
	color:white;
	font-size:1.5em;
	border-right-color:#005815;
	border-right-width:2px;	
}



#principal aside{
	order:2;
	min-width:20%;
	background: radial-gradient(ellipse at center, #ffa84c 0%,#ff7b0d 100%);
	font-size:2em;
	color:white;
	text-align:center;
}

header{
	min-height:8%;
	display:block;
	border-bottom:1px solid #900;
	background-image: linear-gradient(to top, #FF0000 0%, #EB8D9B 51%, #FFBEBE 100%);
	border-bottom-color:#8E001E;
	border-bottom-width:2px;	
}

#footer1{
	min-height:8%;
	position:fixed;
	border-bottom:1px solid #000;
	width:100%;
	background: linear-gradient(to bottom, #b5bdc8 0%,#828c95 36%,#28343b 100%);
	padding:15px;
	font-size:2em;
	color:white;

		
}


#principal section{
	order:1;
	min-height:70%;
	display:flex;
	flex-direction:column;
	flex-wrap:nowrap;
	max-height:100%;
	width:100%;
}


#section1 header{
	background: linear-gradient(45deg, #fefcea 0%,#f1da36 100%);
	order:0;
	min-height:15%;
	flex:1;
	text-align:center;
	font-size:2em;
	color:black;
	
		
}

#section1 article{
	order:1;
	min-height:70%;
	flex:8;
	background: linear-gradient(45deg, #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%);
	font-size:2em;
	color:white;
	text-align:center;
	border-color:#0A00FF;
	border-width:8px;
	
}

#section1 footer{
	background: radial-gradient(ellipse at center, #a90329 0%,#8f0222 44%,#6d0019 100%);
	order:2;
	font-size:2em;
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	color:white;
	text-decoration:blink;
	width:100%;
	min-height:15%;
	justify-content:flex-end;
	flex:1;
	text-align:center;
	
}