@charset "utf-8";
/* CSS Document */


body {
    margin: 0;
    background-color: #E0E1EB;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 200%;  /* Ponemos este tamaño de letra a toda la página para que se vea mejor */
    text-align: left;
}

header {
    background-color: #32354C;
    color: white;
}

h1 {
    margin: 0;   /* Con este margen de 0 se elimina el pequeño top (distancia superior de arriba ) que deja el navegador por defecto */
    font-size: 200%;
}

nav {
    position: fixed;  /* Nota: El posicionamiento fijo en css es el fixed sino aplicamos este las propiedades top y left no surtiran efecto sobre la etiqueta nav ya que se quedara igual como sino las pongamos  */
    top: 100px;
    left: 1%;
    border-radius: 5px;
    background-color: #32354C;
    color: white;
}

a {
    color: white;
    text-decoration: none;
}


main {
    display: block;
    margin: 0 15%;  /* Nota ponemos un 0 para que la distancia de arriba sea de 0 y 15% para 
                       la distancia con el borde izquierdo de la pantalla (y además lo ponemos
                       en porcentaje para que según se vaya estrechando la pantalla se vaya ajustando 
                       la distancia lateral izquierda de las cajas de programas. ) */
}

article {
    width: 90%;
    border-radius: 5px;
    margin: 25px;
    background-color: white;
}

h2 {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin: 0;
    padding-left: 0;
    background-color: #2AA333;
    color: white;
}

p {
    margin: 5px;
}