/* Logo top center, menu bottom center */





/* header desktop */

@media all and (min-width: 768px) {

  header {
    padding: 2em 0 1em 0;
  }

  .hgroup {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 1em;
  }

  .hgroup-logo {
    margin: 0 auto;
  }

  .hgroup-tagline {
    text-align: center;
  }

  nav {
    text-align: center;
  }
  
  .menu  {
   text-align: center;
  }

  .menu > li {
    margin: 0 1em 0 1em;   /* gap between top items? */
  }

  .menu > li:first-child {
    margin-right: 1em;   /*  remove gap on first */
  }

  .menu > li:last-child {
    margin-right: 0;  /*  remove gap on last */
  }

}