/* NOTES 

BEM model
.block
.block__element
.block__element--modifier

*/


/* COMPONENTS */

.page-heading-RIP {
    background: #000000;
}

.site-hero__RIP {
    color: white;
}

/* LAYOUT - In Memoriam */
/* HTML sets layout up for mobile... CSS below re-configures for desktop layout */

@media (width >=600px) {

    .memorial-grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        gap: 30px;
        border-bottom: 1px solid #000000;
        position: relative;
        overflow: visible;
    }

    .memorial-grid > div {
        position: relative;
    }

    .memorial-grid > div::after {
        content: "";
        position: absolute;
        left: -15px;
        right: -15px;
        bottom: -15px;
        height: 1px;
        background: #cccccc;
        pointer-events: none;
    }

    .memorial-grid__intro {
        grid-column: 1 / -1;
        grid-row: 1 / 1;
    }

    .memorial-grid__1a {
        grid-column: 1 / 7;
        grid-row: 2 / 2;
    }

    .memorial-grid__1b {
        grid-column: 7 / 13;
        grid-row: 2 / 2;
    }
    .memorial-grid__2a {
        grid-column: 1 / 4;
        grid-row: 3 / 3;
    }

    .memorial-grid__2b {
        grid-column: 4 / 10;
        grid-row: 3 / 3;
    }

    .memorial-grid__2c {
        grid-column: 10 / 13;
        grid-row: 3 / 3;
    }

    .memorial-grid__3a {
        grid-column: 1 / 7;
        grid-row: 4 / 4;
    }

    .memorial-grid__3b {
        grid-column: 7 / 13;
        grid-row: 4 / 4;
    }

    .memorial-grid__4a {
        grid-column: 1 / 6;
        grid-row: 5 / 5;
    }

    .memorial-grid__4b {
        grid-column: 6 / 13;
        grid-row: 5 / 5;
    }

    .memorial-grid__5a {
        grid-column: 1 / 7;
        grid-row: 6 / 6;
    }

    .memorial-grid__5b {
        grid-column: 7 / 13;
        grid-row: 6 / 6;
    }

    .memorial-grid__6 {
        grid-column: 1 / -1;
        grid-row: 7 / 7;
    }

    .memorial-grid__7a {
        grid-column: 1 / 6;
        grid-row: 8 / 8;
    }

    .memorial-grid__7b {
        grid-column: 6 / 11;
        grid-row: 8 / 8;
    }

    .memorial-grid__7c {
        grid-column: 11 / 13;
        grid-row: 8 / 8;
    }

    .memorial-grid__8 {
        grid-column: 1 / -1;
        grid-row: 9 / 9;
    }

    .memorial-grid__9a {
        grid-column: 1 / 6;
        grid-row: 10 / 10;
    }

    .memorial-grid__9b {
        grid-column: 6 / 13;
        grid-row: 10 / 10;
    }

    .memorial-grid__10a {
        grid-column: 1 / 7;
        grid-row: 11 / 11;
    }

    .memorial-grid__10b {
        grid-column: 7 / 13;
        grid-row: 11 / 11;
    }

    .memorial-grid__11 {
        grid-column: 1 / -1;
        grid-row: 12 / 12;
    }

    .memorial-grid__12a {
        grid-column: 1 / 7;
        grid-row: 13 / 13;
    }

    .memorial-grid__12b {
        grid-column: 7 / 13;
        grid-row: 13 / 13;
    }
   
    .memorial-grid__13 {
        grid-column: 1 / -1;
        grid-row: 14 / 14;
    }
}