/*=============================================
=            Blogpage Structure            =
=============================================*/

:root {
    --blogpage-gap: var(--half-margin);
}

@media only screen and (min-width: 992px) {
    :root {
        --blogpage-gap: var(--default-margin);
    }
}

.fw--blogpage.fw--blogpage-post,
.fw--blogpage.fw--blogpage-home,
.fw--blogpage.fw--blogpage-archive,
.fw--blogpage.fw--blogpage-category {
    padding:var(--row-spacing-s) 0;
}

@media only screen and (min-width:768px) {
    .fw--blogpage.fw--blogpage-post,
    .fw--blogpage.fw--blogpage-home,
    .fw--blogpage.fw--blogpage-archive,
    .fw--blogpage.fw--blogpage-category {
        padding:var(--row-spacing-xm) 0;
    }
}

@media only screen and (min-width: 992px) {
    .fw--blogpage.fw--blogpage-post,
    .fw--blogpage.fw--blogpage-home,
    .fw--blogpage.fw--blogpage-archive,
    .fw--blogpage.fw--blogpage-category {
        padding:var(--row-spacing-l) 0;
    }
}

@media only screen and (min-width:1504px) {
    .fw--blogpage.fw--blogpage-post,
    .fw--blogpage.fw--blogpage-home,
    .fw--blogpage.fw--blogpage-archive,
    .fw--blogpage.fw--blogpage-category {
        padding:var(--row-spacing-xxl) 0;
    }
}

.page__row--post,
.page__row--blog {
    display:flex;
    flex-direction: row;
    flex-wrap:wrap;
    gap:var(--blogpage-gap);
    align-items: stretch;
    justify-content: space-between;
}

.page__content--post,
.page__content--blog {
    flex-basis:calc(100% - var(--blogpage-gap));
    max-width:calc(100% - var(--blogpage-gap));
}

.page__sidebar--blog,
.page__sidebar--post {
    flex-basis:calc(100% - var(--blogpage-gap));
    max-width:calc(100% - var(--blogpage-gap));
}

.page__sidebar--blog .sidebar.sidebar--blog,
.page__sidebar--post .sidebar.sidebar--post {
    display:block;
    width:100%;
    height:100%;
}

.page__sidebar--blog .sidebar.sidebar--blog .sidebar-widget .widget-box,
.page__sidebar--post .sidebar.sidebar--post .sidebar-widget .widget-box {
    display:block;
    width:100%;
    padding:var(--default-margin);
    background-color:var(--white);
    border-radius:0.5rem;
    border:1px solid #CCC;
    margin-bottom:var(--half-margin);
}

.page__sidebar--blog .sidebar.sidebar--blog .sidebar-widget .widget-box:last-child,
.page__sidebar--post .sidebar.sidebar--post .sidebar-widget .widget-box:last-child {
    margin-bottom:0;
}

.page__sidebar--blog .sidebar.sidebar--blog .sidebar-widget .widget-box h3,
.page__sidebar--post .sidebar.sidebar--post .sidebar-widget .widget-box h3 {
    margin-bottom:var(--half-margin);
} 

@media only screen and (min-width: 992px) {
    .page__content--post,
    .page__content--blog {
        flex-basis:calc(70% - (var(--blogpage-gap) / 2));
        max-width:calc(70% - (var(--blogpage-gap) / 2));
    }

    .page__sidebar--blog,
    .page__sidebar--post {
        flex-basis:calc(30% - (var(--blogpage-gap) / 2));
        max-width:calc(30% - (var(--blogpage-gap) / 2));
        padding:0 var(--half-margin);
    }
}

/*=====  End of Blogpage Structure  ======*/



/*=============================================
=            Blogpage Post            =
=============================================*/

.page--post .fw--page-hero .page-hero__blog-details {
    display:flex;
    flex-direction: row;
    flex-wrap:wrap;
    gap:var(--blogpage-gap);
    align-items: baseline;
}

.page--post .fw--page-hero .page-hero__blog-details .page-hero__blog-details-date {
    color:var(--white);
    font-size:2rem;
    font-weight:700;
    line-height:1;
    text-shadow: var(--contrast-text-shadow);
}

/*=====  End of Blogpage Home  ======*/


/*=============================================
=            Blogpage Loop            =
=============================================*/

.blogpage-loop {
    display:block;
    width:100%;
    padding:var(--half-margin);
    background-color:var(--white);
    border-radius:0.5rem;
    border:1px solid #CCC;
}

.blogpage-loop__row {
    display:flex;
    flex-direction: row;
    flex-wrap:wrap;
    gap:var(--blogpage-gap);
    align-items: stretch;
    justify-content: space-between;
}

.blogpage-loop__col.blogpage-loop__col--img {
    flex-basis:calc(100% - var(--blogpage-gap));
    max-width:calc(100% - var(--blogpage-gap));
}

.blogpage-loop__feat-img-container {
    display:block;
}

.blogpage-loop__feat-img-container-figure {
    display:block;
    width:100%;
    margin:0;
}

.blogpage-loop__feat-img-container-figure a {
    display:block;
    width:100%;
    height:100%;

}

.blogpage-loop__feat-img-container-figure a .blogpage-loop__feat-img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position: center center;
    border-radius:0.5rem;
}

.blogpage-loop__col.blogpage-loop__col--content {
    flex-basis:calc(100% - var(--blogpage-gap));
    max-width:calc(100% - var(--blogpage-gap));
    align-content: center;
}

.blogpage-loop__content-outer {
    display: block;
}

.blogpage-loop__headline {
    margin-bottom:var(--half-margin);
}

.blogpage-loop__metadata {
    display:flex;
    flex-direction: row;
    flex-wrap:wrap;
    gap:var(--blogpage-gap);
    align-items: center;
    margin-bottom:var(--half-margin);
}

.blogpage-loop__excerpt {
    margin-bottom:var(--half-margin);
}

.blogpage-loop__excerpt .view-article {
    display:none;
}

@media only screen and (min-width: 992px) {
    .blogpage-loop__col.blogpage-loop__col--img {
        flex-basis:calc(30% - (var(--blogpage-gap) / 2));
        max-width:calc(30% - (var(--blogpage-gap) / 2));
    }

    .blogpage-loop__col.blogpage-loop__col--content {
        flex-basis:calc(70% - (var(--blogpage-gap) / 2));
        max-width:calc(70% - (var(--blogpage-gap) / 2));
    }
}

/*=====  End of Blogpage Loop  ======*/