/* Hamburger menu styles for mobile only */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  #wrapper,
  #container,
  #header,
  #content,
  .narrowcolumn {
    float: initial !important;
    margin: initial !important;
    padding: initial !important;
    max-width: initial !important;
    width: initial !important;
    box-sizing: initial !important;
  }
  #header {
    padding-top: 0 !important;
  }
  #title {
    line-height: 1 !important;
    margin-top: 0 !important;
    margin: 0;
    padding: 0 60px 0 10px !important;
    font-size: 3.2em !important;
    min-height: 32px;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    position: relative;
    z-index: 10002 !important;
    outline: none !important;
    background: none !important;
  }
  #hamburger-menu.hamburger-menu {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute !important;
    top: 2px;
    right: 8px;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    z-index: 10010 !important;
    padding: 0;
    box-shadow: none;
    cursor: pointer;
  }
  #hamburger-menu.hamburger-menu.open {
    display: flex !important;
  }
  #hamburger-menu.hamburger-menu.open span {
    background: #000;
  }
  #hamburger-menu.hamburger-menu.open span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
  }
  #hamburger-menu.hamburger-menu.open span:nth-child(2) {
    opacity: 0;
  }
  #hamburger-menu.hamburger-menu.open span:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
  }
  .hamburger-menu span {
    width: 22px;
    height: 3px;
    margin: 3px 0;
    background: #333;
    border-radius: 2px;
    display: block;
    transition: 0.3s;
  }
  .mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #fff !important;
    color: #222 !important;
    z-index: 9998;
    display: none;
    flex-direction: column;
    align-items: flex-start;
    padding: 60px 20px 20px 20px;
    box-sizing: border-box;
  }
  .mobile-overlay.open {
    display: flex;
  }
  .close-overlay {
    display: none !important;
  }
  .sidebar, #col1 {
    display: none !important;
  }
  .post, .entry, .hentry, .page, .single {
    width: 100% !important;
    max-width: 100vw !important;
    margin: 0 0 15px 0 !important;
    box-sizing: border-box !important;
  }
  .post h2.post-title, .entry h2.post-title, .hentry h2.post-title {
    font-size: 1.5em !important;
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: normal !important;
    margin-bottom: 0.5em !important;
    margin-top: 0 !important;
    display: block;
  }
  .post img, .entry img, .hentry img {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: auto !important;
    display: block;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  .post h2.post-title + img, .entry h2.post-title + img, .hentry h2.post-title + img {
    margin-top: 0.5em !important;
  }
  .mobile-overlay {
    background: #fff !important;
    color: #222 !important;
    text-align: center;
    padding: 60px 0 20px 0 !important;
    overflow-y: auto !important;
  }
  .mobile-overlay ul,
  .mobile-overlay ul ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center;
  }
  .mobile-overlay li {
    display: block;
    margin: 0.3em 0;
    padding: 0;
  }
  .mobile-overlay h2 {
    font-size: 1.6em !important;
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: bold !important;
    margin: 1.1em 0 0.5em 0 !important;
    text-align: center;
  }
  .mobile-overlay a {
    font-size: 1.3em !important;
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: normal !important;
    text-decoration: none;
    color: #222;
    display: inline-block;
    margin: 0.2em 0;
  }
  .mobile-overlay a:hover {
    text-decoration: underline;
  }
  .mobile-overlay ul,
  .mobile-overlay ul ul,
  .mobile-overlay li,
  .mobile-overlay h2,
  .mobile-overlay a,
  .mobile-overlay form,
  .mobile-overlay input {
    box-sizing: border-box !important;
  }
  .mobile-overlay li,
  .mobile-overlay h2,
  .mobile-overlay a,
  .mobile-overlay form {
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
  /* Remove previous content padding fix */
  #container, .content, .main, .site-main, .site-content, .hentry, .page, .single, .home, .archive, .search, .category, .tag, .author, .date, .post, .entry {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Add 3px side padding only to text elements and titles, not images */
  .post > *, .entry > *, .hentry > *, .page > *, .single > * {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .post p, .post h1, .post h2, .post h3, .post h4, .post h5, .post h6, .post ul, .post ol, .post blockquote,
  .entry p, .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6, .entry ul, .entry ol, .entry blockquote,
  .hentry p, .hentry h1, .hentry h2, .hentry h3, .hentry h4, .hentry h5, .hentry h6, .hentry ul, .hentry ol, .hentry blockquote,
  .page p, .page h1, .page h2, .page h3, .page h4, .page h5, .page h6, .page ul, .page ol, .page blockquote,
  .single p, .single h1, .single h2, .single h3, .single h4, .single h5, .single h6, .single ul, .single ol, .single blockquote {
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
}

/* Hide hamburger and overlay on desktop */
@media (min-width: 769px) {
  .hamburger-menu,
  .mobile-overlay {
    display: none !important;
  }
  nav#site-navigation, .sidebar, #col1 {
    display: block;
  }
}