
/*
.parent {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(12, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    }
    
    .nav { grid-area: 1 / 1 / 2 / 9; 
        border: 3px solid #666;
        padding: 25px;
        background-color: black;
    }

    .hero-image { 
        grid-area: 1 / 1 / 6 / 9; 
        display: flex;
        flex-direction: row;
        justify-content: left;
        align-items: left;
        width: 100%;
        height: 100%;
        }

    .main-content { grid-area: 4 / 2 / 12 / 8; 
        padding: 25px; 
    background-color: #f1f1f2;
    }

    .footer { grid-area: 12 / 1 / 13 / 9; 
        border: 3px solid #666;
        padding: 25px; }
*/

.parent {
display: grid;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: repeat(11, 1fr);
grid-column-gap: 0px;
grid-row-gap: 0px;
}

.div1 { grid-area: 1 / 1 / 2 / 9;         border: 3px solid #666;
    padding: 25px; }
.div2 { grid-area: 1 / 1 / 6 / 9;        border: 3px solid #666;
    padding: 25px; }
.div3 { grid-area: 4 / 2 / 8 / 8;         border: 3px solid #666;
    padding: 25px;}
.div4 { grid-area: 8 / 2 / 11 / 8;        border: 3px solid #666;
    padding: 25px; }
.div5 { grid-area: 11 / 1 / 12 / 9;        border: 3px solid #666;
    padding: 25px; }
