.container{
    display: grid;
    height: 100vh;
    grid-template-columns: 5fr 1fr 1fr 1fr 1fr 1fr 5fr;
    grid-template-rows: .5fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas:
      "leftfiller nav nav nav nav nav rightfiller"
      "leftfiller content1 exploringtext exploringtext exploring exploring rightfiller"
      "leftfiller experimentingtext experimentingtext c2crop me rightfiller"
      "leftfiller humancentereddesigncrop humancentereddesigncrop humancentereddesigncrop humancentereddesigncrop humancentereddesigncrop rightfiller"
      "leftfiller c4 society society societytext societytext rightfiller"
      "leftfiller tothetopcrop tothetopcrop rectangle rectangle rectangle rightfiller"
}

#leftfiller{
    background-color: rgb(255, 255, 255);
    grid-area: leftfiller;
    opacity: 0;
    grid-column: 1;
}

#rightfiller{
    background-color: rgb(255, 255, 255);
    grid-area: rightfiller;
    opacity: 0;
    grid-column: 7;
}

nav{
    grid-area: nav;
    margin-bottom: -0.01%;
    grid-row: 1;
    grid-column: 2;
}

#content1{
    grid-area: content1;
    grid-row: 2;
    grid-column: 2;

}

#exploringtext{
    grid-area: exploringtext;
    grid-row: 2;
    grid-column: 3;
    margin-left: -200%;

}

#exploring{
    grid-area: exploring;
    grid-row: 2;
    grid-column: 4;
    margin-left: -200%;

}

#experimentingtext{
    grid-area: experimentingtext;
    grid-row: 3;
    grid-column: 2;
    margin-left: -0%;
}

#c2crop{
    grid-area: c2crop;
    grid-row: 3;
    grid-column: 2;
    margin-left: 60%;
    margin-top: -20%;
}

#me{
    grid-area: me;
    grid-row: 3;
    grid-column: 4;
    margin-left: 80%;
    margin-top: -20%;
}

#humancentereddesigncrop{
    grid-area: humancentereddesigncrop;
    grid-row: 4;
    grid-column: 2;
    margin-left: -0%;
    margin-top: -0.4%;
}

#c4{
    grid-area: c4;
    grid-row: 5;
    grid-column: 2;
    margin-top: -0.1%;
}

#society{
    grid-area: society;
    grid-row: 5;
    grid-column: 3;
    margin-top: -20%;
    margin-left: 250;
}

#societytext{
    grid-area: societytext;
    grid-row: 5;
    grid-column: 4;
    margin-left: 60%;
    margin-top: -20%;
}

#tothetopcrop{
    grid-area: tothetopcrop;
    grid-row: 6;
    grid-column: 2;
    margin-left: -0%;
}

#rectangle{
    grid-area: rectangle;
    grid-row: 6;
    grid-column: 2;
    margin-left: 40%;
    margin-top: -20%;
}