Componentes EFAP

Box pequeno lateral

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

<div class="row">
    <div class="fcol-xs-8 col-xs-centered col-sm-centered col-md-7 col-lg-8">
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore
            magna aliquyam erat, sed diam voluptua.</p>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore
            magna aliquyam erat, sed diam voluptua.</p>
    </div>
    <div class="col-sm-10 col-sm-centered col-md-5 col-lg-4">
        <aside class="panel box-dica" role="complementary">
            <div class="panel-heading">
                <i class="icon"></i>
                <div>Dica</div>
            </div>
            <div class="panel-body">
                <p>É necessário visualizar todas as páginas de conteúdo para poder responder as questões avaliativas!</p>
            </div>
        </aside>
    </div>
</div>

Box médio

<div class="row">
    <div class="col-sm-10 col-centered col-md-8">
        <div class="panel box-atencao" role="complementary">
            <div class="panel-heading">
                <i class="icon"></i>
                <div>Atenção!</div>
            </div>
            <div class="panel-body">
                <p>É necessário visualizar todas as páginas de conteúdo para poder responder as questões avaliativas!</p>
            </div>
        </div>
    </div>
</div>

Box grande

Atenção!

É necessário visualizar todas as páginas de conteúdo para poder responder as questões avaliativas!

<div class="row">
    <div class="col-xs-12 col-sm-10 col-centered">
        <div class="panel box-atencao tarja animated zoomIn">
            <div class="panel-heading">
                <i class="icon"></i>
                <div>Atenção!</div>
            </div>
            <div class="panel-body">
                <p>É necessário visualizar todas as páginas de conteúdo para poder responder as questões avaliativas!</p>
            </div>
        </div>
    </div>
</div>

Tarja