.app {
    background: #f1f1f1;
    display: grid;  
    font-family: Arial, Helvetica, sans-serif;
    grid-template-areas: 
        "cabecalho"
        "conteudo"
        "rodape";
    grid-template-columns: auto;
    grid-template-rows: 50px auto auto; 
}

.cabecalho {
    align-items: center;
    display: flex;
    grid-area: cabecalho;
    padding: 0 2rem;
}

.conteudo {
    grid-area: conteudo;
    padding: 0 2rem;
}

.rodape {
    background: #fdfdfd;
    color: #333333;
    font-size: .8rem;
    grid-area: rodape;
    padding: 1rem;
    text-align: center;
}