body {
   /* font: 24px Helvetica; */
   background: #7ca3b4;
  }
.texto{
	text-align:justify;
	 padding-left:40px;
	 padding-right:40px;
 }
.header img{
	width:100%;
}
  #main {
   /* min-height: 800px; */
   margin: 0px;
   padding: 0px;
   display: -webkit-flex;
   display:         flex;
   -webkit-flex-flow: row;
           flex-flow: row;
   }

nav {
  font-family: font-family: Verdana, Geneva, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #44606f;
}
div.centrado{
	border: 4px solid;
	width:90%;
	/* text-align: center; */
}
nav li a {
  color: white;
  display: block;
  text-decoration: none;
  padding: .5em 1em;
}
nav li:hover {
  /* box-sizing: border-box;
  border:4px solid black; */
  background: #9ab5c1;
  color: white;
}
nav li.dentro{
  /* box-sizing: border-box;
  border:4px solid black; */
  background: #9ab5c1;
  color: white;
}
ul{/* font-size:0.8em; */
		display: flex;
		width:100%;
	}
nav ul li{
	  text-align: center;
      justify-content:space-around;
      width:100%;
    }

  #main > article {
   text-align: justify;
   padding-left:25px;
   padding-right:25px;
   -webkit-flex: 3 1 60%;
           flex: 3 1 60%;
   -webkit-order: 3;
           order: 3;
   }
  .imagenes{
	  text-align: center;
	  display: flex;
	  flex-direction: row;
  }
  .imagenes img{ 
      justify-content:space-around;
      width:95%;
	}
iframe{
	width:100%;
	border-style:none;
  }

.izquierda{
	text-align: center;
	padding-top:20px;
}
.ampliar{
	color:white;
	text-decoration:none;
}
.ampliar:hover{
	color:black;
}
	   
  #main > nav {
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 2;
           order: 2;
   }
  #main > aside {
   background: #ccccff;
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 4;
           order: 4;
   }
.footer {
	margin-top:10px;
	text-align: center;
	color:white;
    background: #44606f;
}  
 
  header, footer, .menu {
   display: block;
   }
 
  /* de 650 para abajo se quitan las columnas */
  @media all and (max-width: 650px) {
	 .texto{
	text-align:justify;
	 padding-left:20px;
	 padding-right:20px;
 } 
ul{
  flex-wrap: wrap;
	}

   #main, #page {
    -webkit-flex-flow: column;
            flex-flow: column;
   }

   #main > article, #main > nav, #main > aside {
    /* poner ordenes a cero */
    -webkit-order: 0;
            order: 0;
   }
  
   #main > nav, #main > aside, header, footer {
    /* min-height: 50px;
    max-height: 50px; */
   }
  }