*{
    box-sizing:border-box;
}
body {
    font-family: Arial, Helvetica, sans-serif;
}
/*Estilo Encabezado*/
#encabezado {
    background-color: rgb(247, 148, 19);
    padding: 30px;
    text-align:center;
    font-size: 25px;
    color: rgb(241, 150, 14)
}
/*Contenedor para cajas flexibles*/
#main { 
    display:-webkit-flex;
    display: flex;
    width: 100%;
}
/*Estilo menú navegación*/
#nav {
    -webkit-flex:1;
    -ms-flex:1;
    flex:.5;
    background-color: #ff9f06;
    padding:30px;
}
/*Estilo lista en menú*/
ul#temas{
    list-style-type:none;
    padding:20px;
    text-decoration-line:none;
}
/*Estilo wlwmwntos lista en menú*/
li.opcion{
    padding-bottom:25px;
    font-size:large;
    font-weight:bold;
}
#figure {
    width:150px;
    max-height:100px;
    float:left;
}
/*Estilo LOGO*/
img#logo{
    width:150px;
    max-height:150px;
    padding-bottom:30px;
    margin-left:40px;
}
/*Estilo imagen*/
img#center{
    display:block;
    margin-left:auto;
    margin-right:auto;
    border:none;
    max-height:350px;
    width:50%;
}
/*Estilo contenido*/
#section {
    -webkit-flex:3;
    -ms-flex:3;
    flex:3;
    background-color: #f1f1f1;
    padding-left:40px;
    padding-right:40px;
    padding:10px;
}
/* Estilo articulo*/
#article {
    text-align:justify;
    font-family:Verdana;
    margin-left:2%;
    margin-right:2%;
    padding:10px;
    padding-left:40px;
    padding-right:40px;
}
/*Estilo pie de página*/
#foot {
background-color:rgba(234, 123, 12, 0.905);
padding:10px;
text-align:center;
color:white;
}
/*Estilo enlaces no visitados*/
a:link{
    color:rgb(102, 0, 2);
    text-decoration-line:none;
}
/*Estilo enlaces al pasarencima*/
a:hover{
    color:rgb(255, 247, 0);
    text-decoration-line:none;
}
/*Estilo enlaces activos*/
a:active{
    color:rgb(255, 2, 2);
    text-decoration-line:none;
}
/*Diseño responsivo: menú y contenido se convierten en filas*/
@media (max-width:600px){
    main{
        -webkit-flex-direction:column;
        flex-direction:column;
    }
}