/*
Theme Name: Asterion Industrial Partners
Theme URI: http://demo.select-themes.com/stockholm
Template: stockholm
Author: Select Themes
Author URI: http://demo.select-themes.com
Description: Asterion Industrial Partners - Child Theme
Tags: agency,business,ajax,portfolio,blog,shop,multi-purpose,clean,elegant,white,photography,modern,fullscreen,stylish,design
Version: 4.6.1550507132
Updated: 2019-02-18 16:25:32

*/

/* ==========================================================================
   News grid (/news-insights/, page id 16, Blog Masonry template)
   Override Stockholm's Isotope masonry with a row-major CSS grid so cards
   read left->right, top->bottom in date order, with equal-height rows.
   Isotope JS is untouched; these rules just override its inline styles.
   Revert: delete this whole block.
   ========================================================================== */
.page-id-16 .blog_holder.masonry {
    position: static !important;   /* Isotope sets position:relative + fixed height */
    height: auto !important;
    width: auto !important;        /* initBlog() sets an inline pixel width */
    opacity: 1 !important;         /* theme fades grid in only after Isotope layout */
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;           /* row-major order */
    gap: 30px;
}
.page-id-16 .blog_holder.masonry article {
    position: static !important;   /* cancel Isotope's absolute left/top */
    left: auto !important;
    top: auto !important;
    transform: none !important;    /* cancel any Isotope translate() */
    width: auto !important;
    margin: 0 !important;          /* spacing handled by grid `gap` */
    float: none !important;
    display: flex;                 /* equal-height: stretch + push footer down */
    flex-direction: column;
    height: 100%;
    min-height: 420px;             /* consolidated from Customizer */
}
.page-id-16 .blog_holder.masonry article .post_text {
    flex: 1 1 auto;
}
@media only screen and (max-width: 1024px) {  /* tablet: 2 cols */
    .page-id-16 .blog_holder.masonry { grid-template-columns: repeat(2, 1fr); }
}
@media only screen and (max-width: 600px) {   /* mobile: 1 col */
    .page-id-16 .blog_holder.masonry { grid-template-columns: 1fr; }
}