/*****************************************************************************************************
* Site layout
******************************************************************************************************/

/*
Site Containers
---------------------------------------------------------------------------------------------------- */

/* Containers: Default
--------------------------------------------- */

body {
  overflow-x: hidden;
  overflow-y: scroll;
}

.site-inner,
.wrap {
  margin: 0 auto;
}

.wrap {
  max-width: 1160px;
}

/* The header takes its own space in the flow (core/css/section.css). */
.site-inner > .wrap {
  padding-top: 50px;
}

/* Pages and archives: the space below the content as between a page's
   sections (64px, 48px on phones), the bottom section's own 40px margin
   (section.css) plus this padding (user, 2026-10-19). Single views end with
   their share buttons and keep their own space, the front page ends with a
   section of its own, and full width pages have no padding. */

body:not(.home, .single, .bub-full) .site-inner > .wrap {
  padding-bottom: 24px;
}

@media screen and (max-width: 650px) {

  body:not(.home, .single, .bub-full) .site-inner > .wrap {
    padding-bottom: 8px;
  }
}

.site-inner > .wrap,
.bub-bottom-section > .wrap {
  padding-left: 20px;
  padding-right: 20px;
}

.has-breadcrumbs .site-inner > .wrap {
  padding-top: 35px;
}

@media screen and (max-width: 1200px) {

  .wrap {
    max-width: 1000px;
  }
  
  .has-breadcrumbs .site-inner > .wrap {
    padding-top: 35px;
  }
}

@media screen and (max-width: 1000px/*mobileMenuMaxWidth*/) {

  .wrap {
    min-width: 280px;
  }

  .site-inner > .wrap {
    padding-top: 40px;
  }

  .site-inner > .wrap,
  .bub-bottom-section > .wrap {
    padding-left: 40px;
    padding-right: 40px;
  }

  .has-breadcrumbs .site-inner > .wrap {
    padding-top: 30px;
  }
}

/* Archives keep the side padding of the other pages, so that their headings
   and grids line up with the logo. */

@media screen and (max-width: 500px) {

  .site-inner > .wrap {
    padding-top: 35px;
  }

  .site-inner > .wrap,
  .bub-bottom-section > .wrap {
    padding-left: 20px;
    padding-right: 20px;
  }

  .has-breadcrumbs .site-inner > .wrap {
    padding-top: 20px;
  }
}


/* Containers: Full Width Sections
--------------------------------------------- */

/* Full Width Sections: Common */

.bub-full :is(.site-container, .site-inner, .site-inner .wrap), 
.bub-full.fl-builder .content {
  margin: 0;
  max-width: none;
  padding: 0;
  width: 100%;
}

.bub-full :is(.site-footer, .bub-bottom-section) {
  margin-top: 0;
}

/* Full Width Sections: Beaver Builder */

.bub-full .bubfl-row-section :is(.fl-row-content, .fl-row-full-width.fl-row-content) {
  max-width: 1120px;
}

.bub-full .bubfl-row-section .fl-row-content-wrap {
  padding-left: 5%;
  padding-right: 5%;
}

@media screen and (max-width: 1200px) {

  .bub-full .bubfl-row-section :is(.fl-row-content, .fl-row-full-width.fl-row-content) {
    max-width: 960px;
  }
}


/* Layout Containers
--------------------------------------------- */

/* Masonry */

.bub-masonry {
  opacity: 0;
}

.bub-masonry-item--visible {
  animation: masonryItemFadeIn 200ms ease-in-out;
}

@keyframes masonryItemFadeIn {
    0% {opacity: 0;}
  100% {opacity: 1;}
}


/* Sticky Footer
--------------------------------------------- */

html,
body {
  height: 100%;
}

.site-container {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.site-header,
.bub-bottom-section,
.site-footer {
  flex: 0 0 auto;
}

.site-inner {
  flex: 1 0 auto;
  width: 100%;
}


/* Prevent Horizontal Scroll
--------------------------------------------- */

/* Prevent horizontal document scroll in mobile browsers (Chrome!),
caused by negative margins on flexbox containers. 'clip' does this
without creating a scroll container, so 'position: sticky' still works
inside. 'hidden' is the fallback for browsers without 'clip' support. */

.site-container {
  height: initial !important;
  overflow: hidden !important;
  overflow: clip !important;
}


/*
Column Layouts
---------------------------------------------------------------------------------------------------- */

/* Full Width Content
--------------------------------------------- */

.full-width-content .content {
  width: 100%;
}


/* Content-Sidebar (Flexbox)
--------------------------------------------- */

/* Net Width: 1120px */

.content-sidebar .content-sidebar-wrap {
  display: flex;
}

.content-sidebar .content {
  max-width: 720px;
  padding-right: 70px;
  width: 100%;
}

.content-sidebar .sidebar {
  flex: 0 0 400px;
  max-width: 400px;
}

@media screen and (max-width: 1200px/*mobileSidebarMaxWidth*/) {

  /* Net Width: 700px */

  .content-sidebar .content {
    margin: 0 auto;
    max-width: 650px;
    padding-right: 0;
  }

  .content-sidebar .sidebar {
    display: none;
  }
}

@media screen and (max-width: 1000px) {

  /* Net Width: Full */

  .content-sidebar .content-sidebar-wrap {
    display: block;
  }

  .content-sidebar .content {
    display: block;
    min-width: 260px;
  }
}


/* Sidebar-Content (Flexbox)
--------------------------------------------- */

/* Net Width: 1120px */

.sidebar-content .content-sidebar-wrap {
  display: flex;
}

.sidebar-content .sidebar {
  flex: 0 0 400px;
  max-width: 400px;
  order: -1;
}

.sidebar-content .content {
  max-width: 720px;
  padding-left: 70px;
  width: 100%;
}

@media screen and (max-width: 1200px/*mobileSidebarMaxWidth*/) {

  /* Net Width: 700px */

  .sidebar-content .sidebar {
    display: none;
  }

  .sidebar-content .content {
    margin: 0 auto;
    max-width: 650px;
    padding-left: 0;
  }
}

@media screen and (max-width: 1000px) {

  /* Net Width: Full */

  .sidebar-content .content-sidebar-wrap {
    display: block;
  }

  .sidebar-content .content {
    display: block;
    min-width: 260px;
  }
}


/* Primary-Content-Secondary (Flexbox)
--------------------------------------------- */

/* Net Width: 1160px */

.sidebar-content-sidebar .content-sidebar-wrap {
  display: flex;
}

.sidebar-content-sidebar .sidebar-primary {
  flex: 0 0 200px;
  order: -1;
}

/* IE 11: Make images respect container width. */
.sidebar-content-sidebar .content {
  display: flex;
  flex-direction: column;
}
.bub-loop-wrap {
  width: 100%;
} /* End: IE 11 */

.sidebar-content-sidebar .sidebar-secondary {
  flex: 0 0 315px;
  max-width: 315px; /* IE 11 ignoring display border-box. */
  padding-left: 40px;
}

@media screen and (max-width: 1200px/*mobileSidebarMaxWidth*/) {

  /* Net Width: 960px */

  .sidebar-content-sidebar .content-sidebar-wrap {
  }

  .sidebar-content-sidebar .sidebar-primary {
  }

  .sidebar-content-sidebar .content {
    /*max-width: 650px;*/
    flex-shrink: 1;
    flex-grow: 0;
    flex-basis: 650px;
    padding-left: 20px;
  }

  .sidebar-content-sidebar .sidebar-secondary {
    display: none;
  }
}

@media screen and (max-width: 1000px) {

  /* Net Width: 780px */

  .sidebar-content-sidebar .sidebar-primary {
    flex: 0 0 190px;
  }

  .sidebar-content-sidebar .content {
    padding: 0;
  }
}

@media screen and (max-width: 800px) {

  /* Net Width: Full */

  .sidebar-content-sidebar .content-sidebar-wrap {
    display: block;
  }

  .sidebar-content-sidebar .content {
    margin: 0 auto;
    max-width: 620px;
  }

  .sidebar-content-sidebar .sidebar-primary {
    display: none;
  }
}

