Hello my question is about aligning divs. On a website i am working on for fun i have a div and inside that div is a child div. i need the child to be in the middle of the adult div. The left and right are aligning in the middle but it is stuck to the top. If anyone could help me that would be greatly appreciated!

[JSFIDDLE](http://jsfiddle.net/ry5xU/)

```
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <title></title>
</head>
<body>
    <div id="container">
        <div id="logo">
        </div>
        <div id="nav">
        </div>
        <div id="content-background">
            <div id="content">
            </div>
        </div>
        <div id="faqs">
        </div>
        <div id="footer">
            <div id="footer-right">
            </div>
            <div id="footer-left">
            </div>
            <div id="footer-bot">
            </div>
        </div>
    </div>
</body>
</html>

* {
    margin: 0px;
    padding: 0px;
}

#container {
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

#logo {
    width: 25%;
    height: 50px;
    float: left;
    background-color: red;
}

#nav {
    width: 75%;
    height: 50px;
    float: left;
    background-color: green;
}

#content-background {
    width: 100%;
    height: 600px;
    clear: both;
    background-image: url('images/background.jpg');
}

#content {
    width: 50%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
    background-color: yellow;
}

#faqs {
    width: 100%;
    height: 500px;
    margin-left: auto;
    margin-right: auto;
    background-color: yellow;
}

#footer {
    width: 100%;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
    background-color: red;
}

#footer-right {
    width: 50%;
    height: 150px;
    float: left;
    background-color: blue;
}

#footer-left {
    width: 50%;
    height: 150px;
    float: left;
    background-color: pink;
}

#footer-bot {
    width: 100%;
    height: 50px;
    clear: both;
    background-color: green;
}

```