main{
    background-color: black;
    display: grid;
    grid-template-columns:  repeat(6, 1fr);
    grid-template-rows: 80px 80px 80px 80px 80px 80px;
    grid-template-areas: 
        "rojo rojo_grande rojo_grande azul_grande azul_grande azul_grande"
        "rojo rojo_grande rojo_grande blanco_grande blanco_grande blanco_grande"
        "amarillo_grande rojo_grande rojo_grande blanco_grande blanco_grande blanco_grande "
        "amarillo_grande rojo_grande rojo_grande blanco_grande blanco_grande blanco_grande "
        "amarillo_grande rojo_grande rojo_grande blanco_grande blanco_grande blanco_grande "
        "amarillo_grande rojo_grande rojo_grande blanco azul amarillo";
    gap: 10px;
    padding: 10px;
}

#rojo{
    background-color: red;
    grid-area: rojo;
}

#rojo_grande{
    background-color: red;
    grid-area: rojo_grande;
}

#azul{
    background-color: blue;
    grid-area: azul;
}

#azul_grande{
    background-color: blue;
    grid-area: azul_grande;
}

#amarillo{
    background-color: yellow;
    grid-area: amarillo;
}

#amarillo_grande{
    background-color: yellow;
    grid-area: amarillo_grande;
}

#blanco{
    background-color: white;
    grid-area: blanco;
}

#blanco_grande{
    background-color: white;
    grid-area: blanco_grande;
}