How to fix the appearance of grid on mobile

Site URL: http://tonicabrandstudio.com/brand-strategy

I'm trying to fix this grid view on mobile so that the text is wider and centered. I'd even be ok with getting rid of the boxes altogether if need be. 
Thank you! 

It looks like there is a CSS styling rule (probably in Design > Custom CSS) that looks like the following:

section[data-section-id="62132a7d18d299423224bd20"], section[data-section-id="62207da64930d71509a4ef6e"] .sqs-col-6 {
    border: 1px solid #fff;
    width: 40% !important;
    margin-left: 7%;
}

To fix the issue, just remove the "!important" tag from the width property so that it looks like this:

section[data-section-id="62132a7d18d299423224bd20"], section[data-section-id="62207da64930d71509a4ef6e"] .sqs-col-6 {
    border: 1px solid #fff;
    width: 40%;
    margin-left: 7%;
}

Hope this helps!

8 hours ago, Caroline_Smith said:

It looks like there is a CSS styling rule (probably in Design > Custom CSS) that looks like the following:

section[data-section-id="62132a7d18d299423224bd20"], section[data-section-id="62207da64930d71509a4ef6e"] .sqs-col-6 {
    border: 1px solid #fff;
    width: 40% !important;
    margin-left: 7%;
}

To fix the issue, just remove the "!important" tag from the width property so that it looks like this:

section[data-section-id="62132a7d18d299423224bd20"], section[data-section-id="62207da64930d71509a4ef6e"] .sqs-col-6 {
    border: 1px solid #fff;
    width: 40%;
    margin-left: 7%;
}

Hope this helps!

Yes this worked perfectly!! Thank you so much 🙂