* {box-sizing: border-box;}
body {font-family: Century Gothic;
background-color: rgb(255, 250, 174);


}
/*Estilo para encabezado*/

  /*Estilo header*/
  .header {padding:50px;
    text-align: center;
    font-size: 16pt; 
    height: 20%; 
}
h1 {
    text-align: center;
    font-size: larges;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow';
    color: rgb(72, 167, 190);
}
h2 {
    text-align: center;
    font-size: 20pt;
    font-family:cursive;
    color: rgb(161, 109, 209);

}
 .flex-container {
        display: flex;
    }

 div.encabezado {
   background-color:  rgb(177, 220, 231);
        padding-left:5%;
        padding-right:5%;
        padding-top:1%;
        padding-bottom:1%;  
        text-align: right;
        height: 135px;
    }
  
        .posicion {
            float: left;

        }

        .otra{
            float:right;
        }
/* Contenedor para cajas flexibles */
section { 
    display:-webkit-flex;
    display: -flex;
}

/* Estilo para el menú de navegación */
nav {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: .5;
    background: rgb(230, 159, 226);
    padding: 30px;
    } 

/* Estilo para la lista dentro del menú */
nav ul {
    list-style-type: none;
    padding: 20px;
    text-decoration-line: none;
}

/* Estilo para elementos de lista dentro del menú */ 
li option {
    padding-bottom: 20px;
    
}

/* Estilo para pie de página */ 
footer {
    background-color:rgb(143, 201, 216);
    padding: 10px;
    border: burlywood;
    text-align: center;
    color: cornsilk;
    font-family: Century Gothic;
}

article {-webkit-flex:3;
    -ms-flex: 2;
    flex: 3;
    background-color: rgb(245, 219, 244);
    padding: 15px;
    padding-left: 40px;
    padding-right: 40px;
    text-align: justify;}

    img.center {display:block;
        margin-left: auto;
        margin-right: auto;
        max-height: 350px;
         max-width:500px; 
          border: none;}
    /*Contenido*/

/* Estilo para los enlaces no visitados */ 
a:link {
    color: #4b7cd6;
    text-decoration-line: none;
}

/* Estilo para los enlaces visitados */ 
a:visited {
    color: rgb(136, 73, 138);
    text-decoration-line: none;
}

/* Estilo para los enlaces activos */ 
a:active {
    color: rgb(53, 108, 228);
    text-decoration-line: none;
}

  iframe{
      width: 1065;
      height: 772;
  }
  
  /*pantallas de 320px o superiores */
@media (min-width:320px) {
    iframe {
        width: 200px;
        height: 150px;
    }
}

/*Pantallas de 768px o superior*/
@media (min-widt: 768px) {
    iframe {
        width: 500px;
        height: 350px;
    }
    }

  
/* Para que el menú quede uno encima de otro */

@media (max-width:700px) {
    section {
        -webkit-flex-direction:column;
        flex-direction: column; }}



.flex-container {
    display: flex;
}