*{
    box-sizing: border-box;
    }
    body{
    font-family: 'Lobster', cursive;
    }
    /*estilo del encabezado o header */
    header {
    background-color: rgba(216, 78, 243, 0.897);
    padding: 30px;
    text-align: center;
    font-size: 35px;
    color: rgb(15, 15, 15);
    }
    /* Cree dos columnas o cajas que floten una al lado de la otra */
    nav {
    float: left;
    width: 30%;
    background: rgb(235, 227, 240);
padding: 20px;
}
/* Estilo de la lista dentro del menu */
nav ul {
list-style-type: none;
padding: 0;
}
article {
float: left;
padding: 20px;
width: 70%;
background-color: #ddd0e0;
}
/* limpiar float despues de la columna */
section::after {
content: "";
display: table;
clear: both;
}
/* Estilo del pie de pagina o footer */
footer {
background-color: rgb(192, 131, 228);
padding: 10px;
text-align: center;
color: rgb(245, 245, 245);
}