*{
    margin: 0;
    padding: 0;
}
body{
    background-color: aqua;
}
.global{
    height: 100vh;
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    grid-template-areas: 
    "mosaico1 . mosaico2 ."
    ". mosaico3 . ."
    ".. mosaico4 . "
    ". mosaico5 . mosaico6";
    gap: 10px;
}
#mosaic1{
    grid-area: mosaico1;
}
#mosaic2{
    grid-area: mosaico2;
}
#mosaic1{
    grid-area: mosaico3;
}
#mosaic2{
    grid-area: mosaico4;
}
#mosaic1{
    grid-area: mosaico5;
}
#mosaic2{
    grid-area: mosaico6;
}
.content{
    height: 25vh;
    display: grid;
    grid-template-columns: auto auto auto auto;
    grid-template-rows: 25% auto auto 15%;
    grid-template-areas:
    "encabezado encabezado encabezado logo "
    "opciones contenido contenido contacto"
    "pciones contenido contenido contacto"
    "pie pie pie contacto";
    gap: 10px;
}
.content>*{
    background-color: aquamarine;
    background-size: cover;
   /* filter: grayscale();*/
    display: flex;
    justify-content: center;
    justify-items: center;
    color: crimson;
    font-size: large;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.item-a{
    background-color: blueviolet;
    grid-area: encabezado;
    background-image: url(images/imag1.jpg);
    background-position: 50% 50%;
    background-size: cover;

}
.item-b{
    background-color: chocolate;
    grid-area: logo;
    background-image: url(images/imag2.jpg);
    background-position: 50% 50%;
    background-size: cover;
}
.item-c{
    background-color: cornflowerblue;
    grid-area: opciones;
    background-image: url(images/imag3.jpg);
    background-position: 50% 50%;
    background-size: cover;
}
.item-d{
    background-color: chartreuse;
    grid-area: contenido;
    background-image: url(images/imag4.jpg);
    background-position: 50% 50%;
    background-size: cover;
}
.item-e{
    background-color: crimson;
    grid-area: pie;
    background-image: url(images/imag5.jpg);
    background-position: 50% 50%;
    background-size: cover;
}
.item-f{
    background-color: darkgoldenrod;
    grid-area: contacto;
    background-image: url(images/imag6.jpg);
    background-position: 50% 50%;
    background-size: cover;
}