functions.php

function skeleton_header_open() {
    echo '<div id="header">';
    echo '<div class="topbar">';
    // phone number
    echo '<span class="tel">1.800.555.1212</span>';
    // search form
    get_search_form(true);
    echo '<ul class="header_social_icons">';
    // Add your social icons below
    echo '<li><a href="http://twitter.com"><i class="fa fa-twitter"></i></a></li>';
    echo '<li><a href="http://facebook.com"><i class="fa fa-facebook"></i></a></li>';
    echo '<li><a href="http://plus.google.com"><i class="fa fa-google-plus"></i></a></li>';
    // end social icons
    echo '</ul>';
    echo '</div>';
    echo '<div class="container">';
    echo '<div class="sixteen columns">';
}

style.css

/* @group Topbar Addon */
#header {
  padding-top: 0;
}

.topbar {
  width: 100%;
  background: #333;
  height: 32px;
  margin-bottom: 20px;
}
.topbar .tel {
  float: left;
  color: #fff;
  line-height: 32px;
  margin-left: 40px;
}
.topbar #searchform {
  float: right;
  margin-left: 6px;
  margin-right: 40px;
}
.topbar #searchform label {
  display: none;
}
.topbar #searchform #s {
  height: 24px;
  margin-top: 4px;
  line-height: 24px;
  background: #4d4d4d;
  border: 1px solid #404040;
  color: #fff;
}
.topbar #searchform #s:focus {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.topbar #searchform input#searchsubmit {
  background: #262626;
  font-size: 14px !important;
  padding: 0 8px !important;
  height: 24px;
  margin-top: 4px;
}

.header_social_icons {
  float: right;
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 1px solid #4d4d4d;
}
.header_social_icons li {
  display: inline-block;
  padding: 0;
  margin: 0;
  line-height: 32px;
  border-right: 1px solid #4d4d4d;
}
.header_social_icons li a {
  color: #fff;
  height: 32px;
  width: 32px;
  display: inline-block;
  text-align: center;
}
.header_social_icons li a:hover {
  color: #3FA6EC;
}

/* @end */