Summary items beneath Product details page on mobile

Im simply trying to place summary items (dragged from a different store) in two per row beneath a product detail page, but there seem to some padding or margin (top) on each summary item that i cant figure out how to remove.
 

Page:

https://www.palmfiction.dk/palms/p/kentia-90cm

Im using this custom css:

@media only screen and (max-width: 767px) {
.summary-item-list {
display: flex;
flex-wrap: wrap;
}
.summary-item {
width: 45% !important;
margin: 4vw 2vw !important;
}
}

Does anyone know the solution for 7.1 store?

Thanks in advance.

@tuanphan

You are a lifesaver. Thank you!