@extends('layout.app')
@section('content')
<section class="conteudo-internas">
  <div class="centraliza">
    <header class="topo-fases-obra">
      <h2 class="titulo-padrao">
        <span>Fases da obra</span>
      </h2>
      <p>Neste espaço, estão à disposição todas as informações e documentações que envolvam diretamente a execuçõo da obra. O projeto arquitetônico do edifício-sede da CNM tramitou junto ao GDF de março/2011 a julho/2012, quando se obteve a sua plena aprovação.</p>

      <p>Em dezembro de 2012, o processo para escolha da construtora da sede da CNM foi iniciado, culminando no preparo do terreno para início das obras em agosto de 2013.</p>
    </header> <!-- final topo-fases-obra -->
    <section class="box-timeline">
      <img src="assets/img/vetor-sede.png" alt="" class="vetor-nova-sede">
      <article class="item-timeline">
        <p class="numero-timeline">
          01
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">Ajustes do Projeto</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-1.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          02
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">Tramitação no GDF</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-2.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          03
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">CONSULTAS PRÉVIAS</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-3.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          04
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">COMPENSAÇÃO AMBIENTAL</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-4.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          05
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">TERRAPLANAGEM E ESCAVAÇÕES</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-5.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          06
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">FUNDAÇÕES</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-6.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          07
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">LAJES E PILARES</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-7.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          08
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">ESTRUTURA METÁLICA</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-8.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

      <article class="item-timeline">
        <p class="numero-timeline">
          09
        </p>
        <div class="conteudo-timeline">
          <h2 class="titulo-timeline">ACABAMENTOS</h2>
          <figure class="foto-timeline">
            <img src="assets/img/timeline-9.png" alt="">
          </figure>
          <p class="texto-timeline">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sollicitudin mattis mattis. </p>
          
        </div>
      </article> <!-- final item-timeline -->

    </section> <!-- final box-timeline -->
  </div> <!-- final centraliza -->

  <section class="foto-parallax">
    <img src="assets/img/foto-sede-construcao.png" alt="">
  </section>
  
</section><!-- final conteudo-internas -->
@endsection