.container{
    display: grid;
    height: 100vh;
    grid-template-columns: 5fr 1fr 1fr 1fr 1fr 1fr 5fr;
    grid-template-rows: .5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas:
      "leftfiller nav nav nav nav nav rightfiller"
      "leftfiller content1 img1 aboutme aboutme aboutme rightfiller"
      "leftfiller project1 project1 aboutme aboutme aboutme rightfiller"
      "leftfiller project1 project1 content2 img2 img2 rightfiller"
      "leftfiller description1 description1 img3 img3 content3 rightfiller"
      "leftfiller img4 img4 img3 img3 content4 rightfiller"
      "leftfiller img4 img4 content5 content5 content5 rightfiller"
      "leftfiller content6 content6 contacts contacts contacts rightfiller"
}


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

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

nav{
    grid-area: nav;
    margin-bottom: -0.4%;
}

#content1{
    grid-area: content1;

}

#img1{
    
    grid-area: img1;

}

#aboutme{
    grid-area: aboutme;
    grid-row: auto;
}

#project1{
    grid-area: project1;
    margin-top: -50.7%;
}

#content2{
    grid-area: content2;
    grid-row: 4;
    margin-top: -1.46%;
}

#img2{
    grid-area: img2;
    grid-row: 4;
    margin-top: -1.46%;
}

#description1{
    grid-area: description1;
    grid-row: 5;
    margin-top: -0.8%;
}

#img3{
    grid-area: img3;
    grid-row: 5;
    margin-top: -1.3%;
}

#content3{
    grid-area: content3;
    grid-row: 5;
    grid-column: 6;
    margin-left: 81.7%;
    margin-top: -1.5%;
}

#img4{
    grid-area: img4;
    grid-row: 6;
    margin-top: -51%;
}

#content4{
    grid-area: content4;
    grid-row: 6;
    grid-column: 6;
    margin-left:81.7%;
    margin-top: -101.4%;
}

#content5{
    grid-area: content5;
    margin-top: -46.4%;
}

#content6{
    grid-area: content6;
    margin-top: -0.79%;
}

#contacts{
    grid-area: contacts;
    margin-top: -1.017%;
}