/* Container principal */
#fundo { 
    position: relative;/* posição relativa para permitir posicionamento absoluto dos elementos internos */
    width: 1195px; /* largura total */
    height: 870px; /* altura total */
    background-color: rgb(143, 65, 252);   /* cor de fundo */
    margin: auto;/* centraliza o container na página */
}

/* Topo */
#topo {
    position: relative; /* posição relativa para permitir posicionamento absoluto dos elementos internos */
    text-align: center; /* centraliza o texto */
    display: flex;  /* usa flexbox para centralizar o conteúdo */
    justify-content: center;    /* centraliza horizontalmente */
    align-items: center;    /* centraliza verticalmente */
    font-size: 40px;    /* tamanho da fonte */
    color: rgb(6, 4, 4);    /* cor do texto */
    background-color: rgb(21, 117, 115);    /* cor de fundo do topo */
    width: 1195px;  /* largura do topo */
    height: 150px;  /* altura do topo */
    float: left;    /* flutua o topo para a esquerda */
}

/* Menu lateral esquerdo */
#le {
    position: relative; /* posição relativa para permitir posicionamento absoluto dos elementos internos */
    float: left;    /* flutua o menu para a esquerda */
    font-size: 12px;    /* tamanho da fonte */
    background-color: lightblue;    /* cor de fundo do menu */
    width: 140px;   /* largura do menu */
    height: 680px;  /* altura do menu */
}

/* Área de conteúdo */
#conteudo {
    position: relative; /* posição relativa para permitir posicionamento absoluto dos elementos internos */
    background-color: lightgray;    /* cor de fundo da área de conteúdo */
    width: 870px;   /* largura da área de conteúdo */
    height: 680px;  /* altura da área de conteúdo */
    float: left;    /* flutua a área de conteúdo para a esquerda */
}

/* Rodapé */
#rodape {
    position: relative; /* posição relativa para permitir posicionamento absoluto dos elementos internos */
    float: left;    /* flutua o rodapé para a esquerda */
    background-color: rgb(0, 132, 255);   /* cor de fundo do rodapé */
    height: 40px;   /* altura do rodapé */
    width: 1195px;  /* largura do rodapé */
}

/* Imagem */
#imagem {   /* posição relativa para permitir posicionamento absoluto dos elementos internos */
    position: absolute; /* posição absoluta para posicionar a imagem */
    left: 870px;    /* distância da esquerda */
    top: 600px;   /* distância do topo */
}

#imagem img {   /* estilo da imagem */
    width: 200px;   /* largura da imagem */
}

/* Caixas brancas */    
#q1, #q2 {
    position: absolute; /* posição absoluta para posicionar as caixas */
    background-color: white;    /* cor de fundo das caixas */
    height: 130px;  /* altura das caixas */
    width: 175px;   /* largura das caixas */
    left: 1015px;   /* distância da esquerda */
}

#q1 {
    top: 153px; /* distância do topo */
}

#q2 {
    top: 290px; /* distância do topo */
}