.parent{display:flex;justify-content:center;flex-direction:column}@media (min-width:768px) and (max-width:1023px){.parent{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(6,1fr)}.div1{grid-area:1/1/3/3}.div2{grid-area:1/3/3/5}.div3{grid-area:3/1/5/3}.div4{grid-area:3/3/5/5}.div5{grid-area:5/1/7/5}}@media (min-width:1024px){.parent{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,1fr)}.div1{grid-area:1/1/3/4}.div2{grid-area:1/4/3/7}.div3{grid-area:3/1/5/3}.div4{grid-area:3/3/5/5}.div5{grid-area:3/5/5/7}}.parent2{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,1fr)}.div12{grid-area:1/1/2/2}.div22{grid-area:1/2/2/3}.div32{grid-area:2/1/3/2}.div42{grid-area:2/2/3/3}.div52{grid-area:3/1/4/2}.div62{grid-area:3/2/4/3}.div72{grid-area:4/1/5/2}.div82{grid-area:4/2/5/3}@media (min-width:768px){.parent2{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}.div12{grid-area:1/1/2/2}.div22{grid-area:1/2/2/3}.div32{grid-area:1/3/2/4}.div42{grid-area:1/4/2/5}.div52{grid-area:2/1/3/2}.div62{grid-area:2/2/3/3}.div72{grid-area:2/3/3/4}.div82{grid-area:2/4/3/5}}.group1:hover{.gr1{width:0}}.group2:hover{.gr2{width:0}}.group3:hover{.gr3{width:0}}