how to make overlay close after user register
<p>I am building an website where users are supposed to login before viewing website content. I try to do this with an overlay login form but the problem is I do not know how to make the overlay close after user press Submit. I think I need a JavaScript but I do not know anything about Javascript.</p>

<p>Can someone help me, please? Thank you!</p>

<p>This is what I intend to do: </p>

<pre><code>&lt;!DOCTYPE html&gt; 
&lt;html lang="en"&gt;
    &lt;head&gt;
        &lt;meta charset="utf-8"&gt; 
        &lt;title&gt;CSS Overlay&lt;/title&gt; 
        &lt;style type="text/css"&gt; 
            html { height: 100%; min-height: 100%; } 
            body { height: 100%; min-height: 100%; font-family:Georgia, sans-serif; } 
            #overlay { background: rgba(0,0,0,0.4); width: 100%; height: 100%;min-height: 100%; position: fixed; top: 0; left: 0; z-index: 10000; 
            header, section,footer { width: 800px; margin: 0 auto 20px auto; padding: 20px; background: #ff0; }
            section { min-height: 1500px; } 
        &lt;/style&gt; 
    &lt;/head&gt;
    &lt;body&gt; 
        &lt;div id="overlay"&gt;&lt;/div&gt;
        &lt;section&gt; 
            &lt;form&gt; 
                &lt;input type='hidden' name='submitted' id='submitted' value='1'/&gt; 
                &lt;label for='username' &gt;UserName*:&lt;/label&gt; 
                &lt;input type='text' name='username' id='username' maxlength="50" /&gt; 
                &lt;br&gt; 
                &lt;label for='password' &gt;Password*:&lt;/label&gt; 
                &lt;input type='password' name='password' id='password' maxlength="50" /&gt;
                &lt;br&gt; 
                &lt;input type='submit' name='Submit' value='Submit' /&gt; 
            &lt;/form&gt; 
        &lt;/section&gt;
    &lt;/body&gt; 
&lt;/html&gt;
</code></pre>
