Caixas

Veja exemplos de uso de caixas para delimitar conteúdos.

Caixa simples

Título dentro da caixa

  • Item 1
  • Item 2
  • Item 3

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Código HTML

<div class="caixa">
    <h3>Título dentro da caixa</h3>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
    <p>
        <a>Lorem Ipsum is simply dummy text</a> of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and
        scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with
        the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
    </p>
</div>

Duas caixas centralizadas

Código HTML

<div class="row center">
    <div class="col s12 m6">
        <a class="caixa">Caixa com link. Ou seria link com caixa?</a>
    </div>
    <div class="col s12 m6">
        <div class="caixa">Caixa 2</div>
    </div>
</div>

Três caixas

Caixa 1
Caixa 2
Caixa 3

Código HTML

<div class="row">
    <div class="col s12 m4">
        <div class="caixa">Caixa 1</div>
    </div>
    <div class="col s12 m4">
        <div class="caixa">Caixa 2</div>
    </div>
    <div class="col s12 m4">
        <div class="caixa">Caixa 3</div>
    </div>
</div>

Quatro caixas

Caixa 1
Caixa 2
Caixa 3
Caixa 4

Código HTML

<div class="row">
    <div class="col s12 m6 l3">
        <div class="caixa">
            Caixa 1
        </div>
    </div>
    <div class="col s12 m6 l3">
        <div class="caixa">
            Caixa 2
        </div>
    </div>
    <div class="col s12 m6 l3">
        <div class="caixa">
            Caixa 3
        </div>
    </div>
    <div class="col s12 m6 l3">
        <div class="caixa">
            Caixa 4
        </div>
    </div>
</div>
                    

Colunas

1. Enquadramento
Informações cadastrais
Análise cadastral e de crédito. Início da relação direta com o BNDES. Clique para saber mais.

Informações necessárias

  • Checklist de informações para cadastro (XLSX- 14 kB).
  • Pacote de arquivos para cadastro (ZIP - 512 kB).
Informações de projeto
Conheça o sistema, veja as informações necessárias relativas ao seu projeto e solicite financiamento.

Informações necessárias

  • Checklist de informações para cadastro (XLSX- 14 kB).
  • Pacote de arquivos para cadastro (ZIP - 512 kB).
2. Análise
Nesta fase, são requisitadas diversas informações que serão utilizadas para o enquadramento e para a análise da operação.
Saiba mais

Informações necessárias

Baixe o checklist de informações e pacote de arquivos de acordo com o seu setor:

Agropecuária

  • Pecuária bovina ( ZIP - 512 kB)
  • Setor Sucroalcooleiro ( ZIP - 512 kB)
  • Demais segmentos ( ZIP - 512 kB)

Indústria, comércio e serviços ( ZIP - 512 kB)

Infraestrutura

  • Geração de energia
    • Solar ( ZIP - 769 kB)
    • Eólica ( ZIP - 512 kB)
    • Hidrelétrica ( ZIP - 512 kB)
    • Pequenas Centrais Hidrelétricas ( ZIP - 512 kB)
    • Biomassa ( ZIP - 512 kB)
    • Térmica ( ZIP - 512 kB)
  • Transmissão de energia elétrica ( ZIP - 512 kB)
  • Transportes
  • Saneamento ( ZIP - 751 kB)

Setor público ( ZIP - 512 kB)

3. Contratação e Acompanhamento
Veja as informações adicionais exigidas durante esta fase.

Informações necessárias

Nesta fase, são solicitados alguns documentos jurídicos para todos os setores e algumas informações adicionais para operações de setores específicos:

  • Construção naval ( ZIP - 751 kB)
  • Educação ( ZIP - 751 kB)
  • Eficiência energética ( ZIP - 751 kB)
  • Indústria automotiva ( ZIP - 512 kB)
  • Mineração ( ZIP - 512 kB)
  • Pecuária bovina ( ZIP - 512 kB)
  • Complexo industrial da saúde ( ZIP - 751 kB)
  • Serviços de saúde ( ZIP - 770 kB)
  • Setor Sucroalcooleiro ( ZIP - 512 kB)
  • Setor público - investimentos em infraestrutura viária ( ZIP - 751 kB)
  • Setor público - demais setores ( ZIP - 512 kB)
  • Todos os demais setores ( xxx -xx kB)

Código HTML


<div class="colunas row">
    <div class="coluna col s12 m6 l4 row no-gutter">
        <div class="titulo">
            1. Enquadramento
        </div>
        <div class="col s12 m6">
            <div class="subtitulo">
                Informações cadastrais
            </div>
            <a class="sumario">
                Análise cadastral e de crédito. Início da relação direta com o BNDES. Clique para saber mais.
            </a>
            <div class="caixa colapsavel">
                <p>Informações necessárias</p>
                <ul>
                    <li>
                        Checklist de informações para cadastro (XLSX- 14 kB).
                    </li>
                    <li>
                        Pacote de arquivos para cadastro (ZIP - 512 kB).
                    </li>
                </ul>
            </div>
        </div>
        <div class="col s12 m6">
            <div class="subtitulo">
                Informações de projeto
            </div>
            <a class="sumario">
                Conheça o sistema, veja as informações necessárias relativas ao seu projeto e solicite financiamento.
            </a>
            <div class="caixa colapsavel">
                <p>Informações necessárias</p>
                <ul>
                    <li>
                        Checklist de informações para cadastro (XLSX- 14 kB).
                    </li>
                    <li>
                        Pacote de arquivos para cadastro (ZIP - 512 kB).
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="coluna col s12 m6 l4">
        <div class="titulo">
            2. Análise
        </div>
        <div class="subtitulo"></div>
        <div class="sumario">
            Nesta fase, são requisitadas diversas informações que serão utilizadas para o enquadramento e para a análise da operação.<br><a>Saiba mais</a>
        </div>
        <div class="caixa colapsavel">
            <p>Informações necessárias</p>
            <p dir="ltr">Baixe o <em>checklist</em> de informações e pacote de arquivos de acordo com o seu setor:</p>
            <p dir="ltr"><strong>Agropecuária</strong></p>
            <ul dir="ltr">
                <li>Pecuária bovina (<em>ZIP - 512 kB</em>)</li>
                <li>Setor Sucroalcooleiro (<em>ZIP - 512 kB</em>)</li>
                <li>Demais segmentos (<em>ZIP - 512 kB</em>)</li>
            </ul>
            <p dir="ltr"><strong>Indústria, comércio e serviços</strong> (<em>ZIP - 512 kB</em>)</p>
            <p dir="ltr"><strong>Infraestrutura</strong></p>
            <ul dir="ltr">
                <li>Geração de energia
                    <ul>
                        <li><a href="/wps/wcm/myconnect/site/a941d137-b88f-4726-8d06-278fa647e556/Roteiro-Solar-Enquadramento.zip?MOD=AJPERES&CVID=lS9Huua">Solar</a> (<em>ZIP - 769 kB</em>)</li>
                        <li>Eólica (<em>ZIP - 512 kB</em>)</li>
                        <li>Hidrelétrica (<em>ZIP - 512 kB</em>)</li>
                        <li>Pequenas Centrais Hidrelétricas (<em>ZIP - 512 kB</em>)</li>
                        <li>Biomassa (<em>ZIP - 512 kB</em>)</li>
                        <li>Térmica (<em>ZIP - 512 kB</em>)</li>
                    </ul>
                </li>
                <li>Transmissão de energia elétrica (<em>ZIP - 512 kB</em>)</li>
                <li>Transportes
                    <ul>
                        <li><a href="/wps/wcm/myconnect/site/d3ad4d94-d173-4a47-8531-e9c88cf05b8b/Roteiro-Logistica-Enquadramento.zip?MOD=AJPERES&CVID=lS9H.Vy">Logística (<em>ZIP - 770 kB</em>)</a></li>
                        <li>Mobilidade urbana (<em>ZIP - 512 kB</em>)</li>
                    </ul>
                </li>
                <li><a href="/wps/wcm/myconnect/site/ba2816c0-4247-4f97-afe4-2cfddb702d5b/Roteiro-Saneamento-Enquadramento.zip?MOD=AJPERES&CVID=lSaxTv8">Saneamento</a> (<em>ZIP - 751 kB</em>)</li>
            </ul>
            <p><strong>Setor público</strong> (<em>ZIP - 512 kB</em>)</p>
        </div>
    </div>
    <div class="coluna col s12 m6 l4">
        <div class="titulo">
            3. Contratação e Acompanhamento
        </div>
        <div class="subtitulo"></div>
        <a class="sumario">
            Veja as informações adicionais exigidas durante esta fase.
        </a>
        <div class="caixa colapsavel">
            <p>Informações necessárias</p>
            <p dir="ltr">Nesta fase, são solicitados alguns documentos jurídicos para todos os setores e algumas informações adicionais para operações de setores específicos:</p>
            <ul dir="ltr">
                <li>Construção naval (<em>ZIP - 751 kB</em>)</li>
                <li>Educação (<em>ZIP - 751 kB</em>)</li>
                <li>Eficiência energética (<em>ZIP - 751 kB</em>)</li>
                <li>Indústria automotiva (<em>ZIP - 512 kB</em>)</li>
                <li>Mineração (<em>ZIP - 512 kB</em>)</li>
                <li>Pecuária bovina (<em>ZIP - 512 kB</em>)</li>
                <li>Complexo industrial da saúde (<em>ZIP - 751 kB</em>)</li>
                <li>Serviços de saúde (<em>ZIP - 770 kB</em>)</li>
                <li>Setor Sucroalcooleiro (<em>ZIP - 512 kB</em>)</li>
                <li>Setor público - investimentos em infraestrutura viária (<em>ZIP - 751 kB</em>)</li>
                <li>Setor público - demais setores (<em>ZIP - 512 kB</em>)</li>
                <li><b>Todos os demais setores</b> (<em>xxx -xx kB</em>)</li>
            </ul>
        </div>
    </div>
</div>