API tools faq
paste
eulaliaaires

Transformare

eulaliaaires
Jun 20th, 2018
65
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.92 KB | None | 0 0
raw download clone embed print report
  1. {% load staticfiles %}
  2. <!DOCTYPE html>
  3. <html lang="pt">
  4.  
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1">
  8.     <title>Transformare Jr.</title>
  9.     <link rel="stylesheet" type="text/css" href="{% static 'slick/slick.css' %}" />
  10.     <link rel="stylesheet" type="text/css" href="{% static 'slick/slick-theme.css' %}" />
  11.     <link rel="stylesheet" type="text/css" href="{% static 'css/index.css' %}" />
  12.     <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600" rel="stylesheet">
  13. </head>
  14.  
  15. <body>
  16.     <!--BANNER-->
  17.     <div class = "banner" id = Início>
  18.         <div class = "navbar">
  19.             <div class = "logomarca">
  20.                 <img src = "../../static/img/Logo quadrada.png" id = "logo">
  21.                 <span class = "style">Transformare</span>
  22.                 <span class = "style2">Jr.</span>
  23.             </div>
  24.                 <ul>
  25.                     <li><a href = "#Início" class="color_text">Início</a></li>
  26.                     <li><a href = "#Serviços" class="color_text">Serviços</a></li>
  27.                     <li><a href = "#Sobre Nós" class="color_text">Sobre Nós</a></li>
  28.                     <li><a href = "#Contato" class="color_text">Contato</a></li>
  29.                 </ul>
  30.         </div>
  31.         <div class = "text" id="text_banner"> Transformando o Governo e a Sociedade</div>
  32.         <div class= "button_banner"><a href = "#Sobre Nós" class="color_text">Conheça-nos</a></div>
  33.     </div>
  34.     <!-- SERVIÇOS -->
  35.     <div id="serviços">
  36.         <h1 class="cabeçalho-seçao">Serviços</h1>
  37.         <div class="serv-container">
  38.             <!-- Assessoria ao Legislativo -->
  39.             <div class="serv-box">
  40.                 <img class="serv-imagem" src="{% static 'img/ass-leg.png' %}">
  41.                 <h3 class="serv-titulo">Assessoria ao Legislativo</h3>
  42.                 <p class="serv-texto">Acompanhamento Parlamentar, Relações Governamentais e Participação Popular</p>
  43.                 <div class="serv-botao">
  44.                     <p>Saiba Mais</p>
  45.                 </div>
  46.             </div>
  47.             <!-- Assessoria ao Executivo -->
  48.             <div class="serv-box">
  49.                 <img class="serv-imagem" src="{% static 'img/ass-exec.png' %}">
  50.                 <h3 class="serv-titulo">Assessoria ao Executivo</h3>
  51.                 <p class="serv-texto">Elaboração de Políticas Públicas e Captação de Recursos</p>
  52.                 <div class="serv-botao">
  53.                     <p>Saiba Mais</p>
  54.                 </div>
  55.             </div>
  56.             <!-- Terceiro Setor -->
  57.             <div class="serv-box">
  58.                 <img class="serv-imagem" src="{% static 'img/ter-setor.png' %}">
  59.                 <h3 class="serv-titulo">Terceiro Setor</h3>
  60.                 <p class="serv-texto">Apoio e desenvolvimento de Organizações da Sociedade Civil (OSCs)</p>
  61.                 <div class="serv-botao">
  62.                     <p>Saiba Mais</p>
  63.                 </div>
  64.             </div>
  65.             <!-- Serviços Personalizados: Mobile -->
  66.             <div class="serv-box serv-pers-m">
  67.                 <img class="serv-imagem" src="{% static 'img/serv-pers.png' %}">
  68.                 <h3 class="serv-titulo">Serviços Personalizados</h3>
  69.                 <p class="serv-texto">Para demais serviços em consultoria política, governança criativa e administração pública consulte-nos.</p>
  70.                 <div class="serv-botao">
  71.                     <p>Contate-nos</p>
  72.                 </div>
  73.             </div>
  74.         </div>
  75.         <!-- Serviços Personalizados: Desktop -->
  76.         <a class="serv-pers" href="">Serviços Personalizados</a>
  77.     </div>
  78.     <!-- FRASE E SOBRE NÓS -->
  79.     <div class="flex-container">
  80.         <div class="sessao-frase-destacada">
  81.             <div id="barra-verde"></div>
  82.             <div class="quote">
  83.                 <div id="quote-mark">
  84.                     <img src="../../static/img/quote.png" alt="quote" id="quote-mark-img">
  85.                 </div>
  86.                 <div id="frase-destacada">Pensar, empreender <br> e transformar.</div>
  87.             </div>
  88.         </div>
  89.         <div class="sessao-sobrenos">
  90.             <h1 class="cabeçalho-seçao">Sobre Nós</h1>
  91.             <p id="texto-sobrenos">
  92.                 Nós somos uma consultoria com soluções inovadoras, capacitações e treinamentos baseados em fundamentos de Governança Social para o Impacto Social. Para tal, investimos em ações que englobam e conectam a sociedade. <br><br> A Transformare Jr é organizada por alunos do Curso de Ciências do Estado da Universidade Federal de Minas Gerais (UFMG), o qual criado no ano de 2009, foca em formar atores capazes de transformar e ampliar o diálogo das instituições do governo com a sociedade. </p>
  93.             <div class="mvv">
  94.                 <div class="blocos-mvv" id="missao">
  95.                     <div class="icones-mvv">
  96.                         <img src="../../static/img/target.png" alt="missão" class="icones-mvv-img">
  97.                     </div>
  98.                     <h1 class="titulo-blocos-mvv">MISSÃO</h1>
  99.                     <p class="texto-blocos-mvv">
  100.                         Transformar realidades oferecendo soluções inovadoras e de qualidade, impactando, através do empreendedorismo social, o meio em que estamos inseridos.
  101.                     </p>
  102.                 </div>
  103.                 <div class="blocos-mvv" id="visao">
  104.                     <div class="icones-mvv">
  105.                         <img src="../../static/img/lighthouse.png" alt="visão" class="icones-mvv-img">
  106.                     </div>
  107.                     <h1 class="titulo-blocos-mvv">VISÃO</h1>
  108.                     <p class="texto-blocos-mvv">
  109.                         Até 2019, regularizar a Transformare e fechar pelo menos um projeto.
  110.                     </p>
  111.                 </div>
  112.                 <div class="blocos-mvv" id="valores">
  113.                     <div class="icones-mvv">
  114.                         <img src="../../static/img/badge.png" alt="valores" class="icones-mvv-img">
  115.                     </div>
  116.                     <h1 class="titulo-blocos-mvv">VALORES</h1>
  117.                     <p class="texto-blocos-mvv">
  118.                         Compromisso com atores e resultados; Olhar Júnior; Somos um só; Impacto Social; Vai lá e faz
  119.                     </p>
  120.                 </div>
  121.             </div>
  122.         </div>
  123.     </div>
  124.     <!--SEÇÃO CONTATO-->
  125.     <div class= "back" id="Contato">
  126.         <div class="text">Contato</div>
  127.         <form class="formulario" autocomplete="off">
  128.                 <div class="container">
  129.                     <div class="form1">
  130.                         <input class="user" type="text" name="nome" placeholder="Nome" id = "nome">
  131.                         <input class="user" type="text" name="email" placeholder="Email" id="email">
  132.                         <input class="user" type="text" name="telefone" placeholder="Telefone" id="telefone">
  133.                         <input class="user" type="text" name="conheceu" placeholder="Como conheceu a Transformare Jr.?" id="conheceu">
  134.                     </div>
  135.                     <div class="form2">
  136.                         <input class="user2" type="text" name="assunto" placeholder="Assunto">
  137.                         <textarea class="user3" type="text" name="mensagem" placeholder="Mensagem"></textarea>
  138.                     </div>
  139.                 </div>
  140.                 <div class="button_submit">
  141.                     <input class="botao" type="submit" value="Enviar">
  142.                 </div>
  143.         </form>
  144.     </div>
  145.     <!-- SLICK/CARROSSEL -->
  146.     <script type="text/javascript" src="{% static 'slick/jquery-1.11.0.min.js' %}"></script>
  147.     <script type="text/javascript" src="{% static 'slick/jquery-migrate-1.2.1.min.js' %}"></script>
  148.     <script type="text/javascript" src="{% static 'slick/slick.min.js' %}"></script>
  149.     <script src="{% static 'js/index.js' %}"></script>
  150. </body>
  151.  
  152. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!