bosco_header.html

<header id="masthead" class="site-header" role="banner">
  <div class="site-branding">
    <h1 class="site-title"><a href="http://www.test.dev/" rel="home">My Sticky Menu</a></h1>
    <h2 class="site-description">And I Don't Even Live In New York. Yet.</h2>
  </div>
  <nav id="site-navigation" class="main-navigation" role="navigation">
    <h1 class="menu-toggle">Menu</h1>
    <a class="skip-link screen-reader-text" href="#content">Skip to content</a>
    <div class="menu-mobile-main-container">
      <ul id="menu-mobile-main" class="menu">
        <li id="menu-item-1351" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1351"><a href="http://www.test.dev/sample-page/">Sample Page</a></li>
        <li id="menu-item-1352" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1352"><a href="http://www.test.dev/about/">About</a></li>
        <li id="menu-item-1353" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1353"><a href="http://www.test.dev/blog/">Blog</a></li>
      </ul>
    </div> 
  </nav><!-- #site-navigation -->
</header>

bosco_header_myStickymenu.html

<div id="mysticky-wrap" style="">
  <div id="mysticky-nav" class="">
    <header id="masthead" class="site-header" role="banner" style="">...</header>
  </div>
</div>

bosco_myStickymenu.css

/* make site title font smaller */
.myfixed .site-title a {
  font-size: 1.25rem;
}

/* hide site description */
.myfixed .site-description {
  display: none;
}

/* add shadow border */
.wrapfixed {
  -webkit-box-shadow: 0 8px 6px -6px rgba(68,68,68,0.6);
  -moz-box-shadow: 0 8px 6px -6px rgba(68,68,68,0.6);
  box-shadow: 0 8px 6px -6px rgba(68,68,68,0.6);
}

/* remove excess padding */
.myfixed .site-branding {
  padding-top: 0px;
  padding-bottom: 0px;
}