body{
    background-color: #D2D2D2;
}

.container{
    display: grid;
    grid-template-columns: 10% 80% 10%;
}

h1, h2, p{
    font-family: sans-serif;
}

h2{
    color: rgb(60, 60, 60);
}

.vit{
    background-color: whitesmoke;
    border-radius: 5px;
    padding: 20px;
    padding-top: 50px;
    margin-bottom: 10px;
    box-shadow: inset;
}

.grid1{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 10px;
}

.grid1 p{
    text-align: center;
    margin-bottom: 0px;
    background-color: #D7C6FC;
    padding: 20px;
}


.grid2{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 10px;
}

.grid2 p{
    text-align: center;
    padding: 20px;
    background-color: #F2AECB;
    margin-bottom: 0px;
}

.sb{
    grid-column: 1/3;
}

.sb2{
    grid-column: 2/4;
}

.grid3{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    column-gap: 10px;
}

.grid3 p{
    text-align: center;
    padding: 30px;
    background-color: #C5EBCA;
    margin-bottom: 0px;
}

.sb3{
    grid-column: 1/3 ;
    grid-row: 1/3;
    align-content: center;
}

.sb4{
    grid-column: 4/5;
    grid-row: 2/4;
    align-content: center;
}

.sb5{
    grid-column: 2/4;
}

.grid4{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 10px;
}

.grid4 p{
    text-align: center;
    padding: 20px;
    background-color: #FDDAE3;
    margin-bottom: 0px;
}

.header, .footer{
    grid-column: 1/4;
}

.main{
    grid-column: 2/4;
}

.main2{
    grid-column: 1/3;
}

.grid5{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 10px;
}

.grid5 p{
    text-align: center;
    padding: 20px;
    background-color: lightblue;
    margin-bottom: 0px;
}

.menu{
    margin-top: 16px;
    padding: 15px;
    background-color: lightblue;
}

.menu p, .menu2 p{
    background-color: #FBB189;
    padding: 12px;
    border-radius: 5px;
    margin-top: 10px;
}

.menu2{
    grid-column: 1/4;
    margin-top: 16px;
    padding: 15px;
    background-color: lightblue;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.menu2 p{
    margin-right: 10px;
}

.grid6{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 10px;
}

.grid6 p{
    text-align: center;
    padding: 20px;
    background-color: #FDDAE3;
    margin-bottom: 0px;
}