.box {
    max-width: 1000px;
    margin: 100px auto;
    display: grid;
    grid-gap: 20px;

    grid-template-columns: 240px minmax(0, 1fr);

}

body {
    background-color: rgb(234, 77, 77);
   
     background-color: rgb(8, 8, 8);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

}

header,
nav,
main,
footer {
    border: rgb(255, 255, 255) 2px solid;
    background-color: white;
    color: black;
}

header {
    grid-row: 1 / 2;
    grid-column: 1 / 3;
    justify-items: center;
}

nav {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
    height: max-content;
    justify-items: left;
}

main {
    grid-row: 2 / 3;
    grid-column: 2 / 3;
    height: 50vh;
    justify-items: center;
}

footer {
    grid-row: 3 / 4;
    grid-column: 1 / 3;
    height: 30px;
    justify-items: center;
}