/* 

NEEDS REFACTORED

main content + sidebar, use ATO layout??

*/

/*  flex layout */
.flex-row-with-sidebar {
  display: flex;
  gap: 4em;
  margin: 0;
  /* align-items: flex-start; */
}


.flex-row-with-sidebar > div:first-child {
  flex: 2; /* takes twice the space of the sidebar */
}

.flex-row-with-sidebar > div:last-child {
  flex: 1; /* takes 1 unit of space */
}


/* OLD WAY - MISALIGNED */
/* .flex-row-with-sidebar > div:first-child {
  flex: 1 1 calc(66.6% - 4em);
}

.flex-row-with-sidebar > div:last-child  {
  flex: 1 1 calc(33.3% - 4em);
} */


.main-body {
  margin-top: 4px;
  margin-bottom: 100px;
}


.sidePadding {
    padding: 0px 30px;
}


/* MOBILE LAYOUT STACK */
@media (max-width: 1024px) {
  .flex-row-with-sidebar {
    flex-direction: column;
    gap: 0em; /* smaller gap for stacked layout */
  }

  .flex-row-with-sidebar > div:first-child,
  .flex-row-with-sidebar > div:last-child {
    flex: 1 1 100%;
  }
  #article-container {
    margin-bottom: 3em;
  }

  .breadcrumbs {
        display: block;
    }

}
/* MOBILE LAYOUT STACK */