Need help creating a logo using html and css : 
<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

    <!DOCTYPE html>
    <html>
    <style>
    .hr{
    margin-top: 0px;
    margin-bottom: 0px;
    width: 35%;
    }
    .logo{
    top:0;
    left:0;
    position: absolute;
    }
    </style>
    <body>
    <div class="logo">
    <h1>GTD</h1>

    <hr>

    <h3>Web Design</h3>

    </div>
    </body>
    </html>

<!-- end snippet -->

 My only problem is I can’t figure out how to center the text to the line and how do I make it where the words are directly above and below the line?