/* ==========================================================================
   layout.css — Layout structure: max-widths, fixed header, heights, footer
   ========================================================================== */

/* --- Max-widths for site components ----------------------------------- */
#site-wrapper,
#site-header-main,
#header-image-main-inside { max-width: 1920px; }

/* --- Fixed header -------------------------------------------------------- */
#site-header-main { height: 60px; background-color: #000000; }
#site-header-main-inside { background-color: #000000; }

#masthead #site-header-main {
  position: fixed;
  top: 0;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

#sheader,
.identity,
#nav-toggle { height: 60px; line-height: 60px; }

#branding { height: 60px; }
#access div > ul > li > a { line-height: 58px; }

.fluida-responsive-headerimage #masthead #header-image-main-inside { max-height: 60px; }

/* Empty header image strip — pushes content below fixed bar */
#header-image-main { margin-top: 60px; }

/* --- Content ------------------------------------------------------------ */
#content {
  margin-top: 0;
  padding-left: 10px;
  padding-right: 10px;
}

article.hentry { background-color: #000000; }

article.hentry .article-inner,
.pad-container {
  padding-left: 10%;
  padding-right: 10%;
}

#header-widget-area {
  width: 100%;
  left: calc(50% - 100% / 2);
}

/* --- Footer / colophon -------------------------------------------------- */
#colophon-inside { margin: 0 0 0 1em; }

#colophon,
#footer {
  background-color: #000000;
  color: #ffffff;
}

#footer { border-top-color: #141414; }

/* --- Mobile menu breakpoint at 1200px --------------------------------- */
@media (max-width: 1200px) {
  .cryout #nav-toggle { display: block; }
  #masthead.cryout #access { display: none; }
  .cryout #site-header-main-inside { display: block; }
  .cryout #sheader { margin-left: 0; margin-right: 2em; }
  .cryout #branding { margin-right: 3em; }
}