logo between top two menus (Magazine)

gistfile1.css

#headerwrap {
    background: none;
}
#header {
    background: #0e88be;
    width: auto;
    margin-top: 180px; /* equal to the height of the logo */
}
@media (min-width: 781px) {
  #sidr {
    width: 1064px;
    margin: auto;
  }
}
#site-logo {
    position: absolute;
    left: 0;
    top: -180px; /* equal to the height of the logo */
}
#header hgroup {
    float: none;
    width: 1064px;
    position: relative;
    margin: 0 auto;
}