@supports (display: grid) {
  @media (width >= 992px) {
    /* Both sidebars: Component | sidebar-left | sidebar-right */
    body.has-sidebar-left.has-sidebar-right .site-grid {
      grid-template-areas:
        ". banner banner banner banner ."
        ". top-a top-a top-a top-a ."
        ". top-b top-b top-b top-b ."
        ". comp comp side-l side-r ."
        ". bot-a bot-a bot-a bot-a ."
        ". bot-b bot-b bot-b bot-b .";
    }

    /* Only sidebar-left: Component grows into the unused right-sidebar space. */
    body.has-sidebar-left:not(.has-sidebar-right) .site-grid {
      grid-template-areas:
        ". banner banner banner banner ."
        ". top-a top-a top-a top-a ."
        ". top-b top-b top-b top-b ."
        ". comp comp comp side-l ."
        ". bot-a bot-a bot-a bot-a ."
        ". bot-b bot-b bot-b bot-b .";
    }

    /* Only sidebar-right: Component grows into the unused left-sidebar space. */
    body:not(.has-sidebar-left).has-sidebar-right .site-grid {
      grid-template-areas:
        ". banner banner banner banner ."
        ". top-a top-a top-a top-a ."
        ". top-b top-b top-b top-b ."
        ". comp comp comp side-r ."
        ". bot-a bot-a bot-a bot-a ."
        ". bot-b bot-b bot-b bot-b .";
    }

    /* No sidebar: Component takes all four central columns. */
    body:not(.has-sidebar-left):not(.has-sidebar-right) .site-grid {
      grid-template-areas:
        ". banner banner banner banner ."
        ". top-a top-a top-a top-a ."
        ". top-b top-b top-b top-b ."
        ". comp comp comp comp ."
        ". bot-a bot-a bot-a bot-a ."
        ". bot-b bot-b bot-b bot-b .";
    }

    /*
     * Cassiopeia changes the component's grid lines when a sidebar is absent.
     * Restore the area named "comp" so those original rules do not overlap a sidebar.
     */
    body:not(.has-sidebar-left) .site-grid .container-component,
    body:not(.has-sidebar-right) .site-grid .container-component {
      grid-column: comp;
    }
  }
}

a.brand-logo img { max-width: 300px; }
.container-header .container-nav {
    background: #000;
}
.container-header .mod-menu > li > a, .container-header .mod-menu > li > button {
    color: #fff;
}

.container-header .grid-child:first-child {
    border-top: 3px solid #000;
    border-bottom: 3px solid #000;
    margin: 20px auto;
    position: relative;
}

.container-header .grid-child:first-child:before,
.container-header .grid-child:first-child:after {
    content: "";
    left: 0;
    position: absolute;
    width: 100%;
}

.container-header .grid-child:first-child:before { 
    border-top: 1px solid #000;
    top: 1px;
}

.container-header .grid-child:first-child:after {
    border-top: 1px solid #000;
    bottom: 1px;
}

a{text-decoration:none}
.flat {
    background: #dddddd;
    padding: 20px;
}
.flat.fontsm h4 a {
    font-size: 0.8em;
    color: #000;
}
.flat.hl .md-title {
    color: #ec0000;
    border-top: 8px solid;
    padding-top: 1rem;
    padding-bottom: 2rem;
}
.footer .grid-child {
    justify-content: center;
}
ul.newsfeed {
    text-align: left;
    list-style: none;
    margin: 0;
    padding: 0;
}
ul.newsfeed a {
    text-decoration: none;
  font-weight:bold;
}
ul.newsfeed li:nth-child(2n+1) {
    background: #fff;
}
ul.newsfeed li {
    padding: 10px;
}
figure.left.item-image {
    float: none;
}

figure.left.item-image img {
    width: 100%;
    height: auto;
}