Change # of Icons Displayed per Row for Vertical Tablet

My website is displaying perfectly and being very responsive on all devices except for Vertical Tablet. My icon list still displays 4 icons per row and I would like it to display 3 per row (I have 8 total so if we need to display 2 per row to make it even that is fine).

See my attachment and you will notice how condensed all the text is. It is unreadable, which is why I want to change the # of icons per row.

I have tried several settings in the responsive section of the edit column tab in the visual design editor. I don’t know whether to change the responsive ‘offset’ or ‘width’. And the width option is locked on the vertical tablet display reading ‘Default value from width attribute’. I have width as 1140px. My responsive option was automatically set to ‘3 column – 1/4’. I went through and changed them all to ‘4 column – 1/3’, but it just totally messed everything up.

Please let me know if you can help.

Also the preview in front and what actually displays on my iPad are different. The preview shows that the contact row at the top of the screen won’t dispaly for horizontal tablets. It does display on my ipad, which I actually prefer, but not in the manner in which it does (phone # hanging under ‘call us toll free’ text). Any help with this bug also?