/* CSS Document */
html{
        font-family: 'PT Sans', sans-serif; color: #fac944
       }
<link href=rel='stylesheet' type='text/css'>
h1 {font-size: 30rem; color: #fac944;text-align: center;}
h3 {font-size: 1.5rem; color: #fac944; text-align: center;}
a{text-align: center;}
h2 {color: #fac944; text-align: center;}
{ box-sizing: border-box; margin: 0; padding: 0; border-radius: 0.5rem;}
h4 {font-size: 1.1rem; color: #fac944; text-align: center;}
a{text-align: center;margin: 2rem; padding: 2rem;}
nav{ width: 100%; background: #ccc; border-radius: 0.5rem;}
nav ul{ padding: 0; margin: 0}
nav ul li{list-style-type: none;}
nav ul li a{background: #333; text-decoration: none; color: #fac944; display: block; padding: 20px}
nav .botones{ position: relative; background: rgb(122, 100, 196); height: 50px; border-radius: 0.5rem;}
nav .cruz{ position: absolute; top: 10px; right: 10px;}
nav .hamb{position: absolute; top: 10px; right: 10px;}
.vinculo{ text-align: center; color: #fac944; display: block;}

img{margin: auto; width: 80%; background:rgb(122, 100, 196);display: block;background: none;}
#destacada {width: 3%;background: none;}
#destacada2 {border-radius: 1000px;  width: 50%;float: left;}


nav1 {height: 50px; border-radius: 0.5rem;  width: 100%;}



img{
    width: 100%;
    background:rgb(122, 100, 196); 
            }
table {text-align: center; 
   padding: 1rem;}

body {}

#page {width: 90%; margin: 0 auto 0 auto;}

  #main {
   min-height: 50rem;
   margin: 0;
   padding: 0;
   display: -webkit-column;
   display:         column;
   -webkit-flex-flow: row;
           flex-flow: row;
   }
 
  #main > article { 
 background-image: url(img/baner2.png); 
   margin: 0.25rem;
   padding: 0rem;
   border: 0.0625rem solid #fac944;
   border-radius: 0.5rem;
   background: rgb(122, 100, 196);
   -webkit-flex: 3 1 60%;
           flex: 3 1 60%;
   -webkit-order: 2;
           order: 2;
   }
  


  #main > nav {
   margin: 0.25rem;
   padding: 0rem;
   border: 0.0625rem solid #fac944;
   border-radius: 0.5rem;
   background: rgb(122, 100, 196);
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 1;
           order: 1;
   }
  
  #main > aside {
   margin: 0.25rem;
   padding: 0.3rem;
   border: 0.0625rem solid #fac944;
   border-radius: 0.5rem;
  background: rgb(122, 100, 196);
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 3;
           order: 3;
   }
 
  header {
      text-align: center;
margin: 0.25rem;
   padding: 0rem;
   display: block;
         min-height: 6.25rem;
   border: 0.0625rem solid #fac944;
   border-radius: 0.5rem;
   background: rgb(122, 100, 196);
   }
footer {text-align: center;
   display: block;
         min-height: 6.25rem;
    padding: 0.5rem;
    margin: 0.7rem;
    
   border: 0.0625rem solid #fac944;
   border-radius: 0.5rem;
   background: rgb(122, 100, 196);
   }
 
  /* Too narrow to support three columns */
  @media all and (max-width: 40rem) {
  
   #main {
    -webkit-flex-flow: column;
            flex-flow: column;
   }

   #main > article, #main > nav, #main > aside {
    /* Return them to document order */
    -webkit-order: 0;
            order: 0;
   }
  
   #main > nav, #main > aside, header, footer {
    /*min-height: 32rem;*/
    max-height: 32rem;
   }
  }