**Objetivo:** criar uma aplicação no [CodePen.io](https://codepen.io) que tenha função semelhante a esta: <https://codepen.io/freeCodeCamp/full/RKRbwL>.
Atenda às [especificações de usuário](https://en.wikipedia.org/wiki/User_story) abaixo para passar em todos os testes. Dê à página o seu próprio estilo pessoal.
Você pode usar HTML, JavaScript e CSS para completar este projeto. É recomendado utilizar CSS puro, pois é disso que trataram as lições até agora. É bom você adquirir alguma prática com CSS. Você pode usar Bootstrap ou SASS se quiser. Outras tecnologias (como, por exemplo, jQuery, React, Angular ou Vue) não são recomendadas para este projeto. Use-as por sua conta e risco. Outros projetos te darão uma chance de trabalhar com diferentes bibliotecas, como o React. Vamos aceitar e tentar corrigir todos os relatórios de problemas que usem a stack de tecnologias sugerida para esse projeto. Boa programação!
**Especificação de usuário nº 1:** a landing page do produto deve ter um elemento `header` com um `id="header"` correspondente.
**Especificação de usuário nº 2:** deve haver uma imagem dentro do elemento `header` com um `id="header-img"` correspondente. Um logotipo da empresa seria uma boa imagem para colocar aqui.
**Especificação de usuário nº 3:** dentro do elemento `#header`, deve haver um elemento `nav` com um `id="nav-bar"`.
**Especificação de usuário nº 4:** deve haver pelo menos três elementos clicáveis dentro do elemento `nav` e cada um deles deve ter a classe `nav-link`.
**Especificação de usuário nº 5:** ao clicar em um botão com a classe `.nav-link` no elemento `nav`, o usuário deve ser levado para a seção correspondente na landing page.
**Especificação de usuário nº 6:** é possível assistir a um vídeo do produto no elemento de `id="video"`.
**Especificação de usuário nº 7:** a landing page deve ter um formulário (`form`) com um `id="form"`.
**Especificação de usuário nº 8:** dentro do formulário, deve haver um campo de entrada (`input`) com `id="email"`, onde deve ser possível digitar um endereço de e-mail.
**Especificação de usuário nº 9:** o campo de entrada `#email` deve ter um placeholder (texto ilustrativo) para que o usuário saiba para que serve o campo.
**Especificação de usuário nº 10:** o campo de entrada `#email` deve usar a validação do próprio HTML5 para confirmar que o texto inserido é um endereço de e-mail.
**Especificação de usuário nº 11:** dentro do formulário, deve haver um campo de entrada (`input`) do tipo botão com `id="submit"`.
**Especificação de usuário nº 12:** quando o elemento `#submit` for clicado, o e-mail deve ser enviado para uma página estática (use esta URL fictícia: [https://www.reecodecamp.com/email-enviar](https://www.freecodecamp.com/email-submit)).
**Especificação de usuário nº 13:** a barra de navegação deve estar sempre na parte superior da viewport.
**Especificação de usuário nº 14:** a landing page deve ter pelo menos uma media query.
**Especificação de usuário nº 15:** a landing page deve utilizar pelo menos uma vez o CSS Flexbox.
Você pode fazer o seu projeto <ahref='https://codepen.io/pen?template=MJjpwO'target='_blank'rel='nofollow'>usando este modelo da CodePen</a> e, logo após, clicar em `Save` para criar seu próprio projeto. Como alternativa, use este link da nossa CDN para executar os testes em qualquer ambiente que você preferir: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
