*{
    box-sizing:border-box;
}
body {
    font-family: Arial, Helvetica, sans-serif;
}
/*Estilo Encabezado*/
header {
    background-color: #FFBE46;
    padding: 30px;
    text-align:center;
    font-size: 25px;
    color: #ffb451;
}
/*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: #ffb451;
    padding:20px;
    text-align: center;
    border-color: #ffb451;
}
/*Estilo lista en menú*/
ul#temas{
    list-style-type:none;
    padding:50px;
    text-decoration-line:none;
}
/*Estilo wlwmwntos lista en menú*/
li.opcion{
    padding-top: 25px;
    padding-bottom:25px;
    font-size:30px;
    font-weight:bold;
    width: 70px;
    height: 70px;
}

figure {
    width:150px;
    max-height:100px;
    float:left;
}
/*Estilo LOGO*/
img#logo{
    width: 130px;
    max-height:150px;
    padding-bottom:60px;
    margin-left:10px;
}
/*Estilo imagen*/
img#center{
    display:block;
    margin-left:auto;
    margin-right:auto;
    border:none;
    max-height:350px;
    width:50%;
}
h2{
    color: rgb(136, 0, 0);
}
iframe#carrot{
    display:flex;
    margin-left:auto;
    margin-right:auto;
    border:none;
    height:100px;
    width:150px;
    
}
div#party{
    width:150px;
    height:100px;
    float:right;
}
/*Estilo contenido*/
section {
    -webkit-flex:3;
    -ms-flex:3;
    flex:3;
    background-color: #f1f1f1;
    padding-left:50px;
    padding-right:50px;
    padding: 80px;

}
/* 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*/
footer {
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;
    }
}