/*---------------------------------------------------------------*/
/*------------- Put CSS to overwrite Blog CSS here  -------------*/
/*---------------------------------------------------------------*/

@media all and (max-width: 780px) {
  .blogNavigation {
    text-align: center;
  }
  .blogArticle .blogArticleWrap .blogPostHero {
    float: none;
    max-width: none;
    margin: 1em 0;
  }
  .blogArticle .blogArticleImages .container div {
    width: 49%;
  }
  .categorySection .container {
    -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
  }

    .blogPost .blogPostHero {
    width: 100%;
    max-width: none;
    max-height: none;
    min-height: 15em;
    margin: 0 0 1em;
  }
  .blogPost .blogPostDetails {
    width: 100%;
  }
}