body{
    background-color: lightgray;
}
.content{
    display: grid;
    grid-template-columns: 5% 90% 5%;
}

.gapmid{
    background-color: white;
    padding: 0 30px;
}


.box1 p{
    background-color: paleturquoise;
    margin: 0;
    padding: 20px;
    
}

.box1{
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 5px;
    background-color: blueviolet;
    padding: 10px;
}

h2{
    grid-column: 1/-1;
}

.box{
    margin-bottom: 20px;
}

.box2{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 5px;
    background-color: blueviolet;
}
.box2 p, .box2 div{
    background-color: rgb(73, 224, 83);
    margin: 0;
    padding: 20px;
}
.box2p1{
    grid-column: 1/3;
}
.box2div4{
    grid-column: 2/-1;
}

.box3{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 5px;
    background-color: blueviolet; 
}
.box3 p, .box3 div{
    background-color: rgb(240, 84, 232);
    margin: 0;
    padding: 20px;
    text-align: center;
}
.box3p1{
    grid-column: 1/3;
    grid-row: 2/4;
}
.box3p5{
    grid-column: 4/5;
    grid-row: 3/5;
}
.box3p7{
    grid-column: 2/4;
}
.box4{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 5px;
    background-color: blueviolet;
}
.box4 p, .box4 div{
    background-color: rgb(240, 84, 232);
    margin: 0;
    padding: 20px;
    text-align: center;
}
.box4p1{
    grid-column: 1/-1 ;
}

.box4p3{
    grid-column: 2/-1;
}
.box4p4{
    grid-column: 1/-1;
}

.box5{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 15px;
    background-color: blueviolet;
}
.box5P{
    background-color: rgb(84, 201, 240);
    margin: 0;
    padding: 20px;
    text-align: center;
}

.box5p1{
    grid-column: 1/-1;
}
.box5p2{
    grid-column: 1/4;
    /* grid-row: 3/6; */
}
.box5p5{
grid-column: 4/5;
}
.menu{
    gap: 0;
    background-color: orange;
}
/* .info1 {
    grid-column: 3/4;
}
.info3 {
    grid-column: 1/2;
    grid-row: 6/7;
}
.info4 {
    grid-column: 2/3;
    grid-row: 6/7;
} */
.info{
    grid-column: 1/-1;
    background-color: rgb(84, 201, 240);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.info1 {
    background-color: orange;
    margin: 10px;

}
.box6{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 5px;
    background-color: blueviolet;
}
.box6 p, .box6 div{
    background-color: rgb(240, 84, 232);
    margin: 0;
    padding: 20px;
    text-align: center;
}
.box6p1{
    grid-column: 1/-1 ;
}
.box6p3{
    grid-column: 2/-1;
}
.box6p4{
    grid-column: 1/-1;
}
.box6p3 {
    overflow: hidden;
    text-overflow: ellipsis;
}