<!DOCTYPE html>


<html>
<head>
<!-- meal-cost.html 
calls meal-cost.php 
gathers numeric input for 3 courses
displays total, average and 15% tip for US users
--> 
        <meta charset="utf-8">
        <title> Form</title>
        <link rel="stylesheet" type = "text/css" media="screen" href="red.css" >
</head>
<body>
<header>
        <h1>Meal Cost Calculator</h1>

        <hgroup> 


                <h4> </h4>
                <h4> </h4>
        </hgroup>
</header>
<form class="contact_form" action="meal-cost.php" method="post" name="contact_form">
    <ul>
        <li>
             <h2>Start Here</h2>
             <span class="required_notification">* Denotes Required Field</span>
        </li>
                <li><!-- number - needs further validation  -->
                  
            <label for="entree">Entree or Choice 1 cost</label>
            <input type="number" size = "2" name="entree" min="5" max="80" placeholder="15.00" required />
            <span class="form_hint">A  number between 5 and 80 only</span>
        </li>
                
                <li><!-- number - needs further validation  -->
                  
            <label for="main">Mains or Choice 2 Cost</label>
            <input type="number" size = "2" name="main" min="5" max="100" placeholder="15.00" required />
            <span class="form_hint">A  number between 5 and 100 only</span>
        </li>
        
                
        
                <li><!-- number - needs further validation  -->
                  
            <label for="dessert">Dessert or Choice 3 cost</label>
            <input type="number" size = "2" name="dessert" min="5" max="30" placeholder="15.00" required />
            <span class="form_hint">A  number between 5 and 30 only</span>
        </li>
                
        <li>
                <button class="submit" type="submit">Calculate</button>
        </li>
    </ul>
</form>


<footer>

            &copy; STL 2013 
            
       
</footer>
</body>
</html>