Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>Join Mailing list - Bussline</title>
    <style>
        header{
            font-family: candara;
            background-color: darkblue;
            color: white;
            text-align: center;
        }
        form{
            font-family: candara;
            background-color: darkblue;
            color: white;
            text-align: center;
        }
     footer{
                font-family: sans-serif;
                background-color: lightblue;
                color: black;
                font-style: italic;
            }


    </style>
    <script>
    function mailconfirm()
        {
            var info = document.getElementById("info");
            var FirstName = document.getElementById("FirstName").value;
            var LastName = document.getElementById("LastName").value;
            var EmailAddress = document.getElementById("EmailAddress").value;


            info.innerHTML = ("Thank you " + FirstName + " " + LastName + " for joining our maling list. Your email that you gave us is " + EmailAddress +".")

        }


    </script>
    <body>
        <header>
        <h3>BUSLINE OF THE CITY</h3>
            </header>
        <form>
        <h1> Join in our mailing list today!</h1>

        <p>First Name: <input type="text" id="FirstName" name ="first_name"> </p>
        <p>Last Name: <input type="text" id="LastName" name ="last_name"/></p>

         <p>Email Address: <input type="text" id="EmailAddress" name ="email_address"/></p>
      <p><input type="button" class="button" value="Submit" onclick="mailconfirm()"></p>


     <p id="info"></p>
        </form>
               <footer>
     <h6> 3746 Harvard Street</h6>
            <h6>773-987-0000</h6>
  </footer>
    </body>
</head>
</html>