* {
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
    --azuloscuro: #07417a;
    --azulclaro: #dbe7f6;
    --blanco: #ffffff;
    
    list-style: none;
 
}

body {
    font-family: Arial, Helvetica, sans-serif;
    color: var(blank);    
    }

header {
    /*medidas logo y menú*/
   width: 1200px;
    margin: auto;

    background-color: var(--azuloscuro);

    display: grid;
    grid-template-columns: 70% 30%;
    grid-template-areas: "imagen lista";
    align-items: center;
    padding: 20px;

}

header div :first-child {
    grid-area: imagen;
    /*tamaño de la imagen*/
    font-size: 4em;
    /*color->color de la letras, colorea el avión*/
     color: var(--azulclaro); 
    }

header nav {
    grid-area: lista;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    justify-items: right;
  }
li {
    display: inline;
}
a{
    color: var(--azulclaro);
    text-decoration: none; /*si no se pone subraya*/

}

/*imagen de la palmera*/
#logoheader>img {
    display: block;
    width: 1200px;
    margin: auto;
    height: 270px;
    object-fit: cover;
    padding-bottom: 20px;
}


/*color del fondo de la grid*/
 div div {
        background-color:var(--azulclaro);
         text-align: justify;
                   
}
/*dos primeras grid 1 fila 2 columnas sin fotos*/
.primergrupo {
    display: grid;
    grid-template-areas: "1fr 1fr";
     gap: 10px;
    width: 1200px;
  margin: auto;
  padding-left: 20px;
  padding-right: 20px;      
    } 

.contenedor {
    width: 1200px;
      display: grid;
    grid-template-columns: repeat(3, 1fr);    /* Crea 3 columnas iguales */
    grid-template-rows: auto;    /* todas las filas de una fracción */
    gap: 20px;    /* Espacio de separación entre celdas */
    padding: 10px;
    justify-self: center;
  
    }

button {
    background-color: var(--azuloscuro);
    color: var(--blanco);
    padding: 20px;
    padding-left: 60px;
    padding-right: 60px;
    border: 0px;
    border-radius: 5px;
     margin : 20px;
}
div>img {
    display: grid;
    justify-self: center;
    padding-top: 20px;
   
}

h3 {
    padding: 0px;
    margin: 40px;

}
p{
    padding: 0px;
    margin: 40px;
     
}