body{
    background-color:springgreen;
}

ul{
    display: flex;
    list-style: none;
    justify-content: center;
}

ul li{
    /* border: 1px solid blue; */
    padding: 2rem;
}
ul li a{

    text-decoration: none;
    color: black;
    font-size: 2rem;
    font-family: sans-serif;
}
ul li a:hover{
    color: brown;
}

li.active{
    background-color: darkorange;
}
main{
    display: grid;
    grid-template-areas: 
    ". a a b"
    "c d d b"
    "e e e b"
    ;
    row-gap: 2rem;
    column-gap: 2rem;
    color: chartreuse;
}

.a{grid-area: a;}
.b{grid-area: b;}
.c{grid-area: c;}
.d{grid-area: d;}
.e{grid-area: e;}

div{
    background-color: aliceblue;
    border-radius: 2rem;
    font-size: 4rem;
    padding: 2rem;
    border: 4px dotted red;
}