.main-layout {
    display: grid;
    position: relative;
    grid-template-areas:
        "header header header"
        ". content ."
        "footer footer footer";
    grid-template-rows: 80px 1fr 40px;
    grid-template-columns: 6% 1fr 6%;
    height: 100%;
    width: 100%;
}

.main-header {
    grid-area: header;
    position: relative;
}

.main-content {
    grid-area: content;
    position: relative;
    overflow: auto;
}

.main-footer {
    grid-area: footer;
    position: relative;
}