@charset "UTF-8";

main {
    max-width: none;
    display: grid;
    grid-template-areas: 
    "h1 h1 h1"
    "p piece1 piece2"
    "p piece1 piece3"
    "p piece5 piece4"
    "p piece5 empty";
    grid-template-columns: 400px 450px 450px;
    grid-column-gap: 1.5em;
    grid-row-gap: .7em;
}

h1 {
    grid-area: h1;
}

.info {
    grid-area: p;
}

.content-image1 {
    grid-area: piece1;
}
.content-image1 img{
    height: 600px;
}

.content-image2 {
    grid-area: piece2;
}
.content-image2 img{
    height: 300px;
}

.content-image3 {
    grid-area: piece3;
}
.content-image3 img{
    height: 300px;
}

.content-image4 {
    grid-area: piece4;
}
.content-image4 img{
    height: 300px;
}

.content-image5 {
    grid-area: piece5;
}
.content-image5 img{
    height: 400px;
}