.header { grid-area: header; text-align: center; position: sticky; top:0;  }
.navbar { grid-area: navbar; text-align: center; position: sticky; top:30; margin-bottom: 10px;;
    input[type="button"]{
        height:20px;width:100px;display:inline-block;border:none;font-family: logtatec;text-align:center;
    }
    select {
        height:20px;width:100px;display:inline-block;border:none;font-family: logtatec;text-align:center;
    }
}
.container-main { grid-area: container-main; overflow-y: auto; height:auto; }
.main {
    z-index: 1;
    padding-left: 10px;
    padding-right: 10px;
}
.footer { grid-area: footer; overflow-y: scroll;}
.grid-container {
    height: calc(100% - 20px);
    padding: 0px;
    display: grid;
    grid-template-areas:
        'header'
        'navbar'
        'container-main'
        'footer';
    grid-template-rows: 30px 30px auto 0px;
    grid-template-columns: auto;
    gap: 0px;
}