Logo image in header positioning

<header>
    <div id="logobox">
    <a href="index.html" id="logo">
        <img src="Images/leaf1.png" id="leaflogo">
        <h1>NiagaraClean</h1>
        <h2>Cleaning Services from Nature</h2>
        </a>
        <h3 id="topphone"><a href="tel:1-800-564-3928">1-800-564-3928</a></h3>
    </div>  
        <p id="bookservice">Book Your Service</p>
        <div id="navigation">
            <nav>
                <ul>
                    <li><a href="about.html">About</a></li>
                    <li><a href="services.html">Services</a></li>
                    <li><a href="products.html">Products</a></li>
                    <li><a href="locations.html">Locations</a></li>
                </ul>
            </nav>
        </div>
</header>

header {
    width: 100%;
    text-align: center;
}

#logo {
    text-align: center;
    margin: 0 auto;
}

#logobox {
    height: 80px;
    margin: -10px 10px 0;
}

#leaflogo {
    height: 30px;
    width: 30px;
    position: absolute;
    margin: -13px -5px 0;
}

h1 {
    font-family: 'Antic Didone', serif;
    color: #50C738;
    font-size: 2.5em;
    font-weight: normal;
    position: relative;
    clear: both;
    line-height: 1em;
}

h2 {
    font-size: 0.75em;
    color: #1CABE8;
    margin: -23px 0 15px;
    font-weight: normal;
}

h3 {    
    font-size: 1.35em;
    color: #50C738;
    font-weight: normal;
    line-height: 1em;
}

#bookservice {
    background-color: #1CABE8;
    display: block;
    width: 100%;
    color: #FFF;
    margin: 29px 0 16px;
    padding: 10px;
}

#topphone {
    margin: -1px 0 0;
}