body, html {
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
        
}
#main {
   height: 80%;
   display: -webkit-flex;
   display:         flex;
   flex-flow: row;
}
#main article {
	background:#F5FFFA;
	flex: 2 1 60%;
	order: 2;
        margin: 10px;
	padding: 0px;
        border: 2px solid white;
             
}
#main nav {
	background: #FFF5EE;
	flex: 1 6 20%;
	order: 1;
        margin: 10px;
	padding: 10px;
        border: 2px solid white;
        
}

header, footer {
	
	min-height: 10%;
	background: #eee;
        margin: 10px;
	padding: 10px;
        border: 2px solid white;
}

#imagen{
    display:block;
    margin: auto;
    width:50%;
    max-height: 200px;
    padding: 5px;
}

#main  article aside{
     height: 90%;  
   display: -webkit-flex;
   display:         flex;
   flex-direction: row;}


#main article aside iframe 
{
  
	flex: 0 0 auto;
	order: 1;
        border: 0px;
        padding: 5px;
        margin: 10px;
        max-height: 200px;
        max-width: 200px;
        
     }
     #main article aside object 
{
  
	flex: 0 0 auto;
	order: 2;
        border: 0px;
        padding: 5px;
        margin: 10px;
        max-height: 200px;
        max-width: 200px;
        
     }
#main article aside audio
{
    
	flex: 0  0 auto;
	order: 3;
        border: 0px;  
        padding: 5px;
        margin: 10px;
        max-height: 200px;
        max-width: 200px;
        
     }