diff --git a/css/style.css b/css/style.css
index 69cc8d8..92f2f71 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,366 +1,415 @@
 @import url(//fonts.googleapis.com/css?family=Noto+Sans);
 
 body{
     font-family: 'Noto Sans';
     margin: 0;
     padding: 0;
 }
 
 header{
     background-color: #1d99f3;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     text-align: center;
     padding-bottom: 5em;
 }
 
 .bg-2018{
     background-image: url(../img/floripa.jpg);
 }
 
 .bg-2017{
     background-image: url(../img/bh.jpg);
 }
 
 .bg-2016 {
     background-image: url(../img/rio.jpg);
 }
 
 header h1 {
     color: white;
     font-size: 2.5em;
     font-weight: 300;
     line-height: 1.2;
     text-shadow: 2px 2px #000000;
 }
 
 #logo {
     max-height: 125px;
     width: auto;
     display: block;
     margin-left: auto;
     margin-right: auto;
 }
 
 section:nth-of-type( odd ) {
     background-color: #f5f6fa;
 }
 
 footer {
     background-color: #1d99f3;
 }
 
 footer p{
     font-size: 0.8em;
     color:white;
 }
 
 .button {
     text-align: center;
     margin: 1em 0 1em 0 ;
 }
 
 .button-primary{
     border: none;
     border-radius: 2px;
     text-transform: uppercase;
     color: white;
     background: #1d99f3;
     padding: 0.3em 1em;
     text-decoration: none;
 }
 
 .button-secondary{
     border: 1px solid #1d99f3;
     border-radius: 30px;
     color: black;
     font-size: 0.8em;
     padding: 0.3em 1em;
     text-decoration: none;
 }
 
 .button-secondary:hover {
     background: #1d99f3;
     color: white;
 }
 
 .icon {
     text-decoration: none;
     color: white;
     font-size: 1.5em;
 }
 
 .navbar {
     margin-bottom: 3em ;
     padding: 0 1em ;
     overflow: auto;
     background-color: transparent;
 }
 
 .navbar-item {
     color: white;
     display: block;
     text-align: center;
     padding: 1em ;
     float: right;
     text-decoration: none;
     text-shadow: 2px 2px #000000;
 }
 
 .navbar-title {
     color: white;
     text-align: center;
     padding: 1em;
     float: left;
     display: block;
     text-shadow: 2px 2px #000000;
     text-decoration: none;
 }
 
 .navbar-dropdown {
     display: block;
     float: right;
     overflow: auto;
     padding: 1em;
 }
 
 .navbar-dropdown-title {
     color: white;
     text-align: center;
     text-decoration: none;
     text-shadow: 2px 2px #000000;
 }
 
 .navbar-dropdown-content {
     z-index: 1;
     display: none;
     position: absolute;
 }
 
 .navbar-dropdown-item {
     color: white;
     text-decoration: none;
     display: block;
     background-color: transparent;
     padding: 1em;
     text-shadow: 2px 2px #000000;
 }
 
 .navbar-dropdown:hover .navbar-dropdown-content {
     display: block;
 }
 
 .navbar-collapse {
     margin-bottom: 3em;
     padding: 0 ;
     overflow: auto;
     background-color: transparent;
     display: none;
     border: 1px solid white;
 }
 
 .navbar-header-collapse {
     height: 3em;
 }
 
 .navbar-icon {
     color: white;
     text-align: center;
     padding: 1em;
     float: right;
     display: block;
     text-shadow: 2px 2px #000000;
 }
 
 .navbar-collapse-dropdown-item,
 .navbar-item-collapse {
     color: white;
     display: block;
     text-align: center;
     padding: 1em;
     float:none;
     border: 1px solid white;
     text-decoration: none;
     text-shadow: 2px 2px #000000;
 }
 
 .hide {
     display: none;
 }
 
 @media screen and (max-width: 600px) {
     .navbar {
         display: none;
     }
     .navbar-collapse {
         display: block;
     }
 }
 
 .img-responsive {
     max-width: 80%;
     height: auto;
     display: block;
     margin-left: auto;
     margin-right: auto;
 }
 
 .img-avatar{
     border-radius: 500em;
 }
 
 .container, .row, .col, .col-3, .col-sidebar, .col-content {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
 }
 
 .container {
     width: 100%;
     margin-left: auto;
     margin-right: auto;
     padding: 2em ;
 }
 
 .container h2 {
     text-align: center;
 }
 
 @media (min-width: 1170px) {
     .container {
         max-width: 1170px;
         padding: 2em 0 2em 0;
     }
 }
 
 .row {
-    padding: 1em ;
+    padding: 0 1em ;
     overflow: auto;
     clear:both;
 }
 
 
 .col {
     display: inline-block;
     vertical-align: top;
     width: 100%;
-    margin-bottom: 2em;
+    /* margin-bottom: 2em; */
     margin-right: -4px;
 }
 
 .col p {
     text-indent: 1.5em;
     text-align: justify;
 }
 
 @media (min-width: 728px) {
     .col-3 {
         width: 33.3333%;
     }
 }
 
 .col-3 img {
     max-width: 100%;
     max-height: 200px;
     display: block;
     margin-left: auto;
     margin-right: auto;
 }
 
 .col-3 h2,
 .col-3 p {
     text-align: center;
     text-indent: 0;
 }
 
 @media (min-width: 992px) {
     .col-content {
         width: 70%;
         padding: 0 2em;
     }
 
     .col-sidebar {
         width: 30%;
     }
+
 }
 
 .timeline {
     position: relative;
     max-width: 1170px;
     height: auto;
     padding: 0 ;
     margin: 0 auto;
     overflow: auto;
     list-style: none;
 }
 
 .timeline-background {
     width: 50%;
     float: left;
     height: 100%;
     position: absolute;
     z-index: -1;
     border-right: 2px dashed grey;
 }
 
 .timeline-year {
     font-weight: 600;
     font-size: 25px;
     letter-spacing: 3px;
     color: #f0f0f0;
     background-color: #1d99f3;
     text-align: center;
     margin-top: 3em;
     margin: 1em auto;
     clear: both;
 }
 
 .timeline-event{
     width: 44%;
     margin: 4% 2%;
     padding: 1%;
     text-align: center;
     background-color: white;
 }
 
 .timeline-img {
     width: 44%;
     margin: 2% 2%;
     padding: 1%;
     background-color: white;
 }
 
 .timeline-event:nth-of-type( odd ){
     float:right;
 }
 
 .timeline-event:nth-of-type( even ) {
     float: left ;
 }
 
 .timeline-img:nth-of-type( even ) {
     float: right;
 }
 
 .timeline-img:nth-of-type( odd ) {
     float: left;
 }
 
 @media (max-width: 600px) {
     .timeline-event,
     .timeline-img {
         width:auto;
         float:none;
     }
 }
 
 .link{
     text-decoration: none;
     color:#1d99f3;
 }
 
 .link-footer{
     text-decoration: none;
     color:white;
+}
+
+
+input {
+    width: 100%;
+    padding: 1em ;
+    border: 2px solid #ccc;
+    border-radius: 10px;
+    margin-bottom: 0.5em ;
+    outline: 0;
+    box-sizing: border-box;
+}
+
+label {
+    padding: 1em 1em 1em 0 ;
+    text-align: left;
+}
+
+.form{
+    width: 50%;
+}
+
+@media (max-width: 992px) {
+    .form {
+        width: 100%;
+    }
+}
+
+.error-message{
+    background-color:#f44755;
+    color:white;
+    width: 100%;
+    border-radius: 10px;
+    font-size: 0.8em;
+    padding: 1em;
+    text-indent: 0;
+    box-sizing: border-box;
+}
+
+.success-message {
+    background-color: #27ae60;
+    color: white;
+    width: 100%;
+    border-radius: 10px;
+    font-size: 0.8em;
+    padding: 1em;
+    text-indent: 0;
+    box-sizing: border-box;
 }
\ No newline at end of file
diff --git a/img/logo-2012.jpg b/img/logo-2012.jpg
new file mode 100644
index 0000000..f1332af
Binary files /dev/null and b/img/logo-2012.jpg differ
diff --git a/img/web-design-in-4-minutes.png b/img/web-design-in-4-minutes.png
new file mode 100644
index 0000000..b957000
Binary files /dev/null and b/img/web-design-in-4-minutes.png differ
diff --git a/index.html b/index.html
index 6b00e63..59b81b6 100644
--- a/index.html
+++ b/index.html
@@ -1,249 +1,249 @@
 <!DOCTYPE html>
 <html lang="pt-br">
     <head>
         <title>Lakademy 2018</title>
         <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">
         <link rel="stylesheet" type="text/css" href="css/style.css">
         <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css">
         <link rel="icon" href="img/favicon.png" type="image/x-icon" />
         <script src="js/functions.js"></script>
     </head>
     <body>
         <header class="bg-2018">
             <nav>
                 <div class="navbar">
                     <a class="navbar-title" href="index.html">Latin America KDE Summit </a>
                     <a class="navbar-item"  href="contato.html">Contato</a>
                     <div class="navbar-dropdown">
                         <a class="navbar-dropdown-title">
                             Edições
                             <i class="fa fa-caret-down"></i>
                         </a>
                         <div class="navbar-dropdown-content">
                             <a class="navbar-dropdown-item" href="2017.html">2017</a>
                             <a class="navbar-dropdown-item" href="2016.html">2016</a>
                             <a class="navbar-dropdown-item" href="2015.html">2015</a>
                             <a class="navbar-dropdown-item" href="2014.html">2014</a>
                             <a class="navbar-dropdown-item" href="2012.html">2012</a>
                         </div>
                     </div>
                     <a class="navbar-item" href="sobre.html">Sobre</a>
                 </div>
                 <div class="navbar-collapse">
                     <div class="navbar-header-collapse">
                     <a class="navbar-title">Latin America KDE Summit</a>
                     <a class="navbar-icon" onclick="javascript:menuShow();">
                         <i class="fas fa-bars"></i>
                     </a>
                     </div>
                     <a class="navbar-item-collapse hide" href="sobre.html">Sobre</a>
                     <a class="navbar-item-collapse hide" href="javascript:dropdownShow();">Edições
                         <i class="fa fa-caret-down"></i>
                     </a>
                     <a class="navbar-collapse-dropdown-item hide" href="2017.html">2017</a>
                     <a class="navbar-collapse-dropdown-item hide" href="2016.html">2016</a>
                     <a class="navbar-collapse-dropdown-item hide" href="2015.html">2015</a>
                     <a class="navbar-collapse-dropdown-item hide" href="2014.html">2014</a>
                     <a class="navbar-collapse-dropdown-item hide" href="2012.html">2012</a>
                     <a class="navbar-item-collapse hide" href="contato.html">Contato</a>
                 </div>
             </nav>
             <img id="logo" src="img/kde-logo.png" alt="logo">
             <h1> Latin America KDE Summit | Lakademy 2018 </h1>
             <div class="button">
-                <a class="button-primary"> Inscreva-se! </a>
+                <a href="inscreva-se.html" class="button-primary"> Inscreva-se! </a>
             </div>
         </header>
 
         <main>
             <section>
                 <div class="container">
                     <div class="row">
                         <div class="col col-3">
                             <h2> Sobre </h2>
                             <img src="img/sobre.png">
                             <p>
                                 O LaKademy é o encontro dos usuários e colaboradores latino-americanos da comunidade KDE.
                             </p>
                             <div class="button">
                                 <a class="button button-secondary"> Saiba mais!</a>
                             </div>
                         </div>
                         <div class="col col-3">
                             <h2> Colabore </h2>
                             <img src="img/contribua.png">
                             <p>
                                 Se você deseja se tornar um(a) contribuidor(a) da nossa comunidade há muitas atividades com as quais você pode se envolver.
                             </p>
                             <div class="button">
                                 <a class="button-secondary"> Saiba mais!</a>
                             </div>
                         </div>
                         <div class="col col-3">
                             <h2> Contate-nos </h2>
                             <img src="img/contato.png">
                             <p>Se você tem interesse em participar do LaKademy e contribuir com a comunidade KDE, entre em contato conosco.</p>
                             <div class="button">
                                 <a class="button-secondary"> Saiba mais!</a>
                             </div>
                         </div>
                     </div>
                 </div>
             </section>
 
             <section>
                 <ul class="timeline">
                     <div class="timeline-background"></div>
                     <li class="timeline-year">
                         <p>
                             2017
                         </p>
                     </li>
                     <li class="timeline-img">
                         <a href="2017.html">
                             <img class="img-responsive" src="img/logo-2017.png">
                         </a>
                     </li>
                     <li class="timeline-event">
                         <p>
                             O LaKademy 2017 foi uma edição muito especial, o evento completou 5 anos. A 5ª edição foi realizado na cidade de Belo Horizonte, Minas Gerais, Brasil. 
                         </p>
                     </li>
 
                     <li class="timeline-year">
                         <p>
                             2016
                         </p>
                     </li>
                     <li class="timeline-img">
                         <a href="2016.html">
                             <img class="img-responsive" src="img/logo-2016.png">
                         </a>
                     </li>
                     <li class="timeline-event">
                         <p>
                             Em 2016, a comunidade KDE completou seus 20 anos de existência, o LaKademy aconteceu no Rio de Janeiro, nas dependências da UNIRIO (Universidade Federal do Estado do Rio de Janeiro).
                         </p>
                     </li>
 
                     <li class="timeline-year">
                         <p>
                             2015
                         </p>
                     </li>
                     <li class="timeline-img">
                         <a href="2015.html">
                             <img class="img-responsive" src="img/logo-2015.png">
                         </a>
                     </li>
                     <li class="timeline-event">
                         <p>
                             Em 2015 o LaKademy aconteceu em Salvador, Bahia, casa do Akademy-BR, do primeiro grupo brasileiro de desenvolvedores do KDE, chamado Live Blue, e terra dos Orixás! 
                         </p>
                     </li>
 
                     <li class="timeline-year">
                         <p>
                             2014
                         </p>
                     </li>
                     <li class="timeline-img">
                         <a href="2014.html">
                             <img class="img-responsive" src="img/logo-2014.png">
                         </a>
                     </li>
                     <li class="timeline-event">
                         <p>
                             A segunda edição do LaKademy ocorreu na cidade de São Paulo, entre os dias 27 e 30 de Agosto de 2014. O evento foi realizado
                             no CCSL - Centro de Competência em Software Livre do Instituto de Matemática (IME) e Estatística da Universidade de São
                             Paulo (USP), campus do Butantã.
                         </p>
                     </li>
 
                     <li class="timeline-year">
                         <p>
                             2012
                         </p>
                     </li>
                     <li class="timeline-img">
                         <a href="2012.html">
                             <img class="img-responsive" src="img/logo-2012.jpg">
                         </a>
                     </li>
                     <li class="timeline-event">
                         <p>
                         A primeira edição do LaKademy aconteceu entre 27 de abril e 01 de maio de 2012. O evento foi realizado na cidade de Porto
                         Alegre, no Rio Grande do Sul, Brasil. Participaram dessa edição colaboradores do Brasil, Argentina, Peru e Colômbia. Doze
                         colaboradores veteranos se juntaram a seis novos colaboradores para trabalharem nos projetos da comunidade durante cinco
                         dias.
                         </p>
                     </li>
                 </ul>
             </section>
 
 
 
             <section>
                 <div class="container">
                     <h2> Depoimentos </h2>
                     <div class="row">
                         <div class="col col-3">
                             <img src="img/avatar1.png" class="img-responsive img-avatar">
                             <p>
                                 O LaKademy é o encontro dos usuários e colaboradores latino-americanos da comunidade KDE.
                             </p>
                         </div>
                         <div class="col col-3">
                             <img src="img/avatar2.png" class="img-responsive img-avatar">
                             <p>
                                 O LaKademy é o encontro dos usuários e colaboradores latino-americanos da comunidade KDE.
                             </p>
                         </div>
                         <div class="col col-3">
                             <img src="img/avatar3.png" class="img-responsive img-avatar">
                             <p>
                                 O LaKademy é o encontro dos usuários e colaboradores latino-americanos da comunidade KDE.
                             </p>
                         </div>
                     </div>
                 </div>
             </section>
         </main>
 
         <footer>
             <div class="container">
                 <div class="row">
                     <div class="col col-content">
                         <p>
                             Mantido por
                             <a target="_blank" href="http://br.kde.org/" class="link-footer"> KDE Brasil </a>
                         </p>
                         <p>
                             KDE® e logo do KDE são marcas registradas de
                             <a target="_blank" href="https://ev.kde.org/" class="link-footer">
                             KDE e.V. </a>
                         </p>
                     </div>
                     <div class="col col-sidebar">
                         <p>
                             <a target="_blank" class="link-footer" href="https://www.facebook.com/kdebrasil/">
                                 <i class="icon social-media fab fa-facebook"></i> Facebook
                             </a>
                         </p>
                         <p>
                             <a target="_blank" class="link-footer" href="https://twitter.com/kdebrasil">
                                 <i class="icon social-media fab fa-twitter"></i> Twitter
                             </a>
                         </p>
                         <p>
                             <a target="_blank" class="link-footer" href="https://telegram.me/joinchat/BstFRj9eUM4B7fZE3yEnLQ">
                                 <i class=" icon social-media fab fa-telegram"></i> Telegram
                             </a>
                         </p>
                     </div>
                 </div>
             </div>
         </footer>
 
     </body>
 </html>
\ No newline at end of file
diff --git a/inscreva-se.html b/inscreva-se.html
new file mode 100644
index 0000000..b057216
--- /dev/null
+++ b/inscreva-se.html
@@ -0,0 +1,117 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Inscreva-se</title>
+    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" type="text/css" href="css/style.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css">
+    <link rel="icon" href="img/favicon.png" type="image/x-icon" />
+    <script src="js/functions.js"></script>
+</head>
+
+<body>
+    <header class="bg-2018">
+        <nav>
+            <div class="navbar">
+                <a class="navbar-title" href="index.html">Latin America KDE Summit </a>
+                <a class="navbar-item" href="contato.html">Contato</a>
+                <div class="navbar-dropdown">
+                    <a class="navbar-dropdown-title">Edições
+                        <i class="fa fa-caret-down"></i>
+                    </a>
+                    <div class="navbar-dropdown-content">
+                        <a class="navbar-dropdown-item" href="2017.html">2017</a>
+                        <a class="navbar-dropdown-item" href="2016.html">2016</a>
+                        <a class="navbar-dropdown-item" href="2015.html">2015</a>
+                        <a class="navbar-dropdown-item" href="2014.html">2014</a>
+                        <a class="navbar-dropdown-item" href="2012.html">2012</a>
+                    </div>
+                </div>
+                <a class="navbar-item" href="sobre.html">Sobre</a>
+            </div>
+            <div class="navbar-collapse">
+                <div class="navbar-header-collapse">
+                    <a class="navbar-title">Latin America KDE Summit</a>
+                    <a class="navbar-icon" onclick="javascript:menuShow();">
+                        <i class="fas fa-bars"></i>
+                    </a>
+                </div>
+                <a class="navbar-item-collapse hide" href="index.html">Home</a>
+                <a class="navbar-item-collapse hide" href="sobre.html">Sobre</a>
+                <a class="navbar-item-collapse hide" href="javascript:dropdownShow();">Edições
+                    <i class="fa fa-caret-down"></i>
+                </a>
+                <a class="navbar-collapse-dropdown-item hide" href="2017.html">2017</a>
+                <a class="navbar-collapse-dropdown-item hide" href="2016.html">2016</a>
+                <a class="navbar-collapse-dropdown-item hide" href="2015.html">2015</a>
+                <a class="navbar-collapse-dropdown-item hide" href="2014.html">2014</a>
+                <a class="navbar-collapse-dropdown-item hide" href="2012.html">2012</a>
+                <a class="navbar-item-collapse hide" href="contato.html">Contato</a>
+            </div>
+        </nav>
+        <img id="logo" src="img/kde-logo.png" alt="logo">
+        <h1> Inscreva-se! </h1>
+    </header>
+
+    <main>
+        <section>
+            <div class="container">
+                <div class="row">
+                    <div class="col-content">
+                        <p> Preencha o formulário abaixo para confirmar sua presença no evento!</p>
+                        <div class="form">
+                            <label for="nome">Nome:</label>
+                            <input type="text" id="nome" name="nome" placeholder="Seu nome" onfocus="cleanOutput()">
+                            <label for="email">Email:</label>
+                            <input type="email" id="email" name="email" placeholder="Seu melhor email" onfocus="cleanOutput()">
+                            <div id="form-output">
+                            </div>
+                            <div class="button">
+                                <a href="javascript:" onclick="validateForm()" class="button-primary"> Inscreva-se! </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </main>
+
+    <footer>
+        <div class="container">
+            <div class="row">
+                <div class="col col-content">
+                    <p>
+                        Mantido por
+                        <a target="_blank" href="http://br.kde.org/" class="link-footer"> KDE Brasil </a>
+                    </p>
+                    <p>
+                        KDE® e logo do KDE são marcas registradas de
+                        <a target="_blank" href="https://ev.kde.org/" class="link-footer">
+                            KDE e.V. </a>
+                    </p>
+                </div>
+                <div class="col col-sidebar">
+                    <p>
+                        <a target="_blank" class="link-footer" href="https://www.facebook.com/kdebrasil/">
+                            <i class="icon social-media fab fa-facebook"></i> Facebook
+                        </a>
+                    </p>
+                    <p>
+                        <a target="_blank" class="link-footer" href="https://twitter.com/kdebrasil">
+                            <i class="icon social-media fab fa-twitter"></i> Twitter
+                        </a>
+                    </p>
+                    <p>
+                        <a target="_blank" class="link-footer" href="https://telegram.me/joinchat/BstFRj9eUM4B7fZE3yEnLQ">
+                            <i class="icon social-media fab fa-telegram"></i> Telegram
+                        </a>
+                    </p>
+                </div>
+            </div>
+        </div>
+    </footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/js/functions.js b/js/functions.js
index 57125dd..f355d4e 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -1,36 +1,74 @@
-/*Adicione e remove a classe hide aos elementos que possuem a classe .navbar-item-collapse*/
+
 function menuShow() {
     var items = document.getElementsByClassName("navbar-item-collapse");
 
     for( i=0 ; i < items.length ; i++ ){
         if (items[i].classList.contains("hide")) {
             items[i].classList.remove("hide")
         } else {
             items[i].classList.add("hide");
         }
     }
 
     if( dropdownIsOpen() ){
         dropdownShow();
     }
 }
 
-/*Adicione e remove a classe hide aos elementos que possuem a classe .navbar-collapse-dropdown-item*/
+
 function dropdownShow() {
     var items = document.getElementsByClassName("navbar-collapse-dropdown-item");
 
     for (i = 0; i < items.length; i++) {
         if (items[i].classList.contains("hide")) {
             items[i].classList.remove("hide")
         } else {
             items[i].classList.add("hide");
         }
     }
 }
 
 function dropdownIsOpen(){
     var items = document.getElementsByClassName("navbar-collapse-dropdown-item");
     return !items[i].classList.contains("hide") ;
 }
 
+function validateForm(){
+
+    var msg = "", nome = "", email = "", type = "", utilizador = "", dominio="" ;
+
+    var nome  = document.getElementById( "nome" ).value;
+    var email = document.getElementById( "email" ).value;
 
+    if( nome != "" && email != "" ){
+
+        if ( email.indexOf('@') != -1 && email.indexOf('.') != -1 ) {
+
+            utilizador = email.substring( 0, email.indexOf('@') ) ;
+            dominio = email.substring( email.indexOf('@') , email.length ) ;
+
+            if ( utilizador.length >= 1 && dominio.length >= 3 ){
+                msg = "Sucesso! Sua inscrição foi confirmada!"
+                type = "success-message";
+            } else {
+                msg = "Informe um e-mail correto!"
+                type = "error-message";
+            }
+        }else{
+            msg = "Informe um e-mail correto!"
+            type = "error-message";
+        }
+    } else {
+        msg="Informe os campos corretamente!"
+        type = "error-message";
+    }
+
+    document.getElementById( 'form-output').innerHTML = "<p class=\""+type+"\"> " + msg + "</>"
+
+}
+
+function cleanOutput(){
+    if( document.getElementById('form-output').innerHTML.match( "error-message" ) ){
+        document.getElementById('form-output').innerHTML = "" ;
+    }
+}