Как опустить текст ниже (margin-top не опускает)

<!-- #Header Start -->
    <header>
        <div class="wrap">
            <a href="#" class="logo"><img src="images/header/logo.svg" alt=""></a>
            <h1><span class="narrow">Разработка электроники</span><br />по всей россии на заказ</h1>
            <ul>
                <li><a href="#" data-link-sel=".who-is">Кто мы?</a></li>
                <li><a href="#" data-link-sel=".what-we-do">Что делаем?</a></li>
                <li><a href="#" data-link-sel=".order-me">Как заказать?</a></li>
            </ul>
            <div class="info">
                <a href="tel:+74952253132" class="phone">+7 (495) 225-31-32</a>
                <span class="quick" onclick="yaCounter33146293.reachGoal('quick_call'); return true;">Быстрая связь</span>
            </div>
        </div>
    </header>

/* Header Section */
header {
    width:100%;
    background-color:#ffffff;
    height:110px;
    padding:24px 0 0 0;
    //position:fixed;
    //z-index:500;
    //top:0;
    //box-shadow:0 0 2px rgba(0,0,0,0.1);
}
 
header .logo, header h1 {
    float:left;
}
 
header h1 {
    font-size:1em;
    text-transform: uppercase;
    margin-left:60px;
    font-weight:900;
}
 
header h1 .narrow {
    letter-spacing:-0.25px;
}